🤔 Votre design (ou son absence) envoie un signal à vos prospects
Qu'on le veuille ou non...
Votre design envoie un signal à vos visiteurs, prospects et clients.
Prenez ce site web :
Que ressentez-vous en le regardant ?
Personnellement, j’ai une réaction “wooh ça sent l'arnaque”.
Maintenant, que ressentez-vous en regardant ces sites-là ?
Personnellement, je ressens de la sobriété, de la finesse et du calme.
Comme notre apparence physique, l’apparence de notre projet envoie un message.
Un homme habillé en costume envoie le signal de “sérieux” et de “professionnel”.
Alors qu’un homme habillé en t-shirt à fleurs renverra un signal plus “décontracté”.
Pour votre marque, c'est la même chose.
Et si vous ignorez complètement votre design, vous enverrez les mauvais signaux.
Vous utiliserez des nouvelles polices à chaque nouvelle publication,
Vous changerez les couleurs,
Vous changerez votre logo,
Etc…
Bref, vous manquerez cruellement de cohérence.
Et votre marque se diluera.
En fait, de nombreuses études montrent que le design de votre marque joue un rôle crucial sur la perception de crédibilité et les ventes de votre marque :
“Un site Web de qualité et une notoriété de la marque forte ont un impact direct sur la confiance des consommateurs, ce qui influe sur la fidélité des clients. Cela démontre l'importance d'un site Web attrayant et facile à utiliser pour établir une présence de marque forte” (Sastika, Suryawardani, & Hanifa, 2016).
La cohérence de l'image de marque, en particulier à travers le design du site Web, affecte positivement l'attitude des consommateurs et leurs intentions d'achat (Yoo & Kim, 2011).
🤓 Que devriez-vous faire pour x10 votre design sans vous faire couper un rein avec des agences ?
Ça fait +3 ans que je suis entrepreneur mais j’ai toujours été mauvais en design.
Pourtant, je voulais :
- être fier de mon projet
- avoir de la crédibilité
- me différencier de la concurrence
Alors, ce que je faisais, c'était foncer sur du micro sans stratégie.
Typiquement, j’ouvrais mon outil de tunnel de vente, Kajabi, et je commençais à chipoter aves les polices, les couleurs et les photos, sans savoir ce que je voulais transmettre.
Alors, je perdais un temps dingue à peaufiner et modifier des détails insignifiants, pour ne jamais être satisfait du résultat final.
Je voyais que mon design n'était pas à la hauteur de l'ambition de mon projet.
Alors, j’ai engagé un freelance pour le faire à ma place.
Ça m'a coûté 5000€, pour qu'au final je n'utilise même pas le travail rendu, car le problème était toujours le même ; la marque était jolie, mais elle ne traduisait pas du tout mon intention avec Atomic.
Ma rencontre avec Ben a radicalement changé ma vision du design.
Je me suis rendu compte que mon problème avec le design n'était pas un manque de sens esthétique en moi, mais un simple manque de méthode.
Je me rappelle même avoir voulu devenir designer professionnel après notre rencontre…
Avec Ben, nous nous sommes rencontrés dans un mastermind entre entrepreneurs, et nous avons tout de suite accroché.
Ben c’est un designer d’exception qui a travaillé avec des centaines de marques à travers le monde depuis ses 16 ans.
C’est d'ailleurs le premier stagiaire de Webflow et il a fondé Supercreative, une marque d’outils pour créatifs qu’il est en train de revendre.
Chez Supercreative, il a conçu une dizaine d’outils digitaux dont Instaprice, une calculette de prix pour freelances :
Ben, c’est le seul designer que je connaisse qui sait faire un design à la hauteur d’Apple sans être Apple.
Et donc, durant le mastermind, il y a eu une semaine où au lieu de s’appeler, on s’était donné rendez-vous en présentiel dans un appartement situé à Orléans.
Voulant tirer au maximum parti des compétences de chacun, on a fait un concept simple : on était tous invités à donner une masterclass aux autres sur le sujet de notre choix.
Et c’est là que Ben s’est levé et a commencé à parler.
Tout le monde s’est tu et j’ai écouté comme un enfant à qui on lit Harry Potter pour la première fois.
Ce jour-là, il nous a dévoilé son modèle mental de création et j’ai été complètement bluffé.
Avant, je voyais le design comme quelque chose d’obscur que seuls les artistes pouvaient faire.
Puis, c'est comme quand un magicien vous dévoile un de ses tours, vous avez l’impression d’être en possession d’un nouveau pouvoir.
Avant ?
Je voulais juste ravir :
Je savais pas ce que je voulais alors évidemment c’était super confus.
Je passais des heures à chipoter à des détails sans savoir où j’allais.
Mais une fois que Ben nous a montré son modèle mental, j’ai radicalement changé ma façon de créer.
Au lieu de commencer par “ravir”, il commence par la clarté (l’intention du projet).
Pourquoi faites-vous ce projet ?
Et c’est une fois que l’intention est définie, qu’il ravit.
Par exemple pour créer un site, au lieu de foncer sur Wix, voici ce qu’on a fait pour mon projet Dance.org :
👇 Les 4 étapes pour créer le site de mon projet Dance.org :
Etape #1 : Concevez le site map
Avant toute chose, on a défini l’architecture du site qu’on voulait faire, on appelle ça un "site map".
Chaque branche est une page de notre site et chaque page doit avoir un appel à l’action (CTA) clair.
Si je ne sais pas certain du CTA que je veux mettre, il est fort probable que cette page n’ait pas lieu d’être.
Etape #2 : Rédigez les textes
Ensuite, je rédige les textes rapidement. Je veux savoir quoi exprimer sur chaque page avant de la concevoir. Je vais à l’essentiel :
Etape #3 : dessinez votre site (wireframe)
Je vais dessiner mon site sur l’outil Whimsical. L’outil est génial, c’est très intuitif et parfait pour faire des mockups.
Ça va me permettre de dessiner sans limite, d’aller vite et c’est seulement en étant satisfait que j’irai sur l’éditeur de site.
Etape #4 : concevez le site sur un éditeur de sites (i.e. framer)
Ça y est !
Une fois que j’ai suffisamment travaillé le wireframe, je peux maintenant aller sur l’éditeur de sites (dans ce cas-ci Framer) et construire mon site.
L’avantage, c’est que maintenant je sais précisément ce que je veux et ce que je ne veux pas.
Je vais droit au but et je suis certain que le résultat va donner quelque chose de bien.
Résolvez la source du problème, pas la conséquence
Etymologiquement le design vient du mot italien, "disegno".
Qui veut dire à la fois :
- dessin
Et
- dessein !
Drôle quand-même ? 😛
Si on devait traduire le mot design en français, on devrait dire "intentionnaliser".
Dans l'usage moderne, en anglais, le mot "design" englobe la signification de planification, de structuration et de création d'objets, de systèmes ou d'interactions visuelles et fonctionnelles.
Donc, il intègre à la fois l'aspect esthétique et fonctionnel de la création.
Voilà pourquoi vous ne pouvez pas faire du design sans clarifier l’intention de votre projet.
Et c'est précisément le but de la méthode Atomic Design :
🔤 La méthode Atomic Design :
Comment vous créer une identité visuelle qui vous ressemble enfin sans compétences en design
Comme je vous disais, vous n’avez pas besoin d’avoir un sens de l’esthétique développé car cette méthode se base sur 3 étapes simples :
- Définissez l’intention de votre projet
- Traduisez votre projet en charte graphique
- Créez les supports
Cette méthode donne 3 avantages majeurs :
- Vous êtes sûr d’avoir une identité visuelle cohérente sur tous vos supports de marque
- Vous êtes fier de montrer votre projet au monde : vous ne serez plus bloqué par la peur de vendre ou de parler de votre projet
- Vous aurez une marque qui inspire crédibilité et confiance
🔑 Les 3 étapes pour un design à votre image
Vous pouvez cliquer sur les 3 étapes pour découvrir leur contenu !
-
1. L'intention de votre projet ✨
Quand Ben m’a aidé à définir l’intention de mon projet Dance.org, il a commencé par me poser 5 questions :
- Quelle est ton intention personnelle ?
- Pour qui ?
- Pourquoi ?
- Quelle action ?
- Quels résultats ?
Ces questions sont là pour réfléchir à la mission de notre projet.
Alors ce que je vous propose, c’est de faire l’exercice avec moi!
Ben insiste sur le fait que ces questions c’est ce qui fait la différence entre une marque forte ou insignifiante.- Quelle est votre intention égoïste de votre marque / projet / site ?
Ici Ben conseille de commencer par répondre de façon égoïste.
Pourquoi est-ce que je fais ce projet pour moi ?
C’est ok de répondre “Pour l’admiration de mes amis”, “Pour rendre ma copine fière”, “Pour virer mon boss”, …
Alors pour moi, égoïstement, Dance.org, c’est un mouvement de danse consciente international qui va me permettre de rencontrer plein de gens trop intéressants, de faire des événements plus grands, de rayonner à l’international et d'avoir un plus grand réseau.- Pour qui ? (pour qui ce n’est pas)
Je pense à une femme, 35 ans qui danse déjà. Elle a déjà testé pas mal de trucs comme le pilate, le yoga, … et veut aller plus loin.
Elle n’a eu que 1 ou 2 danses extatiques dans sa vie mais elle a ressenti un truc de ouf.
Depuis, elle n’a jamais réussi à recommencer.
Elle ne voit pas où elle peut faire ça dans sa région, donc elle n’a jamais réexpérimenté mais dès que quelqu’un lui parle de danse consciente, elle est super emballée.- Et pour qui ce n’est pas ?
Ben conseille de répondre à l’inverse de la question.
Dance.org, ce n’est pas pour l’homme de 50 ans, sceptique qui dira des trucs comme “convainc-moi”.
Il n’aura pas cette énergie d’expansion et d’amour. Celui-là, je ne veux vraiment pas l’avoir.
Je ne veux surtout pas faire des publicités “Connaissez-vous la danse consciente ?”. En fait, je ne veux pas essayer de convaincre les gens.- Pourquoi cette personne viendrait chez toi ?
Elle a déjà expérimenté la danse consciente mais elle a vu que ce n’était pas trop guidé, il n’y avait pas de prof.
Elle est un peu perdue, elle a envie d’explorer, elle voit que les autres dansent et bougent de ouf mais elle ne sait pas trop comment faire.
Alors elle vient sur le site pour découvrir comment elle peut approfondir la connaissance de leur corps.
Donc il y a un côté apprentissage et aussi communautaire :
Elle pourra contacter des membres directement via le site afin qu’ils s’organisent une danse ensemble dans la région.- Quelle action prennent-ils ?
Définir une action permet de clarifier ce que vous voulez de vos clients/membres.
Ça marche aussi bien pour un site (acheter, s’inscrire, réserver une place, …) que pour une marque. Par exemple, l’action de Nike c’est “Mets tes chaussures et va courir”.
Pour Dance.org, je veux qu’ils se mettent à danser le plus rapidement possible.Quelle est la contre-action ?
- L’action à ne surtout pas faire, c’est commencer à intellectualiser le truc. Je ne veux pas qu’ils commencent à lire la documentation sur la danse consciente etc…
Je veux juste qu’ils se laissent porter dans le flow de la danse.
Quels sont les résultats ?
Les bénéfices de la danse consciente sont multiples, voici quelques uns : - apprendre à laisser le corps exprimer ses émotions pour ne pas rester dans le mental au quotidien
- être dans une qualité de présence extraordinaire
- se sentir vivant
Et vous ?
- Quelle est votre intention personnelle avec ce projet ?
- Pour qui ?
- Pourquoi ?
- Quelle action voulez-vous qu’ils fassent ?
- Quels résultats ?
Dans la formation Atomic Design, vous aurez d’autres exercices un peu plus poussés pour identifier le ton de votre marque, avoir des idées de visualisation et comment faire un moodboard efficace.
Ok, maintenant que vous avez défini l’intention de votre projet, il est temps de traduire votre projet en charte graphique. -
2. Son projet en charte graphique 🎨
Votre intention, c’est la base de votre projet.
Mais maintenant, il faut traduire cette intention en charte graphique.
Une charte graphique est un ensemble de directives et de normes qui définissent l'identité visuelle d’une marque, d'une entreprise ou d'une organisation.
Elle assure ainsi une cohérence visuelle dans toutes vos communications et représente l'image de votre marque.
Généralement, elle se compose de 3 éléments :
Maintenant que vous avez défini l’intention de votre projet, on va voir dans la formation tous les outils du designer pour traduire notre intention en visuel.
- Les polices
- Les couleurs
- Les formes
- Les espaces
- Les matériaux
Et c’est seulement après votre charte graphique, que vous pouvez entrer dans le concret !
-
3. Créer les supports 📂
Vous avez tout ce qu’il vous faut pour créer tous les supports que vous voulez en un rien de temps !
Fini de passer des heures à chipotter dans Canvas ou dans votre éditeur de sites…
Vous savez très clairement ce dont vous voulez.
Donc vous allez droit au but.
Et vous aurez une identité visuelle cohérente et qui vous ressemble.
Dans cette étape, vous allez créer un logo, créer une carte de visite et évidemment, votre site web.
Voici ce que ça a donné pour Dance.org :
Logo :
Carte de visite :
La bannière :
Le site web :
Maintenant vous avez la base de la méthode Atomic Design.
Mais si vous voulez passer à l'action et créer votre identité graphique qui fera enfin rayonner votre projet, la formation Atomic Design est pour vous.Elle vous permettra de :
- maîtriser les outils du design ; les couleurs, les polices, les espacements, les formes, etc. pour mettre en forme l'intention de votre projet
- maîtriser les outils dont vous aurez besoin pour créer votre charte graphique, votre site et votre logo.
- être autonome en design pour le reste de votre vie.
👨🎓 Ben et moi sommes fiers de vous présenter Atomic Design
La formation qui vous montre étape par étape comment vous créer une identité visuelle qui exprime l’essence de votre projet sans compétences au préalable.
Après cette formation, vous :
- Aurez acquis une compétence profonde en design : vous serez capable de recréer un design de 0 quelque soit le projet (un restaurant, une marque personnelle, une marque de vêtements, …)
- Aurez une cohérence dans tous vos supports
- Aurez une marque qui inspire la confiance et la crédibilité
- Aurez un logo, une bannière, une carte de visite et un site web prêts à l’utilisation
- Ferez plus de ventes dans vos communications et votre site web
📚 Programme détaillé de la formation
Module #1 - Clarifier votre projet
- L’erreur n°1 dans lesquels les débutants tombent qui peut vous coûter beaucoup de temps et de l’argent (vous allez comprendre pourquoi commencer sur un outil de design est dangeureux)
- Clarifier l’intention : les 5 questions auxquelles vous devez répondre avant de toucher à votre identité visuelle
- L’exercice des Brand Sliders pour déterminer le ton et l’ambiance de votre marque (ça va avoir un impact sur tout ce qui va suivre)
- Créativité divergente : l’exercice “Si ta marque était…” pour matérialiser votre marque et avoir des dizaines d’idées
- La force du moodboard : voilà pourquoi on dit que les bons artistes “volent” (même les meilleurs designers ne partent pas d’une page blanche)
- L’erreur que les porteurs de projet commettent quand ils nomment leur projet (et mes critères pour un bon nom)
Module #2 - Traduire votre projet en charte graphique
- Les “outils” du designer ne sont pas des apps, c’est ce avec quoi le designer joue pour exprimer un message (couleurs, polices, matériaux, …).
- Maîtrisez enfin les couleurs pour exprimer le bon message : vous saurez enfin pourquoi vous ne devriez pas utiliser le bleu pour un projet de boulangerie.
- Maîtrisez la façon dans les polices jouent sur notre attention et notre perception (vous verrez pourquoi vous ne devriez probablement pas utiliser une police en gras pour une marque de luxe)
- Pourquoi vous devriez penser à des matériaux pour représenter votre marque même si vous faites un projet 100% digital.
- Comment vous pouvez tirer parti du mouvement pour évoquer un message dans votre logo et votre identité visuelle
- Les formes ont des significations dans notre inconscient : comment utiliser la forme, la taille et l’espace pour évoquer les bons messages à votre audience
- Pourquoi Ben vous recommande vivement de créer une charte graphique avant de vous lancer dans la création de vos supports
- Les 3 éléments capitaux pour créer votre première charte graphique et ce qu’il ne faut pas faire
- Le conseil d’un professionnel pour ne pas créer vos supports sur base d’une charte graphique dont vous n’êtes pas fie
Module #3 - Créer les supports :
Créez votre logo
- Comment enfin créer un logo pour lequel vous êtes fier sans y passer des années
- La méthode de création de logo rigoureuse mais agile pour faire émerger les bonnes idées
- Comment trouver l’inspiration pour son logo
- La technique de l’”évocation” pour déterminer si le logo est le bon ou pas
Créez votre carte de visite et la bannière de vos réseaux sociaux
- Pourquoi un bon designer sait résister à l’envie d’ajouter des éléments (et dans quels cas est que “moins = plus” ?)
- La technique de Ben pour ne jamais se tromper sur le look de votre bannière des réseaux sociaux
- Comment créer votre carte de visite afin d’impressionner les personnes que vous rencontrez
Site web
- Le protocole en 5 étapes pour créer un site web sans passer des heures à chipotter à des détails insignifiants
- La méthode du “site map” pour construire les fondations de votre site et apporter de la clarté
- Pourquoi vous devez avoir en tête un seul appel à l’action par page au risque de passer des heures à construire un site pour rien (pourquoi ce n’est pas suffisant de simplement avoir une page “événement”)
- Feuille blanche : pourquoi écrire le contenu de votre site avant de penser à sa structure
- Les sections à ne surtout pas oublier sur votre page d’accueil
- Exercice : je fais un premier brouillon de mon wireframe et regardez Ben me donner son feedback honnête (il a été cash mais constructif 😅)
- Regardez-nous par-dessus l’épaule réaliser un site web complet en live (sans montage, on vous montre tout !)
🙈 Les extras
Bonus : Quels outils devriez-vous utiliser et comment les maîtriser ?
- La différence entre les éditeurs de sites (et découvrez lequel Ben vous conseille en fonction de vos besoins)
- Comprendre l’interface de framer pour créer des sites web impressionnants et à votre image
- Comprendre comment se structure une page sur framer pour ne pas y passer trop longtemps
- Comment générer une première version de son site en 30 secondes chronos (grâce à l’IA puissante de framer)
La communauté Atomic Circle
1. Le groupe telegram
Pour parler avec les autres membres des formations en continu, nous avons mis en place un groupe télégram. Il fonctionne exactement de la même manière qu'un groupe whatsapp.
Pour l’instant, nous sommes plus ou moins 600 membres, des entrepreneurs, des créateurs de contenus et autres. Les membres discutent de leur progression, d’optimisations, posent leur question et certains se sont même mis en couple suite à une rencontre sur le groupe 😛.
2. Les Atomic Lives
Recevez les invitations calendrier quand Eliott organise une rencontre avec tous les membres de la communauté. Nous passons environ une heure en live par mois.
Vous pourrez directement me poser vos questions en live et me parler de vos projets.
3. La base de ressources communautaires
À chaque fois qu'une ressource intéressante est partagée dans la communauté, nous l'ajoutons à une grande base de savoir sur Notion.
Bénéficiez maintenant de l’intelligence collective de la communauté.
4. Les ateliers participatifs
Tout le monde (vous y compris) peut organiser un atelier participatif sur le thème de son choix (par exemple sur comment gérer son énergie dans une journée).
Cet atelier devra suivre une structure minimaliste et être participatif. Profitez du savoir des autres et partagez le vôtre !
5. Canal Telegram dédié aux élèves Atomic Design
Dans ce canal, vous pourrez partager tous vos projets et recevoir du feedback des autres membres.
Parfait pour apprendre rapidement et avoir un regard externe.
Des questions ?
-
1. Pourquoi devrais-je investir dans cette formation plutôt que chercher des ressources gratuites en ligne ?
Cette formation offre une structure complète du design : qui part de l'intention de votre projet jusqu'à la conception pratique de vos supports pour faire briller votre projet.
Contrairement aux ressources gratuites en ligne dispersées, elle vous donne un accès direct à un contenu de poussé, à des exercices pratiques et à un support personnalisé pour un objectif : que vous soyez fier de montrer votre projet au monde entier. -
2. Y a-t-il une garantie de remboursement si la formation ne répond pas à mes attentes ?
Oui, il y a une garantie de remboursement pendant 14 jours.
Si, après avoir suivi la formation Atomic Design, vous n'êtes pas satisfait des résultats ou si elle ne correspond pas à vos attentes, nous offrons une garantie de remboursement intégral endéans les 14 jours.
Vous pouvez rejoindre la formation pour essayer et décider après si vous la gardez. -
3. Comment puis-je être sûr que cette formation convient à mon niveau de compétence actuel en design ?
La formation Atomic Design est conçue pour être accessible aux designers de tous niveaux, des débutants aux professionnels expérimentés. Elle commence par les bases et progresse graduellement vers des concepts plus avancés.
Vous pouvez évaluer votre niveau de compétence actuel et suivre la formation à votre propre rythme. -
4. Est-ce que la formation est adaptée aux personnes daltoniennes, ou est-ce que la différenciation des couleurs est essentielle ?
La formation Atomic Design se concentre sur les concepts fondamentaux du design.
L'association des couleurs n'est qu'un outil du designer parmi d'autres. Bien que la différenciation des couleurs puisse être un élément du design, elle n'est pas l'aspect central de cette formation.
Les personnes daltoniennes peuvent donc également bénéficier de la formation. -
5. Combien de temps par semaine devrais-je consacrer à cette formation pour en tirer le meilleur parti ?
Le temps nécessaire dépend de votre rythme d'apprentissage personnel. Mais normalement, en un weekend vous pouvez terminer son visionnage. Ensuite, en une semaine ou deux, vous pourrez avoir votre moodboard, votre charte graphique, votre logo et votre site web. Une semaine ou deux supplémentaires si vous prenez votre temps.
-
6. Ai-je besoin d'un logiciel ou d'un outil spécifique pour suivre la formation, et cela impliquera-t-il des coûts supplémentaires ?
Vous aurez besoin d'un ordinateur avec accès à Internet pour suivre la formation. Certaines sections de la formation peuvent utiliser des logiciels comme Whimsical ou Framer. Même si ces logiciels ont des fonctionnalités payantes, vous pourrez suivre l'entièreté de la formation avec leurs versions gratuites. Il n'est pas nécessaire de dépenser de l'argent supplémentaire pour des outils spécifiques.
-
7. Que faire si je rencontre des difficultés ou si j'ai des questions pendant la formation ?
En cas de difficultés ou de questions, vous aurez accès à un support et à la communauté Atomic où nous sommes plus de 800 membres. Vous pourrez poser vos questions, obtenir de l'aide et résoudre vos problèmes.
-
8. Existe-t-il une communauté ou un réseau d'anciens élèves avec lesquels je pourrais échanger et partager mes progrès ?
Oui, dès que vous rejoignez une formation Atomic, vous faites immédiatement partie de la communauté Atomic Circle. Il y a des ateliers organisés par les membres toutes les semaines, des lives chaque mois, des ressources partagées et un groupe Telegram pour échanger et poser vos question. Cette communauté est idéale pour interagir avec d'autres étudiants, partager vos progrès, poser des questions et collaborer sur des projets. Cela favorise l'apprentissage collaboratif et le réseautage.
Add Headline Here
Vivamus dapibus interdum metus.
Nam sagittis non sapien vitae cursus. Vivamus dapibus interdum metus vitae cursus. Pellentesque gravida eu elit a malesuada. Aenean vitae ipsum velit. Etiam porta purus sed tincidunt convallis.
- Bullet point
- Bullet point
- Bullet point
Add Headline Here
Lorem ipsum dolor sit amet, consectetur adipiscing elit.
Les formules de la formation
Garantie zéro regret 30 jours, paiement en 3x disponible au moment du paiement.
La formation seule
Atomic Design
497€
167€ x3
Le budget d'un projet de design intégral en France est en moyenne de 7200€. Vous économisez 6900€.
-
Le curriculum complet de la formation à vie.
- Les +4h de vidéos.
-
Ses mises à jour régulières.
-
Accès à la communauté Atomic Circle.
- Paiement en 3 fois disponible au moment du paiement