top of page

Lead the UX design process

Grocery App

HOW CAN WE BRING ONLINE
GROCERY SHOPPING BENEFITS
TO IN-STORE EXPERIENCES?

Lead the UX design process

Grocery App

HOW CAN WE BRING ONLINE
GROCERY SHOPPING BENEFITS
TO IN-STORE EXPERIENCES?

Project Objectives

  • Revolutionize in-store grocery shopping by merging it with the perks of online shopping, improving customer convenience and efficiency.

Schedule

  • May 2022 - December 2022

Tools

  • Illustrator, Figma, Axure

PROCESS

The development of the apps feature followed a structured approach that allowed for simultaneous tasks and adjustments as required. The project started with the idea of developing a tool to improve the overall experience of shopping inside physical stores. After conducting research and understanding the needs of clients, the project prioritized solving the main challenges to enhance the shopping experience, making it more convenient, efficient, and tailored to users' preferences.

RESEARCH

ETNOGRAPHIC FIELDWORK

To capture a holistic view, I scheduled 5 visits to the store on different days and at various times throughout the week with the aim of understanding the range of customer behaviors and preferences. During each visit, I spent time in different sections of the store, meticulously observing how customers interacted with items, read labels for product information, and made purchasing decisions. I paid close attention to any visible frustrations or confusion, recognizing that addressing these issues directly contributes to enhancing the overall shopping experience.

People meticulously choose fresh produce, examining each item, touching them. 

Some clients are interested in knowing the ingredients of products; they read labels meticulously and may even smell them.

Some clients depend on guidance from others to locate products or understand what a product is.

This is the space to introduce the Product section and showcase the types of products available. 

INTERVIEWS

I had the opportunity to interview seven individuals and empathize with their challenges when shopping for groceries. The individuals interviewed had diverse backgrounds: three follow special diets, two do not speak English, and two work as Uber grocery delivery drivers. Their challenges included deciphering labels to determine if products met their dietary requirements, learning about shopping for the first time, struggling to distinguish between products like milk and cream, and dealing with the pressures of fulfilling timely deliveries. Using this empathetic understanding of their challenges, I tailored interview questions to address their needs and refined the research process accordingly.

PERSONAS

JOURNEY MAP

VALUE PROPOSITION CANVAS

How Might We spread reliable immigration information and raise awareness about misinformation in a clear, easy-to-understand, and engaging manner, empowering individuals to make informed decisions about immigration and legal compliance?

JOURNEY MAP

VALUE PROPOSITION CANVAS

How Might We facilitate connections between new immigrants and those who have already successfully immigrate, enabling them to exchange resources, provide mutual assistance and navigate their navigation paths with shared guidance.    

JOURNEY MAP

VALUE PROPOSITION CANVAS

How Might We ensure that people effortlessly receives accurate and tailored advice on the immigration process, regardless of geographical location. 

IDEATE

GOAL STATEMENT

The tool is an interactive platform designed to provide reliable immigration information and combat misinformation. It offers personalized resources based on users' needs, educational modules with videos and infographics, a database of verified legal resources, and community forums for peer and expert advice. The tool supports multiple languages to cater to diverse users, includes a survey for personalized assistance, shares inspiring immigration stories, and provides timely updates on policy changes.

 

Collaborations with immigration experts ensure the accuracy of information, while the user-friendly design and feedback mechanisms not only enhance accessibility but also support continuous improvement.

DESIGN RECOMENDATION

WIREFRAMES

I began with basic hand-drawn sketches to outline the structure and layout of the feature.

The interface should include:

  • Immediate Help Button: A quick-access button for users needing instant guidance or support. When activated, the user can gain deeper understanding of the links on the website.

  • Text-to-Audio Conversion feature: Converts selected text into audio for users who prefer listening over reading.

  • Multilingual Support: Users can share and access content in their preferred language, promoting inclusivity, accessibility, and reaching a wider audience.

  • Literacy-Friendly Content: Pop-ups provide explanations for challenging words and features, enhancing understanding, improving vocabulary, and promoting literacy skills.

  • Interactive Glossaries: Users can interactively understand terms by clicking on them, enhancing user engagement, improving comprehension, and facilitating learning.

  • Anonymity by Default: Users can share stories anonymously, fostering a safe and open environment for sharing personal experiences without fear of judgment, ensuring user privacy and comfort.

