BackAfterDark
A nighttime navigation app
- Semester
- Spring 2026
- Course
- Interactions Design 2 (Richard K. Millard)
- Skills
- Figma, Mapbox
- Task
- Mobile Design, Navigation Design, User Research
AfterDark
- Semester
- Spring 2026
- Course
- Interactions Design 2 (Richard K. Millard)
- Skills
- Figma, Mapbox
- Task
- Mobile Design, Navigation Design, User Research
Context
AfterDark is a nighttime navigation app for late-night travelers and workers, inspired by my experience with night classes that ended at 9:30 PM and an hour-long commute home. As I adapted to this nocturnal routine, I began to notice the need for safer nighttime navigation and grew curious about the side of the city that only comes alive after dark.
Problem
Current tools are too fragmented. To navigate safely at night, users often have to switch between:
- Maps that lack nighttime context
- Food apps to find places open late
- Rideshare apps when walking or transit feels unsafe
- Messaging apps to check in with family and friends
Target audience
Mission statement
AfterDark empowers people to navigate and explore their cities with confidence after dark by connecting safer nighttime mobility with relevant late-night discovery.
Workflow statements
Drawing on interviews with potential users, I defined three core workflows. These workflows shaped the wireframes and established the scope for an interactive prototype of each journey.
Finding food after hours
As a late-night commuter finishing work or class, I want to quickly find nearby food options that are still open, so I can grab something to eat before heading home.
Getting there safely
As a late-night traveler heading to a selected destination, I want to navigate using a safe and efficient route, so I can reach the restaurant smoothly and with confidence.
Exploring what’s next
As a night owl finishing a late-night meal, I want to explore other nearby places, so I can decide what to do next without extra effort.
Wireframes
Sitemap
Building on the initial wireframes and user workflows, AfterDark’s sitemap was developed to organize the overall information architecture.
Color palette
Typography
Logo
Prototypes
This workflow follows a commuter finding a food stop before heading home. Users explore the map, review a restaurant’s opening hours and details, and compare routes before starting their journey. By bringing food discovery and transit planning together, I aimed to make choosing a late-night stop feel like part of the trip home.
Silent screen recording. This workflow follows a commuter finding a food stop before heading home. Users explore the map, review a restaurant’s opening hours and details, and compare routes before starting their journey. By bringing food discovery and transit planning together, I aimed to make choosing a late-night stop feel like part of the trip home.
Hold the video to pause; release to continue. With a keyboard, hold and release Space.