VapeTime

vapetime setting stray A.K.A. the ashtray
vape time connect screen
vapetime dashboard
vapetime widgets
vape time distractions screen
vapetime setting stray A.K.A. the ashtray
vape time connect screen
vapetime dashboard
vapetime widgets
vape time distractions screen
vapetime setting stray A.K.A. the ashtray
vape time connect screen
vapetime dashboard
vapetime widgets
vape time distractions screen

VapeTime challenges users to stretch out the time between nicotine consumption, and utilizes native widgets for convenient nicotine tracking and distraction seeking. It includes a collection of minigames on the Distractions screen that can occupy the user's thumbs while experiencing a craving to smoke a cigarette or puff on their vape. A Connect screen gives users the ability to securely link up with a friend and provide accountability and encouragement for their quitting journey.

VapeTime challenges users to stretch out the time between nicotine consumption. The app also utilizes native widgets for convenient nicotine tracking and distraction seeking.

It includes a collection of minigames on the Distractions screen that can occupy the user's thumbs while experiencing a craving to smoke a cigarette or puff on their vape.

A Connect screen gives users the ability to securely link up with a friend and provide accountability and encouragement for their quitting journey.

Design System

Color Palette

Contrasting colors in the blue and orange families were selected to convey a sense of trust, reliability, calm, and a touch of playfulness. A cool gray was selected for a neutral background tone.

Buttons

The shape of the primary buttons is intended to convey non-conformity to convention where simple corner radii would be more standard. The top left bevel also provides a sharper angle, nodding to a modern high-tech experience. Secondary buttons being slightly smaller do benefit from a simple top-left radius that mirrors the bevel of the primary design but has a softer submissive quality.

The shape of the primary buttons is intended to convey non-conformity to convention. The top left bevel provides a sharper appearance, nodding to an edgier experience. Secondary buttons being slightly smaller do benefit from a simple top-left radius that mirrors the bevel of the primary design but has a softer, simpler quality.

(enlarged to show detail)

Primary Button

Top Left Bezel, 10x10px

Solid primary color

Light font color

Secondary Button

Top Left Radius, 6px

Light fill, Primary stroke 3px

Font color matches stroke

Typescale

Typeface was selected that has a softly futuristic feel to it to match the tech contemporary style of the buttons. Headers utilize sans serif Nobile Medium for slightly more weight. The simple lines and curves of Sen make for a pleasant reading experience that also mesh into the design with its clean simplicity. Ubuntu Sans Mono was chosen for improved readability of label text and also fits into the semi-futuristic goal of the overall design..

Typeface was selected that has a softly futuristic feel to it to match the contemporary style of the buttons. Headers utilize sans serif Nobile Medium for slightly more weight. The simple lines and curves of Sen make for a pleasant reading experience that also mesh into the modern design. Ubuntu Sans Mono was chosen for improved readability of label text and also fits into the semi-futuristic goal of the overall design..

H1: Nobile Medium, 32

H1: Nobile Medium, 32

H2: Nobile Medium, 28

H2: Nobile Medium, 28

H3: Nobile Medium, 24

H3: Nobile Medium, 24

H4: Nobile Medium, 20

H4: Nobile Medium, 20

Body: Sen, 20

Body: Sen, 20

Button1: Sen, 24

Button1: Sen, 24

Button2: Sen, 18

Button2: Sen, 18

Label: Ubuntu Sans Mono, 16

Label: Ubuntu Sans Mono, 16

Initial Research

Initial Research

Problem Statement: Nicotine and other chemicals found in cigarettes and vapes are incredibly addictive and contribute to adverse health conditions.

Competitive Analysis: I looked at five competing apps with the goal of quitting either cigarettes or vaping. No apps were found that covered both. Many calculated nicotine intake and money spent over time. One was just a simple chatbot that would remind users of the health risks of cigarette smoking. No competitors incorporated a timer to challenge users to defer nicotine gratification.

Survey: I began research with a survey of smokers and vapers who had either successfully quit the habit or attempted to quit at least once prior. Results revealed that most participants:

  • Were not discouraged by health warnings on the packaging or elsewhere,

  • Desired a way to connect with friends for support during their journey, and

  • Many users who successfully quit still occasionally smoke or vape (meaning that a level of forgiveness and a reminder of commitment would be key — "you only fail when you stop trying").

  • An unexpected discovery was that a majority of participants had strong concerns about data privacy, as nicotine use relates directly to personal medical data, which many participants didn't want to have their habit disclosed in any measure.

Goal Statement: Design a digital smoking cessation tool that is easily accessible, simple to use, and provides security of personal data.

Personas: Survey results were distilled into three end user personas who represented the major needs and pain points.

Personas

Personas

Headshot of Jason Alvarez, persona 1

Jason Alvarez

  • M, 45. Mechanic

  • 10 year smoker, turned to vapes for health reasons but wants to stop entirely.

  • Has strong beliefs about data privacy. Finds it difficult to avoid smoking or vaping around friends who all smoke.

