Personnalisez vos fonds de carte
À partir d’une base de données géographiques comme Open Street Map ou IGN, une carte interactive est un rendu stylisé de ses données, souvent enrichi par des contenus ou des services, dépendant du produit que vous souhaitez construire : application mobile ou site web, de son public, de son utilisation, etc.
Dans ce blogpost nous allons revenir sur les grands principes de la stylisation d’un fond de carte : pourquoi styliser ? Quel impact ? Comment ?
1. Une restitution stylisée des informations géographiques
OpenStreetMap, l’IGN, TomTom : les fournisseurs de données cartographiques sont avant tout des bases de données géantes (le fichier “planète” sur OpenStreetMap c’est 1,5 to de données).
Si aujourd’hui en tant qu’utilisateurs nous consommons des cartes interactives qui se chargent instantanément plusieurs fois par jour c’est parce que ces bases de données sont transformées et stylisées pour être consommables –autrement dit comprises et utiles – par nos cerveaux sur nos différents devices.
Pour transformer ces bases de données géographiques en cartes interactives utiles, au-delà des processus techniques (transformation en tuiles vectorielles ou raster) qui permettent de les télécharger et les afficher sur nos écrans, il faut réaliser un travail souvent méconnu de stylisation des cartes.
Styliser une carte c’est d’abord faire un choix difficile : quelles informations montrer ? Quelles informations omettre ? Les noms des rues ? Les noms des ensembles administratifs ? Les formes des bâtiments ? Les voies de chemin de fer ? Vu la quantité d’informations géographiques disponibles aujourd’hui, choisir c’est avant tout retrancher.
Tous ces choix révèlent des hiérarchies et doivent être appliqués aux 20 niveaux de zoom qui permettent de passer du globe à votre coin de rue. Ces choix sont subtils et nous n’avons pas conscience des impacts énormes qu’ils peuvent avoir.
Ensuite chacun des types d’information choisi peut et doit être stylisé pour se distinguer des autres composants de la carte, pour mettre en évidence une information par rapport à une autre, etc. Pour une carte interactive “classique” ce sont déjà plusieurs dizaines de type d’éléments –mer, fleuves, rues, bâtiments, routes, champs, forêts– dont il faut choisir la couleur, la transparence, les polices de caractère, etc.
Et avant de se lancer la question à se poser est : styliser ma carte, pour quoi faire ?
2. Pourquoi des styles ?
Avec Google Maps qui a si longtemps dominé le secteur de la carte interactive (mais cela change heureusement !), on a pu oublier qu’il y avait différents styles de cartes.
Et pour cause, aujourd’hui les cartes interactives sont au cœur de nombreux produits digitaux : des médias aux applications de livraison, des chasses au trésor aux portails de l’administration. Comme le dit Wired “Maps became the new search box”.
La règle d’or est que le style de vos cartes interactives doit correspondre au style de votre produit. Céder à Google ou Apple vos choix de design au travers des plans par défaut dans Android et iOS c’est contre-productif (surtout quand on sait que styliser une carte interactive peut être bien fait, sans effort, voir plus bas).
Voici quelques exemples de lignes directrices qui peuvent influencer vos choix de stylisation pour vos cartes interactives.
2.1 — Créer une carte interactive qui respecte une charte graphique
Vos cartes interactives doivent refléter l’identité de votre produit, de votre marque. C’est un espace de communication et d’interaction essentiel pour vos utilisateurs, ils doivent vous y retrouver.
La stylisation passe par la configuration des couleurs notamment des eaux, des routes et des terres. Comme l’a très bien fait le Louvre avec sa carte des œuvres dans le monde en optant pour des tons chaux concordant avec leur charte graphique.
La police de caractère fait aussi partie intégrante des choix de stylisation. Le nom de la ville, des rues, des structures…, tout cela doit s’harmoniser à votre image et à votre charte graphique comme l’a pu faire Colmar sur sa carte.
Il est également possible d’aller encore plus loin en choisissant un style de carte particulier s’adaptant à votre produit. Des studios comme Stamen Design proposent des styles assez originaux tels que le “ watercolor ” ou bien le “toner”.
2–2 S’adapter à vos utilisateurs
Le style ne doit pas primer sur l’utilité car en effet une carte ou un plan interactifs ont toujours une finalité servicielle : pour informer, pour comprendre, pour situer, pour guider, etc. L’usage de vos cartes interactives et l’objectif de votre produit doivent donc déterminer vos choix de style.
Votre carte interactive sera-t-elle consommée sur des écrans dans l’espace public ? Est-elle utilisée en mobilité, pour une information de proximité, ou depuis un ordinateur sur des écrans larges ?
2–3 Stylisations avancées : enrichir en données
Votre fond de carte exige parfois des enrichissements particuliers : il peut s’agir de couches de données particulières ou d’éléments tels que des bâtiments qui doivent être mis en avant.
On peut penser par exemple aux images satellitaires ou aux courbes d’élévation pour les thématiques “outdoor”.
Sur un plan plus local les données de bâtiment peuvent faire l’objet d’enrichissements. Ainsi Hachette pour les cartes interactives accompagnant son guide “Un grand week-end à Paris”, a souhaité mettre en avant des bâtiments spécifiques, faisant l’objet d’un style particulier appliqué individuellement.
Pour aller plus loin encore les bâtiments peuvent être rendus en plans intérieurs ou en rendu 3D. Ainsi, au-delà du fond de carte aux couleurs de la fédération et conçu pour un usage en mobilité dans l’application Roland Garros, la FFT a souhaité intégrer dans les cartes de cette dernière des modélisations 3D des cours les plus emblématiques.
Pour la nouvelle Cité des sports, la ville d’Issy les Moulineaux a enrichi le fond de carte avec une modélisation en 3D simplifiée du bâtiment et de ses différents étages. Les possibilités sont infinies !
Enfin si on parle de fond de carte c’est parce que vous allez enrichir ce canevas avec des informations, avec vos messages sous la forme de points d’intérêts, parcours, zones, etc. Cela sera l’objet d’un autre blogpost !
3. Styliser ses cartes interactives comme un pro
Les possibilités sont vastes pour styliser vos cartes, mais cet effort de stylisation est à la portée du plus grand nombre. Pas besoin d’être géomaticien ou formé au SIG pour créer un fond de carte qui serve votre marque, fasse le délice de vos utilisateurs et valorise vos contenus : plusieurs options s’offrent à vous, en solo, ou avec l’accompagnement d’experts.
3.1 Créer un style en quelques clics
Avec l’outil en ligne Wemap Pro vous avez à votre disposition un outil professionnel de création de cartes, à la portée de tous. Dans cet environnement no-code, la personnalisation des fonds de carte se fait par un outil WYSIWYG pour des ajustements simples et efficaces.
3.2 Un studio pour les styles avancés
Wemap intègre l’outil Maputnik qui vous permet de paramétrer : affichage, stylisation de tous les éléments du fonds de carte à tous les niveaux de zoom. Attention c’est addictif !
Pas d’inquiétude, le support Wemap reste toujours à votre disposition pour la conception de vos cartes.
3.3 Des fonds de carte cousus main
Vous souhaitez un fond de carte à vos couleurs et enrichi, avec des bâtiments et des modélisations 3D : l’équipe graphique Wemap est là pour vous accompagner.
Vous avez des questions concernant la création de fonds de cartes personnalisés ou sur les fonctionnalités Wemap Pro ? L’équipe est à votre écoute, écrivez-nous !
