Devils Corner Winery

Website User Experience / Interface Re-design

PROJECT

Remember to click any text looking like this!

EXAMPLE

Overview

The idea for this project came from the beautiful artwork that is on the bottle for the brands wine. Inspired I decided to create a website that would be suit Devils Corner; The main focus of this project would be on the User Interface (UI) in regards to the aesthetic and interaction of icons, graphics and website assets.

However, I still wanted to develop the User Experience (UX) and refine it to see if there is a possibility to make the navigation of the website a little less cumbersome and easy to find and complete tasks.This would also tackle elements of visual branding on top of UX/UI, but this would be a way of thanking the company for creating nice wine that I have enjoyed in recent years.

Understanding the Problem

The problem I noticed was an outdated user Interface with the website, some areas on the homepage felt they were created with differently in terms of style, so the website comes across as a mix match of different styles, other notable issues include:

(1) Bland and outdated User Interface that is not suited for a company whose wine is nice.

(2) Interaction is lacking, for a brand who is quite exceptional in wine making and good visual brand Identity, their website lacks that same feeling however.

Devils Corner Winery is a visually striking place, their branding and wine are also strong points; so why should their website lack that same thought.

First part of this project was to look at other winery websites and get Inspired, afterwards I got the idea of taking their iconic brand and using that as the foundation for their website.

Developing the Solution

The landing page was the most important aspect of the website, I had to ensure that was handled with care as everything else will falter if it is not executed appropriately.

Maintaining Brand Identity

Brand Identity has already been established which means less work thankfully, taking their already existing elements I refined the website with their current assets as well as creating some new ones for the project.

Segoe UI
Aa Bb Cc Dd Ee Ff Gg Hh Ii Jj Kk Ll Mm Nn Oo Pp Qq Rr Ss Tt Uu Vv Ww Xx Yy Zz

Aa

TYPOGRAPHY

#943235

#cccccc

#a2a6a9

COLOUR

ICONOGRAPHY

LOGO

Designing the Concept

The landing page was the complicated aspect of the website, after that was handled the rest of the pages were devised with devils corner classic graphics and artwork to create something that would make the website feel like it belongs to a luxury wine company.

Scroll down to Reveal more of the High Fidelity Mock Up!

Prototype

The Final design of the camera was to be as easy as possible to use, simple to navigate and fun without taking too much away from photography. Overall I believe this was achieved through trial and error to figure out the best optimal outcome.

Website Interface

The website was a fun project to design, creating a striking landing page that brought it to life and make Devils Corner stand above other wineries that have lackluster website display.

Conclusion

The user Interface was well received, it had plenty of positive feedback; many explained they found the animation to be unique and cool.
‍
Personally I do like the animation, but I do wonder how it could be pushed without being overly complicated or visually over stimulating; the concept of pushing or reeling oneself back is difficult, especially when you're working in a vacuum, therefore the solution is to bring others in the development pipeline to account for that issue so one does not overdo it.