top of page

E-COMMERCE APP

The mobile application provides consumers with the possibility to buy products using their mobile phones. On the platform, users can keep track of packages, orders, and pending payments. Additionally, the application profile displays account information, delivery addresses, and payment information, available for modification.

Service

E-Commerce

Software

Adobe XD

Adobe Illustrator

Year

2018

Pantallas-2.png
2016-12-01 11.44_edited.jpg

Business/User Needs

PRIORITIZE REQUIREMENTS AND NICE TO HAVE FUNCTIONALITIES

Initial meetings with stakeholders helped to identify users' and business goals, which allowed for the prioritization of design functionalities.

Sketching ideas on the board supported the ideation process and helped to distinguish between "nice-to-have" functionalities and actual requirements.

2016-11-29 11.55_edited.jpg

User Research

Creating personas and identifying user’s needs and goals helped map user scenarios and pay closer attention to worst-case scenarios. User research supported the identification of complex actions and pain points throughout the shopping and tracking processes.

Screen Shot 2021-08-25 at 22.00.51.png

Low Fidelity  Wireframes

Wireframing acknowledged the design team's content approach and spatial location more efficiently. A simple architecture and menu navigation helped improve the content layout, product information, and alternative functionalities

app-1.jpeg

Application Architecture

New information organization defined sections hierarchy, menu navigation content, and labeling. 

 

Card sorting testing provided information organization, name sections, and information labeling according to the user's mental model.

Mesa de trabajo 1.png

Final Design

Screen Shot 2021-08-25 at 23.34.32.png
01-B-PDP-01 – 7.png

Reflections

The application was divided into sections for prototyping, which contributed to a faster feedback and iteration process. The look and feel was derived from the original e-commerce website, and a new style guide and icons were created to provide consistency throughout the app.

bottom of page