Headshot of Jenni Cohen, persona 2

Jenni Cohen

  • F, 24. Nursing Student / Waitress

  • Vaped since she was 20 and for 4 solid years.

  • Vaping is a stress release and the perfect excuse to take a break from both her schoolwork and her job.

Headshot of Jessica Famenco, persona 3

Jessica Flamenco

  • F, 32. Expecting Mother

  • Cigarette smoker for 14 years.

  • Her wife is very supportive but doesn't vape or smoke and doesn't understand the struggle. Jessica feels it would be helpful to do this with friends of hers on the same journey.

Headshot of Jason Alvarez, persona 1

Jason Alvarez

  • M, 45. Mechanic

  • 10 year smoker, turned to vapes for health reasons but wants to stop entirely.

  • Has strong beliefs about data privacy. Finds it difficult to avoid smoking or vaping around friends who all smoke.

Headshot of Jenni Cohen, persona 2

Jenni Cohen

  • F, 24. Nursing Student / Waitress

  • Vaped since she was 20 and for 4 solid years.

  • Vaping is a stress release and the perfect excuse to take a break from both her schoolwork and her job.

Headshot of Jessica Famenco, persona 3

Jessica Flamenco

  • F, 32. Expecting Mother

  • Cigarette smoker for 14 years.

  • Her wife is very supportive but doesn't vape or smoke and doesn't understand the struggle. Jessica feels it would be helpful to do this with friends of hers on the same journey.

Headshot of Jason Alvarez, persona 1

Jason Alvarez

  • M, 45. Mechanic

  • 10 year smoker, turned to vapes for health reasons but wants to stop entirely.

  • Has strong beliefs about data privacy. Finds it difficult to avoid smoking or vaping around friends who all smoke.

Headshot of Jenni Cohen, persona 2

Jenni Cohen

  • F, 24. Nursing Student / Waitress

  • Vaped since she was 20 and for 4 solid years.

  • Vaping is a stress release and the perfect excuse to take a break from both her schoolwork and her job.

Headshot of Jessica Famenco, persona 3

Jessica Flamenco

  • F, 32. Expecting Mother

  • Cigarette smoker for 14 years.

  • Her wife is very supportive but doesn't vape or smoke and doesn't understand the struggle. Jessica feels it would be helpful to do this with friends of hers on the same journey.

Sketches & Wireframes

I started with a big picture storyboard, and then moved on to paper wireframes. Paper wireframes included five "how might we" sketches and a sixth final sketch of the favorite ideas. The paper wireframes were then built in Figma as digital wireframes.

Dashboard

"Ash" tray

Widgets

Connect screen

Distract screen

Sketches & Wireframes

I started with a big picture storyboard, and then moved on to paper wireframes. Paper wireframes included five "how might we" sketches and a sixth final sketch of the favorite ideas. The paper wireframes were then built in Figma as digital wireframes.

Dashboard

"Ash" tray

Widgets

Connect screen

Distract screen

Sketches & Wireframes

I started with a big picture storyboard, and then moved on to paper wireframes. Paper wireframes included five "how might we" sketches and a sixth final sketch of the favorite ideas. The paper wireframes were then built in Figma as digital wireframes.

Dashboard

"Ash" tray

Widgets

Connect screen

Distract screen

Wireframe Usability Testing

Wireframe Usability Testing

The wireframes were connected into a low fidelity prototype and tested via moderated study over Zoom. This study included 5 participants from a range of ages and backgrounds, who at some point in their life vaped, smoked cigarettes, or both.

Themes

1

Users completely overlooked the tap to connect NFC functionality because nobody recognized the NFC logo.

2

Testers broadly agreed that button labels were too small and elements were a bit too crowded.

3

Testers generally felt that the widget buttons should have their own user flow and not open the app, which felt unnecessary and would impede stickiness.

Insights

1

Create a custom animated logo for the tap to connect functionality.

2

Increase label font size and negative space for better clarity.

3

Disconnect the widget buttons so that the user flow of tracking a cigarette or vape use can be completed without opening the app.

Themes

1

Users completely overlooked the tap to connect NFC functionality because nobody recognized the NFC logo.

2

Testers broadly agreed that button labels were too small and elements were a bit too crowded.

3

Testers generally felt that the widget buttons should have their own user flow and not open the app, which felt unnecessary and would impede stickiness.

Insights

1

Create a custom animated logo for the tap to connect functionality.

2

Increase label font size and negative space for better clarity.

3

Disconnect the widget buttons so that the user flow of tracking a cigarette or vape use can be completed without opening the app.

Themes

1

Users completely overlooked the tap to connect NFC functionality because nobody recognized the NFC logo.

2

Testers broadly agreed that button labels were too small and elements were a bit too crowded.

3

Testers generally felt that the widget buttons should have their own user flow and not open the app, which felt unnecessary and would impede stickiness.

Insights

1

Create a custom animated logo for the tap to connect functionality.

2

Increase label font size and negative space for better clarity.

3

