6–9 minutes

Construire une carte interactive avec Grok Bot (sans savoir coder)

Dessin à la craie sur tableau noir : un village perché en pierres dorées entouré de vignes, et au premier plan un smartphone affichant une carte avec trois repères rouges et un chemin en pointillés.

Je vais être honnête avec vous : je ne sais pas coder. Pas une ligne. Pourtant, le samedi 24 octobre, j’ai mis en ligne une carte interactive sur ce site… depuis une table de restaurant, à Oingt.

Le dépliant « Oingt – Plan de visite libre » ouvert sur une table de restaurant, avec le plan du village et ses 14 étapes numérotées, point de départ de la carte interactive
Le dépliant photographié sur la table du restaurant : le plan du village et ses 14 étapes – Dépliant Beaujolais Tourisme

Devant moi, le dépliant « Oingt – Plan de visite libre » de Beaujolais Tourisme. Un très beau document, avec un plan, 14 étapes, une légende et même une balade sonore avec des QR codes. Le problème ? Sur le terrain, jongler entre un plan papier, un téléphone pour scanner les codes et ses propres pieds dans les ruelles en pente… ce n’est pas l’idéal.

Alors j’ai eu une idée un peu folle : et si je demandais à Grok Bot de transformer tout ça en une vraie carte sur mon téléphone ?

Dans cet article, je vais vous raconter comment je suis passé du dépliant photographié à la carte en ligne, ce que j’ai demandé exactement, ce qui a été corrigé en route, et pourquoi ça m’a fait mieux profiter de ma visite.

C’est parti !

Vue sur les vignes et les collines du Beaujolais sous un ciel gris d'automne, une branche au premier plan
Les vignes et les collines du Beaujolais, pendant ma visite d’Oingt le 24 octobre.

Comment tout a commencé ?

J’ai pris 6 photos du dépliant, directement sur la table. Puis, à 14 h 35, j’ai envoyé ma demande à Drew, mon assistant Grok Bot. Mot pour mot, la voici :

« sur base des photos que je te fournis, est-ce que tu peux me créer une carte interactive sous forme de page Web qui tient compte de ma géolocalisation afin de visiter le village »

Pas de cahier des charges, pas de jargon technique. Juste mon besoin, expliqué comme je l’aurais expliqué à un ami.

Une minute plus tard, j’ai ajouté (oui, je dicte, d’où le « euh ») :

« Tu peux euh aussi aller sur internet pour essayer de valider des sources et de réimporter d’autres images si nécessaire. »

Et c’est tout. Le reste, c’est Drew qui s’en est chargé.

Que fait Grok Bot à partir d’un simple dépliant ?

C’est la partie qui m’a le plus impressionné. Grok Bot n’a rien inventé : il a assemblé des informations qui existaient déjà, sur papier et sur le web.

Voici ce qu’il a fait :

  • Lire le dépliant : il a recadré chaque photo pour retranscrire les 14 étapes, avec les citations du « baron Guichard » reprises telles quelles.
  • Récupérer les audios : la balade sonore « Les fléaux d’Oingt » est disponible sur le site Rhône Médiéval. Plutôt que de scanner des QR codes, les fichiers audio sont directement dans la carte.
  • Placer les repères utiles : grâce à OpenStreetMap, la carte affiche 3 parkings (3 € pour 24 h), l’office de tourisme, les toilettes et 2 points de vue.
  • Ajouter des photos : elles viennent de Wikimedia Commons, avec l’auteur et la licence indiqués sur chaque fiche.
  • Vérifier les horaires : sur beaujolais-tourisme.com et oingt.ovh.
Pages du dépliant d'Oingt présentant les étapes 4 à 11, de la Prison au Logis seigneurial
Les étapes 4 à 11 du dépliant, de la Prison au Logis seigneurial, retranscrites une à une dans la carte – Dépliant Beaujolais Tourisme

Petit détail que j’apprécie : quand Grok Bot n’était pas sûr de l’emplacement exact d’une étape (la Prison, le Chemin de ronde, le Logis seigneurial et le Puits), il l’a affichée avec un contour en pointillés et la mention « position approximative ». Plutôt que de faire semblant de savoir, il le dit. J’aime ça.

Porte en bois marquée « PRISON » dans un mur en pierres dorées, avec une table et des chaises rouges de bistrot
La porte de la Prison (étape 4), l’une des étapes au contour pointillé sur la carte.
Le puits d'Oingt, une petite cabane de pierre en forme de cône avec une grille, à côté d'un panneau d'information
Le Puits (étape 13), une petite cabane de pierre, lui aussi placé approximativement.

Combien de temps ça a pris ?

Moins d’une heure, et j’insiste : tout s’est passé le jour même, pendant ma visite.

  • 14 h 35 : ma demande, avec les 6 photos.
  • Vers 14 h 46 : un premier aperçu à tester sur mon iPhone, via un lien temporaire.
  • 15 h 13 : la page « Oingt – Visite libre » est publiée sur denisqs.com.
  • 15 h 38 : la dernière retouche de la journée est en ligne.

Soit 38 minutes entre la photo du dépliant et la page publiée. Le temps d’un café (bon, peut-être deux…).

Et si quelque chose ne me plaît pas ?

Eh bien, je le dis. Comme à une personne. C’est là que j’ai compris que je n’avais pas besoin de savoir coder : il me suffisait de savoir ce que je voulais.

