2023
Design System
UI/UX
Role
UI Lead
Redesigned pharmaceutical POS experience with a modern style, improved functions and accessible layout.
Overview
Lofex stands as a prominent pharmaceutical vendor in Mexico; however, their software required an update to align with the latest operating systems on their computers. Recognizing this as an opportunity for enhancement, we suggested a comprehensive interface update. To achieve this, we initiated a user research process involving their vendors, aimed at elevating the software's aesthetics to a modern and captivating level. Our goal was to create an adaptable, user-friendly experience that catered to the needs of every vendor, ensuring a seamless and efficient interaction with the software.
Team
Camilo Montoya, UI Lead.
Arturo Gómez, UX Lead.
Jose David Giraldo, Project Manager.
Óscar Giraldo, UI Designer.
Jose Ossa, UI Designer - UX Researcher.
Amalia Acitlali, UX Researcher.
Context
Lofex Pharmacy is a prominent pharmacy network in Mexico, with a strong presence in both Guadalajara and Cancún, encompassing over 30 boutiques across these vibrant cities. In response to the evolving technological landscape, Lofex recognized the need to migrate their existing software to a more compatible programming language, specifically to enhance the user experience on the latest Windows operating systems. While acknowledging the necessity to embark on this project from the ground up, we were determined to create something truly meaningful. Our goal was to craft a purposeful and modernized interface that didn't merely replicate the old, somewhat outdated design but instead, breathed new life into the user experience.
Objective
Craft a POS experience for Lofex Pharmacy based on user research and modern user experience.
Design Process
To initiate this project, we initiated an extensive UX research phase. This involved conducting a benchmark analysis to evaluate the capabilities of other Point of Sale (POS) systems, conducting a thorough exploration of the existing tool to comprehend its functionalities, and conducting in-depth interviews with five Lofex vendors. These interviews provided valuable insights into their perspectives on the POS and how they navigate specific tasks within the software. Armed with these research findings, we gained clarity on the areas that required prioritization, thus establishing a robust foundation for the POS project.
Subsequently, our focus shifted towards enhancing the software's architecture while preserving its full range of functionalities. The goal was to reorganize these functions in a manner that aligned with the research outcomes and our expertise in creating user-friendly interfaces.
The establishment of the Design System served as the cornerstone for scalability, providing a comprehensive design foundation from which we could build our wireframes. We drew inspiration from the Fluent Design system by Windows, referencing its components, styles, and guidelines. This approach not only ensured clear documentation for developers but also lent the software a sleek appearance, reference to using familiar tools like Word or Excel, contributing to a seamless user experience.
With the design system in place, we commenced the creation of wireframes that mapped out our envisioned interface improvements, emphasizing interaction and layout hierarchy. Through multiple iterations, we honed our proposal, retaining key elements from the previous design while introducing a structure that streamlined user steps and enhanced vendor focus during sales processes. This iterative design process allowed us to strike a balance between familiarity and innovation, ensuring a more efficient and user-centric POS interface.
Subsequently, we meticulously refined our user journey through the creation of wireflows, strategically mapping and prioritizing user interactions. This step aimed to ensure a logical, intuitive, and easily comprehensible flow of actions. It provided an opportunity for thorough review and validation with both the development team and the client to ensure alignment with their expectations for the overall user experience.
Following the approval of wireflows, we ventured into enhancing the design system further. This phase introduced some custom components and templates for a much easier update on the design file. The wireflows were then transformed into detailed userflows, vividly representing the software's final look and feel through mockups that showcased different interaction scenarios.
Ultimately, we brought the project to fruition with the creation of a prototype. This interactive model navigated through the primary userflows, providing an experience marked by clarity and reduced room for error, a direct result of insights gathered during our initial research. The prototype afforded stakeholders the invaluable opportunity to engage with the design in a hands-on manner, gaining a profound understanding of how the product would function in practice.
This comprehensive approach, spanning meticulous research, architectural refinement, iterative design system development, and detailed userflows, culminated in the creation of a dynamic and captivating prototype. It not only promises to deliver an exceptional user experience but also serves as an invaluable reference point for the development team, ensuring that the final product aligns with the vision and expectations established throughout the design journey.
The Problem
However, not everything proceeded as seamlessly as expected. During our last stakeholder meeting, their lack of enthusiasm about the final delivery was palpable. They expressed concerns that our solution did not sufficiently reflect our understanding of the users' needs and their workflows. Additionally, they pointed out that certain interface improvement suggestions came solely from vendors, who may not fully comprehend the requirements for a scalable product designed to accommodate various user profiles effectively.
Our Proposal
Knowing this issue, we immediately calm their thoughts by offering a guided workshop and a design iteration of our deliverables, that would help us understand them better and what should be really changed of what we have right now, but also that they see our point of view for a prioritized development based on certain functions and how our design approach with a design system serves as a tool for a scalable product.
Workshop
We conducted two workshops to address the issue. The first workshop, conducted remotely, focused on identifying the source of confusion regarding the main screens using the prototype. Our goal was to pinpoint quick fixes that could be promptly applied. In the second workshop, held at their physical offices, we presented improved screens in printed form and gathered feedback. This session involved not only the stakeholders but also other vendors whose input was valued in shaping the product.
As a result of both workshops, we compiled a list of various improvements that held significance for the client. We then prioritized these enhancements, tackling the most pressing issues as a priority while retaining others as part of a backlog for a subsequent phase of the project.
Design Iteration
In our most recent iteration of the product, we diligently implemented the prioritized fixes derived from the workshop outcomes. Then, we furnished the development team with all the requisite assets and guidance, streamlining the product's creation process. The majority of these fixes revolved around enhancing product navigation and refining the control mechanisms governing what a vendor profile can modify.
Impact
The client eagerly awaited the fully developed product, now equipped with a deeper understanding of our scalability vision for the future. They recognized our commitment to crafting a user-friendly experience for vendors, drawing inspiration from our initial research and their valuable input. This transformation promised to have a significant impact on the company, expediting sales and minimizing challenges associated with platform adoption. The guided interface and support tutorials were designed to smoothen the learning curve, ensuring a seamless and efficient user experience.
Learnings
Despite the project's occasional challenges, I found immense value in the experience of conducting research and engaging with real users to establish essential design guidelines for the product. This process provided us with a robust foundation upon which to substantiate our design choices. Furthermore, it deepened my understanding of the client's perspective, emphasizing the importance of maintaining close collaboration with the client throughout the project. This approach facilitates iterative feedback and minimizes friction in the project's delivery, ultimately leading to a more successful outcome.
Password: Lofex2023
Check out more of my work: