A L I H A S S A N
ASTRO FIT Branding & UI/UX Design
  • Client ASTRO FIT
  • Project Type Branding | UI/UX Design

Introduction:

ASTRO FIT is an online store that sells fitness accessories for men, women, and kids. The website aims to provide customers with a seamless and user-friendly shopping experience. The UI/UX design is crucial for the success of any eCommerce store, and this case study will detail the process of designing the ASTRO FIT website.

Landing Page:

The home page of the ASTRO FIT website features several sections, including New Arrivals, Who We Are, Latest News, Customers’ Reviews, and Instagram Stories. The New Arrivals section showcases the latest products added to the store, while the Who We Are section provides an overview of the brand and its values. Latest News showcases the latest happenings in the fitness world and the brand, while the Customers’ Reviews section displays customer feedback on products. The Instagram Stories section highlights user-generated content and provides a glimpse of the brand’s social media presence.

Astro Fit - Home Page (Landing Page)
Astro Fit - Home Page (Landing Page)

Shop Page:

The Shop page is the heart of the eCommerce store and features all products categorized by category, color, size, and price brackets. The filters make it easy for customers to find what they are looking for quickly. The products are displayed in a grid layout, and hovering over each product displays a quick view of the item, including its name, price, and rating.

Astro Fit - Shop Page
Astro Fit - Shop Page

Product Details Page:

Clicking on a product takes the customer to the product details page. The page features product images, title, rating, price, description, features, and related products. The product images are displayed in a carousel, allowing the customer to view the product from different angles. The title, price, and rating are displayed prominently at the top of the page, while the product description and features are listed below. The related products section suggests other products that the customer may be interested in purchasing.

Astro Fit - Product Detail Page
Astro Fit - Product Detail Page

About ASTRO FIT Page:

The About ASTRO FIT page provides customers with an overview of the brand, including its story, team, and how it started. The Our Story section highlights the brand’s journey, while the Who We Are section introduces the team behind ASTRO FIT. The How We Started section describes the inspiration behind the brand and its values.

Astro Fit - About Page
Astro Fit - About Page

News/Blog Page:

The News/Blog page showcases all the brand’s blogs and features sorting functionality by tags and recently added blogs. The page’s design is clean and straightforward, making it easy for customers to find what they are looking for.

Astro Fit - Blogs Page
Astro Fit - Blogs Page

Blog Detail Page:

Clicking on a blog takes the customer to the Blog Detail page, which features the main blog image, blog body, sharing section, and comments. The page’s design is minimalistic, making it easy for customers to read the blog and share it on their social media profiles.

Astro Fit - Blog Detail Page
Astro Fit - Blog Detail Page

Contact Us Page:

The Contact Us page features the brand’s contact information, social media handles, map, and contact form. Customers can reach out to the brand through the contact form or follow them on social media for the latest updates.

Astro Fit - Contact us Page
Astro Fit - Contact us Page

Conclusion:

The UI/UX design of the ASTRO FIT eCommerce store was crucial to its success. The website’s clean and minimalistic design makes it easy for customers to navigate and find what they are looking for. The design focuses on providing customers with a seamless shopping experience, highlighting the brand’s values and social media presence. The ASTRO FIT website’s UI/UX design ensures that the brand gains and retains customers, leading to higher sales and revenue.