TL;DR

The client’s overall requirement for this project is for me to create an MVP mobile app design for their website e-commerce store. This covers the Homepage, Category, Wishlist, Product page, and User account screens.

The mobile app design is expected to be deployed for iOS and Android. Therefore, I have to create a design that can be developed using a cross-platform framework like Flutter.

In this study, I will be showing you:

• UX Audit of the web app

• User story map

• Mock-ups

• Brand guide

Babyplanet.pk is an expansive online store dedicated to products for kids, babies, and mothers. This platform offers a wide range of items, including fashion, gear, feeding essentials, bath products, safety items, toys, diapering needs, nursery equipment, and more.

With a focus on quality and variety, Babyplanet.pk aims to be a one-stop solution for all parenting needs. The website features a diverse selection of products, showcasing best sellers and new arrivals, all designed to cater to the varying needs of young families.

UX Audit

The purpose of conducting a UX Audit on Babyplanet.pk's homepage is to understand how to effectively translate its web features into a mobile app.

This audit focuses on analyzing the user interface, navigation, content layout, and overall user experience. It aims to identify areas where the mobile experience can be optimized for convenience, efficiency, and user satisfaction.

Home page

Challenges

• To design the homepage in a way that showcases various categories without overwhelming users at first glance.

• The goal is also to facilitate easy navigation between categories and to present promotional banners in a subtle, user-friendly manner.

Solutions

• Curate the categories displayed on the homepage, focusing on the most visited, frequently ordered, and those with new arrivals.

• Integrate promotional banners seamlessly, displaying them one at a time amid the product listings.

• Organize promotional banners thematically based on seasons, enhancing visual appeal.

• Implement horizontal swipe functionality for category browsing, offering a convenient user experience.

Category page

Challenges

• Converting a vast e-commerce category list into a more compact layout while ensuring the user's browsing experience isn't overwhelming.

• Maintaining category discoverability and engagement in a more condensed layout.

Solutions

• Dedicate separate screens for each category to simplify navigation and enhance user focus.

• Implement intuitive filtering options to allow users to quickly narrow down their interests.

• Utilize collapsible menus or accordion-style designs for subcategories to maximize space and reduce visual clutter.

Product page

Challenges

• Displaying Detailed Product Information in a Limited Space

• Efficient Size and Color Selection on a Smaller Screen

• Showcasing Multiple Product Images

• Streamlining the 'Add to Cart' Process

Solutions

• Use expandable sections or tabs to organize details like product specifications, care instructions, and reviews, allowing users to access the information they need without cluttering the screen.

• Include a simple menu for selecting sizes and colors making it easier for users to view and choose without overwhelming the interface.

• Feature a gallery where users can easily swipe through product images.

• Design a fixed 'Add to Cart' button that stays visible as users scroll through product details, ensuring a smooth and easy path to purchase.

Style guide

Please note: In compliance with the Non-Disclosure Agreement terms set forth by the company, I am limited to displaying only selected screens from this project. Confidentiality and adherence to the NDA terms are strictly maintained.

Feel free to reach out!

I am available for a FREE online 1-1 mentorship.

Go to www.adplist.org/mentors/estella to book a 30-minute session with me.

I am also open to event speaking engagements with the following topics:

• UX Design

• Typography

• Design System

• Design Management

• Brand Identity Design

• Career Progression in Design

• Women Empowerment topics

Inquire about speaking availability by sending me a message on LinkedIn.