Haven

Responsive Web Design | UI/UX

This is a website design project for a Home Décor company, I did as a part of a study. I developed a name and a style for the brand. I drew inspiration for this project from a few boho designs. The colors I have used are mostly pastel and light colors, the typography used is a combination of 3 fonts, all thin-stroked but with subtle differences between the 3, the most legible was used for the body text while the 2 more display fonts were used for the logo and headings. I believe the mix of pastel colors with this typography gives the design an elegant touch. The images are supposed to be the focal point in all the pages therefore I have given them more significance than text. I wanted the website to showcase an elegant, modern, and minimalistic look and for whoever looks at it to be inspired to have similar spaces in their homes. I used the programs Adobe XD and Adobe Photoshop for this project.

Sitemap & Wire Frames

I started by doing a “Crazy Eight” brainstorming session to come up with a few templates and then I proceeded to the sitemap and the final wireframes. This helped me plan out the next steps and gave me an idea as to how many images were needed for the project. After this, I developed a style tile that helped me confirm the colors, typography, action buttons, and design elements.

Home Page

The Home page gives an introduction to the store and it promotes the seasonal items that will be available. These categories will be clickable and it will take you to more products in that category and you can add to your cart from there.

Discover Page

The Discover page talks about the team and the services they offer, in addition, they also have a gallery of images to draw inspiration from. The gallery is designed as a slideshow and at the bottom you can view the next two images.

Shop Page

The shop page gives you all the categories of items that are being sold. You can click to go into a category and it will expand to show all the products, descriptions, and prices, and from here you can add these to your cart and complete your purchase.

Showroom Page

The showroom pages, give details about their showroom locations, their operating times, and how to contact them. It also allows you to make appointments with interior designers.

Adobe XD | Photoshop