The V-Lab mobile app enables chemists to upload drawings of chemical compound structures, order custom synthetic chemicals, get quotes based on different quality and purity levels, and track the progress of orders—all on the go.
I was lead UX designer on the project while I worked at Grio, a San Francisco design and development studio, and directed two junior designers at various phases. One of the first things we did was create a project brief to get alignment with the client stakeholders on the project’s vision, problems, goals, objectives, requirements, phases and milestones.
The client, WuXi AppTec, wanted to update the app’s design to appeal to a younger generation of chemists and make it easier to use. The budget, however, was small and the turn around time fast, so there wasn’t going to be validation by using prototypes and usability testing. With these constraints in place, I tackled the problems by listening, evaluating, and exploring.
I had the pleasure of working with Robert on one of our highest priority mobile app development projects. He was able to quickly familiarize himself with the challenges at hand and produced great UX designs that met our demands. His thought process was a nice balance between addressing our business goals while also considering user needs and pain points. He has a positive attitude and openness for feedback, as well as able to get the job done on time.
— Annie Chen, Project Manager – WuXi AppTec
The project began with a kick-off meeting with the client. I recapped the goals, objectives, milestone dates, potential risks, and design project plan. This creates alignment between client and designers at the beginning of the project.
The design project plan outlines the phases, steps, complexity, and outcomes of the design process. It includes a Gantt chart that estimates the project schedule. The design project plan is a living document and can change as the designer and client gather new insights that reframe the problem or objectives. We can pivot at any time as long as budgets and deadlines are met.
After the kick-off meeting I began the project by conducting listening tours with stakeholders to learn and understand their goals with the redesign. It became clear they wanted a modern look, but also wanted to improve interactions and flows. All of the key takeaways from the interviews were gathered into the project brief.
I then conducted a heuristic evaluation that documented UI/UX issues screen by screen and analyzed the user’s journey to determine additional pain points. The main issues included confusing onboarding, tracking inquiries, and uploading chemical drawings. These issues, along with others, were presented to the client and we prioritized the one’s that fit within the project’s budget and deadline.
Several rounds of sketches explored user flows, interactions, and patterns that addressed the UI and UX issues. Once these were solved I began the conceptual designs, which explored the app’s visual design including logo, photography style, typography, infographics, iconography, and color palette.
Since this was a collaborative project with feedback loops stakeholders and target users reviewed designs and provided feedback against the objectives captured in the project brief. This helped me fine tune the designs until a final version was arrived at.
The end result delivered improved UI and UX solutions including more meaningful onboarding, easier sign-up and log-in, clearer estimation flow and order process, unique main menu navigation, and an overall modern visual design. All of this was achieved on budget and on time.
Analytics revealed after a few months of release a four-fold increase of app downloads, more time spent using the app, and increased number of orders.