Featured

 

labocaloca.co.nz

“Online sales increased 85%, year-on-year, after the launch of the new website.”

La Boca Loca is a popular modern Mexican restaurant that had a ‘split-personality’ online. They had an outdated ‘main’ website for their restaurant that was not fit-for-purpose and not a true reflection of the high quality of their food and products. Secondly, they had a separate website at a different domain to sell their products online. Through a successful collaborative process, Silent Designs helped them integrate all aspects of their business into one cohesive web presence. Upgraded design, features and user experience all helped to meet the business’s changing needs and better represent La Boca Loca online.

La Boca Loca Website

Background

Silent Designs was asked to work on the project by a designer with whom we had previously worked, and who would be the design lead on the project. We met, together with the client, to discuss their needs, dissect the existing websites, define the areas that needed improvement and make recommendations on what the design and features of a new website should be. Following this, wireframes were created to describe the content and features, designs were mocked up in Photoshop and finally these were developed into the final product.

Issues

There were numerous issues with the existing websites, all of which needed to be addressed. Firstly, combining all of the client’s online services (both existing websites) into one online space was a priority. The existing online sales website was built using the Shopify e-commerce platform, and they were unsure if they should build the new website on that platform or build a bespoke site.

The existing main website’s design was outdated; this did not project the modern, professional image that the business wanted to portray. The layout and content heirarchy of the site did not reflect best practice when it came to user experience, for example the restaurant address and contact details were hidden in the footer of the site where users had to search for them; this important information should be one of the first things a user sees on the site.

The colour scheme and design of both existing websites did not match, which further contributed to the disjointed and confusing presentation of the business. Neither website was responsive and therefore not optimised for mobile phones or tablets – as mobile browsing is the largest growing area of the web, this was a major issue and potentially turning off customers. There was no easy way to feature products, such as the client’s newly released cookbook, on the main website. Neither website drew attention to the business’s social media presence (e.g. their very active Instagram account). Finally, there was no way for a potential customer to make a restaurant booking online.

Solutions

Through an ongoing collaborative process with the designer and client, the following solutions to each of the defined problems were proposed and implemented on the new website:

• Silent Designs’ recommendation was to continue using the Shopify platform for the new website, as it performs well and has many benefits over other e-commerce platforms, such as built-in speed and security for hosting and excellent customer support. Their existing product inventory could be directly imported into the new website, saving many hours work for the client. Another plus is that Shopify’s ‘liquid’ templating system is flexible and easily customisable by incorporating semantic HTML5 and CSS3. We were also able to redirect their existing domain to the new site.

• The new website has a more ‘earthy’ colour scheme that better reflects the warm, familiar aspects of modern Mexican culture and cuisine. This fits well with their existing logo and presents a more coherent and modern image of the La Boca Loca brand.

• The new website is ‘responsive’ with the content adjusting to the particular screen size/device it is being viewed on at any given time. This was implented by customising a basic Shopify ‘liquid’ theme, which contains a responsive grid-system that manipulates content based on CSS media-queries. The appearance, layout and design of individual elements could then be specified by using the grid classes associated with each screen resolution. This improvement allows users on mobile phones and tablets to navigate the site and find the most important information on the site much more easily.

• The layout and content heirarchy of the new site has been arranged by priority, so that the user is immediately presented with the most important information, and their attention is drawn to the high priority content (e.g. the restaurants’s contact details and opening hours are now clearly displayed in the header section of every page). One of the client’s priorities was to increase sign-ups to their newsletter, so a call to action was added to the header to allow users to sign up easily via a MailChimp plug-in that integrates the website with the client’s mailing list account.

• To help direct customers to the client’s highest priority content (e.g. the restaurant, their newly released cookbook, and the online store) a large ‘hero’ image slider was added to the homepage. This instantly draws attention to these areas, and calls to action allow the user to head straight to these content sections without having to search the site.

• As social media content is an increasingly effective way to create engagement with online customers, the client needed to leverage the good work being done on their very active Instagram account, and encourage visitors to the website to follow them and stay engaged with the business. This was achieved by adding a feed to the homepage which displays the most recent Instagram posts and allows users to click through and follow the client’s account.

• To allow users to request a restaurant booking directly from the website, a booking section was created. This consists of a simple form that the user completes, and on submission their requested booking information is emailed directly to the restaurant for confirmation. This eliminates the need for the user to phone or visit the restaurant and therefore keeps them viewing the website longer.

Outcomes

The outcome of the project is a new, modern, professional website that combines all of the clients products, services and social media content in one place, with cohesive branding, targeted content and an improved user-experience. This has proven to be incredibly effective, as online sales increased 85%, year-on-year, after the launch of the new website.