Fuzzies logo.

Designing a gratitude journal that works.

Music by A A Aalto via Free Music Archive

Design Challenge

How can we train ourselves to look for the positives in life?

Design Solution

The practice of gratitude journaling has been shown to have many positive benefits. It's as easy as writing down the things you are grateful for on a daily basis.

I wanted to design a system that encourages people to get into the habit of gratitude journaling, and to share their gratitudes with others, using the technology they have at hand.

Role
I did all the things: Concept, research, user interviews, personas, information architecture, job mapping, user testing, wireframes, mockups, prototypes (InVision, Xcode, node.js), animations (Principle), branding, and copywriting.
Timeline
4 weeks
Deliverable
High-fidelity prototype.

Solution Process

Backstory

Ever since working at a company where employee recognition was a common, everyday, and rewarding practice, I knew I wanted to bring that with me everywhere I went.

So initially for this project I had thought of building my own personal recognition solution... but that didn’t provide much of a design challenge for me, having lived in that world for many years.

Person surrounded by circles.

I realized it begins with thanking ourselves: Finding the small, everyday things that we can be happy about; from our tiny accomplishments, to a tasty cup of coffee. After we’ve started to appreciate the world around us and ourselves, we can then expand our gratitude to our family, friends, acquaintances... and idealistically everybody else we come across in our lives.

Thus, fuzzies was born.

Ethnographic Research

I began by conducting interviews about gratitude. Over the course of these interviews, a few key insights emerged:

People have trouble coming up with gratitudes.

Analysis

I started each interview putting people on the spot to come up with things they’re grateful for. It’s challenging! What helps is a prompt: some audio or visual cue to get the person to remember something.

My thought was, what information was already on the person's phone that could be used as prompts? I questioned people about how they used their phones, looking for what content (calendar entries, photos, songs played, conversations, stuff they read, etc.) we could use to trigger memories for journalling.

I take photos of things that speak to me.

For this iteration, I chose to focus on photos, to bring meaningful visuals into the app, as well as look at how to ask the user different questions.

For future versions:

  • people I talked to listen to music regularly, so it seemed like it would be a good option; and
  • most people use their calendar for things outside their routine, and mainly for work.

Developing the habit to journal is hard.

Analysis

This wasn't surprising, as keeping any new habit is hard. As I knew notifications would be part of the solution, I asked about those:

Reminders shouldn’t go off at inopportune times.

People who already practiced journaling did so at the beginning or end of the day. As a result, I chose to let the user set an ideal reminder time.

Gratitude can be perceived negatively.

Analysis

Some people connect gratefulness to religion.

This was something I hadn’t considered. In order to address the largest audience, I decided not to have monks or ties to religion as part of the app’s brand, in case this didn't connect with some of my potential users.

Public gratitude on social media is not perceived to be genuine.

Try searching Twitter for the words “grateful” or “thankful”; the results can feel like they're bragging, relating to religion, or condescending.

A curated feed that is proprietary to the app, or a managed social feed, might work better (if needed for marketing, or as prompts within the app itself).

Competitive Research

What are similar products doing and what can I learn from them?

I made use of direct competitors (My Gratitude Journal, Grateful, Uplifter, KYŌ, pen and paper) for a number of days. I also looked at diaries (Day One, Grid Diary), apps that cater to building habits (Productive), and apps that provide writing prompts (Werdsmith, Prompts).

Diaries

Being able to do journal more than one gratitude at once was helpful, as thoughts flow when thinking about what to write. Text formatting options are nice, but I didn't think necessary for my MVP.

Screenshot of formatting options in My Gratitude Journal.

Building Habits

I also saw a trend of gamification where progress is visually rewarded, but users are not guilted into adding entries regularly. As a variable reward, one app provided a quote after writing each gratitude.

Screenshot of progress gamification in Productive.

Writing Prompts

A couple apps allow you to customize a prompt question, which was useful. The ability to pull up photos within the editor was helpful; the weather, not so much.