Disconnect the widget buttons so that the user flow of tracking a cigarette or vape use can be completed without opening the app.

Mockups

The overall color scheme, button shapes, icons, and typscale were developed to convey a sense of trust, reliability, encouragement, and fun..

Dashboard

"Ash" tray

Widgets

Connect screen

Distract screen

Mockups

The overall color scheme, button shapes, icons, and typscale were developed to convey a sense of trust, reliability, encouragement, and fun..

Dashboard

"Ash" tray

Widgets

Connect screen

Distract screen

Mockups

The overall color scheme, button shapes, icons, and typscale were developed to convey a sense of trust, reliability, encouragement, and fun..

Dashboard

"Ash" tray

Widgets

Connect screen

Distract screen

Prototype Usability Testing

Prototype Usability Testing

Once the mockup designs were drafted based on the wireframe insights and necessary additional interactive components were created, a second round of testing was done. This high fidelity prototype usability test was similar to the wireframe test in that it was moderated and conducted via Zoom. Again 5 new subjects with a history of nicotine use were given tasks and prompts.

Themes

1

Users were confused by terminology, specifically the word "Puff." All test participants were confused about what puff meant and implied in different contexts.

2

The tracking type and other setting labels were confusing to most users.

3

The tracking chart on the Dashboard was not easily understood by several testers. Generally there was just too much information all at once.

Insights

1

Ultimately "Puff" was too vague and was best not used altogether. It was changed into terms like "vape," "smoke," "per use," and "per pack/pod."

2

Add fullscreen overlays as an initial walkthrough of the different features and terminology. Keep text succinct to avoid attention fatigue. Adjust visual hierarchy in the settings tray ("Ashtray") for clearer understanding.

3

Simplify the charts to focus on necessary data. The decreased clutter improves the readability of the data.

Themes

1

Users were confused by terminology, specifically the word "Puff." All test participants were confused about what puff meant and implied in different contexts.

2

The tracking type and other setting labels were confusing to most users.

3

The tracking chart on the Dashboard was not easily understood by several testers. Generally there was just too much information all at once.

Insights

1

Ultimately "Puff" was too vague and was best not used altogether. It was changed into terms like "vape," "smoke," "per use," and "per pack/pod."

2

Add fullscreen overlays as an initial walkthrough of the different features and terminology. Keep text succinct to avoid attention fatigue. Adjust visual hierarchy in the settings tray ("Ashtray") for clearer understanding.

3

Simplify the charts to focus on necessary data. The decreased clutter improves the readability of the data.

Themes

1

Users were confused by terminology, specifically the word "Puff." All test participants were confused about what puff meant and implied in different contexts.

2

The tracking type and other setting labels were confusing to most users.

3

The tracking chart on the Dashboard was not easily understood by several testers. Generally there was just too much information all at once.

Insights

1

Ultimately "Puff" was too vague and was best not used altogether. It was changed into terms like "vape," "smoke," "per use," and "per pack/pod."

2

Add fullscreen overlays as an initial walkthrough of the different features and terminology. Keep text succinct to avoid attention fatigue. Adjust visual hierarchy in the settings tray ("Ashtray") for clearer understanding.

3

Simplify the charts to focus on necessary data. The decreased clutter improves the readability of the data.

Post Mortem

Post Mortem

I'm glad I went through two rounds of testing and didn't skimp on the initial research. As a non-smoker myself, I needed to keep an open mind about every aspect of this design to make sure it was actually helpful. Closely listening to user feedback led to a truly unique and human centered system that has a huge potential impact for the smallest required effort.

The concept of smoking cessation isn't new, but the competitive audit revealed a large opportunity for innovation and a new way of approaching the goal that wasn't really demonstrated elsewhere. Given the time and availability, I would love to flesh out the prototype further with some of the minigames and other "Distractions," though they're not strictly necessary for the purposes of this prototype.

Overall the VapeTime project demonstrates the value of research and testing at all stages. In the case of the NFC logo, it also serves as reminder that icons aren't universally recognized and need special consideration. Similarly, terminology and button labels are best when obvious rather than nuanced or open to interpretation.

Contact

Community engagement is a priority. Tell me about the projects you're working on. I would love to share my two cents.

Digital Product Design

Usability Research

UX/UI & Customer Experience (CX) Consulting

Voice Over

© 2025 Eric David Leach

Digital Product Design

Usability Research

UX/UI & Customer Experience (CX) Consulting

Voice Over

© 2025 Eric David Leach

Digital Product Design

Usability Research

UX/UI & Customer Experience (CX) Consulting

Voice Over

© 2025 Eric David Leach

Contact

Community engagement is a priority. Tell me about the projects you're working on. I would love to share my two cents.

Contact

Community engagement is a priority. Tell me about the projects you're working on. I would love to share my two cents.

Contact

Community engagement is a priority. Tell me about the projects you're working on. I would love to share my two cents.

Contact

Community engagement is a priority. Tell me about the projects you're working on. I would love to share my two cents.