Voici les retouches que j’ai demandées cet après-midi-là, en testant la carte sur place :

  • 15 h 15 : j’ai d’abord proposé de déposer la carte « en tant que fichier ». Réponse : WordPress refuse les fichiers HTML, donc on garde la page. Le lien m’est renvoyé à 15 h 16.
  • 15 h 19 : « La glissière ne fonctionne pas bien, est-ce que tu peux mettre juste une croix pour […] fermer […] pour que on puisse simplement réafficher la carte facilement. » Résultat : une grosse croix × sur les fiches, en ligne à 15 h 20.
  • 15 h 27 : « Tu crois que c’est possible de récupérer les audio liés aux lieux directement dans la page, avec un lecteur intégré plutôt que de renvoyer vers un site externe ? » À 15 h 29, 7 fiches avaient leur lecteur audio, plus une introduction en haut de la liste des étapes.
  • 15 h 35 : je demande d’afficher les guides vocaux supplémentaires avec une icône de haut-parleur, en précisant : « Je parle uniquement de ceux disponibles sur le site que tu as déjà, n’en cherche pas d’autres ailleurs. » Deux points 🔊 apparaissent : « Introduction » et « Érable Castel di Tora ».
  • 15 h 36 : je veux pouvoir agrandir les fiches en plein écran, « mais garde la croix ». C’est fait, et en ligne à 15 h 38.

Vous remarquerez une chose : à chaque fois, je décris ce qui me gêne en tant que visiteur. Jamais comment le corriger. C’est à mon avis la clé.

Qu’est-ce que ça a changé pendant ma visite ?

Concrètement, sur mon téléphone, sans application à installer, j’avais :

  • une carte centrée sur Oingt, avec les 14 étapes reliées par un tracé ;
  • pour chaque étape, une fiche avec le texte du dépliant, la citation du baron, une photo et l’audio quand il existe ;
  • la distance qui me séparait de chaque lieu (« À … de vous ») ;
  • un bouton « 🚶 Itinéraire » pour me guider ;
  • un bouton « Marquer comme vu » pour cocher les étapes, avec ma progression gardée sur le téléphone.

Résultat : je n’ai plus eu à chercher où j’étais sur le plan ni à scanner un QR code à chaque coin de rue. J’ai pu lever le nez et profiter du village.

Vitrail coloré représentant saint Matthieu et l'ange, dans l'église Saint-Matthieu d'Oingt
Saint Matthieu et l’ange, dans l’église Saint-Matthieu d’Oingt.
Panneau d'information « Saint Bonnet et saint Matthieu dans l'église d'Oingt – Les vitraux de 1856 »
Le panneau de l’église : ces vitraux ont été posés en 1856 par les verriers lyonnais « Sauris et Payet » – Texte Renée Dupoizat – Fédération Patrimoine des Pierres Dorées
Vitrail coloré représentant saint Bonnet en évêque, dans l'église d'Oingt
Saint Bonnet, représenté en évêque, juste à côté.

Pourquoi une seule correction cinq jours plus tard ?

Tout a été fait le 24 octobre. La seule modification ultérieure date du 29 octobre, et elle m’a appris quelque chose d’important.

Au départ, la carte sautait directement sur ma position GPS. Parfait quand on est à Oingt… mais si j’envoyais le lien à quelqu’un resté chez lui, il voyait sa propre rue, pas le village !

Avec Drew, la carte a donc été recentrée : elle s’ouvre désormais sur Oingt, la géolocalisation tourne en arrière-plan (le petit point bleu), et le bouton 📍 ne recentre sur vous que si vous le demandez.

La leçon ? Quand on crée quelque chose, il faut aussi penser à la personne qui le reçoit.

Qui faut-il remercier ?

Je n’ai rien créé de tout ça seul, et Grok Bot non plus. La carte affiche d’ailleurs ses sources en bas de la liste des étapes. Un grand merci à :

  • Beaujolais Tourisme, pour le dépliant « Oingt – Plan de visite libre » (juillet 2026), source de tous les textes ;
  • Rhône Médiéval – Les fléaux d’Oingt, pour la balade sonore ;
  • les contributeurs OpenStreetMap, pour le fond de carte et les repères ;
  • les photographes de Wikimedia Commons (licences CC BY-SA et CC BY), crédités sur chaque fiche ;
  • Leaflet 1.9.4, la bibliothèque qui fait tourner la carte.

Et vous, quel parcours aimeriez-vous transformer en carte interactive ?

Ce que je retiens de cette expérience, c’est que la méthode est réutilisable partout : un dépliant, quelques infos déjà disponibles, un besoin expliqué simplement… et une carte qui vous fait mieux profiter d’un lieu.

Vous pouvez tester la carte ici : Oingt – Visite libre. Et si vous passez par le Beaujolais, elle est faite pour vous !

Alors, à vous de jouer : quel lieu aimeriez-vous visiter avec votre propre carte interactive ? Dites-le-moi en commentaire !

À bientôt pour un prochain article !

Denis-Quentin Simon

Denis-Q.S.

Pas parfait. Juste mieux, jour après jour.

En savoir plus sur moi →

Laisser un commentaire

Votre adresse e-mail ne sera pas publiée. Les champs obligatoires sont indiqués avec *

À lire aussi