E-commerce App UX/UI Proposal

E-commerce App UX/UI Proposal

We are a mobile app offering a wide range of streetwear clothing from multiple brands.
Users can explore collections, purchase exclusive pieces, track their orders, and receive coupons or gift cards.

We are a mobile app offering a wide range of streetwear clothing from multiple brands.
Users can explore collections, purchase exclusive pieces, track their orders, and receive coupons or gift cards.

Context

Context

Today, the streetwear market has shifted from a cultural niche to one of the most influential sectors in global fashion.

Our mobile app was born as an e-commerce platform to bring together a wide variety of streetwear brands in one place.
However, after analyzing user behavior, we identified opportunities to improve navigation, usability, personalization, and customer loyalty.

Today, the streetwear market has shifted from a cultural niche to one of the most influential sectors in global fashion.

Our mobile app was born as an e-commerce platform to bring together a wide variety of streetwear brands in one place.
However, after analyzing user behavior, we identified opportunities to improve navigation, usability, personalization, and customer loyalty.

Today, the streetwear market has shifted from a cultural niche to one of the most influential sectors in global fashion.

Our mobile app was born as an e-commerce platform to bring together a wide variety of streetwear brands in one place.
However, after analyzing user behavior, we identified opportunities to improve navigation, usability, personalization, and customer loyalty.

Our mobile app was created as an e-commerce platform to offer a wide range of streetwear clothing from different brands in one place.

However, by analyzing the user experience, we identified opportunities for improvement in terms of navigation, usability, personalization, and loyalty.

Streetwear consumers are not only looking to buy clothes, but also to experience a digital experience that reflects their lifestyle, connects with their identity, and allows them easy access to exclusive releases.

Problem

Problem

Confusing navigation and limited search. Users struggle to find specific products due to unclear categorization, basic filters, and the lack of personalized recommendations.

Inefficient checkout process. The purchase flow is long and unintuitive, generating friction and high cart abandonment. Limited payment methods also restrict accessibility.

Unclear order tracking. Customers lack real-time updates on shipping status, generating uncertainty and post-purchase distrust.

Actions

Actions

Following a Design Thinking methodology, the redesign focused on deeply understanding the user, identifying pain points, and co-creating digital experiences that combine functionality, usability, and emotional connection to the streetwear culture.

Following a Design Thinking methodology, the redesign focused on deeply understanding the user, identifying pain points, and co-creating digital experiences that combine functionality, usability, and emotional connection to the streetwear culture.

Competitive Analysis

Competitive Analysis

Our validation process involved analyzing leading apps such as Nike SNKRS, Adidas Confirmed, StockX, and Farfetch.

While these platforms stand out for exclusivity, community, and transparency, they also present friction points in navigation, checkout, and accessibility.
This competitive insight helped us identify opportunities to differentiate and enhance our user experience.

Buyer Persona

Buyer Persona

Our primary user is a digital-native, fashion-forward streetwear enthusiast aged 18–32.
They value authenticity, exclusivity, and community, spending between $100–$300 per month on apparel.

They are socially active on platforms like Instagram and TikTok, constantly seeking the latest drops, limited collaborations, and unique pieces that reflect their identity.

Challenges

Reduce friction in the purchasing process to reduce cart abandonment.
Reduce friction in the purchasing process to reduce cart abandonment.
Design clear and intuitive navigation for a diverse product catalog.

Challenges

Reduce friction in the purchasing process to reduce cart abandonment.
Reduce friction in the purchasing process to reduce cart abandonment.
Design clear and intuitive navigation for a diverse product catalog.

Challenges

Reduce friction in the purchasing process to reduce cart abandonment.
Reduce friction in the purchasing process to reduce cart abandonment.
Design clear and intuitive navigation for a diverse product catalog.

Goals

Improve conversion with a simplified checkout flow and alternative payment methods.
Strengthen user trust through a transparent, real-time order tracking system.
Optimize app usability by reducing browsing and checkout times.

Goals

Improve conversion with a simplified checkout flow and alternative payment methods.
Strengthen user trust through a transparent, real-time order tracking system.
Optimize app usability by reducing browsing and checkout times.

Goals

Improve conversion with a simplified checkout flow and alternative payment methods.
Strengthen user trust through a transparent, real-time order tracking system.
Optimize app usability by reducing browsing and checkout times.

