6 min read

Avoir une idée le matin, lancer un site dans la foulée et finir sur BFMTV le soir : la petite histoire derrière 100km.space

person sitting inside restaurant

S’il y a bien une chose à laquelle je ne m’attendais pas, c’était ce qu’allait devenir la petite idée d’une carte qui affiche un cercle.

Parce que finalement, il ne s’agit que de cela. Afficher une carte, prendre des coordonnées géographiques et placer un rond équivalent à 100 kilomètres autour de ce point précis.

Au réveil, j’ai eu la pensée toute bête de savoir ce que représentait cette future zone de déplacement autorisée lors des phases de déconfinement. Mine de rien, ça fait quand même pas mal de kilomètres et les déplacements professionnels vont reprendre très rapidement et beaucoup plus fréquemment pour certains (je pense par exemple à certains clients qui souhaitent absolument voir un prestataire avant de lui confier une mission).

Ne sachant pas ce que cela représentait, j’ai décidé de me remettre à l’API de Google Maps. J’aime bien les cartes, ça me permet de me situer dans l’espace, ça me parle, ça m’attire.

Ni une, ni deux, j’en profite pour me dire que si ça me sert, ça pourra sûrement servir à deux ou trois potes un peu geek sur les bords. Au moins pour échanger sur ce défi que représentait cette idée.

Petite routine du matin, check des emails, réunion d’équipe, échanges avec les collègues et il est 10h.

C’est parti, je prends un nom de domaine, court de préférence et que je pourrais partager sans l’écorcher.

Direction OVH. Et ses promos.

Je vois que le .space est dispo pour le titre du site : ce qui se trouve dans un rayon de « 100km ». Moins de 1,5€ plus tard, je me retrouve devant la facture de location du nom de domaine, je paie, j’attends de pouvoir le relier à un hébergement existant, après tout, il ne s’agit qu’un simple fichier HTML et d’un peu de mise en page. Pas besoin d’une bête de course.

Bienvenue : https://100km.space !

Google Cloud Platform. Et les APIs.

Cela faisait quelque temps que je n’avais pas mis les mains dans cet espace. Beaucoup de possibilités sont offertes à ceux qui veulent s’intéresser à la création de service grâce aux outils de Google.

Certes, aux yeux de beaucoup, il s’agit d’un géant prêt à tout pour récupérer vos données, votre argent, votre identité. Mais il s’avère que c’est surtout celui qui propose des APIs simples à prendre en main, en peu de temps, avec peu de moyens, pour des prototypes rapides.

De ce fait, activation des bonnes ressources, liaison à ma carte de paiement (mon aide à l’effort collectif, en plus de chercher du matériel pour les EHPAD), récupération de ma clé API, sécurisation pour éviter l’usurpation de site … Bref, c’est fait.

Les mains dans le JavaScript. Et les à-côtés.

Le prototype du site a été rapide à sortir. Je me suis servi d’un builder HTML5/CSS3 que j’avais déjà sous le coude, l’idée était de faire du quick & dirty.

Prendre le temps de boucler une première version qui marche avant de passer du temps à l’optimiser.

Timing serré, je me donne le défi de boucler tout ça en moins d’une heure. Pari réussi, je pousse en ligne après quelques microajustements :

  • OpenGraph : indispensable pour être bien vu par les plateformes sociales
  • Balises de header : au cas où ce serait utile
  • Test rapide sur mobile : j’ai un souci de zoom, mais ça marche quand même
  • Google Analytics : juste pour voir d’où les gens se connectent, c’est mon petit plaisir

En ligne. Et que ça saute.

Canva pour générer les visuels de partage ainsi que la favicon. Transmit pour tout envoyer sur le serveur. SublimeText pour optimiser à la volée les scripts.

Sélectionner le dossier, cliquer sur envoyer en ligne, attendre. Vérifier. Changer de petites choses du côté de OVH sur le DNS. Vérifier. Publier un tweet. Il est 10h59, j’ai réussi à lancer un prototype fonctionnel en 1h.

Les premiers retours arrivent, on me dit que c’est marrant, que c’est cool, que ça change, que je devrais modifier des choses.