MID-FI PROTOTYPE

Due to participants' reluctance to engage repeatedly in the testing process, I chose to develop a medium-fidelity prototype for interface testing. This allowed me to balance realistic functionality testing with reduced time and resource demands compared to high-fidelity prototypes.

Personalized Profile Assessment: A thorough questionnaire that evaluates users' backgrounds, qualifications, skills, and aspirations to customize a legal immigration path.

Testimonial Hub: A dedicated section where users can read and share firsthand immigration experiences.

USABILITY TESTING

TEST #1

Participant was similar to JULIO’S profile:

Maximum level of education: High School

Has some familiarity with computers

Never consult anything about immigration

I developed a MID-fidelity prototype using Axure and subsequently conducted a user test involving three participants.

 

In order to guide them through the tasks and assess the interface's usability and effectiveness, I interacted with each participant individually through Zoom video calls, during which calls they shared their screens with me.

TEST #2

Participant was similar to JULIO’S profile:

Maximum level of education: Technician

Lacks computer familiarity

Have apply for a visa before

TEST #3

Participant was similar to JULIO’S profile:

Maximum level of education: Technician

Lacks computer familiarity

Have apply for a visa before

While the participants completed the assigned tasks, I closely observed instances in which they encountered challenges in understanding task fulfillment or identified design glitches within the prototype. After each session, I addressed the identified errors to ensure smoother interactions in subsequent rounds. The final participant who tested the prototype provided valuable feedback, emphasizing the clarity of the service offered, particularly highlighting the intuitive navigation and user-friendly interface.

INTERFACE RECOMMENDATIONS

Obvious and Explanatory Interface

User Problems:

  • If users don't understand what a feature does they will avoid and lose interest in the platform.incorrectly.

Approach:

  • Use straightforward, descriptive labels for all navigation elements to ensure users understand their functions.

  • Keep styles consistent for buttons, links, and other interactive components, helping users quickly recognize their functions.

  • Ensure CTAs stand out with appropriate color contrast and size, making them easy to find.

  • Ensure all interactive elements and content are accessible via screen readers.

Aesthetic and Minimalist Design:

User Problems:

  • Novice users may struggle to identify what action to take first when a webpage addresses multiple tasks simultaneously, leading to confusion and uncertainty.

Approach:

  • Avoid clutter and keep the design simple. Every extra unit of information competes with the relevant units of information and diminishes their relative visibility.

  • Design each page to focus on a single task or goal. Ensure that each page focuses on a single task and provides all necessary information in a clean layout.

PROTOTYPE

You can see the major flows of the app in the following prototype video.

EXPECTED OUTCOME

The expected outcome for Pocketed Counsel is to empower immigrants by bridging the gap between them and legal assistance. The platform aims to help individuals navigate the complexities of the immigration process confidently. With a user-friendly interface and culturally sensitive approach, Pocketed Counsel seeks to make legal support accessible and transparent for all users.

REFLECTION

Pocketed Counsel emerges from the imperative to humanize and enhance fairness within the immigration process. My experience at a law firm revealed that many individuals innocently migrate to the United States, facing risks such as lack of legal representation, exposure to exploitation, and uncertainty about their rights. They are often misled by false promises, leading to critical errors such as submitting incorrect documentation and missing important deadlines, which hinder them from obtaining necessary protection. In today's immigration environment, individuals face the daunting task of discerning between trustworthy and deceptive information, which can profoundly impact their immigration outcomes and legal status. Unfortunately, some legal professionals exploit people's limited knowledge for personal gain. Despite the platform's ongoing evolution, initial testers have provided positive feedback.

bottom of page