On this page 7 sections
Show one clear route with your app’s key difference visible on it: quiet streets, step-free access, live transit, climbs, offline. Zoom in until the map is readable at thumbnail size, use realistic but fictional journeys, and never show anyone holding a phone while driving.
Why people add a second maps app
Everyone already has a maps app. A navigation app gets installed when it handles a specific journey better: cycling on quiet roads, step-free routes, hiking trails, live bus times, trucks, boats. The hook should name the journey and the difference.
Maps are the hardest thing to make readable in a screenshot. Zoom in further than feels natural, simplify the base map, and make the route thick and high-contrast. One route, one destination, one piece of information on top: time, climb or a warning.
The proof is the detail only your app has: a climb profile, a crowding level, the last bus. Lift it out of the phone as an enlarged card so it can be read.
A five-frame plan for a navigation app
A navigation set should read like one good journey.
Headlines for navigation apps
Navigation headlines should promise a better journey, not a better map.
Colour and style for navigation apps
Map apps need contrast more than style: a light, simplified base map, one bold route colour and a calm brand colour for headlines. Outdoorsy greens and blues suit cycling and hiking.
Store rules for navigation apps
Never show someone holding a phone while driving or riding. A mounted device with voice guidance is the safe way to show navigation in use.
Use map data you are allowed to show and keep any attribution your map provider requires.
Background location must be justified and disclosed; show fictional routes, not a real person’s commute.
Coverage, offline areas and live data in a frame must match what the app offers where it is listed (2.3.1).
Do and avoid
- Name the journey you’re best at
- Zoom in until the route is readable
- Use one thick, high-contrast route
- Lift key data out as a card
- Show offline if you support it
- Show phones in hand while driving
- Show a whole city with tiny streets
- Cover the map with five overlays
- Use real people’s routes
- Drop the map attribution
Questions
How do I make map screenshots readable?
Zoom in, simplify the base map and use one thick, high-contrast route with a single piece of information on top. Lift details like elevation out of the phone as a larger card.
What should a navigation app’s first screenshot show?
The journey you handle better than the big map apps, such as quiet cycling roads or step-free routes, on one clear route.
Can navigation screenshots show driving?
Show a mounted phone or car display with voice guidance, never a hand-held phone while driving.
Do I need map attribution in screenshots?
Follow your map provider’s terms; many require their attribution to stay visible on map imagery.
