BACKGROUND
Ben Pickles Design has enjoyed working with MPC since building their website back in 2009. Built in HTML, CSS and Flash, it has been one of our longest-living sites to date.
THE CHALLENGE
The website, while still relatively modern, was starting to show signs of ageing. Once Apple removed support for interactive Flash content on their devices, and mobile devices increased in popularity, whole pages were beginning to either stop working or were becoming illegible.
Additionally, mobile visitors were shown to have a bounce rate of near 60% - double that of desktop users.
THE METRICS
Once the website’s Google Analytics results began to show that a majority of visitors were browsing from mobile devices (52%), this convinced the client of the need to optimise the user experience for these visitors.
THE SOLUTION
Media queries were integrated into the HTML and CSS, which allow the website’s content to resize according to browser dimensions. This caused no change to the desktop view of the site, but greatly improved the usability for tablet and mobile: increasing font size and adjusting content into a stacked, single-column layout.
THE RESULT
Since implementing the improved user interface, analytics have shown a greatly reduced bounce rate. It is highly likely that this is due to the mobile-optimised content.
BACKGROUND
This particular website was selected for students enrolled in the ‘Industry Digital Design Program’ at Tractor Design School (2014), and was chosen as an example of poor information architecture, and uninspired visual hierarchy.
THE CHALLENGE
The project demanded an audit be carried out on product design consultancy Design + Industry’s website, to spot potential improvements to make navigation easier and help make popular content more prominent. Several menu labels were either misleading, contained duplicate content or were not placed in logical order.
The website also featured a portfolio of innovative products, which were not being featured in an engaging manner.
THE SOLUTION
The information architecture was reorganised, grouping like items into their appropriate menu tabs. Multiple wireframes were sketched, including lists for reorganising content and improving navigation labels. The homepage layout was redrawn to allow for popular items to feature more prominently, and the portfolio was re-organised into case studies, to be championed as main features in the header slider.