BabyNaps - two live apps, and engagement that would not hold

Client
Children's sleep tracking product company, Stockholm, Sweden
Period
2022-2023
Scope
Redesign of a live web app and a mobile sleep tracker
Role
Lead Product Designer (UX/UI) - NozomiHealth
Release
Released on the App Store

The BabyNaps app helps parents monitor their children’s sleep progress and adjust daytime naps to reach their child’s recommended amount of sleep.

Two illustrated onboarding screens about planning the day and sleeping better

The partners already had both a web app and a mobile sleep app. What they asked for was not another product - it was for people to keep opening the ones that already existed.

Situation

Two apps in use, and engagement that would not hold

A web app and a mobile sleep tracker were both live, and both were being opened less than the partners wanted. The brief was to redesign them for engagement, so the work started with an analytics pass over the audience: the redesign followed what the data said, not what the room assumed.

Children’s sleep tracking across web and mobile, released on the App Store. The job of the product is narrow and unforgiving - help a parent adjust daytime naps so a child reaches the sleep they actually need.

Nap logging dial with sleep categories beside a night wake-up timer

Objectives

Five things the partners asked for

  1. 01

    Identify the primary user pains

  2. 02

    Raise engagement across both the web and the mobile app

  3. 03

    Improve the onboarding process

  4. 04

    Build a navigation process that stays simple

  5. 05

    Build the new modules - frames and prototypes - against the technical requirements

Tablet view of the website hero and a grid of parenting articles

Method

How it was done

  1. 01

    Found the pains before redrawing anything

    An analytics pass over the target audience first, then user tests built for this product - the flow and the pain points were located, not assumed.

  2. 02

    Rebuilt the UX

    User flows and user paths, carried into an interactive prototype and tested as one, rather than screen by screen.

  3. 03

    Rebuilt the UI

    Grid, the three-colour rule, the three-click rule, honest clickable areas. A parent reads this app one-handed, in the dark, next to a sleeping child.

  4. 04

    Built onboarding as its own module

    Not a screen bolted to the front of the app but a module with its own interactions, added to the product as a new part of it.

  5. 05

    Rebuilt navigation and illustration

    Navigation restructured against known patterns of the audience, and the illustration set redrawn - in a product about a child’s sleep it carries tone, not decoration.

  6. 06

    Tested locally and iterated

    The prototype went through usability testing before and after the redesign, and the findings went back into the design.

Child profile with monthly sleep averages and a nap calendar
Night-sky landing page promoting white noise playlists with listener statistics

Results

What the tests said

The strongest test numbers of this portfolio. Success here was measured as engagement and brand recognition, through usability testing before and after the redesign - a different metric set from enterprise finance, and worth naming as such rather than hiding.

(Brand-colour recall, after redesign)

95%

(Users with no navigation problems)

92%

(Objectives)

05

(Platforms rebuilt)

02

The full deckEvery screen and flow from the project presentation, in the order it was built (16 images)Click to open section
Cover slide with a phone showing the next nap on a circular dialEarlier Swedish-language screen with a donut chart of the day's napsTypeface specimen showing five weights from bold to lightGreyscale wireframes of the nap dial, live timer and sleep entry formPalette slide with four brand swatches in violet, coral, white and blackIllustration set of a sleeping family, birthday cake, toddler and sleep maskFlow from baby and parent sign-up through payment to the app sectionsThree illustrated onboarding slides about sleep, scheduling and sleep statisticsFour user feedback quotes with round portrait avatarsSleep schedule setup with child details, nap length, photo, loading and sign-upHome screen nap dial shown in bedtime prompt and night sleeping statesLive nap stopwatch with progress bar, plus a smartwatch quick action screenCircular time picker for logging a nap with place and type chipsChild profile, sleep phase article and daily calendar with nap logLaptop article hub and a web sleep schedule quiz with phone versionTablet on a pink plinth showing the night-sky white noise page