Ma deuxième semaine de stage chez France Résine Bretagne
Après une première semaine consacrée à l’analyse des prescripteurs et à l’idéation, cette deuxième semaine a marqué un tournant concret. Nous sommes passés de la théorie à la pratique avec la création officielle de l’identité de marque du projet.
Lundi : Création de l’identité de marque (Branding)
Lundi matin : Choix du nom et structuration des valeurs
Nous avons débuté la semaine en validant une étape cruciale : le choix définitif du nom. Le projet s’appellera désormais « Entremise ». Ce nom a été retenu pour sa signification littérale : le fait d’intervenir entre deux personnes pour faciliter une mise en relation ou résoudre une problématique. Cela renvoie à l’idée de « s’entremettre », d’être le lien essentiel entre deux parties.
Une fois le nom acté, nous avons défini les piliers de la marque en regroupant nos idées en plusieurs groupes de valeurs clés :
La transparence et l’honnêteté : La volonté d’offrir un service clair, lisible, traçable et encadré.
La fluidité (aspect organique) : Une approche naturelle, intuitive et simple, qui se fait d’elle-même.
L’alliance professionnelle (B2B) : Un cadre sécurisé, confidentiel et privé, favorisant la collaboration.
Le réseau (mécanique) : L’idée de connexion, de transmission, de flux et de liaison solide.
Lundi après midi : Conception du logo
L’après-midi a été dédiée à la traduction graphique de ces concepts. À partir des groupes de valeurs définis le matin, nous avons travaillé sur la conception du logo.
L’objectif était de créer un symbole qui reflète l’ensemble de ces notions. Nous nous sommes orientés vers une forme visuelle évoquant l’interconnexion (deux cercles qui se lient), jouant sur la transparence pour symboliser la clarté, et utilisant des teintes vertes et sombres pour rappeler à la fois le côté organique et le sérieux professionnel.
Mardi : Formalisation du style et création des composants
Mardi matin : Branding et formalisation du style UI
Mardi matin : Branding et formalisation du style UI
Dans la continuité de la création du logo, la matinée de mardi a été consacrée à l’extension de l’identité visuelle et à sa traduction en éléments d’interface numérique. L’objectif était de ne pas se limiter à un simple logo, mais de construire un univers graphique complet et cohérent.
Nous avons créé le branding global ainsi qu’une base de composants pour formaliser le style UI (User Interface). Ce travail a consisté à définir les règles qui régiront les futurs supports numériques du projet :
La typographie : Sélection de polices modernes et lisibles pour structurer les contenus. Les composants d’interface (UI Kit) : Nous avons conçu les éléments interactifs de base tels que les boutons (actions principales et secondaires), les champs de formulaire (« Se connecter », « Créer mon espace »), les tags et les systèmes de navigation.
Cette étape est essentielle pour garantir une homogénéité visuelle lors du développement des futures maquettes.
Mardi après midi : Création des visuels de la Landing Page et usage de l’IA générative
L’après-midi, nous avons attaqué la production des éléments visuels destinés à être intégrés dans la Landing Page. Nous nous sommes concentrés en priorité sur la « Hero Section » (la partie haute du site), car c’est le premier point de contact avec l’utilisateur et elle se doit d’être impactante.
Pour cela, nous avons mis en place un processus créatif en plusieurs étapes :
L’idéation et le croquis : Avec mon tuteur, nous avons imaginé une scène vue du dessus représentant une interaction professionnelle sur un chantier. Nous avons réalisé un croquis d’ensemble ultra simple pour poser la composition : une toiture, un fourgon, des matériaux et deux personnes se serrant la main (symbolisant l’accord).
Génération par IA : J’ai utilisé ce croquis comme base de référence pour guider une intelligence artificielle (Nano Banana Pro via Google AI Studio). L’objectif était de transformer ce dessin schématique en une image photoréaliste.
Itération et sélection : Après plusieurs essais de génération pour obtenir le bon rendu de perspective et de lumière, j’ai sélectionné les deux résultats les plus convaincants pour les présenter à mon tuteur.
Post-traitement et préparation à l’animation : Mon tuteur a ensuite pris le relais pour la partie technique sur logiciel de retouche. Il a procédé au détourage et à la décomposition de l’image (séparation des calques : camion, toit, personnages, etc.). Ce travail a été réalisé pour anticiper une potentielle animation de la scène lors du développement.
En parallèle de ce travail sur l’image principale, mon tuteur a également avancé sur la création des éléments graphiques pour les autres sections de la page.
Mercredi : Développement du site et travail sémantique
Le mercredi a marqué le début de l’intégration technique. Alors que mon tuteur avait déjà préparé l’environnement de développement et les configurations serveur, nous sommes passés à la construction des pages.
Pour cette étape, mon tuteur a privilégié une méthode de travail appelée le « Vibe Coding ».
Il m’a expliqué qu’il s’agit d’une approche moderne du développement où le programmeur utilise des assistants d’intelligence artificielle avancés pour générer le code « boilerplate » (la structure de base) et les fonctions standards en temps réel. Au lieu de tout écrire ligne par ligne, le développeur se concentre sur la logique globale, le design et le ressenti (la « vibe ») de l’application, en « dirigeant » l’IA. Cela permet de prototyper et de construire le site beaucoup plus vite.
Bien que je ne sois pas intervenu directement sur l’écriture du code, cette phase d’observation a été très formatrice. J’ai acquis le vocabulaire technique indispensable pour dialoguer avec une équipe web. J’ai appris à identifier et nommer les différentes parties d’une interface :
Le Header : L’en-tête de navigation (avec le logo et les menus).
Le Footer : Le pied de page contenant les informations légales
La Sidebar : La barre latérale pour les menus secondaires.
La Landing Page : La page d’atterrissage unique conçue pour la conversion.
En parallèle de la construction technique, nous avons travaillé sur le fond, c’est-à-dire le copywriting (la rédaction publicitaire). En nous basant sur la maquette, nous avons réfléchi aux textes pour qu’ils soient impactants et clairs.
Nous avons par exemple validé l’accroche principale visible sur le site : « Valorisez votre capital relationnel », suivie d’une promesse forte : « Transformez vos recommandations en revenus certifiés ». L’objectif était de rassurer le visiteur tout en l’incitant à créer son espace.
Jeudi : Conception du parcours d’inscription (Onboarding)
Après avoir finalisé la Landing Page destinée à capter l’attention, nous nous sommes attaqués jeudi à une étape critique du produit : l’Onboarding. C’est le point de bascule où le visiteur devient un utilisateur.
L’intention majeure de cette matinée était de travailler sur la réduction de la friction. Nous avons réfléchi à la manière la plus efficace de guider l’utilisateur pour qu’il configure son compte sans effort. L’enjeu était de concevoir un « tunnel » de conversion fluide, où chaque étape semble naturelle et rapide, évitant ainsi l’abandon en cours d’inscription.
Nous avons fait un choix de design radical : l’utilisation du « Full Green ». L’objectif de cette intention graphique est d’immerger immédiatement l’utilisateur dans l’univers de la marque Entremise, créant une rupture nette avec les interfaces classiques souvent blanches et neutres.
Pour rendre l’inscription fluide et performante, nous avons connecté notre système à l’API Pappers.
Il s’agit d’une interface de programmation qui nous permet d’interroger en temps réel les bases de données légales et financières de toutes les entreprises françaises.
L’intégration de cet outil répond à un double objectif stratégique :
-L’expérience utilisateur (UX) : Cela automatise la saisie. L’utilisateur n’a plus besoin de remplir manuellement son SIRET, son adresse ou sa raison sociale. Une simple recherche suffit pour pré-remplir l’ensemble des champs, rendant l’inscription quasi instantanée.
-La fiabilité des données : En sourçant les informations directement depuis des registres officiels, nous évitons les erreurs de saisie et nous nous assurons que les entités qui s’inscrivent existent légalement.
Vendredi : Bilan général
Ces deux semaines de stage ont été très intensives et productives. Nous avons réussi le pari, en seulement dix jours, de finaliser une première maquette fonctionnelle pour la partie présentation du programme.
J’ai pu suivre et participer à l’intégralité du cycle de création d’un produit digital :
La stratégie : Qualification et identification du public cible (les prescripteurs).
L’identité : Réflexion sur l’histoire (storytelling), le nom « Entremise » et l’image de marque que nous voulions véhiculer.
La conception : Réalisation du design et des interfaces sur Figma (outil de design collaboratif).
Le développement : Initiation à l’intégration web moderne via le « Vibe Coding » et découverte de la logique technique (structure de page, Responsive design et connexion API).
C’était une expérience très enrichissante!