Sketching, diverging, ditching ideas
Part 2 in a series on how I’m designing a Companion App for Sports Interactive’s Football Manager
Other parts on this series:
OK, so, my main goal here is to quickly define the user flow and interactions, the app’s structure, and do some user testing before doing high-fidelity work. After reading Ces Cortez’s Personal Design Sprints (which, by the way, are great articles that you should totally read!) I decided to give Google Venture’s Design Sprint a try. Truth is, I can’t really work on this project for five straight days, so I adapted some of their ideas and used what fits my needs the most.
I started by defining the most important user story of the app, which is to find and view a specific player’s profile. This is the core feature for this product, specially because I want to highlight the quality of Sports Interactive’s content. But I will be designing the entire app, or at least a Minimum Viable version of it, and that means I need to map out the other user stories, if not all. So I came up with this:
I felt the need to group the stories into epics, and ended up adding other user stories to have a clear idea of the extension of the app. This doesn’t mean all of them will be in the final product, though, because I decided to really just do an MVP that works and can show the app’s full potential.
I want to find a player
- I want to search a player by their name;
- I want to browse the continents, countries, leagues and clubs until I find the player I’m looking for;
- I want to filter my search results;
- I want to search for players by attributes.
I want to view a player
- I want to view a player’s complete profile
I want to view a club
- I want to view a club’s complete profile
I want to compare players
- I want to select two or more players and compare their attributes
I want to create shortlists
- I want to create shortlists for my favourite players
- I want to add as many players as I like to my shortlists
- I want to edit my shortlists information and players
This is the most current version of this list, after cutting stories that can be worked on later, and focusing on the most important ones:
- I want to search a player by their name;
- I want to browse the continents, countries, leagues and clubs until I find the player I’m looking for;
- I want to view a player’s complete profile
- I want to view a club’s complete profile
- I want to create shortlists for my favourite players
- I want to add as many players as I like to my shortlists
- I want to edit my shortlists information and players
In the image above you can see I also did a mind map, and one of the things I wrote down is “information in cards”. I ended up coming across a great article from Intercom later on, called “Why Cards are the future of the web”, that gave me some great examples on how to do this when dealing with a large amount of information. Anyway, just a shout out, go bookmark that!
Crazy-8s
They’re crazy fun and crazy useful.
The next step on my adapted Design Sprint was playing with Crazy-8s. This means sketching 8 rough ideas in 5 minutes (around 40 seconds per sketch). This exercise is meant to really churn out ideas as fast as possible. This is what I came up with after two rounds:
This is when I stopped to think and decide what I was really doing. I don’t have the time to develop two different versions of the same app, one for iOS and one for Android. Doing the Crazy-8s made me see this conflict when sketching the last three panels, when I decided to give tabs (with a swiping navigation) a try. Apple’s and Android’s design guidelines are different from each other, and I’m still not sure if I want the app to have a native feel in both OSs, or if I want the app to stand alone. I guess I’ll have to figure this out in the next steps.
Storyboards
Right after the Crazy 8s, I took some of the best ideas (or most interesting, or ideas I was in doubt about) and sketched small, 3-panel storyboards detailing the user’s interactions within the app. I chose to sketch the collapse / expand navigation in the Club Browser, and the swiping navigation in tabs, which you can see already moves towards Android design patterns. I also sketched the club information screen and a more detailed visualization on how the search would behave. I’m starting to get a better understanding of what I expect this app to be.
Next Step
My next step will be to decide things, and resolve conflicts. This means zeroing-in on the navigation style, figuring out the iOS vs. Android dilemma, and creating a detailed user story diagram, step by step. Stay tuned, and thanks for reading!
Disclaimer: I’m in no way affiliated to Sports Interactive. This is a personal project and a design concept. Football Manager is very dear to my heart and I love data visualization design, so why not study both at the same time?
