Business
Operations software (clocking in & out, completing tasks/checklists, scheduling, inventory) for the restaurant and retail space, available on smartphones and tablets.
Problem to solve
Users were failing to complete tasks in multiple areas of the product that relied on the current top navigation bar. (checklists weren’t being submitted, availability requests were being left midstream, general feedback of confusing navigation)
User Journey & Research
The first piece of this task was to fully understand the users journey throughout the app as a whole, and the actions performed under each section. To do this effectively I listed out ALL the different possibilities and then organized them based off of common design patterns.
After categorically organizing the pieces based off of my research and product knowledge I brought in subject matter experts from within the company to gather their insights and concerns on the problem as well as the direction we were headed with the proposed solution. This is always my favorite part, seeing how others maybe have differing ideas and collaborating.
Brainstorming
With product requirements in mind and a clearer view of the challenges, I then brainstormed multiple variations on a single app bar to rule over the common patterns.
The first iteration was a double stacked app bar for hierarchy and clarity. After feedback it was determined that a single row of actions to allow for maximum space to view content was ideal. This worked out much better considering the complex nature of the app and it ability to function on different types of devices including the Kindle Fire 7.
Prototyping & Testing
With an idea of what it should look like and where the different components of the app bar belong, I created a prototype based off of different testing scenarios. I tested one task for each product, picking a different piece of the app bar per product to ensure coverage. Each task was timed and rated on on the Company’s usability scale.
Results & Conclusion
Six of the seven tasks passed the usability scale as well as average time. The task that failed was an icon that tried to convey a too complex concept, that was changed to be a blue call to action button instead and tested again. After that change it passed with no problems, and the high fidelity version was created.