Cherrytree Bakery - Website Research/Development

As previously mentioned because of my branding technique I wanted to offer a full package to the cherry tree bakery brief. Through doing so it will make the branding seem more effective and therefore more engaging with the client themselves. A big part of the brand didn't like originally at the moment, was the existing website. Their existing website as a representative of the brand or the products in particular, other than the use for the large images the products themselves it is in particular visually represent the tone of voice of the brand. Therefore, by redesigning their website I could offer them a new visual which would enable the client to see the way in which the branding could be encapsulated to truly identify that a voice to the consumer and the other businesses they supply to. 

Current Website:

Current Site

• Too dark
• Un-inspiring images of the products don't represent premium or artisan
• Dated, both in the layout of the site and the colours used
• Dark, doesn't seem inviting or easily navigatable
• Doesn't seem to represent the rest of the brand's values

Competitors Websites Research:

Mainstream Bakery/Market Leader

Notice understanding in order to get an understanding of what the market leaders have done to be up to correct their products online I decided to look at Mr Kipling, they are the largest baked goods company in the The UK being stocked in all supermarkets and being a household name. Their website consists of a brand driven visual identity, similar to that I want to create for the Cherrytree bakery. The colours are consistent with the product themselves whilst also retaining consistency with the brand, red being their staple colour, contrasting with a warm neutral to give a noncorporate feel to a massive conglomerate company. This is something had taken consideration when creating the website for Cherrytree, making sure that the company seems inviting and friendly to reflect their family values.

Artisan Bakery

Artisan Bakery

I also decided to look into an Artisan bakery company to be able to get an understanding of what companies similar to the cherry tree are doing. This bakery brand keeps the products at the key of its imagery ensuring that the products were waiting throughout. Their arses and nature are bought through modern design, with simplicity giving up premium feel. Bright and bold colours are used throughout the website to be able to create consistency with the brand identity itself. The typography used complements the branding, it is kept simple and extremely legible for customers and businesses to be able to understand the business and keep the emphasis on the product themselves rather than the type.

Key Design Notes:

• Clear and concise typography
• Bright and bold colours representative of the brand
• The warm and inviting feel
• Products feature
• Product imagery relevant to the tone of voice of the brand

Design Ideas: 

• Use colours from research
• use imagery style throughout
• consider simple type to go with the logo itself
• consider bringing both the story of the brand to the forefront of the website as much as the products
• make sure artisan methods can through in a visual style

Wireframes: 

As I am only creating a couple of pages of the website shows a visual example to the company, I will only be creating wireframes for these pages. Although this will be able to give an example. Although before throwing myself into designing I believe wireframing is a crucial part of the design process for websites. Will allow me to be able to gain an understanding of how the website will be navigated around and therefore, in turn, will affect the way the website is designed. I will be taking inspiration from the websites I've looked into my research as can be seen above.

Homepage:

• Simple navigation system at the top
• top visual is a centred logo
• interchangeable hero banner with imagery of both the products and people
• infinite scroll down the website to give a modern feel

Product Page:

• Simple navigation kept at the top with the logo being the top header
• navigational was the centre out all pages in order to keep the website simple
• image of the product being presented is the key focal point of the image
• nutritional information below the image
• information about that product beside the image
• background image highlighted with either colour or texture

Imagery: 

As the imagery, I have already created a style for the brand to be used throughout I have decided to use the same style for the visualisations of the products themselves. As the brief itself didn't include any assets for the new brand, I decided to take imagery from the current website and edit it in the same way.

Trial 1

In this trial, I attempted to create a product image that resembled the imagery that was also edited previously on in the product, although I believe because of the layers of the product not being excluded from its background, the product becomes lost in the image itself.

In order to be out to rectify this, I think each project needs cutting out and excluding from a background I will have to take this into consideration with further experimentation of the imagery itself.

Trial 2

In my second imagery trial, I decided to experiment with the image of the workers themselves, in an attempt to be able to bring in some of the branding colours they previously decided on I added an overlay of these colours onto the image. The duotone was then added over the original texture which had been used elsewhere in the branding of the imagery. In order to keep consistency throughout the brand officially I've decided against using them colour in this way and reverted to using the simple black-and-white/sepia imagery that previously experimented with on any imagery of people or the factory itself.

Imagery rule consideration - In order to keep consistency throughout the brand I've decided that any images of people or the factory itself will be done in the style previously explored within the branding identity. Any images of the products which need to be brought to the forefront of their webpage, or any other place where the products imagery is used, the product itself should be excluded from the background. This will be half overlaid the texture which has been using the other imagery of the people, and half overlaid a block colour of the brand colours previously decided. By doing this it incorporates the branding colour into the products themselves and also allows for the product to speak for itself, without the distraction of the background. The use of the texture within this imagery also ties into the rest of the branding imagery, therefore, keeping a consistent visual style throughout any imagery used on the website. Whilst the addition of the colours of the Lancashire flag broke back the values of the brand being proud of being from Lancashire and also supporting the local community, something which is a common consistent theme of the visual considerations of the entire brief.

Pudding Imagery

Cupcake Imagery

Biscuit Imagery

Website Visual Trial:

Following the wireframing of the website concept I've decided to create a visual trial of how the website could come together. Once this the visual trial comes together, I can gain feedback from peers and tutors, and be able to create a website fitting for the brand.

Website Trial

Feedback:

• Follows the visual identity of the brand itself
• imagery shouldn't have colour, stick to the imagery that has been previously experimented with, use the colours of faxing colours throughout the website rather than key colours
• use smaller navigation so it doesn't take over the hero banner
• make the logo smaller to be able to give it room to breathe