Aurora Beauties Website
“Aurora Beauties, a UX/UI and website design project, from concept ideation to prototyping and testing.“
Overview
Products pages are critical in success of a brand’s website online store. To make an informed purchase, customers need to have access to product information and details, images, reviews, etc. Additionally, a user-friendly and well-designed checkout process is crucial, to ensure that customers can complete their purchase effortlessly.
Role:
Designer
Tools:
Spline, Illustrator
Total Hours:
5 Hours
Date:
June 2024
Research & Analysis
Brand exploration
Brand exploration helps to reflect brand values in design.
- Brand exploration helps to reflect brand values in design.
- Organic colors of nature, energetic
- User friendly experience
- Help consumers make conscious choices
- Brand Values:
- Cruelty Free
- Dermatologist Tested
- Clean
- Sustainable packaging
User needs assessments
- Significant shift in consumer preferences towards brands that align with values such are cleanliness, cruelty free practices, and sustainable packaging.
- Users are increasingly attentive to product ingredients. Transparency in highlighting and listing the key ingredients is appreciated among consumers
- Competitors within industry are incorporating these values into their design.
Persona development
I created the Persona for my project based on “Researcher” e-commerce user type. The Researcher persona represents a user archetype who approaches online shopping with a meticulous and research-driven mindset. Individuals embodying the Researcher persona are characterized by their thorough investigation of products and their commitment to making well-informed purchasing decisions.
Empathy map
Empathy map helps to understand and visualize the implicit and explicit actions and behaviours of a particular types of user. It helps to better understand users needs and prioritize them. As I used it at the initial stages of my design process, it helped me in developing the user’s journey map.
Journey map
Creating a flowchart for the purchasing process is an excellent way to visualize and communicate the step-by-step journey a user takes when buying a product on the website. “Flowcharts are used to describe both back-end processes and user task flows in UX design.” Flowcharts are versatile tools that can be applied in various domains, including both back-end processes and user task flows in UX design.
Flow Chart
Creating a flowchart for the purchasing process is an excellent way to visualize and communicate the step-by-step journey a user takes when buying a product on the website. “Flowcharts are used to describe both back-end processes and user task flows in UX design.” Flowcharts are versatile tools that can be applied in various domains, including both back-end processes and user task flows in UX design.
Wireframes
I designed the wireframes based on the insights gathered from my research. It was crucial for users to easily navigate through pages, especially on each product page, and to quickly access product details and ingredients. My focus was on ensuring users could effortlessly scan the page to obtain detailed information about the product's texture, ingredients, usage instructions, and reviews to make informed decisions. Prior to this, I examined competitors' websites such as Sephora, SkinFix, and The Body Shop. From this analysis, I discovered that while providing access to product details is important, it's even more critical for users to comprehend the ingredients and their functions to trust the brand and product. Additionally, I found that using icons enhances the readability of the content, so I incorporated this feature into my design.
Design and Prototyping
Style Tile
Prototypes