L’Atelier is the website of Natalia Willmott, selling antique, vintage and contemporary art and objects, bespoke upholstery & curios. http://nataliawillmott.co.uk/L’Atelier is the website of Natalia Willmott, selling antique, vintage and contemporary art and objects, bespoke upholstery & curios. http://nataliawillmott.co.uk/

Natalia approached us about creating a brand and website for her business selling a range of antiques and art. We were first commissioned to create a logo for her – we came up with a range of ideas based around a ‘handwritten’, personal style designed to reflect the handcrafted, bespoke items sold by the business.

The logo style Natalia chose is this one – a free flowing ‘L’Atelier’ with a flourish and more formal lettering for Natalia’s name.

We then went through a number of colour iterations to get the colour scheme just right to carry through into the site.

Brief

The website brief was for a fairly simple e-commerce system selling products that Natalia could update herself. The site would include a variety of different categories of products, each with multiple photos and a ‘buy now’ button, alongside some descriptive text explaining the product and its origins.

The site also serves as a general hub of information for the business, with a number of information pages and images, including details of upcoming exhibitions.

We chose our in-house content management system – the Cybermill Webapp – to build this site. The webapp is particularly good at handling images (auto resizing, captions, slideshows), and also works well in creating sales pages for small online shops.

Design

Following on from the colour scheme and style introduced by the logo, we created an open, clean design for the website that would accentuate the product images.

Using the Google font API – a technology allowing us to embed a wide range of new fonts – we added a traditional font, similar to the logo, called ‘Sorts Mill Goudy’.

In the top right corner we added a decorative background – the pattern itself painstakingly recreated from an item sold in the shop (a cloisonné tea-jar).

Background pattern from the website - and its originBackground pattern from the website - and its origin

For the categories of products we added column of clickable buttons each with a cover image showing an item in that section. Once you’ve clicked on a category you’ll then see a longer list of products stored in that category.

Features

The site uses a stock control system – a number of the products are unique so will only be displayed on the site until they are purchased, at which point they disappear from the list.

The sales pages contain all the usual information – item description and title, along with quantity and the all-important ‘Buy now’ button in the bottom left.

Each product can have a range of photos so a simple image gallery is used with chunky thumbnails showing the other photos available.

A sales page from the L'Atelier websiteA sales page from the L'Atelier website

Customers can add an additional donation to charity before they order – a simple button adds £2 to the total amount (L’Atelier will also match all donations).

Natalia can choose to flag items as ‘favourites’ adding them to the front page to increase their visibility.

The site uses our discounts system for orders; customers with a personal discount code can enter this at the checkout phase to be given money off or ‘buy one get one free’ on their order.

The outcome

Hope all is well with you. Thanks for your fabulous work, received so many compliments about the new website. I have a little present for you… will pass by one of these days when I have time to drop it off!

Natalia was so pleased that she brought us a gift here at the Cybermill – a basket of Italian deli-style food and drink goodies, including wine, cheese and handmade pasta. Thank you Natalia! (Unfortunately we forgot to take a photo!)

Posted by Bryn Dodgson on 26th July 2012 in , ,

Leave a Reply

Your email address will not be published. Required fields are marked *.

You may use these HTML tags and attributes: <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <strike> <strong>