Website/Mobile app - Chewbeads
UX Case Study
Introduction
Worked on user personas, user research, user flow, sketching, wireframes, prototypes, building information architecture, creating wireframes, prototypes and visual design, detailed style guide & UI to support the development of the app and website.
I was responsible for both interaction design & visual design. Collaborated with developers and the internal team to support the development of the app and website.
Project Details
Duration: 5 weeks
Team: 1 Designer, 5 Developers
My Role: Lead Designer
Client: Chewbeads
Platform: IOS, Android, Web
Year: 2016
Tools: Sketch, Photoshop, InVision, Illustrator, Pen and Paper
Personal Project
Client Requirements
The client wanted the following in the design:
1) The website is for mothers and babies, keeping it in mind, the design needs to have the motherly touch and baby friendly touch.
2) Work Flow : Home Page –> Product List Page –> Product Page –> Cart Page –> Contact Us
Empathize - Define - Ideate - Prototype - Test - Implement
Goals
- Easily accessible, entry and exit points for users.
- To have a much smoother and more enjoyable shopping experience.
- Without having to spend more time than you have.
- For our target audience we sought after to create a look and feel that can resonate with the younger age group and mothers.
Brainstorming
User Story Map
Empathy Map
Persona
Card Sorting
Observation & Findings
Research in early stage helped us to understand and define clear goals on how to take our design decisions. Multiple research methodologies were used to answer key questions and generate important insights. It helped us to better understand the market and its users.
Insights
- Mostly female users, aged 24-37.
- Shopping mainly for kids, aged 1-4.
- Female users prefer to shop online while staying at home and avoiding crowds.
- Apprehension for range and quality of products.
- Have to focus on a task/shopping with limited distractions.
User FLow
1. Home Page
2. Product Listing Page
3. Product Page
4. Cart Page
5. Contact Us Page
1. Home Page
2. Product List Page
3. Product Page
4. Cart Page
5. Contact Us
Medium Fidelity Wireframe of CHEWBEADS mobile app
Some of the screens of CHEWBEADS mobile app
Some of the screens of CHEWBEADS mobile app
Some of the screens of CHEWBEADS mobile app
Conclusion
The inputs that we got conducting research has helped a lot in finalizing the design for the app and website. It gave me insight into how challenging and rewarding it can be to restructure a website and an app that hosts pages for an e-commerce platform.