West Monroe Intern Project
Designing a more accessible & responsive label generator environment.
Deliverables
High Fidelity Prototype
User Research Stories
Low Fidelity Design
My Role
UX/UI Design
User Research
Developing Personas
Project Context
Timeframe: June-August (Two Months)
Organization: West Monroe & PXEL
Tools: Figma, Miro and Confluence
Team: Rajbir Singh, Connor Blacksher, Noah Miwa, Darius Lawson, Kala Pratt, & Jason Zytkovicz.
Overview
This project is part of the West Monroe Product Experience and Engineering Labs. I worked with a large nutrition label research company to create a customer portal to help expand their current system of business tools. I was able to create low-fidelity and high-fidelity pages to help my team work more efficiently. With my help, we were able to produce more screens than was expected from the client side and employ inclusive design.
The Goal
To transform a nutrition label research company label creator experience to make it more user-friendly and to update the system.
Research
Research has shown that most users in the food and nutrition label industry work closely with the government. This is to ensure that their product is up to date and following guidelines that are set forth by the FDA. As companies start moving into software management, the importance of creating a welcoming customer experience becomes more important in business-to-business interactions. These users are food scientists that develop ingredient lists for many household companies.
Personas
The personas that we worked with were already determined by our engagement. However we also worked to develop these personas further to better understand who are designing for. We came up with four personas ranging from power users to novice users.
Design Process
Based on our personas and interviews we came up with design requirements that we thought would help improve the customer experience with design
Some of our requirements include:
-
Visibility of System Status
-
Consistency and Standards
-
Recognize, Diagnose and Recover from Errors
-
Space utilization
The goals that we would like to achieve:
-
Accessibility so that more users can use our desktop app
-
Help users contain/correct small errors and submit recipes correctly from the first time
Ideation Process
Based on our design process we came up with three different types of methods that would allow us to build our desktop experience.
-
Form styled approach
-
Accessible styling for a wider audience to use
-
Modals that required a supervisor to sign off
Our broad goal was to allow users to have a more straightforward method of creating labels and saving recipes in a convenient database.
Product Features
As we were redesigning the customer experience of our desktop app. We came up with four features that would help users organize the content of their recipes. As time progressed and designs changed we later added modals that corresponded to each page to allow the user to have a chance to correct their work.
These four pages are as follows:
-
File Viewer – This expanded on the current web experience where the user only had a column to view files with no previews. File Viewer allows the user to edit recipes, add tags, and more metadata.
-
Ingredients – This page allows the user to populate their recipe with ingredients. In this sequence, they will have to follow different requirements such as deselecting any allergens that are recognized by the FDA.
-
Recipes – This page allows users to add different cook times and add ingredient amounts.
-
Create Label – Allows users to generate a label using the needed regulations and different market guidelines.
-
Approval Process – These are across different areas in the experience as a user completes each page they will have to get their recipes submitted for review.
Wireframes + Low-Fidelity Prototype
Using our design requirements and our current working file we developed a low-fidelity design.
Evaluation
My evaluation was done by asking fellow designers and users from the engagement to understand how our low fidelity would work. We received direct feedback from our designs.
Overall positive feedback, we decided to consider a few different design changes.
-
Adding a modal that allowed the user to have 'jump to edit'
-
The summary form allows users to see what they had worked on
-
Error sequences and autosave banners as the user is working
Final Design
This is where I had the most ownership to create a design along with working with my senior product designer. I was allowed to have full ownership of what I created and designed with the user in mind. Below are the designs of the 4 pages and modals that show the approval process.
Reflection
As my internship progressed I was tasked with being not only a product designer but also a consultant at the same time. I am thankful for the opportunity to be able to design and balance the business aspect of presenting and selling my work taught me to become confident in my speaking abilities and be open to immediate feedback from my engagement company. As my internship progressed I got work on this project and two other small internal educational projects to help teach future interns, new hires, and professionals in the growing field of human-centered design. This project helped me grow as a designer and allowed me to have full ownership of a distinct design process such as low-fidelity and high-fidelity. I was able to have full responsibilities and was treated like an employee rather than just an interim designer, I am thankful for the opportunity to grow as a designer and learn from the Product & Experience Labs at West Monroe!