\DESIGNSORCERY>_

Organisez et enregistrez vos adresses avec Mapstr

Video · Light

Design System Inspiration

Mapstr — extracted via DESIGN.md

Travel · Location organizer & sharing

clean vibrant illustration-rich playful minimalist split-screen hero floating CTA illustration-rich content mobile-first design

Typography

DM Sans

Heading

Aa Aa Aa Aa

Color palette

TL;DR

Mapstr utilizes a high-contrast "monochrome-plus-one" system where a dominant achromatic foundation of Obsidian (#202020) and White Smoke (#efeff1) is punctuated by a single high-energy primary accent: Sun Yellow (#ffc222). Typography is exclusively **DM Sans**, leveraging heavy weights (700) for massive display headers and medium weights (500) for interactive elements. The interface relies on generous spacing (base unit 4px, scaling to 120px) and extreme pill-shaped geometry (100px radius) for primary actions and container groups. Surfaces alternate between pure white and a very light grey (#f9f9f9) to create a rhythmic, structured scrolling experience.

Target audience

The likely target audience is individuals who enjoy exploring new places and want a convenient way to organize, save, and share their favorite locations with friends.

Full tech stack

cdnjs Cloudflare Google Analytics Google Font API Google Hosted Libraries Google Tag Manager jQuery jQuery CDN jsDelivr

Analytics

Google Tag Manager Google Analytics

Meta description

Mapstr est l'application ultime pour organiser et enregistrer vos adresses favorites. Créez vos listes personnalisées et partagez-les avec vos amis. Téléchargez Mapstr dès aujourd'hui et explorez le monde!

Brand Voice

Mapstr is an encouraging and practical companion that helps users curate their own world with ease and confidence.

Positioning

Mapstr is a personal mapping and social discovery tool for individuals who want to organize their favorite places and explore new ones. It positions itself as the solution to digital clutter (lost notes and screenshots) by offering a central, private, and customizable space for "good addresses."

Voice principles

  • Empowering: Uses the imperative mood (Explorez, Découvrez, Enregistrez) to encourage users to take ownership of their discoveries.
  • Personal: Frequently uses "you" and "your" (votre, vos, vous) to emphasize that the experience is tailored to the individual's unique tastes.
  • Practical: Focuses on solving everyday frustrations like forgetting an address or losing a note at the bottom of a phone.
  • Trustworthy: Maintains a clear and protective stance on privacy while highlighting a large, active community and expert endorsements.

More SaaS Designs

← Back to Gallery