Apotek K-24
2024
UI/UX Design
Role
UI/UX Designer
Scope
Redesign
Platform
Time Frame
10 days
Introduction
Apotek K-24:
A Trusted Partner in Health
Apotek K-24 has built a solid reputation over two decades, having been established in 2002 and becoming a familiar name among the Indonesian public. The business has experienced rapid growth, now boasting more than 700 branches throughout the country. In addition to selling medications directly to customers, Apotek K-24 also offers business opportunities through franchises and other avenues. This dual approach allows Apotek K-24 to serve not only B2C customers but also provide essential services for B2B needs.
Traditionally, customers have purchased their medications by visiting physical outlets, but Apotek K-24 also offers the convenience of online shopping. The K24Klik app is designed to simplify the process of purchasing medicines online, making it easier than ever for users to access the products they need.
Problem Finding
Navigating Obstacles in Visibility
But when I opened the official website of Apotek K-24, I found several problems that need to be addressed, such as the following:
Although Apotek K-24 has the K24Klik app, it is not widely recognized or used. Many users still prefer physical visits to the pharmacy.
The current website makes it difficult for users to find information about purchasing medicines online, as the homepage is overly focused on franchise information.
Information about the K24Klik app is unclear and not easily accessible.
The app download button is buried among numerous banners, and the information about partnerships is excessive and confusing.
Objectives
From Confusion to Connection
Here are the main objectives for enhancing the Apotek K-24 website:
Implement a highly visible and compelling call-to-action (CTA) button above the fold, prompting visitors to download the app.
Incorporate user testimonials, reviews, and social proof elements to build trust and credibility.
Showcase the primary benefits and unique selling points of the app prominently on the landing page.
Leverage user feedback to refine the website’s functionality and optimize the overall user experience.
By focusing on user engagement and simplifying the journey, we aim to make key information more accessible and intuitive.
Goals
Transforming Interaction from Interest to Action
As a UI/UX designer, the main objective of this project is to redesign the website with a focus not only on users but also on catering to business needs.
(B2C and B2B) Provide a smooth and visually appealing experience that reduces bounce rates and improves interaction with the landing page content.
Enhance the landing page to significantly boost app downloads and increase awareness of valuable business opportunities.
Research
Diving Deep to
Understand User Needs
User Interview
Research Method:
The purpose of conducting user interviews was to gain a deeper understanding of user needs and pain points. This process helped validate assumptions made during the initial research phase, ensuring that the design solutions were aligned with real user expectations. Additionally, the interviews allowed us to identify areas where usability could be improved and gather valuable insights for enhancing the overall user experience on the Apotek K-24 website.
Aged 18-35 years old
Reside in Indonesia
Have purchased medicine from a pharmacy either online or offline
Offline Buyer: Still purchases medicine by visiting the pharmacy
Online Buyer: At least have bought medicine online (via K24Klik App or competitors like HaloDoc, Kimia Farma Mobile, AloDokter)
Preliminary Usability Testing
Five tasks were designed to identify user pain points when navigating the Apotek K-24 website. This testing aims to gain valuable insights, particularly regarding user behavior when interacting with the official website of a company.
Scenario:
B2C: You want to buy medicine but don't feel like going out. You visit the Apotek K-24 website to find information and discover that Apotek K-24 has an app called K24Klik. You learn about the app's key features and various offers. Now, you're interested in downloading the K24Klik app.
B2B:
You are interested in partnering with Apotek K-24 and are seeking information about this business opportunity.
A success rate is a metric that measures how well users perform specific tasks. The average score for a product with good usability is around 80%. However, the result was only 55%, and there were several insights and feedback from users as follows:
Insight & Top Findings
Insight and Top Findings data summarizes the user’s pain points gathered during preliminary usability testing in User Interview.
Define
User Pain Points and Expectations
User Persona
A user persona is built based on interview data as a representation of participants.
Affinity Mapping
The goal of the user interviews was to identify pain points users experience on the Apotek K-24 website. We gathered data from interviews, grouped similar insights, and then prioritized the most critical issues to focus on during the redesign.
Ideate
The Power of Possibility: Exploring Creative Paths Forward
In this section, I am crafting potential solutions using the "How Might We?" framework, based on insights and findings gathered from the research process.
The Priority Matrix helps to focus on the most important tasks and allocate resources effectively, ensuring that my efforts are directed toward potential solutions that align with project goals and desired outcomes.
The improved information architecture for the Apotek K-24 website focuses on enhancing user navigation across four key pages:
Home: Prioritizes B2C users by making the K24Klik app download prominent and easy to access.
About Us: Provides general information about Apotek K-24, highlighting its history and services.
Business Opportunities: Tailored for B2B users, offering clear details on partnership and franchising options.
Download App: A straightforward page guiding users directly to the App Store or Play Store for downloading the K24Klik app.
Legend:
The user flow for both B2C and B2B visitors on the Apotek K-24 website guides users from the hero section to the CTA. B2C users are led to explore the K24Klik app and download it, while B2B users find business opportunities like franchising and are directed to the partnership CTA.
Legend:
UI Style Guide
A Comprehensive Resource for UI Designers and Developers
Landing Page Optimization
Boosting K24Klik app downloads & Enhancing business opportunities awareness
To boost K24Klik app downloads and increase awareness of business opportunities, several key design improvements were implemented. The navigation menu was simplified to prioritize customer-focused information, making it easier for B2C users to access what they need without being overwhelmed by franchise details. Additionally, a dedicated page for online purchases was created, clearly labeled on the homepage to guide users directly to the K24Klik app, allowing them to easily explore its features and offers.
Clear and prominent Call-to-Action buttons were also strategically placed throughout the website to direct users to the online purchasing section, ensuring a seamless experience. These design solutions were crafted to align with the core objectives: highlighting app benefits, incorporating social proof, and providing a smooth user journey that ultimately drives engagement and conversions for both B2C and B2B audiences.
Here is the Hi-Fi design and the final solutions, crafted based on insights from the Priority Matrix:
Evaluating Apotek K-24's New Design
Usability Testing to Gather Insights and Refine Solutions
Usability Testing
Five tasks were designed to validate the results of the design solutions that were implemented when navigating the Apotek K-24 website, using the same participants from the preliminary usability testing.
Scenario:
B2C: You want to buy medicine but don't feel like going out. You visit the Apotek K-24 website to find information and discover that Apotek K-24 has an app called K24Klik. You learn about the app's key features and various offers. Now, you're interested in downloading the K24Klik app.
B2B:
You are interested in partnering with Apotek K-24 and are seeking information about this business opportunity.
Usability Testing Result
Since the usability testing result was 100%, I asked participants if they would be interested in downloading the K24Klik app after browsing the improved Apotek K-24 website. Here are their responses:
Result
The redesign of the landing page led to a remarkable improvement in user engagement. Preliminary usability testing scored 55%, but after implementing the changes, the score surged to 100%. During usability testing, users reported feeling happy with the navigation and found it easy to access the information they needed.
Additionally, 96% of participants showed a high level of interest in downloading the K24Klik app following the redesign. These results highlight the effectiveness of the enhancements, demonstrating that good navigation is key, and validate the project's success.
Lesson Learned
This project has been a valuable learning experience, particularly in refining my skills and improving time management. From the beginning, I was able to identify the problem and think of potential solutions. However, I made sure to maintain empathy for the users to avoid bias and ensure the solution truly addressed their needs.
Working on this redesign also provided a great opportunity to create a compelling presentation deck, enhancing my ability to communicate design decisions effectively. The process helped me grow as a designer by balancing technical expertise and user-centered thinking.
Next
Moving forward, my focus will be on tackling projects that deliver meaningful improvements and positively impact users.
If you're looking for a designer who can bring fresh perspectives and effective solutions to your next project, let's work together to make a difference.
