Lorenzo Serravalle

An app that helps smokers quit

by tracking their habit and socializing their struggle

Executive summary:

I designed end-to-end a mobile app as a capstone project. Interviewing users about their smoking habits and quitting attempts resulted in a major insight that was later designed into a lapse tracking feature, not found in competitors' products. The overall designed was fine tuned through reviews and usability testings, and finally adjusted to meet accessibility guidelines.

Discovered one major gap in the smoking cessation user flow.

Delivered a functional concept design for a mobile app.

A look into the research process

Designing an app from scratch requires a research plan, I organized it in a classical two-step approach. The generative step was conducted early to pinpoint users' goals, needs, and frustrations. It included a literature review and user interviews. The evaluative step was performed at later stages to test and validate design choices. It involved usability tests and an accessibility audit.

Design development

issues?

no issues?

issues?

Generative

Lit review

User interviews

Usability testing

Accessibility audit

Evaluative

The results tell a story

Most smokers reside in low- or middle-income countries, and more men then women

smoke. In NA, smoking is most prevalent among Indigenous, African American, and non-Hispanic White peoples. The average age for starting is between 14 and 20 and for quitting quitting at 40. I used this to identify a target group and aimed for 6 participants,

possibly adding another 6 if needed (Guest, Bunce & Johnson, 2006). Lacking funding, I only managed to schedule 2 interviews.

I transcribed data into empathy maps, allowing me to identify insights commonly found in literature: smoke as stress relief, smoke at social events, smoke as isolating or stigmatizing, etc. But interviews also revealed that opinions varied on the best way to quit, with some preferring a more gradual approach that is tolerant of lapses.

Defining the problem and ideating solutions

I used the 5Ws & H method to define problem and hypothesis statements.

Problem statement example:

Marcus is a father of two who needs to quit cold turkey because smoking alienates him from his family.

Hypothesis statement example:

If Marcus uses the app, then he can quit smoking and show his progress to his family to stop feeling isolated.

These allowed me to craft value propositions, which I evaluated with an analysis of competitors' products. Doing this earlier could have skewed my ideation with conformism. I downloaded the top results for "quit smoking" in the Google App Store.

The competitors' analysis revealed that there were user needs not currently met by products on the market. The most important was the need to track lapses during the smoking cessation journey. I also used this data to organize and prioritize the value propositions.

Must-haves

time tracking

visualizes progress

lapse tracking

enables gradual quitting

shareable achievements

socializes progress

reset timer

enables full quitting

community chat

fosters smoke-free sociality

Nice-to-haves

notification system

track critical times (e.g. work breaks)

research page

keep users informed

tips page

provide quitting tips

cigarettes, time, & money counters

track statistics

The design process

I sketched out the must-haves value propositions on paper wireframes, taking notes of the concepts I liked most, which I then combined into a digital version.

I like to evaluate wireframes to find potential issues early. For example, here are two user flows: one to reset the timer tracker and another to add a lapse to it. A brief moderated testing revealed that these flows were too similar, and users frequently had to double check what flow they were following. This was a violation of the recognition vs. recall heuristic guideline, forcing a heavier cognitive load on users. I modified the lapse flow and made it an overlay.

I finally designed mock-ups and made them interactive to test content and usability.

Evaluating the design

I scheduled two video calls with participants and I shared the prototype. First, I invited them to explore the app at their own pace. Then, I instructed them to complete two tasks: modify their profile and add a lapse to the time counter. I obtained several insights:

• Users disliked the aesthetic and visual elements/components looked 'old.'

• Users skipped the 'lapse information' page because it was too verbose and cluttered.

• Users found the icon in the 'add lapse' button confusing because a plus was associated with adding time.

I used these insights to redesign the prototype with a more polished look, along with adjusted flows.

A quick, informal review session revealed that the new design's aesthetic was viewed more favourably. I evaluated the prototype against common WCAG (2.2) and made small adjustments, such as colour contrast. The design was finished.

Takeaways and what I would have done differently

I enjoyed the iterative approach of the design process I learned at Google. It allowed me to stay on track of users' needs and preferences.

My first mockup was a very bad reading of a skeuomorphic design. Commonly associated with iOS app icons of a decade ago, it's not surprising that it felt 'old' or 'vintage.' My app was limited in scope and functionality, and did not warrant such a look, but instead needed a more sleek and flat design. I now always consider a product's scope and functionality (its 'soul') to better understand what it should look like.

The case study was also too conceptual. I did not implement all the must-have functionalities, such as a way to share achievements. I could have also benefitted from spending more time on designing icons and developing a sticker sheet to create a more original product.

Lastly, I should have checked for adherence to WCAG way earlier and with more frequency. This would have prevented potential design-breaking issues later on.