From Complexity to Clarity: Improving the LC Pharmacy End-User Journey

From Complexity to Clarity: Improving the LC Pharmacy End-User Journey

About Project

About Project

About Project

LC Pharmacy, a thriving retail chain in the healthcare sector, aims to provide customers with speedy access to medical products, 24/7 consultations, and comprehensive care. The LC Pharmacy app plays a vital role in engaging and nurturing potential customers.

My mission

My mission

My mission

When I joined this project, my goal was simple: make a complex pharmacy app feel effortless for everyday users. I spent time listening to real customer needs, turning those insights into flows that felt natural, and shaping prototypes that showed how each idea could come to life. For me, it wasn’t just about creating screens, but about making sure people felt supported and confident when using the app.

Timeline

Timeline

Timeline

The design process was continuously refined and iterated with a strong focus on user-centered principles, leading to multiple effective and well-aligned improvement options.

The design process was continuously refined and iterated with a strong focus on user-centered principles, leading to multiple effective and well-aligned improvement options.

User Flow

User Flow

User Flow

After collecting insights from users, business stakeholders, and technical experts, I collaborated with the Product Manager and team members to brainstorm solutions for the identified issues. Our primary focus was mapping out the user flow and ensuring alignment with user expectations and needs.

After collecting insights from users, business stakeholders, and technical experts, I collaborated with the Product Manager and team members to brainstorm solutions for the identified issues. Our primary focus was mapping out the user flow and ensuring alignment with user expectations and needs.

Heuristic Analysis

I conducted a heuristic analysis based on Jacob Nielsen's 10 heuristic principles to identify usability problems in the user interface design. It's an essential step in evaluating the product:

Consistency and standards

Inconsistent spacing, style, and colors create poor visual hierarchy and make reading difficult. The layout inconsistency adds cognitive load for users.

Consistency and standards

Inconsistent spacing, style, and colors create poor visual hierarchy and make reading difficult. The layout inconsistency adds cognitive load for users.

Aesthetic and minimalist design

The design appears to be outdated and the content is not logically organized, resulting in a dense and unappealing interface.

Aesthetic and minimalist design

The design appears to be outdated and the content is not logically organized, resulting in a dense and unappealing interface.

System-to-real world alignment

Information is not displayed in a natural or logical order, and the use of multiple internal jargon makes it difficult for users to understand.

System-to-real world alignment

Information is not displayed in a natural or logical order, and the use of multiple internal jargon makes it difficult for users to understand.

Flexibility and efficiency of use

The initial data visualization is unclear due to bad color choices and design, making it hard to grasp insights and slowing down users.

Flexibility and efficiency of use

The initial data visualization is unclear due to bad color choices and design, making it hard to grasp insights and slowing down users.

Final Design

Final Design

The final design went through iterations, incorporating user feedback from usability tests, A/B tests, and surveys. However, launching this functionality is just the first step in the program's success. To further assess its performance and shape the product roadmap, analyzing key metrics like drop rate, task success rate, time on task, error rate, and completion percentage is essential. These metrics offer valuable insights for gauging success and guiding future improvements.

The process of purchasing
in a shopping cart

The process of purchasing
in a shopping cart

The process of purchasing
in a shopping cart

Old design version

Old design version

01

01

01

The shopping cart combines all information into one screen including products in the cart, customer information, delivery method, payment method,...
-> This can lead to users missing information in case the shopping cart contains many products.

02

02

02

When the shopping cart contains products that cannot be purchased immediately (out of stock/need pharmacist advice), the user can only delete them.
-> Reduces the opportunity to be advised on alternative products by a specialized pharmacist.

New design version

New design version

01

01

01

Divide the purchasing process into 3 basic steps to reduce the burden on the user's memory, making it easy and friendly to use.

02

02

02

Users can immediately create a consultation request for products that cannot be purchased online (out of stock, medicine,...) without leaving the shopping cart.

96.8%

96.8%

Success Rate

Success Rate

7.6s

7.6s

Average time to complete a task

Average time to complete a task

The process of purchasing
prescription drugs

The process of purchasing
prescription drugs

The process of purchasing
prescription drugs

Old design version

Old design version

01

01

01

The UX/UI experience in the application and website is not consistent, users are confused when switching between the two platforms

02

02

02

Information hierarchy is not optimized, making it difficult for users to use the feature

37.5%

37.5%

Success Rate

Success Rate

50.1s

50.1s

Average time to complete a task

Average time to complete a task

New design version

New design version

01

01

01

Unify the experience between the application and the website

02

02

02

Users can easily use it without needing instructions from a pharmacist. Save the using time.

95.9%

95.9%

Success Rate

Success Rate

7.1s

7.1s

Average time to complete a task

Average time to complete a task

Re-design UI Concept

Re-design UI Concept

Re-design UI Concept

Old design version

Old design version

01

01

01

The shopping cart combines all information into one screen including products in the cart, customer information, delivery method, payment method,...
-> This can lead to users missing information in case the shopping cart contains many products.

02

02

02

When the shopping cart contains products that cannot be purchased immediately (out of stock/need pharmacist advice), the user can only delete them.
-> Reduces the opportunity to be advised on alternative products by a specialized pharmacist.

New design version

New design version

01

01

01

Creating a lively and friendly mascot with expressive emotions to convey feelings such as love, care, happiness, and even occasional frustration.

Creating a lively and friendly mascot with expressive emotions to convey feelings such as love, care, happiness, and even occasional frustration.

02

02

02

Leveraging motion effects to enhance the excitement in the user experience.

Leveraging motion effects to enhance the excitement in the user experience.

03

03

03

Clear content organization and hierarchy to help users quickly grasp information and navigate effectively.

Clear content organization and hierarchy to help users quickly grasp information and navigate effectively.

Create a free website with Framer, the website builder loved by startups, designers and agencies.