NightLight
In this project case study, I will be sharing my experience designing a mobile app for a local fitness centre. The goal was to create an app that made it easy for gym-goers to view class schedules, book sessions, and track their progress.
Throughout the design process, I focused on creating an intuitive user interface that would enhance the overall user experience and encourage engagement with the app.
Project type
Group project (2x UX designers, 2x software engineers)
My role
UX research
UX/UI design
Prototyping
Duration
24 hrs
Tools
Figma
FigJam
Problem
Getting home at night for women is stressful
‘’According to an extensive survey of 18-25 year olds commissioned by ITV News, 81% of young women say they feel unsafe walking home in the dark.’’
- Haughton, C. (2024). Violence against women a 'national emergency' as 81% say they feel unsafe walking in dark. iTV News.
It all began one evening in London when I was navigating home from dinner in an unfamiliar neighborhood, relying on Google Maps.
The route suggested led me through streets where I felt uneasy, forcing me to find a safer detour on my own. This frustrating experience, repeated several times, left me questioning - why isn’t there a tool to make getting home easier and safer, even in a city I’ve lived in for years?
Solution/Outcome
A commuting app with integrated safety features
Design Process
Discover
Define
Develop
Deliver
Secondary Research
Safety concerns on women's mobility and freedom in the city
My goal was to understand how young women in London travel home, what factors contribute to their sense of safety, which conditions they consider essential for safe journeys, and how safety concerns impact their mobility and freedom.
So as a first step, I looked into some statistics:
The number of women feeling at risk when traveling home is rising each year. According to YouGov’s survey two thirds of women who ever walk alone outdoors at night say they “always” or “often” feel unsafe when doing so.
Primary Research
Listening to women's stories
Looking at the numbers, it was clear that getting home or commuting at night for many women brings a lot of stress and requires a lot of preparation and planning.
I spoke to 5 young working/studying females living in London to understand the process young women living in London need to undertake to travel home, to investigate the factors that contribute to a sense of safety among women in London, and to define the specific measures and conditions that women perceive as essential for feeling safe on their journeys home.
Interviewer 1
Female, student, 18
’’I usually take the recommended route with Googe Maps but when I see that it's really dark and it might be not safe I usually walk around to the main area again. So the route might be longer but safer.’’
Interviewer 2
Female, professional, 23
‘'To feel safer I am always trying to walk fast. Trying to call somebody like my friends or, I don't know, my mum. Just to feel safe. ''
Interviewer 3
Female, student, 22
’’I think feeling safe is a really important factor in your daily life.''
Interviewer 4
Female, professional, 22
’’So I do find it [feeling unsafe] quite frustrating. I feel like it's kind of a burden.’’
Interviewer 5
Female, student, 24
''But there's not really a feature that tells me, this is the best route home. I feel like that's for me to kind of figure out or know, already know.’’
It's worth mentioning that at that stage my assumption was that women don’t have access to enhanced, self-guided safety tools that offer more detailed information and resources to address their safety concerns, help them feel empowered and improve their journey home.
I was struck by how accurate my assumptions turned out to be during the interviews, and how many women expressed shared frustrations about commuting home at night, frequently taking extra precautions to minimize risks and feeling burdened by the lack of reliable safety measures.
Safety tactics & danger prevention
All 5 interviewees mentioned the extra steps they take on daily basis to minimize opportunity for danger as feeling unsafe
Lack of means & choices
All interviewees reported the unreliability of existing tools and digital products, citing inaccurate information and a lack of safety guarantees.
Safety assurance
All interviewees expressed a desire for enhanced safety measures and sought improvements in digital tools that would increase their sense of security.
Fears & discomfort
All interviewees reported experiencing feelings of insecurity and discomfort, and frequently imagining worst-case scenarios.
Key Insight
Women would like to be confident and independent when getting back home
What I have learnt from the interviews was that young women in London strive for confidence and independence when commuting home. They wish to minimize fears, discomfort, and safety concerns while traveling, without feeling constrained or restricted for the sake of security.
However, the existing tools and solutions fail to ensure their safety adequately. This was when I realised there is a need and an opportunity for an intervention.
Persona
Creating the Identified User - Astrid
After defining my problem statement and HMW question, I synthesized my findings to create a persona that represents the core insights of my target users and guiding me throught my design decisions.
Experience Mapping
How is Astrid currently gets home?
Once I had my Persona defined, I analysed the current process of getting home in London and the potential frustrations that may come up - this was all from the perspective of Astrid, a 25 year old professional who needs to go home after having drinks with her colleagues post-work submission.
''It's been a productive day and a lovely work social, time to go home and get rest''
Astrid needs to travel home after working late at the office and having a few drinks at a pub with her colleagues after an important work submission
''Wow, it's pretty late! There aren't many buses going to my place so I will have to walk from the stop a bit as per Google Maps. Is that a safe route though?''
Astrid looks for best routes to go home from the bar but it not sure which one is the most suitable
''Gosh, I need to decide as I don't have much time left. I have to just trust the app and figure it out later.''
Astrid decides to go with the Google Map's suggestion as it's getting late and she wants to get home before there are no buses at all
''Not again, Google Maps wanted me to go through some weird alley. I guess I need to order Uber now. So annoying as I should not be too far from home.''
While walking from the stop Astrid notices the route is through a dark alley so decides to order Uber home
Sketching
Putting ideas on paper
I started with exploratory sketches of each screen, researching the competitors and existing apps like Google Maps and CityMapper. I analysed every part of the app, imagining the situation the end user would be in, to come up with the solution sketches presented here.
Testing & Improvements
Improving the flow from testing
In order to obtain practical, real-time feedback to improve the user’s flow when using the app, I conducted 2 rounds of 5 usability tests and continually iterated my design with 4 major imrpovements:
Ensuring consistency for the user
Initially the emeregency button was in two locations, depending on the mode - in the Safe Mode it would switch from a floating button to a feature in the navigation bar.
After the testing, I streamlined the design by consolidating elements and ensuring the emergency button remained in a consistent, easy-to-find location to reduce user confusion.
Giving a visual feedback to the user
During the usability testing, there was a lot of positive feedback regarding the Live Location feature. However, users were confused who it was shared with.
After the feedback, I incorporated a subtle visual confirmation to indicate to the user that the feature has been successfully activated, and remind the user who the live location has been shared to.
Clarifying the rating system
In the first wireframes the users were unsure what the rating system was and how they should rate for acurate feedback.
To keep it clear, I added a small description of the rating helping users give a more suitable score through the sliders.
Clarifying the community-based aspect
The usability testing revealed that the community-driven aspect of the app was unclear to users.
To highlight this important part and incorporate another idea of user verification on the app, I incorporated a rating for the category in suggested route.
UI Library
Defining the brand
After ironing out the functionality of the app I then jumped on the branding. Defining the brand and core values prompted a crucial reflection on what makes the product unique and its mission.
This process revisited the problem space, drawing on personal experiences, user insights, and the motivations behind the app.
Brand name
Naming the brand was both enjoyable and challenging, as it needed to reflect its values and resonate with the audience.
"NightLight" was chosen to symbolize guidance and safety at night, evoking images of night lights, light towers and fireflies—beacons of hope guiding users safely home.
Wordmark
The final wordmark selection features the Voltaire font, chosen for its elongated, distinctive yet minimal and elegant letterforms. This type style is paired with an icon of a streetlamp illuminating a path, reflecting the likely use case of the app. The imagery reinforces the theme of guidance, offering light and clarity during moments of darkness and uncertainty.
Typography
Primary font style - Voltaire, reserved for headers, buttons, and the logo to maintain emphasis and brand recognition.
Secondary font style - Inter, predominantly used for informational text throughout the app, chosen for its superior legibility.
Primary colors
The brand's color palette is streamlined to four core colors with 3-4 hues.
The primary color is used for text, the neutral color for backgrounds and inactive states, the accent color for highlighting key elements, and the emergency color for warnings and alerts.
The App
Introducing NightLight
The final outcome of the fitness centre mobile app was a user-friendly and engaging digital product that exceeded the client’s expectations.
Users were able to easily view class schedules, book sessions, and track their fitness progress, all within a seamless and intuitive app experience.
As a result, the fitness centre saw an increase in user engagement and loyalty, and the app has become an important part of their overall customer experience.
Get safer routes with just one swipe
Turn on the safety-focused mode to get safer route suggestions based on verified community ratings!
Have an emergency button at your disposal
Have the option to quickly inform your emergency contact when you feel unsafe. Alternatively double click your side button to make a loud noise!
Share Live Location of your trip
Share your live location in the same app with your emergency contact with just 1 easy swipe.
Be safer together
Give back to the community by sharing your feedback, and help everyone have a safer experience traveling to their home.