BaseSpace Mobile App
Overview
Role: UX Designer, UI Designer
Goals: Work collaboratively with the UX lead, product owner, and mobile developers to redesign the current iOS mobile app by improving the information architecture and discoverability of content that is simple, aesthetically pleasing, and consistent with the Sequence Hub web-app and other company apps to maintain style and familiarity when switching applications.
Type: Hybrid Mobile App
Evaluating Existing App
The existing app's experience was weak. The information architecture was poor, fonts were too thin, consistency and alignment was sacrificed, and key features like searching and filtering were not implemented.
Analytics and Assumptions
Based on the data available to me via Google Analytics, I was able to make some assumptions on what's working and what's not with the existing mobile app. For example, only 2.9% (5,169) of the users who view 'Analysis List' actually continue to view 'Analysis Details,' so it was safe to assume that users don't find the 'Analysis Details' page useful. My next question was, how can I make it more useful?
Ideating with Sketches
Rough sketches based on initial assumptions helped define the direction of the design. My main focus at this point was to improve the information architecture of the existing app and make more important information more accessible with a brand new Home page.
Learning with Contextual Inquiry
Although sketching helped me get a feel for which direction the design was going to go in, I still needed to learn more from my users to understand their main use cases and find out what information was most important to them.
Recruiting and Interviewing Users
I was able to recruit 3 internal users that use the BaseSpace mobile app. I scheduled an hour interview in their work settings to ask them some open ended questions, which would ultimately help me understand their needs and design around what's important for them when they're using the mobile app.
I created an Interview Protocol (pictured) to help guide me through the interview process.
Using the KJ Method to find common insights…
Testing with Mid-Fi Mockups
I was ready to begin refining my sketched concepts and start wireframing possible screen flows. I planned on testing my first prototype with these screens, so I opted for mid-fidelity mockups by including realistic content and some design elements (like icons, font sizes, font weights, etc) to help users understand the flow of the app in testing sessions.
I used InVision to create my first prototype to test with users. The goals of my usability tests were to: ensure the app is easily navigable, generate a response from users on the reorganization of app content, and validate that users understand and need the new concepts that are being considered.
Moving to Hi-Fi, Testing, Iterating
After several iterations and usability tests with users, I refined my wireframes and started working on high-fidelity screens.
Using InVision and Lookback, I was able to record my usability test sessions with my users. The recording captured sound, video, and their onscreen interaction.
My goals were to identify any existing usability issues in the prototype, ensure users can complete common everyday tasks quickly without errors, and specifically, validate that users know how to switch workgroups.
Play with the InVision prototype here.
With each iteration, I consulted my users, other designers, product owner, and mobile developers to ensure that the build would be feasible and the design was meeting my user's expectations and business needs.