Please note that some artifacts and sensitive information will be post-processed or excluded for confidentiality issues. All rights reserved to the publisher and designed institution(s) with no distribution.
overview
J. Knipper and Company is a fully integrated direct marketing and drug sampling firm dedicated to the pharmaceutical and healthcare industry. Our client has a list of products for drugs and medical equipment ordering and distribution designed for different people or organizations such as doctors, sales representatives, and drug stores, etc. Because of that, it makes it difficult for users, especially head office users to get all relevant order information for a specific customer.
Knipper reached out to us for a product that allows users to find all ordering information at a centralized location. This project consisted of two stages. The first stage was meant to deliver a conceptual design to get approval for development from major investors. The second stage was for elaboration and providing a detailed design solution that covers all business requirements.
I was the only designer for the first stage and the supporting designer for the second stage to provide UI-related works such as wireframes, prototypes and style guide.
Process
We applied the double diamond design process(see picture below) for both stages. Compare to other projects, the subject to consult and research from were our main stakeholders:
Senior product analysts from all related products
Customer Representative Manager from all related products
Lead solution architect from all related products
Compare to the traditional approach where I will have more time to discover the issues and define user stories. In this project, we needed to provide design/prototype as quickly as we go due to the intensive schedules.
Discovery & Define
For the discovery and define phase in the first stage, my desired outcomes were to:
Understand the business requirements and why so
Establish design strategies that are both economic and development-friendly
As I was the supporting designer for the second stage of the project, I wasn’t able to participate in user reviews or workshop sessions due to the tight budget. My day-to-day contact was either the principal BA who was responsible for most of the communication and/or the PO/lead designer who was responsible for the IA and user flow. My “discovery & define“ was to focus on:
Clarification on the business context/user flow
Why so? For whom?
…
Technical opportunities and constraints
There were some major challenges for this project regardless of the stage differences:
Unfamiliar with the context
Request for quick design and prototype
The volume of data required to process and design was quite overwhelming
Frequent change of requirements in stage II and looking for quick turnouts
Intensive schedules
We have review meetings three times a week which gave me a very short time to identify all the gaps
…
To address all the challenges and support the project, I tried the following things:
Consult with designers, BAs, and developers who had worked with the client before
We have helped the client ship multiple products. I got myself familiar with the background and filled the knowledge gap by having conversations with coworkers who had worked with the client, and going through relevant documentations/artworks
Reference the wireframes from previous projects and identify UX/UI patterns
Engage in design critique sessions with other designers when run into hesitations
Create and share documents for meetings and business requirements to ensure all feedback was up-to-date and captured beforehand
The meeting notes and business requirements were very important documents that helped us to align business requirements and identify user stories and allow us quickly move to the design iteration.
Design Iteration
As I did for other projects, I usually do a 3-point check-in between the design, the development, and the business. There are four steps for a user story iteration:
Internal alignment session
Align requirements on a whiteboard or via sketches is possible
Internal check-in session prior to presenting to the client
Verify all use cases and businesses pursuing
Stakeholder review
Present the solution to the client for a roundtable critique
Gather additional feedback via offline prototype
Technical feasibility check
Sign-off
The client will sign-off on approved user stories through emails or google sheets
We use low-fi prototypes to communicate and test with the client until all requirements were met. Unlike other projects, this project was rather demanding, quite data-heavy, and needed to identify alignments between different product teams. We were experiencing frequent change requests, thus an intermedium prototype would better serve us.
One of the challenges was to better manage the amount of data. This was a data-heavy project and the client was demanding to present as much information as possible so that users won’t need to drill down to several levels. Thus from a design perspective, we need to know the following things about the data set:
The priority
By usage
By target user group
By business channel
The hierarchy/relationships to other datasets
The viewing angle(sorting logic)
By target user group
By business channel
The way to acquire
By request only or
Always accessible
On the UI level, multiple view-switching components, such as tabs, accordions, and toggles, were used to prioritize, sort and present relevant data to users.
Hands-Off and Support
Once we received a green light on a user story, I prepared the wireframes and export them to Zeplin along with the most updated design system and all the necessary graphics to ensure a smooth transition between design and development. The wireframe inventory will not cover the user flow. Developers could reference the clickable prototype for such information. The design will stay supportive until a user story has been committed and tested.
impact
This was my last project at AppCentrica and unfortunately, I wasn’t able to see it live. This was an intermedium investor check-in in which our client present the prototype I created. According to our client, it was well received.