Dollar Follower
How can we empower users to purchase goods that reflect their values?
The Project
The continued consolation of corporations makes it increasingly difficult for socially conscious consumers to know who they are supporting with their purchases. To bridge this knowledge gap I designed Dollar Follower, a mobile application that connects socially conscious consumers to information about the companies behind a product and the policies they support.
My Role
UX Research, UX Design
The Users
Our users consisted of socially conscious consumers who I divided into two user segments. The first is made up of Millennials interested in social justice topics, with previous experience using common digital platforms. The second are Middle-aged individuals with liberal ideals and the income to make elastic purchasing decisions.
Personas
Age: 23
Occupation: Grad Student
Income: $22,000
Bio: Progressive issues are important to Brendan. He has a busy schedule going to school and working as a teaching assistant. He is also involved in several clubs that promote issues he is passionate about. Brendan always goes grocery shopping on student discount day to get the best bang for his buck.
Brendan McLean
Age: 41
Occupation: Architect
Income: $102,000
Bio: Amy and her husband want to raise their two children in an inclusive and accepting environment. Her family’s health is very important so she purchases organic and environmentally friendly products. On most nights she picks up a few things at the store to fit groceries into her busy schedule.
Amy Thompson
As-Is Scenario
After defining our users I chose to relate to them through an as-is scenario describing how they would choose between two similar products based on each producer’s values.
User Goals
I created 2 user goals to summarize what our users wanted to get out of the experience I was designing for:
-
Feel like their purchases support companies alighted with their best interests.
-
Access relevant information about corporations in a way that does not disrupt their shopping experience.
Metaphor
To create a familiar experience I based part of the design on the user experience of a price scanner to create a metaphor for capturing invisible information from a product and communicating it to a user.
Sketches
I started designing the interface by sketching out screens and how the user would interact with them.
Low Fidelity Wireframes
Developing the sketches further I created low fidelity wireframes.
 |  |
|---|---|
 |  |
 |  |
 |
UI Patterns
While designing the low fidelity wireframes I incorporated several common user interface patterns to create a smooth experience that accomplished the user goals.
A. Overview Plus Detail
Users see an “overview” menu of options along the bottom and “detail”, or content above the menu, simultaneously to keep them oriented and allow easy navigation between pages.
Let’s users compare products by each category.
C. Sortable Table
B. Extras On Demand
Allows the user to open and close a slide menu showing each page of the app that can be used for navigation.
A linear navigation between each screen by swiping left or right is easy to understand and facilitates one-handed use.
D. One Window Drilldown
To-Be Scenario
Before progressing any further, I ran through the as-is scenario in the context of using Dollar Follower to assess if my rough design had relieved our users’ pain points.
Visual Identity
To define the visual identity for Dollar Follower I chose a color palette and designed a logo for the app.
Color Palette
A pallet of greens was chosen for their connection to ethical consumption and association with currency.
Logo
The logo combines a “D” and “F” creating a fluid path starting at Two points and ending at one, much like the experience of comparing products with the app.
The Result
The context-aware, user-focused process behind Dollar Follower produced a design that empowers consumers to easily purchase products that align with their values.