Dès lors, il m’a suffi d’adopter une méthode bêtement simple :

  • Accuser réception du retour, car c’est assez génial pour ça Internet, le fait de pouvoir avoir un feedback immédiat
  • Engager la discussion pour comprendre les frustrations ou les envies
  • Tenter en direct de modifier le prototype local puis le pousser une fois au carré
  • Tenir au courant en répondant à la personne qui m’a donné le feedback de la nouveauté
  • Tenir au courant en créant un thread à partir de mon premier tweet des évolutions du site
  • Itérer

Ceci a été fait sur les réseaux où je suis présent, sur chaque compte personnel que j’ai, et non sur un compte d’entreprise. Il s’agit d’une démarche personnelle. L’adresse a donc été communiquée sur :

  • Twitter
  • Facebook
  • LinkedIn
  • Instagram en storie

Aucune campagne email de lancement en grande pompe. C’est juste l’histoire d’un mec dans son coin qui a relevé un défi qu’il s’est lui-même lancé.

Manger un bout. Et regarder les statistiques.

À partir de ce moment, j’ai compris qu’il se passait quelque chose. Je passais plus de temps à répondre à chaque commentaire / chaque partage qu’à prendre le temps de faire une nouvelle itération sur le code source.

Toutefois, j’ai pu avancer sereinement suite aux feedbacks complets et éclairés. Régler le souci du zoom sur mobile. Régler l’apparence de la carte. Régler le temps de chargement. Implémenter la fonctionnalité multipoint sur la carte …

À chaque sortie d’une fonctionnalité, je reprenais ces deux points essentiels :

  • Tenir au courant individuellement
  • Tenir au courant collectivement

Sans omettre une chose radicalement essentielle :

On peut partager les succès et les ratés. Les certitudes et les inquiétudes.

Rapidement, je me suis rendu compte que le tarif chez Google allait commencer à gonfler au fur et à mesure des visites. En fin de journée, vers 21h, il y avait déjà eu plus de 5000 personnes ayant effectué des recherches. Plus de 7000 pages vues, avec une moyenne de 43 secondes sur la page.

Oui, cette simple page HTML marche et plait.

J’ai alors décidé de finir la journée en répondant à ceux qui partagent encore le lien ou les publications originales. C’est alors qu’à 23h, je reçois une mention sur Twitter : « tu es passé sur BFMTV ».

Effectivement, le journaliste a pris une capture d’écran pour son sujet du jour qui traitait des fameux 100 kilomètres promis. Plusieurs sites ont étés abordés, mais mon projet matinal en faisait partie, à côté de productions bien meilleures techniquement.

Bilan de la journée, 6385 visiteurs uniques, 9399 pages vues, 46 secondes en moyenne sur la page. Pour 1 heure de développement au tout départ.

À la fin, ça fait des Chocapic.

Ce site ne reste qu’un bout de code, réalisé en peu de temps, pas très W3C, pas forcément parfait techniquement, avec des lacunes côté marketing (oui, c’est gratuit, oui, c’est moi qui paie encore).

Mais ce qui se passe, c’est que dès le lendemain matin, Twitter m’alerte à coup de notifications nombreuses : le site est encore plus partagé.

Cette fois-ci, au cours de la journée, il s’agit de Clubic qui décide de publier un article. Ensuite dans les sources du site je découvre des newsletters qui en parlent, des forums qui partagent le lien, quelques blogs avec des articles sur le sujet du déconfinement.

J’ai vraiment été content de faire ce projet, qu’il serve est une situation géniale à vivre. Surtout que ce n’était pas gagné, j’ai une fâcheuse tendance à vouloir concrétiser beaucoup d’idées du matin, sans forcément le faire.

La suite. Et la fin ?

Il est 18h30, le jour d’après. 14998 visiteurs uniques sur la journée, 23313 pages vues, 48 secondes en moyenne sur la page. Clairement, mes dépenses chez Google ont explosé.

Je ne sais pas si je vais continuer à financer ce site. Une cagnotte est en place, pour le moment pas de logo de sponsor à afficher.

Quelques pas gentils se sont proposés pour une récupération du site afin d’y mettre une marque. Ce que j’ai refusé. Il s’agit d’un outil créé par un individu pour les individus.

Mécénat ok, sponsoring ok, récupération non.

Au final, je ne sais pas encore ce que ça va devenir. En tout cas merci, c’était une riche expérience de vivre ce petit moment avec vous, les Internets.