Daily Focus BFL Evolution
Daily Focus BFL is a prototype design for a mobile app created as part of an online Coursera / UCSD Interaction Design course. It evolved throughout the ten week capstone course passing through all phases of UX and UI design:
- Needfinding
- Opportunity identification
- Solution brainstorming
- Storyboarding
- Paper prototypes
- Video user testing
- Heuristic evaluation
- UI design
- Invision prototyping. See https://invis.io/ZCEX7EJ6X
- In person user testing
- A/B online testing through UserTesting.com
- Explanation video. See https://youtu.be/eGkCJxQUyms
- Design process summary
- Promotion on social media
Design Brief
The design brief was abstract:
Identify opportunities for a mobile app that could provide value to users at a “glance”, perhaps a quick summary of key information, or something motivational.
Needfinding
User interviews with four participants revealed a variety of opportunities. Some common themes emerged. Users wanted to
- Keep on track of important tasks and goals
- Be alerted to key communications and events
- Be inspired
- Keep things simple
Storyboarding
Storyboards created visions of apps to match identified opportunities
Paper Prototypes
Paper prototypes were created and tested with users. Videos were taken and heuristic evaluations were performed.
Roads Not Taken
Two of the concepts that were tried but abandoned include 1) a panel style layout of squares, and 2) placement of the Settings button on the right margin to free up space at the bottom for larger quotes. The panel layout was rejected after one user expressed the feeling that the original row layout was “…cleaner, easier to use, the squares take up too much space. In the second one the image is kind of useless…”. In the A/B testing with the Settings button on the right margin it was felt to be inferior by 3 of the 4 testers. One tester commented, “If I had to do Version B first, I would have struggled to find the Settings button.”
Brainstorming
In the end, a concept emerged of a mashup app which combined a few key “glanceable” functions:
- A focused to-do list
- Notifications for communications from the same person across channels such as phone, email, and texting
- Inspiring images and quotes
The app would not replace existing reminder lists, but rather integrate with them to extract only those items to be worked on that day.
- Integrate with other reminder lists such as Evernote and Google Keep
A concept of Hot Messages was also incorporated. Hot Messages are defined as recent, repeated contacts from the same user. An algorithm can be envisioned which prioritizes such communications and sends notifications for only the “hottest” ones.
- Integrate with phone, email, and text messaging
Given that the app was envisioned to be used throughout the day, simplicity was a major design goal.
- Focus on simplicity and ease of use.
UI Prototype Evolution
Based on the user testing and heuristic evaluations, a UI prototype was evolved in Keynote. Many changes were made over time such as
- Terminology improvements, e.g. from “Hot Comms” to “Hot Messages”
- Orange color and revised layout for Hot Messages
- Deletion buttons
- Better terminology and navigational flow of Settings screens
- Clarifying text hints
A/B Testing
High-fidelity prototypes were created and A/B tested using Invision and UserTesting.com.
Publicity
A short promotional video which highlighted the design features was made, and a Medium blog post was written to reflect upon the design evolution of Daily Focus BFL.
Take home
I had an awesome time with the UCSD Interaction Design course. Applying all parts of the UX design process to a single product was a holistic learning experience. It was also very gratifying to learn that some of the evaluators on UserTesting.com found the product to be something they would really like to use. One said
“Love the app, I think it is a great concept. Don’t mind that it is not pretty. Nice and simplistic.”
If you’d like to try out the prototype, you can access it here: https://invis.io/ZCEX7EJ6X
