UX/UI redesign of habit conditioning mobile app, KICKER

• Summary

  "Just another 10 minutes to go..."  Founded out of a desire to moderate smoke breaks, KICKER was initially developed to help regulate habits by wedging blocks of time between indulgences.
  
  Bolstering self control with timers and reminders, KICKER provides the structure and accountability users need to change their ways.
  
  Tested and designed in Figma during a four week, solo design sprint, this UX Case Study showcases how UX research informed the UI redesign of the beta KICKER app.
  

  "The chains of habit are too weak to be felt until they are too strong to be broken."
  -Charlie Munger

• Role & Responsibilities

  UX/UI DESIGNER

  proto persona
  user surveys + interviews
  user persona validation
  User Story development‍

  User Flows
  Information Architecture
  Content Strategy
  sketch + digital Wireframes

  branding + ui design
  Clickable Prototype
  user testing
  Summary of findings

• Problem STATEMENT

  Users need help forming and breaking habits.
  They need structure and accountability to assist with behavioral conditioning.
  They need real-time reminders that direct them to act or refrain, in order to build routines and achieve lasting change.

  

  How might we facilitate the REMINDER, ROUTINE, REWARD loop in an app?

• USERS & AUDIENCE

  CHEMICAL addicted
  BEHAVIORAL ADDICTed
  THE UNDISCIPLINED

  performance HACKERS
  self improvement TYPES
  TIME MANAGERS

  Men
  Women
  Ages 16-49

  Test the high-fidelity solution

  View Prototype
• GOALS & REQUIREMENTS
  • Framework for forming a habit (KICK START) + notifications to encourage action
    
  • Framework for breaking a habit (KICK) + no notifications to discourage action
  • Continuous time tracking for users who have assimilated their new habit (KICKED)
  • Habit set-up form to outline goal + reasons why + rewards + pace
    
  • Tracking + statistics (Success Streaks)

  Starting and stopping habits involve similar frameworks, but are not the same:
  "Stop drinking"  ≠  "Stay sober"

• DISCOVERY & RESEARCH

  A screener survey of user attitudes towards habit formation found:

  32 out of 33 respondents want to break an existing habit or form a new one.

  

  People believe change is possible, but HOW does one do it successfully?

  

  The type of habit influences the frequency, duration and necessity of participation.
  

  
  • BEHAVIOR IS DEPENDENT ON THE USER + HABIT
  • HOURLY: Smoking, social media, hydration, affirmations, movement, eating
  • DAILY: Caffeine or alcohol consumption, exercise, meditation, snacking, dining out
  • WEEKLY: Dining out, alcohol consumption, rest day, shopping, cheat day
  USE CASES + PAIN POINTS
  
• user personas
  Josh W.  |  KICKED SMOKING FOR GOOD

  

  • STATUS
  • 37 years old, male, in a hetero relationship
  • From Carlsbad, CA
  • Sober, reserved, hard working, structured, kind

  • BIO
    Josh is a Warehouse Manager at a popular brewery. He likes to grill, hike with his dog and girlfriend, and play in his adult softball league. Josh was a smoker for 13 years. He quit with the KICKER app in 60 days and has been smoke-free for 18 days.

  • GOALS
  • Make it to the one year mark smoke-free
  • Better lung capacity for physical activities
  • Save money for a down payment

  • FRUSTRATIONS
  • Stressful commute or situations at work
  • Smelling cigarette smoke/ seeing smoking

  "Now I'll be able to make a down payment on a  home with all the money I'm saving."

  Nikki d.  |  kick SOCIAL MEDIA

  

  • STATUS
  • 26 years old, female, single
  • From Eugene, OR
  • Witty, artsy, free spirited, friendly, activist

  • BIO
    Nikki is a barista and student of Thinkful's Software Engineering boot camp. She loves to read, practice latte art and bake vegan cookies.

  • GOALS
  • Graduate from her coding boot camp
  • Get hired as a front-end developer within 3 months
  • Be as productive as possible with a reasonable amount of coffee

  • FRUSTRATIONS
  • Unconsciously opening Instagram
  • App blockers that can easily be disabled

  "I really need to limit my time on social media.
  I would really rather create art on Canva, read or learn something new instead."

  MINDY O.  |  kick start PHYSICAL MOVEMENT

  

  • STATUS
  • 34 years old, female, mother of two, it's complicated
  • From Boston, MA
  • Hard working, clean, controlling, family-oriented

  • BIO
    ‍Mindy has a lot of responsibility as a HR Manager and single mother of two young boys. She loves that her family lives close by, even though they can be overbearing at times. Mindy often gets asked if she is an influencer and loves fashion and crafting.

  • GOALS
  • Walk 1-2 miles with the kids daily, Monday-Friday
  • Lose the baby weight and improve circulation

  • FRUSTRATIONS
  • Falling off the exercise wagon after a good streak
  • When her kids when they have too much energy
  • Organizing visitation with their father

  "I need a fitness routine so I can feel my best mentally and physically for the kids and I."

