Little Blue Dot
Little Blue Dot
Little Blue Dot
Little Blue Dot is an app that allows people to earn points from converting air miles and doing everyday eco-friendly behaviours. These points are used as currency to offset the carbon produced from flying.
​
Deliverables
Mobile App
Problem Statement
The Product
Little Blue Dot would encourage eco-friendliness through gamification. Users earned Life Points by doing eco-friendly behaviours such as using a reusable mug to get coffee, or by converting some of their air miles into Life Points. Life Points could then be used to buy carbon offsets to effectively cancel out users' carbon emissions from flying.
​
Requirements
I was tasked to design a fun, attractive and simple app that could get people into the habit of earning life points. There were 3 entities involved - Airlines, Eco-focused NGOs and the company itself. The app had 3 main features:
Convert
Conveniently convert air miles to Life Points on the app.
Offset
Use Life Points to buy carbon offsets from NGOs via the app.
Gamify
Make being eco-friendly fun! Reframe it from a chore to a rewarding challenge to encourage sustained use.
Exploring
Gathering Information
To understand the context and user needs of the product, I carried out the following:​
-
Competitive analysis of 5 companies' UI, usability and product features to understand business needs.
-
Secondary research of airlines, carbon offsetting companies and eco-conscious blogs.
Creating Understanding
The results of all the research was organised into an affinity map. To create shared understand about the user, I created a persona and storyboards from this information, then shared it with my stakeholders.
Research Outcomes
After knowing what and for who I'd be designing for, I sat down and started generating ideas for the app's UI. Then, I created a user flow which explained how users would navigate the app. Finally, it was time to create prototypes and test them out with users.
Creating Understanding Among Stakeholders
Competitive Analysis, Persona, Storyboards, User Flow
Iterating
User Interface Styles
To see what visual style would look best, I compared several versions of the UI elements. This included:
-
Moodboards
-
Typography
-
Colour palettes
​
Prototyping and Usability Testing
To visualise and test the usability of the web app, I created these prototypes:
-
Sketches to quickly visualise and modify designs.
-
Wireframes for the initial usability test.
-
High-fidelity prototypes for final test. I used Adobe XD.​
I conducted usability tests with 2 users. Further below I write more detailed findings.
User Interface Styles
Moodboard, Typography, Colour Palettes
Low- to Mid-Fidelity Prototypes
Sketches, Wireframes
Research Outcomes: Series of Changes to Designs
Final Design
Conclusion
Key Takeaways
While there is certainly some way to go, it has been a great experience working with this client. I learnt about how important user feedback is, as well as gaining practical experience playing around with colour palettes.
​
In Hindsight...
In hindsight, I would have incorporated more accessibility standards into more user interface design. Also, I would have done more user interviews and usability tests to get a wider source of feedback.
​
Future Plans
Little Blue Dot is currently in discussion with a major airline about implementation.
