Maynooth Hi-Fidelity version

Maynooth Hi-Fidelity version - student project

My first project as designer, out of the skills i learnt from Daniel, i have implemented and prepared the project, do give your constructive feedback for improvement and development.

Lo fidelity Prototyping

Maynooth Hi-Fidelity version - image 1 - student project

 

Maynooth Hi-Fidelity version - image 2 - student project

 

Maynooth Hi-Fidelity version - image 3 - student project

Wireframe prototyping

Maynooth Hi-Fidelity version - image 4 - student project

 

 Hi-Fidelity version

 

Checking the persona given, few key points imagined.

a) Person given the project is a 50 YO lady, so the colour theme she might wish to have is a warm and pleasant colours.

b) The entire website should be user friendly and easily understandable. So usage of more ICON based design might be preferred.

c) As she is in medical field, she might be interested in making the person visiting site stay for long and gain inspiration from the site. So we shall make use of images which can be easily imagined at their own home and can be shared in pintrest too.

d) We are choosing colours of blue, orange and maroon, where shades of them will be used throughout the site.

 

1) Home Page- Hero image

Fixed header

Fixed social icons

Realistic buttons 

Images from Unsplash

3 colour design with gradients, for calm experience for user on website

Icon based design for user simplicity experience

No background product image for better depth and live experience of user

Filtered background for footer

Overlay image for review, for point focus of user

Simple add to cart button in form of +

Own icon design of cart

Circular white background selection of icons

 

Maynooth Hi-Fidelity version - image 5 - student project

 

2) Living room page- Overlay logo of Maynooth

Categories again based on icons, for easy understanding of user

Colour selection option provided with zoom effect for identification to user

Filter option made simpler for identification

Product background made to focus the product

 

 

Maynooth Hi-Fidelity version - image 6 - student project

3) Product page

Product focus points provided to know the features of the product

Colour options with design option provided scrollable

Relevant items and reviews highlighted in separate containers

Two fonts used throughout the design

Maynooth Hi-Fidelity version - image 7 - student project

4) Contact us page

Maynooth Hi-Fidelity version - image 8 - student project

 

Video