Screenshot of ability to change prompt reminders in NYO.

Voice + Tone

The tone in gratitude apps is light-hearted, and encouraging. App notifications with varied messaging helps to keep these prompts fresh.

Screenshot of different My Gratitude Journal notifications.

What opportunities exist in the market?

No apps provided prompts using other information from the phone, such as recently-played music (possible via the iOS Media Player framework, for example), or recent calendar entries.

None of these apps think about life outside of the app: How can I easily record my gratitudes in other contexts (e.g., via conversational UIs)?

Sharing gratitudes wasn't something these apps focussed on, either, keeping journalling a private activity. While that may be appropriate for a diary, gratitudes definitely lend themselves to sharing, as evidenced by social media.

User Journey + Ideation

I found it helpful to look at the "job to be done" in the context of Tony Ulwick’s universal job map, having applied it successfully in previous projects.

Using this lens raised a number of "how might we" questions that opened the implementation up to numerous solutions. You’ll see those on the user journey map.

User Flows
Flow diagram showing user onboarding.

The user onboarding flow.

My approach to onboarding the user was to get users to enter three gratitudes, and reward them for doing so; on an ongoing basis, three is recommended and rewarded, but not enforced. App permission prompts are spread out, and presented in the context in which they will aid the user.

When mapped out, the onboarding flow looks rather long, but all my testing feedback indicated that it didn’t feel long.

Wireframes

As I created my wireframes, I really liked the concept of a chronological timeline, and centered my UI around that.

Each screen is really a snapshot of a moment in time in the conversation with the user. In hindsight, I think I would have done one continuous timeline to mock out the conversation to make sure it flowed, and then put them in screens.

Visual Design

Creating a brand that feels good.

Colors used in the fuzzies branding.

Colors chosen were warm, bright, happy, and organic. I received overwhelming positive feedback about using orange as my primary color; and green paired well as a secondary color.

With a minimal amount of time to work on a brand, I kept the logo simple, by starting with my main font (Avenir) and adding the "fuzzy" i element.

Variations of the fuzzies logo, and the final version.
Variations of the fuzzies app icon, and the final version.

The icon ultimately zeroed in on the fuzzy icon design, incorporating the rays in the background, and a high-contrast icon that worked well when placed on a screen with other app icons.

Iterations

The card design of the newsfeed evolved from something I didn't want to take a lot of vertical space (grouped by day), to one where each "fuzzy" became its own standalone object. I tested cards with and without photos, with the assumption that most users wouldn't add a photo.

KEY QUESTIONS

How might we make it a habit?

Animation showing the reward for adding a fuzzy.

I looked at Nir Eyal's hook model to build the habit of journaling.

After a notification (the external trigger) appears, the user is taken directly to the editor, with the keyboard displayed. Once the gratitude is entered, we display a random entry from another user (if they opted to share) as the variable reward.

How might we make it easy?

To make it easy to make a fuzzy, one path might be to allow the user to take action from the reminder directly.

I was inspired by chat apps that allow you to do this, but had to research if it was available to others.

Animation showing responding to a potential fuzzies notification, on iOS.

Prototyped in Xcode + Swift

How might we be in the flow of the user?

I wanted to see how we could be where the user is. During the day, that might be in a messaging tool such as Slack. To that end, I prototyped two commands, one for showing the latest entries and another for easily adding one:

Slack logo
Animation showing the potential fuzzies Slack command.

Prototyped in node.js + JavaScript.

HIGH-FIDELITY MOCKUPS

Thanks

Thanks for reading! And big thanks to my classmates and teachers at Bitmaker for their feedback and support during the build of this project!

If you have feedback about this case study, I'd love the input!

Fuzzies logo.

The feel-good app.

Try The Prototype
Fuzzies screenshot on an iPhone.

Chris Gurney


I'm a product designer and former product manager who has toured the tech industry with a background in computer science, across a broad range of roles.

About Me

Let's Get In Touch!


Connect with me using the power of the Internets.