Boxfresh are Greg & Mikala Everett, a London born ex-chef and his partner. Supplying market-fresh vegetable boxes around Sydney is the core of their business, but their website left a lot to be desired.
The Problems:
- The old website was black, purple and orange - striking colours creating user discomfort and reducing the focus on fresh, quality produce.
- Potential clients were uncertain about when their orders would arrive, and if their suburb was delivered to.
- No support for recurring orders ensured credit cards had to be manually processed each week.
- Orders arrived to Greg & Mikala by email, and then had to be sorted manually into a schedule based on geographical knowledge
- There was no support for customers who were allergic to or disliked certain vegetables (eg. brussel sprouts) so these could be automatically excluded from orders.
- Recipes were provided each week to Boxfresh's customers giving meal suggestions using ingredients from the box - these couldn't be searched and were hard to navigate, and had to use a Wordpress installation due to the lack of supported functionality.
The Solution:
Identity identified a number of unmet needs and preferred solutions, and used a combination of .Shop and .Blog plus bespoke functionality to achieve a unique solution.
Branding
With the branding of Boxfresh, we improved the visual aliasing and kerning of the main typeface, removing excess ligatures to modernise the font. Boxfresh's badge shows Greg's english roots, and in the centre of the logo it was sharpened and rebuilt to work better at smaller sizes, and colours tweaked to work when used in greyscale. The colours were muted slightly from their previous incarnation, to move slightly upmarket and cater to a young and professional audience.
The slogan "for when you're cooking at home" was changed from an ornate, script font to a more modern and relaxed font, then brought to the left to bring balance to the design.
Colour Scheme
From a previously black/purple/orange/peach/green colour scheme, Identity rationalised and revamped the colour scheme as follows:
Confident, fresh and earthy colours were used alongside the traditional black and white - now reversed, and the grey provided a balance between the pastels used in the illustration and the rest of the palette. The reasoning for each colour is shown below.
Green: A natural, healthy zucchini (courgette) green was selected to reflect the freshness of the vegetables in the box, and to tie into the predominant colour of a well-stocked vegetable drawer. This colour is used as a highlight colour throughout the website to provide points of interest.
White: For Boxfresh, we wanted to bring attention to the produce, and move away from the previously intense experience of the site. White is associated with freshness, air and room to breathe, creating a relaxed, product-focused browsing experience.
Brown: The colour of the earth, we chose a brown of similar saturation to the green to balance the site. Colour theory typically suggests brown is a neutral and boring colour, so we utilised this to avoid distracting site visitors, while also using a more adventurous shade than is usual to draw slight attention to the main product menu.
Mid Grey: As a truly neutral colour, this mid grey is used for information on the site which should be easy to read, and to tie the black and white to each other in a comfortable way. It is a supporting colour for the areas around it, and to prevent areas from having too great a contrast gradient when moving from black to white.
Fruit and Vegetables: A sympathetic, stepped gradient palette was used for illustrations, with the green runner beans overlapping with the standard theme colours and the tomato red providing contrast. Tomatos were picked as they're typically "ripe and bursting with flavour", something our clients were keen to point out was the hallmark of their produce.
Black: Boxfresh's previous site had been overbearing in its use of black (background, header and text), but it is a colour they have been strongly associated with since their beginnings. We kept this for the logo and softened it by using it to provide a retro-organic frame which draws the eye to the content within, and avoided straight edges - where the black leaves and stems are used for the background area it breaks up solid areas of white and brings the attention back into the center of the page.
Other Design Features
Identity carried through the retro modern organic theme with a bespoke set of shopping cart buttons which increased the number of products added to the basket (and the number of successful payments) overnight.
Technical Solution
We deployed a standard installation of .Shop to cover basic e-Commerce needs - browsing categories, shopping, giving users information and images, adding to cart and checking out, then added a light-weight version of .Blog to provide the framework for a searchable recipes section. At this point we:
- Started work on the graphic design of the site, sending a Version 1 to Greg and Mikala for feedback.
- Exported recipes from the previous solution, ran them through filters to clean the data, and imported them directly into the .Blog database to prevent manual entry of content.
- Collated Boxfresh's delivery suburbs, postcodes and routes and created a delivery information module which became part of the normal checkout procedure.
- Added 'required for order' options to all the fruit and vegetable box options, and configured checkout to ensure that at least one box was present in each order.
- Added a 'recipe newsletter signup option as part of the checkout'.
With the basic order processing working well, we reviewed the designs with the client and revised them according to the feedback we gave each other. We then addressed some of the more complex features, and those that relied on the first round of features being complete.
- We added a 'Nearest cross street' option to help delivery drivers plan routes and find addresses quickly.
- We added recurring order functionality - allowing customers to place orders every 7, 14 or 21 days.
- Added a 'cash on delivery' option.
- Improved conversions at checkout by adding a "I like..." and "I don't like..." section to the delivery notes, which lets Boxfresh swap out specific items (eg. brussel sprouts) and replace them with desired items (eg. strawberries) to increase customer satisfaction with box contents.
- Within the micro content management system which is a standard part of .Shop, we added a testimonials page and a delivery map page, outlining the areas Boxfresh serves 'at a glance'.
- Finished deploying the 'Round 2' template and added the custom icons mentioned above.
Hidden Away
We then generated an automatic private calendar feed in Outlook format, scheduling the orders according to suburb on delivery route and showing recurring orders first, followed by new orders, alongside a packing list for each order. This is reversed, which ensures aa van is filled with the last delivery on first. Where boxes need collecting or providing, these are marked appropriately and each order is given a calendar slot. Order paperwork can be printed for both accounting and invoicing/delivery purposes from the administration panel or directly by clicking on embedded links, allowing Greg and Mikala to run their business from outlook.
Every night, the orders for the next day are processed through an eWay payment gateway using our software scheduler, and customers whose orders are not approved are automatically emailed (alongside the approval paperwork and invoices for approved customers). These recurring orders can be suspended or cancelled by customers from their accounts page, perfect for holiday times.
We've even added an automatic labelling system which allows the labels for each box to be printed off by using just a 3G netbook (or standard PC/Mac) and label printer, including Boxfresh's branding and the 'yes please/no thanks' substitution information.
Future Happenings
As you read this, we're adding cross-selling and up-selling functionality to the Boxfresh checkout (so customers can remember their bacon and eggs reliably), while working closely with photographer Philip Poyner to revamp the main product area and category pages to provide clearer information on the amount of produce in each box as it relates to common household sizes, and to better present the product freshness and quality. We're also adding a few other features which we can't talk about - while it's good to look at a business in detail, we don't want to give away all their trade secrets!
Greg said after one particular deluge of orders:
“Just had a couple of massive days and been thinking how much easier the system makes my life.”