Ideate

Ideate

Based on the pain points identified, brainstorming sessions focused on:

Streamlined navigation with advanced filters, categories, and smart recommendations.

One-click checkout with multiple payment integrations (digital wallets, BNPL).

Transparent order tracking with push notifications and real-time updates.

Based on the pain points identified, brainstorming sessions focused on:

Streamlined navigation with advanced filters, categories, and smart recommendations.

One-click checkout with multiple payment integrations (digital wallets, BNPL).

Transparent order tracking with push notifications and real-time updates.

Prototype

Prototype

We created low-fidelity wireframes to map flows and validate navigation. These evolved into high-fidelity prototypes in Figma, focusing on:

A clean design system with consistent typography, grid layouts, and a modern streetwear aesthetic.
Interactive prototypes tested with real users to validate clarity in navigation, checkout flow, and tracking.
Usability tests informed quick iterations, ensuring the final design reduced complexity and improved trust.

Final Screens

Final Screens

The Final Screens represent the consolidation of the entire research, ideation, and prototyping process, resulting in clear, modern interfaces consistent with the streetwear brand's identity. These final screens demonstrate how the app achieves a balance between usability and aesthetics, offering intuitive navigation, a streamlined shopping experience, and visual elements that convey urban authenticity.

The Final Screens represent the consolidation of the entire research, ideation, and prototyping process, resulting in clear, modern interfaces consistent with the streetwear brand's identity. These final screens demonstrate how the app achieves a balance between usability and aesthetics, offering intuitive navigation, a streamlined shopping experience, and visual elements that convey urban authenticity.

Final Screens

Final Screens

Every detail of the screens reflects user testing findings and the application of UX/UI best practices, ensuring that the design not only addresses identified issues but also elevates the user experience to the next level.

Every detail of the screens reflects user testing findings and the application of UX/UI best practices, ensuring that the design not only addresses identified issues but also elevates the user experience to the next level.

Every detail of the screens reflects user testing findings and the application of UX/UI best practices, ensuring that the design not only addresses identified issues but also elevates the user experience to the next level.

Figma Prototype
Link

Access the interactive prototype to explore navigation and main user flows.
Use the prototype for usability testing, feedback, and validation of design decisions.
Preview how UI elements adapt across desktop and mobile before development.

Figma Prototype Link

Access the interactive prototype to explore navigation and main user flows.
Use the prototype for usability testing, feedback, and validation of design decisions.
Preview how UI elements adapt across desktop and mobile before development.

Figma Prototype
Link

Access the interactive prototype to explore navigation and main user flows.
Use the prototype for usability testing, feedback, and validation of design decisions.
Preview how UI elements adapt across desktop and mobile before development.

Conclusions

The redesigned e-commerce app delivers:

A frictionless shopping journey that minimizes cart abandonment.
Stronger brand connection, aligning with the streetwear lifestyle and cultural values.
Scalable design solutions that support future brand growth, exclusive releases, and community engagement.

By combining user-centered design, competitive benchmarking, and modern UX/UI principles, the app is now positioned as a reliable, stylish, and conversion-driven platform in the streetwear ecosystem.

The redesigned e-commerce app delivers:

A frictionless shopping journey that minimizes cart abandonment.
Stronger brand connection, aligning with the streetwear lifestyle and cultural values.
Scalable design solutions that support future brand growth, exclusive releases, and community engagement.

By combining user-centered design, competitive benchmarking, and modern UX/UI principles, the app is now positioned as a reliable, stylish, and conversion-driven platform in the streetwear ecosystem.

Related Articles

Related Articles

Related Articles

Technology

How do I create this Portafolio without code?

May 25, 2025

0

min read

Web Design

What is Design Thinking and How to Implement It in Your Projects

November 9, 24

6

min read

Web Design

Responsive Design Best Practices for Adaptable Interfaces

October 6, 2024

8

min read

Technology

How do I create this Portafolio without code?

May 25, 2025

0

min read

Technology

How do I create this Portafolio without code?

May 25, 2025

0

min read

Web Design

What is Design Thinking and How to Implement It in Your Projects

November 9, 24

6

min read

Stay in touch

If you'd like to know about my work and projects, send me an email.

If you'd like to know about my work and projects, send me an email.

Menú

Social

UX/UI - Digital Designer

UX/UI - Digital Designer