Version 09
← Toutes les directions

PARCOURS INSPIRÉS DES LEADERS · TOUCHNOTE

09Façon Touchnote

La page reprend l’ordre de touchnote.com : bandeau promo, hero en panneau + visuel produit, grille d’occasions, 3 étapes, « personnalise », barre d’avis, panneau « encore mieux sur l’appli » devenu « encore mieux sur WhatsApp », tuiles colorées, puis un bloc crédits copié de touchnote.com/credits (lignes radio, prix par carte qui baisse) avant la FAQ.

Capture desktop 1440 de la version 09

Desktop · 1440

Capture mobile 390 de la version 09

Mobile · 390

Ce qui change

  • Bandeau promo fin en haut (« Une carte en 30 secondes · 72 h · timbre & livraison inclus »), comme le « Send a card in minutes · Free worldwide delivery » de Touchnote.
  • Hero en deux panneaux (texte sur crème + photo produit pleine hauteur), CTA pilule « Envoyer une carte ⊕ » façon « Create a card », lien secondaire « ou ouvrir WhatsApp », ligne Trustpilot sous le hero.
  • Nouvelle grille d’occasions (carrousel + puces) avec les 8 occasions du footer : anniversaire, vacances, naissance, mariage, je pense à toi, Noël, fête des mères, fête des pères — chaque tuile mène au tunnel.
  • « Comment ça marche » en 3 visuels carrés légendés (vidéos étapes 1 et 2 + photo étape 3) + bouton « Commencer », comme « The art of keeping in touch ».
  • « Pensé pour durer » traité comme « Make it personal » : 4 caractéristiques en 2×2 à gauche, carte annotée à droite, pleine largeur.
  • Preuve sociale : titre « Déjà +50 000 sourires », témoignages vidéo, puis barre d’avis Touchnote (note à gauche, avis défilants à droite).
  • « Even better on the app » devient « Encore mieux sur WhatsApp » : rappels (iPhone + chat) et bouton « Ouvrir WhatsApp » à la place du QR code de téléchargement ; les lignes du comparatif deviennent 4 avantages avec une seule mention grise « Ailleurs : … » (fin de la colonne répétée).
  • 3 tuiles colorées (réserve, rappels, parrainage) comme Membership / Credits / Referrals.
  • Bloc crédits façon touchnote.com/credits : titre « Des cartes achetées d’avance. Envoyées quand tu veux. », 3 lignes pilules (pile de timbres qui grandit, prix par carte, prix du pack, remise), bouton d’achat qui suit l’offre choisie, réassurances en tuiles.
  • FAQ en lignes accordéon teintées (comme sur /credits), footer avec moyens de paiement et encart « Pas d’appli à télécharger → écris à Hector sur WhatsApp ».

Inspiration et sources

  • Touchnote — touchnote.com (accueil) et touchnote.com/credits. Ordre relevé en navigateur headless le 9 octobre 2026 : hero « Turn life’s moments… » + « Create a card » → carrousel de modèles + onglets d’occasions → « The art of keeping in touch » → « Make it personal » → « Millions of real and heartfelt cards » (avis Trustpilot) → « Even better on the app » → tuiles Membership / Save with credits → footer (paiements, QR appli). La page /credits : « Cards, bought in advance. Sent whenever you need them. » + 5 lignes « x credits · €y each · total » + « Buy Credits » + 1-2-3 + occasions + FAQ. Hector remplace « télécharger l’appli » par « ouvrir WhatsApp ».
  • Touchnote — page d’accueil
  • Touchnote — page crédits
  • Figma 115:1361 « Touchnote 1 » (research/figma/115-1361_insp-touchnote-1.png)

Autocritique

  • Compris en 5 s : hero simple, photo d’une vraie carte, « depuis WhatsApp » dans le chapô ; le CTA pilule vert est le premier élément cliquable évident.
  • La grille d’occasions donne une raison d’envoyer (anniversaire, Noël…) que la 00 n’avait pas, et les prix arrivent présentés comme une monnaie (crédits) et non sous une galerie produit — ce qui répond au commentaire d’Arthur sur la réserve.
  • Le comparatif n’est plus un tableau : chaque avantage porte une seule ligne « Ailleurs : … », plus de répétition gauche/droite.
  • Discutable : les vignettes d’occasion réutilisent les mêmes photos de cartes (Tahiti, bébé) faute de visuels par occasion — à remplacer par de vraies cartes « anniversaire », « Noël »… ; la page est longue, avec beaucoup de blocs crème successifs.
  • Touchnote cache ses prix sur une page dédiée ; ici le bloc crédits est sur l’accueil (demande du brief) — une variante avec /tarifs séparée resterait à tester.