Baby Mind

In Summer 2020, mobile app developer ICMobile lab asked me to redesign the Baby Mind app for his client at the University of York.

The product is a tool that the researchers at the university use to study how new mothers build relationships with their child during the first six months.

The lead researcher developed a technique called mind-mindedness to help new mothers connect with their child. The technique is primarily an applied mix of empathy and mindfulness.

Baby Mind app had to be designed to prompt mind-mindedness, to encourage mothers to empathise with how their baby is feeling at any one moment, rather than simply reacting to whatever the baby is doing.

The brief was, to redesign the app with a simple and pleasant user interface that prompted mothers to record how their baby was feeling at any given moment.

The new UX/UI would need to include all the existing features from the previous app.

This included sign-up, user and baby details, a pre-selected array of emotions, photo capture, comments and alerts and a link to further research information.

Given the core purpose was to prompt mind-mindedness, I felt it was important to prompt users with the question "How's *baby* doing?" front and centre in a main feed in the app.

This meant each time the app was opened, the path of least resistance was to follow a prompt to think about how the baby is feeling and - once tapped - offer an array of emotions.

And while some of these emotions are closely related to "doing" actions - such as being sick, crying or sleeping - the copy would always be leading the user to think about how the baby was feeling - sick, sad or tired.

This contrasted with to the previous app where the user could add a comment or a photo before adding an emotion. I felt comments and photos were likely to prompt users to think about what their baby was thinking or doing, respectively.

So by restricting the ability to add a comment or photo until the user had chosen an emotion, we were pushing them towards mind-mindedness.

I wanted the layout of the app to have a strong centre that would focus the user's attention. This would become the central "feed" that displayed the baby's emotions at its core. It is from here the user were prompted to add new posts.

Off to the left side was an "alerts" section, which would send automated prompts based on the baby's recent feelings and posts.

I tested putting the alerts in the main feed, but this made the app feel like it was a conversation between the mother and an AI chat bot - rather than an intimate log between a mother and her baby.

The information section would be off the the right side of the central feed. This was where users could go to find links to longer-form content about a baby's development. This part of the app was to remain adaptable for some future features.

When designing the new experience I felt there was an opportunity to add character to the app with use of some Lottie animations.

I worked with an animator to create 15 animations for each of the pre-set emotions that would play as the user scrolled the feed.

The purpose of these was to help draw the user's attention to her baby's feelings, especially on posts which might have engaging photographs or videos.

One ritual new parents sometimes go through is picking a colour to paint the nursery.

When shaping the new registration flow, I thought it would be nice to mimic this by enabling the possibility to choose a custom theme for the app.

As with all UI projects, it helps to leave the team with an adaptable design system that can be used as the basis for any future updates without complicating user experience, or wasting development time.

For BabyMind I used a colour palette with 6 colours. Black white and 4 shades of the chosen colour theme.

The spacing system was an 8pt design system.