• Competitive Analysis
  • HABIT APPS BY NICHE
  • Productivity or habit forming apps  (Productive, Momentum Habit Tracker, Notion)
  • Smoking cessation apps (Quit Tracker, SmokeFree, QuitNow!, Flamy)
  • Sobriety tracking apps  (I am Sober, Nomo, SoberTool, Recovery Box)
  • App or website blockers (AppBlock, Offtime, Freedom, Moment)
  • Food journaling or nutritional tracking apps (Loose It!, MyFitnessPal, Noom, WW)
  

  VALUE PROPOSITION:  KICKER can be used to BREAK existing habits, not just form new habits.

  COMPETITOR ANALYSIS
  The main differentiation of KICKER is how it uses timers to regulate routines and that it can be used to break habits, not just form them.
  
  It's not enough to remind users to "X only Y times today." Users who are serious about making change need clear guidelines. The dichotomy of "Yes, you can (or should) X now" or "No, It's not time to X yet" sets KICKER apart from its competitors.

• user flowS

  Primary user flows include 1. Initial habit set up  
  2. Checking in on the status of the timer of a habit

  

  NEW HABIT SET UP FLOW
  Like many forms, the user flow for a new habit set up is a linear process, regardless of their goal for the habit.
  ‍
   A. KICK - The goal is to quit or moderate a habit
   B. KICK START - The goal is to begin or maintain a habit
   C. KICKED - The goal is to never do the habit again
  
  *KEY INSIGHT
  Initial iterations of the KICK (quit) flow, asked if users intended to quit or simply pace their usage.
  When only considering use cases like smoking cigarettes, we assumed users wanted to quit and the form was changed from "Do you want to wean off OR moderate?" to "What is your timeline for quitting?"
  Survey feedback revealed not everyone wants to quit a habit for good; many want to simply moderate their participation, like with sugar intake or social media usage. We changed the form back so users could opt for moderated usage or an exponential phase out of the habit.

  

  HABIT CHECK-IN FLOW
  Humans are complex and our motivation varies from day to day. Though there are preferred user actions and outcomes, we designed for all possible use cases.
  ‍
  KICK check-in (countdown):
   A. Time left on the clock - continue to wait
   B. Timer has reached 0 - perform the habit
  
  KICK START check-in (countdown):
   A. Time left on the clock - continue to wait OR do the habit early
   B. Timer has reached 0 - perform the habit, snooze the reminder OR skip it altogether
  
  KICKED check in (count up):
   A. Continuous counter - view timer (indicates passage of time since the change became permanent) OR restart

  
• Sketches & WIREFRAMES

  User interviews concluded that users preferred to work on 1-3 habits at a time. This is likely due to Miller's Law, where the average person can only keep 7 (+/-2) items of information in their working memory at a time. Below are initial sketches of the home screen.
  

  

  Being able to quickly perceive how much time is left on the clock was an accessibility requirement (Perceivable Information.)
  

  

  

  Timer status is communicated in 3 different ways to improve accessibility
   1. TEXT/ ANALOG representation
   2. DOUGHNUT CHART as a ratio of time elapsed over total time
   3. COLOR gradient fade from yellow to green as it wanes
  

• vISUAL DESIGN & ux COPY

  MOOD BOARD
  In color psychology, Green represents ambition, growth, renewal and safety.
  Gray represents neutrality, reliability, maturity and balance.
  Black represents power, strength, control and success.‍

  

  LOGO ITERATIONS
  Font color, weight and capitalizations are used to create visual hierarchy and similarity. Bolded and capitalized san serif font, Sansation is used to command power and authority. The gradient green communicates progress or change, which aligns with the apps goals.

  

  MOCKUPS
  Dark mode was selected for its privacy and legibility. Timers drive user actions so the need for visibility of remaining time was required for:
  Efficiency of use: goals are easy to accomplish quickly and with few or no user errors
  Intuitiveness: the interface is easy to learn and navigate
  Low perceived workload: the interface appears easy to use

  

  GOOGLE SURVEY for VISUAL DESIGN + UX COPY decisions
  In this survey we asked questions like "which look do you prefer?" or "which word makes the most sense to you?" to hone in the best UI and suitable language.
  ‍
  This feedback influenced design preferences for the final logo, content location, color gradation and terminology for commands to act, resist or permit. Survey data and UI research lead us from the wireframe on the left through the final design on the right.
  ‍
  See the full survey here
  

  “Resist, as in resisting temptation, makes the most sense to me.” -Survey participant

  

Test the hi-fidelity solution yourself

View Prototype