Inital Planning:

The candle bliss website project with researching design inspirations from high-end e-commerce sites such as Diptyque. The goal was to create a luxurious yet minimalistic website for a candle business that balances aesthetics with usability. The design process involved sketching wireframes to determine the layout and structure for key pages: The Homepage, Shop page, and Contact page. Sketched and wireframes helped plan the navigation, product display grid, and responsiveness for mobile users. Later on, I started the photography process with my own candle collection that I customized online. This process involved using Photoshop, I had to cut the background and make the picture look neat enough to be present like a product on the website.

*All the wireframes were designed using Figma, Codes were written using Adobe DreamWeaver (HTML, CSS, JavaScript)

User Persona:

In this part of the project, I was able to learn how to conduct customer profiling and market research to identify market target groups and design a website that suits their preference and needs, as well as understand what products they like.

*User persona was made using Figma.

* I ended this course with an A mark and was ranked above class average

Usability and Accessibility Principles

The Candle Bliss website integrates several usability and accessibility principles:

Responsive Design - The site uses a mobile first approach with flexible grids and media queries to ensure that the website adapted seamlessly to different screen sizes.

Clear Navigation - The navigation bar is simple, with clear links to the Home, Shop and Contact pages. A hamburger menu is available for mobile users as well.

Accessibility - Forms on the Contact page include proper labels for easy navigation by screen readers, and images include descriptive alt attributes. The color contrast was tested to ensure readability for users with visual impairments.

Semantic HTML - The use of proper HTML elements like <nav>, <section>, and <header> improves both SEO and accessibility.