Mapping screen examples

Firecrawl

App playground where the user configures a web crawl job by entering a URL, setting semantic prompt instructions, and reviewing recent runs.

• AI Editing
• AI Settings

Front

Import wizard where the user maps CSV column headers to knowledge base article fields.

• Import & Export
• Setup Wizard

Height

Settings overlay where the user maps imported CSV columns to corresponding task attributes in Height.

• Add & Create
• Import & Export

Expensify

List view where the user calculates a mileage expense by entering start and end locations on an interactive map.

• Map
• Form

Readymag

Design editor canvas with a bottom-anchored code panel for injecting custom HTML into the page body.

• Code Editor
• API Keys

Gemini

Settings page where the user manages and toggles enabled extensions like Google Flights, Hotels, Maps, Workspace, and YouTube for their AI assistant.

• Integrations
• AI Settings

Fibery

Map view displaying customer locations across the globe with an open popover to switch the map style to satellite.

• Map
• Media Editor

Ortto

List view displaying a global map for real-time activities, currently showing zero activities alongside a trial countdown banner.

• Empty State
• Map

Robin

Floor plan editor where the user arranges spaces, desks, and points of interest on an office map.

• Design Editor
• Edit

Waldo

Workflow editor where the user is recording a mobile app test, showing a horizontal timeline of captured screens alongside an interactive device simulator, currently displaying an error toast.

• Workflow Builder
• Error

Airbnb

Onboarding step where the user searches for their address, uses their current location, or enters it manually over a map view.

• Setup Wizard
• Map

Felt

Design editor where the user annotates a satellite map with custom polygons, routes, text notes, and markers using a floating tool palette.

• Tutorial
• Design Editor