How to make online purchasing of medications or other pharmaceutical products a simple, intuitive, and accessible process for everyone?
Farmácias Portuguesas is a network that includes around 2000 pharmacies in Portugal. This case study focuses on creating a mobile application for Farmácias Portuguesas to enhance the online shopping experience for medications and other pharmaceutical products.
In this project, I was responsible for the following flows:
Creating an account and logging in.
Adding and removing products from the cart.
Completing the checkout process.
Checking the order status. My work aimed to ensure that the application was accessible, intuitive, and met the needs of users, including people with different types of limitations.
My main tasks were:
Desk Research: In-depth research on the previous app and the Farmácias Portuguesas website, identifying usability and accessibility issues.
User Research: Conducting interviews and a survey to understand user needs and challenges in accessing pharmaceutical products.
Personas: Creating personas based on interviews and surveys to guide design decisions.
Empathy Map: Developing empathy maps to understand users' pain points, needs, and desires.
Competitive Analysis: Analyzing competitors and benchmarking to identify best practices and areas for improvement.
Information Architecture: Structuring the application to ensure intuitive navigation.
Wireframes: Creating low, medium, and high-fidelity wireframes, exploring different solutions, and refining them based on feedback.
Style Guide: Developing a style guide to ensure visual consistency, including typography, colors, icons, and other design elements.
Prototype: Building an interactive prototype to test the application's usability.
Usability Testing: Conducting tests with users to identify improvements and optimize the experience. 
Figma
Miro
Notion
Survey Monkey
Google Meet
SimilarWeb
AccessMonitor
The process was divided into six phases: Research, Empathy, Definition, Ideation, Design, and Testing.
In the research phase, I conducted a detailed analysis of the current context of Farmácias Portuguesas, including reviewing past resources and investigating existing issues.
Through in-depth online research, I discovered that in 2016, Farmácias Portuguesas launched a mobile application that allowed customers to shop online and order products for home delivery.
The app launch was widely covered in various media outlets and websites. However, seven years after its release, the application is no longer available. The app links on Google Play and the App Store show errors, and searching on these platforms no longer returns the product.
Currently, online purchases at Farmácias Portuguesas can only be made through the website. According to Similarweb data, website users have the following characteristics:
93% reside in Portugal.
59% are female.
41% are male.
26% are between 25 and 34 years old.
28% are between 35 and 44 years old.
17% are between 45 and 54 years old. However, the website has some usability and accessibility issues. Through a heuristic analysis of the mobile version, I identified the following problems:
Error prevention: Forms do not indicate which fields are required.
System and real-world compatibility: Some icons confuse users.
User control and freedom: Some pages lack 'emergency exits' that allow users to go back without relying on the system.
System status visibility: In some pages, users are not informed about their current location within the site. Besides usability issues, I identified accessibility failures, including:
Forms without labels: Input fields lack proper labels, using only placeholders.
Poor color contrast: Some color contrasts do not meet accessibility standards.
Small font sizes: Text is hard to read due to small font sizes.
Clickable areas with little spacing: Icons and buttons are difficult to see and interact with. 
Examples of mobile version screens of the Farmácias Portuguesas website
Using accessMonitor, I discovered that the homepage of the site has an accessibility score of 4.5 out of 10.
In the empathy phase, I sought to understand users' needs and challenges through interviews and a survey.
I conducted interviews with five users of different profiles to understand their purchasing habits and methods of acquiring medications or other pharmaceutical products. I gathered the following insights:
At the beginning of this year, I had a health issue that left me dependent on my wife to buy my medications. Adult Male
I live far from town. When I need to buy medications, I have to take a taxi or ask my son to bring them for me. Senior Woman
I have little free time. I prefer to shop online rather than go out. Young Adult Woman
In the survey, which received more than 20 responses, I extracted the following insights:
40% of respondents purchase medications or other pharmaceutical products monthly.
90% buy online due to lack of time.
75% buy online because of discounts.
80% are Farmácias Portuguesas customers. In the definition phase, I identified the problem and defined the target audience and personas.
Based on interviews and the questionnaire, I found that people face difficulties in purchasing medications or other pharmaceutical products in person due to three main reasons:
Lack of time
Geographic limitation
Disability Therefore, the solution needed to ensure that the process of purchasing and delivering medications or other pharmaceutical products was simple and inclusive.
Based on the data obtained from interviews, the questionnaire, and Similarweb, I defined the following target audience, which includes people with some type of limitation, whether physical or cognitive, permanent or temporary:
Young Adults
Adults
Seniors Additionally, I defined five main profiles:
People without time
People living far away
People with motor disabilities
People with visual impairments
People with hearing impairments Based on this data, I created five personas representing the different user groups.
Profile: People without time
Profile: People living far away
Profile: People with motor disabilities
Profile: People with visual impairments
Profile: People with hearing impairments
Profile: People without time
Profile: People living far away
Profile: People with Motor Disabilities
Profile: People with Visual Impairments
Profile: People with Hearing Impairments
In this phase, I identified the main competitors of the Portuguese Pharmacies app and conducted benchmarking to understand how competitors presented similar features, analyzing best practices and areas for improvement.
The main competitors of the app
Farmácia Elisio Andrade stood out as the best competitor in terms of accessibility and usability due to the following positive points:
The color contrast follows accessibility guidelines.
Clickable areas with good element spacing.
Readable font.
Forms with labels.
Intuitive and easy-to-use navigation.
Well-organized and structured information. On the other hand, Farmácia Sacavém showed several negative points:
Poor color contrast.
Forms without labels.
Unreadable font sizes.
Some clickable areas with poor spacing.
Difficulty going back without using the system. Next, I created the app map, outlining the structure and main features.
App map
In the design phase, I started by creating low-fidelity wireframes to test the initial ideas and navigation structure, followed by medium-fidelity wireframes.
Examples of medium-fidelity screens
Through the medium-fidelity wireframes, I conducted usability tests with five users to validate the navigation and main features. I received the following feedback:
All users were able to log into the app.
All users understood the flow of adding products to the cart and checking out.
4/5 users correctly identified the back button.
2/5 users understood the difference between the Filter and Sort buttons. Based on the feedback, I made adjustments to the wireframes and conducted new usability tests. After the adjustments, I created a style guide and high-fidelity wireframes.
In the style guide, I paid attention to the typography, font sizes, color contrast, and iconography to ensure the product was accessible to all users while aligning with the brand's visual identity. For this, I tested color contrast using online tools like Accessible Brand Colors and the Stark plugin for Figma.
Style Guide
Next, with the high-fidelity wireframes, I developed an interactive prototype and conducted usability tests with five users. I received the following feedback:
All users were able to log into the app and navigate through the pages.
All users were able to filter options, add products to the cart, and complete the checkout.
All users could clearly see the texts and colors and understood the functionality of the buttons and icons. Based on the identified problems and the specific needs of each user group, I designed a mobile app that simplifies the online purchase of medications or pharmaceutical products, while also allowing for home delivery.
The main features include:
Shopping management: Add and remove products from the cart easily.
Simplified checkout: Optimized purchase completion process for a fast and efficient experience.
Order tracking: View the status of orders in real-time. In addition to the features, the design was thought out to provide an accessible and intuitive experience, ensuring:
Readable font sizes to facilitate reading.
High color contrast (AAA level).
Adequate spacing between elements to avoid accidental taps.
Intuitive navigation buttons, including options to easily go back in any flow.
Accessible forms, with visible labels and clear feedback.
Sans-serif fonts, ensuring better readability on digital screens.
Progress bar, allowing the user to quickly see which step of the checkout they are on.
Clear success and error messages, with intuitive colors and icons for better guidance. 
App features
The result is an accessible, intuitive, and secure shopping experience that simplifies users' daily lives.
Home Screen
Log In
Home
Categories
Category
Subcategory
Product Details
Cart
