Two Hands Bread

Mobile Website Design & Build

Two Hands Bread is a company selling gourmet bread in New Zealand supermarkets. Two Hands went through a brand redesign process recently, which included new logos and packages. The creation of a mobile website was part of their new brand strategy and I was responsible for the design and front-end development of this deliverable.

DraftFCB for Two Hands Bread in 2012

Home About Contact

Having previously worked on the implementation of other mobile sites, I tend to find that static designs are not the best approach. In this case I created a quick wireframe/prototype in Fireworks as a reference for positioning/spacing and started developing the project after this step, getting immediate visual feedback.

Great White Bread Great White Bread recipe Mixed Grain Bread Mixed Grain Bread recipe

Being a mobile website and limited to a slow connection, the number of images per page is limited (some are CMS driven), and the common UI graphics were carefully compressed and embedded in the stylesheet with the intent of limiting the number of HTTP requests. There were some compromises, such as using a Google web font, since I felt that none of the system fonts did justice to the new brand design.

Third-party JavaScript libraries were avoided, since 32KB plus optional plugins would slow down the page load. All the scripts are hand-crafted and minified (as is the stylesheet).

Map Tooltip on map 404 page