Designing for Field Scenarios
Due to NDA restrictions, I will not be sharing the client name or clear high fidelity wireframes. As well, I will not be sharing key functionalities that may give away the brand but will focus on specific problems I encountered and how I proceeded to solve those problems. Visuals can be shown during the interview process.
Design Process
The Situation
A brand reached out to work with Syntronic due to our "idea to complete system" delivery. Our team offered solutions that covered all key milestones of product development, which allowed our team members to work cohesively while delivering the product within the desired time frame.
Constraints
During my design process, I had to align the final wireframes to the brand's overall visual style. I worked alongside the brand's designers, who helped clarify the overall brand vision. This was necessary because I was in charge of creating additional custom assets for the iPad version, as the brand was in the process of getting a revamped design.
I was the only designer working on the project, however, I collaborated with a product manager and senior designer who articulated the results of user testing.
Additionally, I had to operate under specific engineering constraints by collaborating with the engineering team. This helped determine which interactions were possible within the project's overall scope and timeline.
Discovery
As I dove into understanding the project, I realized that I needed to understand how the app connected to various devices to catch issues that users may face while in the field. By collaborating with the engineering team, I understood what data was displayed and what resulted in the data displaying. Furthermore, I interpreted how various actions could interfere with that data - accounting for edge cases that may occur in the field when creating the user flow.
I presented my designs during stakeholder meetings to streamline the user flow and account for technical considerations.
User Flow
User Testing
After the wireframes were finessed, the client set out into the field to test with the intended users. The iPad version was tested due to the majority of users using a company iPad to complete their various tasks.
The primary takeaway was that the environment in which the users were using the product had a lot of glare from their natural environment and was therefore difficult to read. A larger and more easily readable font was used instead to alleviate eye strain and accommodate for their external environment.
The second takeaway was that users had difficulty understanding the hierarchy of the navigation within the iPad version. To counteract this problem, I created a few wireframes to test internally within the team, selected the best options, and handed it off to the client, who then tested the product with their users.
Rough wireframes + brainstorming to explore navigation options
The third takeaway was that users were confused with current icons used within the bottom navigation. I created a large selection of icons, presented them during the stakeholder meeting, and narrowed them down. The designers from the clients' end then held user testing to understand user needs.
Delivery
The third takeaway was that users were confused with current icons used within the bottom navigation. I created a large selection of icons, presented them during the stakeholder meeting, and narrowed them down. The designers from the clients' end then held user testing to understand user needs.
What I Learned
Prototypes must be tested with the intended audience under the intended environment to ensure accessibility and support design decisions.
My Other Projects
© 2024 by Jenna Yang