Map interface
Skill Dragoon0x/everything-design-taste/skills/map-interface
Map UI patterns, markers, clustering, search on maps, location pickers, and map interaction design.From its SKILL.md
npx -y skills add Dragoon0x/everything-design-taste --skill map-interfaceAssembled from the repository path, not quoted from the project. Check it against their README if it does not work.
One thing to look at
- 9 stars9 stars. Stars are a popularity signal and not a quality one, but at this level it is likely that nobody has read this closely except its author, and you would be relying on your own review.
SKILL.md
1.2 KB, 239 tokens by cl100k_base, as published. Nobody here has run it
Map Interface Patterns
Map Controls
- Zoom: buttons (+/-) and scroll/pinch
- Current location: "locate me" button
- Map type toggle: satellite/terrain/standard
- Search: geocoding input for address/place lookup
- Fullscreen toggle
Markers
- Cluster dense markers at low zoom (show count)
- Selected marker is visually distinct (larger, different color, elevated)
- Hover shows tooltip with preview info
- Click opens detail card/panel
- Consistent marker style within categories
Info Cards
- Appear on marker click as card overlay or side panel
- Include: name, address, rating, image, action buttons
- Close on clicking elsewhere on map
- Mobile: bottom sheet sliding up from bottom
Location Picker
- Click to place marker
- Drag to adjust position
- Search to jump to address
- Show coordinates for precision use
- Confirm button to finalize selection
Performance
- Limit visible markers (cluster or viewport-filter)
- Lazy load marker details on click
- Use vector tiles for smooth zoom
- Debounce search-as-you-pan requests
What ships with it
Read from the repository
Just SKILL.md. No reference files, no scripts.