Our Approach: We started by understanding the variety of different users and their needs as well as how the current NSF for Sport application was being used (or not). The app is used by a range of people - everyone from elite Olympic-level athletes that have to take drug tests for their sport to gym buffs picking out a new protein powder to a coach working with high-schoolers. There were a myriad of use cases that the new app could address as well as heuristic problems with the existing UI. These use cases led us to create a few different conceptual models of how the thousands of products in the database could potentially be navigated through.

    We talked through each of the conceptual models with the client and ultimately decided on a single direction that would be optimal for the use cases we identified. We then spent a day at the client's headquarters and worked directly with their team to flesh out how the model could actually work and tested it. So much came out of the workshop that we were able to dive head first into app design afterwards.

    The flow of information was so complex that we actually wanted to first map out the architecture and ensure that was 'right' before even thinking about individual pieces of the UI. It's not pretty - but it helped us think through the complexity!

    We then moved into wireframes - being sure to call out technical questions along the way in order to iron out any kinks before getting into the final spec doc. We used the iterations to generate a prototype that we tested on real users.

    The clarity and iteration from the user testing allowed us to quickly move into the final spec doc - a buttoned up document with complete annotations and visual direction that developers would be able to take it and run with. A few months later we were excited to see NSF for Sport available in the app store!