top of page
copd-front.jpeg

GLAXOSMITHKLINE

Responsive design on time and budget

When one of clients of Havas, where I worked as an Experience Director, approached us to convert one of their websites to a responsive version, the ask was to do it in the most efficient way. That meant to reusing content and code whenever possible. I was able to re-purpose about 90% of the content and about 70% of the old code and the whole project was done within weeks.

​

The results can be seen here.

Invest in users not in devices

After analyzing site traffic I quickly figured out patterns in user behavior. Most user would either use a desktop version or phone, with a small percentage of users accessing via a tablet. Another observation was that while most first time users would often come from a phone device, a majority of repeated users would view the site on a larger screens. Therefore, I proposed to skip the tablet version all together, which significantly reduced development costs.

​

The original wireframe documentation can be seen here.

​

copd-layout.jpeg
copd-desk-wires.jpeg
Grids, layouts and content

Next step was to analyze all layouts grids and content and decide which elements to keep and which needed to be redesigned and re-coded.

After several brainstorming sessions with coders we decided to move the website to 12 column grid. That allowed for maximum content and code reuse.  We also had to review all the content to make it more relevant to new users (on mobile) and for repeated user (who used mostly desktop). So after some sketching and testing we revised information architecture and proposed new navigation.

​

Mobile second

In this project we actually created a mobile version after the desktop. This was due to the fact that we wanted to reuse us much content as possible and also that our primary target user group were returning users who would usually access this site on the desktop.

​

Therefore after revising navigation and information architecture we also defined how much content would be displayed on the mobile version. This allowed user to quickly scan  the content on a small screen and they would later return for in depth visit on a larger devise.

copd-mobile-wire.jpeg
The results

Due to the fact that we delivered the first project in a record amount of time and under the budget, our client quickly asked for a couple of similar projects.

​

Those also were done in record time and on budget which resulted with GlaxoSmithKline to include this method of responsive treatment as a recommended way for all their projects globally.

​

One of those additional project documents can be seen here and here.

benefiber-front.jpeg
R

© 2019 by Pawel Tulin 

bottom of page