# Didier Blessemaille — Portfolio 3D (https://didier.media) --- Ce site est une expérience 3D interactive : on pilote un vaisseau entre des planètes qui ouvrent chacune une page. Voici tout son contenu en texte. Contact : formulaire sur le site (planète Contact) ou LinkedIn https://www.linkedin.com/in/didier-blessemaille/ --- # 🚀 Didier Blessemaille Je m'appelle Didier Blessemaille, j'ai **22 ans** et je suis **médiamaticien CFC** depuis 2026. Passionné par mon métier, j'aime particulièrement sa polyvalence : chaque projet est l'occasion d'apprendre quelque chose de nouveau. Ma plus grande réussite : avoir terminé **7ème suisse** et **1er suisse romand** en médiamatique aux **SwissSkills 2025** 🏆 Une planète plus complète est dédiée à ce sujet : explorez l'univers pour en savoir plus ! --- ## 💼 Ce que j'aime dans mon métier - **Le design** : créer des visuels qui ont de l'impact, du print jusqu'au web - **Le code** : donner vie à mes idées, comme ce portfolio en 3D - **L'analyse de données** : étudier les chiffres et analyser comment le public réagit à un projet - **Le contact avec les clients** : j'aime passer du temps avec eux, que ce soit pour présenter un projet ou pour vendre de futurs projets --- ## 🧭 Ma personnalité Je suis quelqu'un de **sociable**, je m'intègre facilement, et je suis **très curieux**. J'adore les **défis** et découvrir de nouvelles choses. J'aime d'ailleurs être mis sous pression pour réaliser un projet. Et pour être honnête, j'ai aussi mes points faibles : - Je suis **très mauvais en orthographe et en grammaire**. Heureusement que l'IA est là pour me corriger ! J'utilise aussi des outils comme Reverso pour corriger rapidement mes erreurs. - Je suis **moins fan de la photographie et des vidéos longues**. --- ## 🤖 Passionné par les nouvelles technologies Je suis passionné par les nouvelles technologies, et en particulier par **l'intelligence artificielle**. Je suis régulièrement les nouveautés et j'essaie toujours de les tester pour voir comment elles évoluent. Ce site en est le meilleur exemple : il en est déjà à sa **3ème version**. J'ai commencé ce projet au début de l'été 2025, et c'est depuis la fin de l'été 2026 que l'IA est vraiment devenue assez performante pour réaliser simplement ce genre de projet. --- ## 🛰️ En dehors du travail - **Le spatial** : il y en a qui regardent des matchs de foot, moi je regarde des lancements de fusées ! - **La grimpe** : c'est le sport que je pratique sur mon temps libre. --- ## 🎖️ Actuellement Je suis actuellement en **service militaire long**, jusqu'à **fin avril 2027**. --- # 🏆 SwissSkills 2025 Les SwissSkills 2025, c'est ma plus grande réussite à ce jour. Voici ce que sont ces championnats et le projet que j'ai réalisé pendant le concours. --- ## C'est quoi les SwissSkills ? Les **SwissSkills** sont les **championnats suisses des métiers**. Du **17 au 21 septembre 2025**, environ **1 100 jeunes professionnels** venus de toute la Suisse se sont affrontés à **Berne** dans **90 championnats**, devant quelque **120 000 visiteurs** attendus. Pour y participer, il faut d'abord passer les sélections de son association professionnelle. En médiamatique, le championnat est organisé par **ICT-Formation professionnelle Suisse**. Lors des sélections, j'avais terminé **15ème suisse** et **3ème suisse romand**, ce qui montre aussi mon évolution jusqu'à la finale. --- ## 🥇 Mon résultat J'ai le plaisir de vous annoncer que j'ai terminé **7ème suisse** et **1er suisse romand** en médiamatique ! --- ## Le défi : lancer une marque de thé froid Pour le concours, nous jouions le rôle d'une équipe créative travaillant pour une **start-up locale de thés froids naturels**. L'entreprise produit déjà deux saveurs, pêche et citron, mais n'a pas encore de nom. Notre mission : donner vie à la marque et lancer sa **troisième saveur**. Le concours était composé de **5 tâches**, chacune avec un temps limité : - **Mini-concept** : nouvelle saveur, nom de marque, public cible et concept marketing (90 min) - **Logo** : utilisable en print comme sur le web, et lisible même en petit (60 min) - **Étiquette** : au format 50 x 100 mm (60 min) - **Photo produit** : prise de vue en studio puis retouche (60 min) - **Teaser vidéo** : de 10 à 20 secondes (120 min) L'utilisation de l'IA était autorisée, et vous vous doutez bien que j'en ai profité ! --- ## Mon projet : Astra Tea ### Le mini-concept J'ai imaginé **Astra Tea**, une marque à l'univers spatial : « Astra » signifie « étoiles » en latin. La nouvelle saveur, **Astra Neptuna**, associe la **myrtille** et la **fleur de sureau**. Le bleu de la myrtille fait le lien avec Neptune, la mystérieuse planète bleue. Le but serait, à l'avenir, d'avoir **un thé froid par planète**. Le public cible : les **jeunes adultes de 22 à 38 ans**, créatifs urbains et jeunes professionnels, qui recherchent des produits naturels et un beau design. Pour les toucher, j'ai misé sur **Instagram et TikTok** avec des micro-influenceurs suisses, et sur une distribution dans des **cafés indépendants et des espaces de coworking**. ![Mini-concept d'Astra Tea](https://didier.media/projects/swissskills/mini-concept.avif) ### Le logo Le logo combine **l'espace** et **la bouteille** : sa silhouette rappelle à la fois une fusée et une bouteille, avec un dégradé du cyan au violet. ![Logo Astra Tea](https://didier.media/projects/swissskills/logo.avif) ![Conception du logo : l'espace et la bouteille](https://didier.media/projects/swissskills/logo-conception.avif) Il est décliné en couleur et en monochrome, avec une version mini pour les petites tailles. J'ai aussi défini les typographies (Pirulen pour les titres, Lato pour le texte) et la palette de couleurs de la marque. ![Déclinaisons du logo](https://didier.media/projects/swissskills/logo-declinaisons.avif) ### L'étiquette Une étiquette de **50 x 100 mm** avec un fond spatial, une planète bleue, des myrtilles et des fleurs de sureau. Sur le côté : les ingrédients, la date de conservation et le code-barres. ![Étiquette Astra Neptuna, myrtille et fleur de sureau](https://didier.media/projects/swissskills/etiquette.avif) ### La photo produit Une fois l'étiquette imprimée et collée sur la bouteille, j'avais **10 minutes** dans un studio photo pour réaliser mes prises de vue. J'ai ensuite retouché l'image sur Photoshop pour qu'elle colle à l'univers de la marque. ![Photo produit de la bouteille Astra Neptuna](https://didier.media/projects/swissskills/photo-produit.avif) ### Le teaser vidéo C'est la tâche qui rapportait le plus de points. J'ai réalisé un **Reel vertical de 19 secondes** pour Instagram, qui peut aussi être diffusé sur les écrans des cafés partenaires : un voyage dans l'espace, la découverte d'un « thé mystérieux » devant Neptune, puis un appel à commander sur le site. ![Teaser vidéo Astra Neptuna](https://didier.media/projects/swissskills/teaser.mp4) **Outils utilisés :** - **InDesign** : mise en page du mini-concept - **Illustrator** : création du logo et de l'étiquette - **Photoshop** : retouche de la photo produit et des éléments de l'étiquette - **Gemini** : aide à la rédaction - **Nano Banana** : génération d'images - **Veo 3** : génération des séquences vidéo - **ElevenLabs** : voix off du teaser --- ## 🔍 Avec du recul Il y a eu un problème dans le projet rendu : j'ai fait une **faute d'orthographe** dans la vidéo, où j'ai écrit « Astra **The** » au lieu de « Astra **Tea** ». Comme je vous le disais dans ma présentation, l'orthographe n'est pas mon point fort ! Avec du recul, voici ce que j'aurais fait différemment : - **Ne pas faire la faute d'orthographe**, évidemment, en prenant le temps de relire chaque texte avant le rendu - **Revoir le design de l'étiquette** : la mettre à la verticale et utiliser la forme du logo pour le haut et le bas de l'étiquette, histoire d'avoir un rappel au logo et d'être plus original qu'un simple rectangle --- # 🌐 Projets web Des sites vitrines aux web apps, voici les projets web sur lesquels j'ai eu le plaisir de travailler, de la conception jusqu'à la mise en ligne. --- ## Foxes Basketball En 2024, j'ai repensé intégralement le site web du **Pully Lausanne Foxes**, le club de basket de la région du Grand-Lausanne et de Pully. Au total, environ **70 heures de travail** avec WordPress, Elementor, Astra et WooCommerce. L'ancien site avait vieilli : fond blanc, menu surchargé et peu de mise en valeur du club. L'objectif était de lui redonner une identité forte, à l'image de l'équipe. **Objectifs et réalisations :** - **Design moderne et intuitif** : interface sobre, couleurs harmonieuses aux tons bordeaux du club et animations légères - **Accessibilité multiplateforme** : site responsive, optimisé pour mobile, tablette et ordinateur - **Contenu interactif** : popups pour annoncer les prochains matchs et liens dynamiques vers les classements et les résultats - **Optimisation SEO** : meilleure visibilité sur les moteurs de recherche - **Intégration e-commerce** : mise en place d'une boutique en ligne complète, avec la gestion des produits et le paiement via Worldline ### Avant / après **Avant** : l'ancienne page d'accueil, avec son fond blanc et son menu à rallonge. ![Ancienne page d'accueil du site Foxes Basketball, avant la refonte](https://didier.media/projects/web/foxes-basketball/accueil-avant.avif) **Après** : la nouvelle page d'accueil, plus immersive, avec un menu épuré et un accès direct à la billetterie et à la boutique. ![Nouvelle page d'accueil du site Foxes Basketball, après la refonte](https://didier.media/projects/web/foxes-basketball/accueil-apres.avif) ### Quelques autres pages La page billetterie, pensée pour donner envie de rejoindre les rangs des fans : ![Page billetterie](https://didier.media/projects/web/foxes-basketball/billetterie.avif) Et la popup qui annonce le prochain match dès l'arrivée sur le site : ![Popup du prochain match](https://didier.media/projects/web/foxes-basketball/popup-prochain-match.avif) > « Notre collaboration avec Didier a été excellente, grâce à son écoute attentive et son professionnalisme. Il a su dépasser nos attentes avec un site moderne, dynamique et fidèle à notre image. Toujours disponible, même en cas d'urgence, il a assuré un suivi complet, de la création aux corrections post-lancement. » > > — **Jeremy Corpataux**\ > *Responsable communication & marketing digital, Club basket Pully-Lausanne* **Outils utilisés :** - **Photoshop** : retouche photos et intégration des mockups - **Elementor** : mise en page du site, gestion des popups et mise en page du responsive - **WooCommerce** : gestion des produits et intégration de Worldline pour le paiement Lien du site : [foxesbasketball.ch](https://foxesbasketball.ch) --- ## Portes ouvertes CPNV 2024 Dans le cadre des portes ouvertes du CPNV, j'ai réalisé le **site officiel** (en collaboration, avec WordPress et Bricks) et développé une **chasse au trésor sur le thème des pirates**. La chasse était composée de **5 énigmes réparties sur différents étages** de l'école. Les visiteurs les suivaient grâce à une **web app** que j'ai codée avec Cursor et Claude 3.5 : on scanne le QR code de chaque énigme, on répond aux questions et on avance jusqu'au trésor. J'y ai aussi intégré des outils analytiques (Google Analytics) pour suivre la participation. ![Web app de la chasse au trésor sur mobile : liste des énigmes, questions et étape Multimédia](https://didier.media/projects/web/portes-ouvertes-cpnv-2024/web-app-chasse-au-tresor.avif) > « Travailler avec Didier sur le projet Portes Ouvertes 2024 aux CPNV a été un réel plaisir. Il a créé un site remarquable avec un système de QR code innovant, tout en apportant des idées créatives et une grande efficacité. Sa détermination et sa capacité à résoudre les problèmes avec calme ont été clés dans la réussite du projet. » > > — **Charles Pickavance**\ > *Élèves médiamatique 3ème année, CPNV Ste-croix* **Outils utilisés :** - **Bricks** : mise en page du site web - **Cursor** : programmation de la web app - **HTML, CSS, JS** : langages de la web app - **Illustrator** : mise en page des énigmes à imprimer Lien du site : [po2024.mediamatique.ch](https://po2024.mediamatique.ch) --- ## Optimisation du site mediamatique.ch En binôme pour la junior entreprise, nous avons travaillé à améliorer la **rétention des visiteurs** sur le site [mediamatique.ch](https://mediamatique.ch). Le projet s'est articulé autour de deux axes : - **Des ajustements sur l'ensemble du site** : ajout de carrousels et d'explications plus détaillées pour mieux présenter la formation - **La création d'une vidéo banner de 1 min 30**, conçue pour illustrer le métier de médiamaticien et adaptée pour les réseaux sociaux ![Page d'accueil de mediamatique.ch](https://didier.media/projects/web/mediamatique/accueil.avif) ![Page du domaine Multimédia](https://didier.media/projects/web/mediamatique/page-multimedia.avif) **Outils utilisés :** - **Elementor** : page builder utilisé sur le site - **Appareil Canon** : capture photo et vidéo - **Lightroom** : retouche des photos et compression pour le web - **Premiere Pro** : montage vidéo Pour en savoir plus et voir la vidéo, rendez-vous directement sur [mediamatique.ch](https://mediamatique.ch). --- # 🖨️ Projets print Le print, c'est le domaine que je pratique le plus en dehors du CPNV. Affiches, flyers, livrets et grands formats : voici des supports conçus pour de vrais événements, imprimés et distribués. --- ## Cantonale FVJC 2024 — Givrins En 2024, j'ai eu le plaisir de contribuer bénévolement à l'organisation de la **Cantonale 2024 à Givrins** en créant ses supports visuels, imprimés à **18 500 exemplaires** au total : - **6 flyers** : pour promouvoir l'événement, recruter des bénévoles, présenter l'événement et expliquer le système cashless, ainsi que pour les soirées et activités du programme - **2 affiches** : la promotion de l'événement et la célébration du 1er août - **1 livret** intégrant une chasse au trésor immersive Ce projet m'a permis d'affiner mes compétences en design graphique en améliorant la lisibilité, les détails et l'efficacité de production. ### Les affiches L'affiche de la Cantonale et celle de la Fête nationale du 1er août, toutes deux dans les couleurs de l'événement : ![Affiches de la Fête nationale et de la Cantonale](https://didier.media/projects/print/cantonale-2024/affiches.avif) ### Les flyers Le flyer de présentation, avec le programme des concerts, animations et sports : ![Flyer de présentation de l'événement](https://didier.media/projects/print/cantonale-2024/flyer-presentation.avif) Le flyer de recherche de bénévoles : ![Flyer de recherche de bénévoles](https://didier.media/projects/print/cantonale-2024/flyer-benevoles.avif) Le système cashless expliqué étape par étape, de la recharge du bracelet jusqu'au remboursement : ![Flyers expliquant le système cashless](https://didier.media/projects/print/cantonale-2024/flyer-cashless.avif) Et les flyers des événements du programme : le Dinner Dance, la Dôle Trail Patrol et la Schlager Evening. ![Flyer du Dinner Dance](https://didier.media/projects/print/cantonale-2024/flyer-dinner-dance.avif) ![Flyer de la Dôle Trail Patrol](https://didier.media/projects/print/cantonale-2024/flyer-dole-trail-patrol.avif) ![Flyer de la Schlager Evening](https://didier.media/projects/print/cantonale-2024/flyer-schlager-evening.avif) ### Le livret « Les secrets de la Cantonale », un livret qui embarque les visiteurs dans une chasse au trésor à travers la fête : ![Livret « Les secrets de la Cantonale » avec la chasse au trésor](https://didier.media/projects/print/cantonale-2024/livret-chasse-au-tresor.avif) > « Ce fut un véritable plaisir de collaborer avec Didier sur la Cantonale FVJC 2024. Créatif, flexible et toujours professionnel, il a su apporter des solutions pertinentes à chaque étape. Son travail a grandement enrichi nos visuels ! » > > — **Daniel Turin**\ > *Responsable communication & médias, Cantonale 2024* **Outils utilisés :** - **Photoshop** : retouche photos et intégration des mockups - **InDesign** : mise en page du livret - **Illustrator** : création des affiches, des flyers et des illustrations --- ## RetroMania Début 2024, j'ai participé à un concours pour la convention **RetroMania** : il a fallu concevoir **5 supports visuels** (affiche promotionnelle, bâche, affiche, poster et roll-up). Un gagnant a été sélectionné par support, sur **50 participants**. J'ai opté pour un **style pop art aux couleurs vives** pour créer un effet tape-à-l'œil et renforcer l'esprit rétro de l'événement. Des références comme Goldorak, Yoshi et la réinterprétation de l'affiche du premier Doom illustrent mon approche rétro des visuels. ### Le design sélectionné J'ai le plaisir de vous annoncer que j'ai été le **grand gagnant pour le roll-up** : mon visuel a donc été imprimé et utilisé au sein de la convention. ![Roll-up « App mobile », le visuel gagnant](https://didier.media/projects/print/retromania/rollup-app-mobile.avif) ### Les autres supports L'affiche de la convention : ![Affiche de la convention](https://didier.media/projects/print/retromania/affiche-convention.avif) Le poster, une réinterprétation de l'affiche du premier Doom : ![Poster inspiré de l'affiche du premier Doom](https://didier.media/projects/print/retromania/poster-doom.avif) Et la bâche pour les stands Information et Boutique : ![Bâche « Information / Boutique »](https://didier.media/projects/print/retromania/bache-information-boutique.avif) > « Le comité de l'association RetroMania a sélectionné la réalisation de Didier parmi 50 propositions pour la qualité du rendu final et la mise en page soignée. Son respect des consignes, l'harmonie des couleurs et l'attention portée aux détails ont été particulièrement appréciés. Il a également su réaliser les retouches demandées dans des délais très courts. » > > — **Yvan Haeni**\ > *Co-fondateur de RetroMania & prof marketing au CPNV* **Outils utilisés :** - **Photoshop** : retouche photos et intégration des mockups - **Illustrator** : création des éléments visuels et mise en page de la bâche - **InDesign** : mise en page de l'affiche, du poster et du roll-up --- # 🛰️ Comment fonctionne cet univers Bienvenue ! Vous l'avez sans doute remarqué : ce portfolio n'est pas un site classique. Au lieu de faire défiler des pages, vous pilotez un vaisseau et vous partez explorer un petit univers en 3D. Je vous explique ici pourquoi je l'ai construit ainsi, et comment il fonctionne, même si vous n'y connaissez rien en informatique. --- ## 🎯 Le but de ce projet Un portfolio sert à présenter mon parcours et mes réalisations. J'aurais pu me contenter d'une page avec du texte et des images, mais je voulais que **le site lui-même soit une démonstration** de ce que je sais faire. Ce projet m'a permis de réunir tout ce qui me passionne dans le métier de médiamaticien : - **Le design** : les couleurs, les polices, les animations et l'ambiance générale - **Le développement web** : tout ce qui se passe « sous le capot » pour que le site fonctionne - **La 3D** : le vaisseau, les planètes et l'espace qui les entoure - **L'expérience utilisateur** : faire en sorte que tout reste simple à prendre en main, sur ordinateur comme sur téléphone L'idée est simple : plutôt que de vous dire que je sais créer des expériences web originales, je préfère vous en faire vivre une. --- ## 🌌 Un petit jeu vidéo dans votre navigateur Tout ce que vous voyez est dessiné en direct par votre navigateur, environ **60 fois par seconde**, un peu comme les images d'un dessin animé qui défilent très vite. Pour cela, j'utilise **Three.js**, un outil qui transforme le navigateur en véritable moteur de jeu vidéo. - **Les planètes** sont des sphères que j'ai volontairement « cabossées » pour leur donner ce style facetté, appelé **low-poly** : peu de faces, des angles bien visibles, un rendu épuré. - **Le vaisseau** réagit à une petite physique : il accélère, il freine, il s'incline dans les virages et ses réacteurs crachent des flammes qui suivent vos mouvements. - **Le décor** bouge lui aussi : le réseau de triangles au sol s'écarte au passage du vaisseau, et des traînées apparaissent quand vous accélérez. Les étoiles et les traînées sont calculées pour n'afficher que ce qui est réellement visible à l'écran. C'est ce qui permet au site de rester fluide, même sur un ordinateur modeste. --- ## 🧩 Un assemblage de blocs « Lego » Pour construire le site, j'utilise **React**. Imaginez que chaque élément (le vaisseau, une planète, la minimap, les fenêtres qui s'ouvrent) est un bloc de Lego. Je crée chaque bloc séparément, puis je les assemble pour former l'univers complet. L'avantage, c'est que tout reste bien rangé : pour ajouter une nouvelle planète, il me suffit de « poser un bloc » de plus, sans avoir à reconstruire le reste. --- ## 📝 Le contenu des planètes Le texte que vous lisez en ce moment provient d'un simple fichier texte, écrit dans un format appelé **Markdown**. - C'est un peu comme un document Word, en beaucoup plus simple : quelques symboles suffisent pour faire un titre, une liste ou insérer une image. - Le contenu est séparé du « moteur » 3D. Je peux donc modifier un texte ou ajouter un projet sans toucher au reste du site. - Les images sont enregistrées dans un format moderne (**AVIF**), souvent des dizaines de fois plus léger que les fichiers d'origine, pour qu'elles s'affichent rapidement même avec une connexion lente. --- ## 🌍 Un site qui parle deux langues Le site existe en **français** et en **anglais**. Au premier passage, il choisit automatiquement la langue de votre navigateur, puis il se souvient de votre choix. Vous pouvez en changer à tout moment en visitant la planète **Langue** ou depuis les paramètres, en haut à droite. --- ## 🎧 Le son La musique, le bruit des réacteurs et les petits sons des boutons sont gérés directement par le navigateur. Le grondement du vaisseau, par exemple, n'est pas un simple enregistrement : il monte dans les aigus et s'intensifie avec la vitesse, en temps réel. Pour ne pas vous déranger, la musique baisse quand vous lisez le contenu d'une planète, et tout se coupe automatiquement quand vous changez d'onglet. Vous pouvez aussi couper le son depuis les paramètres. --- ## 🔍 Quelques secrets Cet univers cache aussi quelques surprises pour les plus curieux. Ouvrez l'œil en lisant le contenu des planètes… je n'en dis pas plus ! --- ## 🚀 Et ensuite ? Ce projet est en constante évolution. Je prévois notamment d'ajouter de nouveaux projets au fil de mes réalisations, et un mini-jeu se prépare déjà en coulisses. *Merci d'explorer cet univers avec moi !* --- # ⚖️ Conditions générales d'utilisation *Dernière mise à jour : 14 octobre 2026* En naviguant sur ce site, vous acceptez les conditions ci-dessous. Elles expliquent aussi, en toute transparence, quelles données sont collectées et pourquoi. --- ## 👤 Éditeur du site Ce site est le portfolio personnel de **Didier Blessemaille**, médiamaticien CFC en Suisse. Il n'a aucun but commercial. Pour toute question, vous pouvez me joindre depuis la planète **Contact** ou sur [LinkedIn](https://www.linkedin.com/in/didier-blessemaille/). --- ## 🖥️ Hébergement Le site est hébergé par **Hostinger International Ltd.** ([hostinger.com](https://www.hostinger.com)). --- ## 🎨 Propriété intellectuelle Les textes, visuels, modèles 3D et le code de ce site sont ma création, sauf mention contraire. Vous ne pouvez pas les reproduire ou les réutiliser sans mon accord. Les projets réalisés pour des clients ou des associations sont présentés à titre de références. Leurs noms, marques et logos appartiennent à leurs propriétaires respectifs. --- ## 🔒 Protection des données Je respecte la **loi fédérale sur la protection des données (nLPD)** et, pour les visiteurs de l'Union européenne, le **RGPD**. ### Aucun cookie Ce site **n'utilise aucun cookie**, ni pour la publicité, ni pour le suivi. C'est pourquoi aucune bannière ne vous demande votre accord. ### Mesure d'audience Pour savoir quelles planètes intéressent le plus, j'utilise [Umami](https://umami.is), un outil de statistiques **anonyme et sans cookies**. Il compte les visites, les planètes ouvertes, le pays, le type d'appareil, le navigateur et le site d'où vous venez. - Votre adresse IP **n'est jamais enregistrée**. - Il est **impossible de vous identifier** ou de vous suivre d'un site à l'autre. - Si votre navigateur envoie le signal **« Ne pas me suivre »** (Do Not Track), vous n'êtes pas compté du tout. ### Formulaire de contact Quand vous m'écrivez, votre prénom, votre nom, votre adresse e-mail et votre message me sont transmis par e-mail via le service [Web3Forms](https://web3forms.com). Je les utilise **uniquement pour vous répondre**. Ils ne sont jamais revendus ni partagés. ### Stockage dans votre navigateur Le site retient votre **langue**, le fait d'avoir déjà vu le **tutoriel** et votre progression dans la **quête**. Ces informations restent sur votre appareil, ne me sont jamais envoyées et peuvent être effacées depuis les réglages de votre navigateur. Les polices d'écriture sont hébergées directement sur ce site : aucune donnée n'est envoyée à Google. ### Vos droits Vous pouvez à tout moment me demander quelles données je possède sur vous, les faire corriger ou les faire supprimer. Il suffit de m'écrire depuis la planète **Contact**. --- ## 🔗 Liens externes Ce site contient des liens vers d'autres sites, comme LinkedIn. Je ne suis pas responsable de leur contenu ni de leur façon de traiter vos données. --- ## 📜 Droit applicable Ces conditions sont soumises au **droit suisse**. Elles peuvent évoluer : la date de mise à jour en haut de cette page indique la dernière version. --- This site is an interactive 3D experience: you fly a ship between planets, each opening a page. Here is all of its content as text. Contact: form on the site (Contact planet) or LinkedIn https://www.linkedin.com/in/didier-blessemaille/ --- # 🚀 Didier Blessemaille My name is Didier Blessemaille, I'm **22 years old** and I've been a **certified mediamatician (CFC)** since 2026. I'm passionate about my trade, and I especially love how versatile it is: every project is a chance to learn something new. My biggest achievement: finishing **7th in Switzerland** and **1st in French-speaking Switzerland** in mediamatics at **SwissSkills 2025** 🏆 A more complete planet is dedicated to this topic: explore the universe to find out more! --- ## 💼 What I love about my job - **Design**: creating impactful visuals, from print to web - **Code**: bringing my ideas to life, like this 3D portfolio - **Data analysis**: studying the numbers and analysing how the audience reacts to a project - **Working with clients**: I enjoy spending time with them, whether to present a project or to sell future ones --- ## 🧭 My personality I'm **sociable**, I fit in easily, and I'm **very curious**. I love **challenges** and discovering new things. I actually like being put under pressure to deliver a project. And to be honest, I have my weak spots too: - I'm **very bad at spelling and grammar**. Luckily, AI is there to correct me! I also use tools like Reverso to quickly fix my mistakes. - I'm **less of a fan of photography and long videos**. --- ## 🤖 Passionate about new technologies I'm passionate about new technologies, and especially about **artificial intelligence**. I keep up with the latest news and always try things out to see how they evolve. This website is the best example: it's already in its **3rd version**. I started this project in early summer 2025, and it's since the end of summer 2026 that AI has really become good enough to build this kind of project simply. --- ## 🛰️ Outside of work - **Space**: some people watch football matches, I watch rocket launches! - **Climbing**: the sport I practise in my free time. --- ## 🎖️ Right now I'm currently doing my **long military service**, until **the end of April 2027**. --- # 🏆 SwissSkills 2025 SwissSkills 2025 is my biggest achievement so far. Here's what these championships are about and the project I created during the competition. --- ## What is SwissSkills? **SwissSkills** are the **Swiss national championships for vocational skills**. From **17 to 21 September 2025**, around **1,100 young professionals** from all over Switzerland competed in **Bern** in **90 championships**, in front of some **120,000 expected visitors**. To take part, you first have to get through the selections of your professional association. For mediamatics, the championship is organised by **ICT-Vocational Education and Training Switzerland**. In the selections, I had finished **15th in Switzerland** and **3rd in French-speaking Switzerland**, which also shows how much I progressed up to the final. --- ## 🥇 My result I'm happy to announce that I finished **7th in Switzerland** and **1st in French-speaking Switzerland** in mediamatics! --- ## The challenge: launching an iced tea brand For the competition, we played the role of a creative team working for a **local startup making natural iced teas**. The company already produces two flavours, peach and lemon, but doesn't have a name yet. Our mission: bring the brand to life and launch its **third flavour**. The competition was made up of **5 tasks**, each with a time limit: - **Mini-concept**: new flavour, brand name, target audience and marketing concept (90 min) - **Logo**: usable in print and on the web, and readable even at small sizes (60 min) - **Label**: in a 50 x 100 mm format (60 min) - **Product photo**: studio shoot and retouching (60 min) - **Video teaser**: 10 to 20 seconds long (120 min) Using AI was allowed, and as you can guess, I made the most of it! --- ## My project: Astra Tea ### The mini-concept I came up with **Astra Tea**, a space-themed brand: "Astra" means "stars" in Latin. The new flavour, **Astra Neptuna**, combines **blueberry** and **elderflower**. The blue of the blueberry links it to Neptune, the mysterious blue planet. The goal would be, in the future, to have **one iced tea per planet**. The target audience: **young adults aged 22 to 38**, urban creatives and young professionals looking for natural products and great design. To reach them, I bet on **Instagram and TikTok** with Swiss micro-influencers, and on distribution in **independent cafés and co-working spaces**. ![Astra Tea mini-concept](https://didier.media/projects/swissskills/mini-concept.avif) ### The logo The logo combines **space** and **the bottle**: its silhouette is reminiscent of both a rocket and a bottle, with a gradient from cyan to purple. ![Astra Tea logo](https://didier.media/projects/swissskills/logo.avif) ![Logo design: space and the bottle](https://didier.media/projects/swissskills/logo-conception.avif) It comes in colour and monochrome versions, with a mini version for small sizes. I also defined the brand's typefaces (Pirulen for headings, Lato for body text) and its colour palette. ![Logo variations](https://didier.media/projects/swissskills/logo-declinaisons.avif) ### The label A **50 x 100 mm** label with a space background, a blue planet, blueberries and elderflowers. On the side: the ingredients, the best-before date and the barcode. ![Astra Neptuna label, blueberry and elderflower](https://didier.media/projects/swissskills/etiquette.avif) ### The product photo Once the label was printed and stuck on the bottle, I had **10 minutes** in a photo studio to take my shots. I then retouched the image in Photoshop to match the brand's universe. ![Product photo of the Astra Neptuna bottle](https://didier.media/projects/swissskills/photo-produit.avif) ### The video teaser This was the task worth the most points. I made a **19-second vertical Reel** for Instagram, which can also be shown on screens in partner cafés: a journey through space, the discovery of a "mysterious tea" in front of Neptune, then a call to order on the website. ![Astra Neptuna video teaser](https://didier.media/projects/swissskills/teaser.mp4) **Tools used:** - **InDesign**: mini-concept layout - **Illustrator**: logo and label design - **Photoshop**: product photo retouching and label elements - **Gemini**: writing assistance - **Nano Banana**: image generation - **Veo 3**: video footage generation - **ElevenLabs**: teaser voice-over --- ## 🔍 Looking back There was a problem in the project I handed in: I made a **spelling mistake** in the video, writing "Astra **The**" instead of "Astra **Tea**". As I mentioned in my introduction, spelling isn't my strong point! Looking back, here's what I would have done differently: - **Not make the spelling mistake**, obviously, by taking the time to proofread every text before handing it in - **Rethink the label design**: make it vertical and use the shape of the logo for the top and bottom of the label, so it echoes the logo and is more original than a simple rectangle --- # 🌐 Web projects From showcase websites to web apps, here are the web projects I had the pleasure of working on, from design all the way to launch. --- ## Foxes Basketball In 2024, I completely redesigned the website of the **Pully Lausanne Foxes**, the basketball club of the Greater Lausanne and Pully area. In total, about **70 hours of work** with WordPress, Elementor, Astra and WooCommerce. The old website had aged: white background, an overloaded menu and little to showcase the club. The goal was to give it a strong identity again, true to the team. **Goals and achievements:** - **Modern, intuitive design**: clean interface, harmonious colours in the club's burgundy tones and subtle animations - **Cross-platform accessibility**: responsive website, optimised for mobile, tablet and desktop - **Interactive content**: popups announcing the upcoming games and live links to standings and results - **SEO optimisation**: better visibility on search engines - **E-commerce integration**: a complete online shop, with product management and Worldline payments ### Before / after **Before**: the old home page, with its white background and endless menu. ![Old home page of the Foxes Basketball website, before the redesign](https://didier.media/projects/web/foxes-basketball/accueil-avant.avif) **After**: the new home page, more immersive, with a clean menu and direct access to ticketing and the shop. ![New home page of the Foxes Basketball website, after the redesign](https://didier.media/projects/web/foxes-basketball/accueil-apres.avif) ### A few other pages The ticketing page, designed to make you want to join the fans: ![Ticketing page](https://didier.media/projects/web/foxes-basketball/billetterie.avif) And the popup announcing the next game as soon as you land on the site: ![Next game popup](https://didier.media/projects/web/foxes-basketball/popup-prochain-match.avif) > "Our collaboration with Didier was excellent, thanks to his attentive listening and professionalism. He exceeded our expectations with a modern, dynamic website true to our image. Always available, even in emergencies, he provided full follow-up, from creation to post-launch fixes." > > — **Jeremy Corpataux**\ > *Communication & digital marketing manager, Pully-Lausanne basketball club* **Tools used:** - **Photoshop**: photo retouching and mockup integration - **Elementor**: site layout, popup management and responsive layout - **WooCommerce**: product management and Worldline payment integration Website: [foxesbasketball.ch](https://foxesbasketball.ch) --- ## CPNV Open Days 2024 For the CPNV open days, I built the **official website** (as a team, with WordPress and Bricks) and developed a **pirate-themed treasure hunt**. The hunt had **5 riddles spread over several floors** of the school. Visitors followed them with a **web app** I coded with Cursor and Claude 3.5: scan each riddle's QR code, answer the questions and move on to the treasure. I also added analytics tools (Google Analytics) to track participation. ![The treasure hunt web app on mobile: riddle list, questions and the Multimedia step](https://didier.media/projects/web/portes-ouvertes-cpnv-2024/web-app-chasse-au-tresor.avif) > "Working with Didier on the Open Days 2024 project at CPNV was a real pleasure. He created a remarkable website with an innovative QR code system, while bringing creative ideas and great efficiency. His determination and his ability to solve problems calmly were key to the project's success." > > — **Charles Pickavance**\ > *3rd-year mediamatics student, CPNV Sainte-Croix* **Tools used:** - **Bricks**: website layout - **Cursor**: programming the web app - **HTML, CSS, JS**: languages of the web app - **Illustrator**: layout of the printed riddles Website: [po2024.mediamatique.ch](https://po2024.mediamatique.ch) --- ## Improving mediamatique.ch As a pair for the junior company, we worked on improving **visitor retention** on [mediamatique.ch](https://mediamatique.ch). The project focused on two areas: - **Adjustments across the whole site**: carousels and more detailed explanations to better present the training - **A 90-second banner video**, designed to illustrate the mediamatics trade and adapted for social media ![mediamatique.ch home page](https://didier.media/projects/web/mediamatique/accueil.avif) ![Multimedia page](https://didier.media/projects/web/mediamatique/page-multimedia.avif) **Tools used:** - **Elementor**: page builder used on the site - **Canon camera**: photo and video capture - **Lightroom**: photo retouching and compression for the web - **Premiere Pro**: video editing To find out more and watch the video, head straight to [mediamatique.ch](https://mediamatique.ch). --- # 🖨️ Print projects Print is the field I practise the most outside of CPNV. Posters, flyers, booklets and large formats: here are materials designed for real events, printed and handed out. --- ## FVJC Cantonale 2024 — Givrins In 2024, I had the pleasure of contributing as a volunteer to the organisation of the **2024 Cantonale in Givrins** by creating its visual materials, printed in **18,500 copies** in total: - **6 flyers**: to promote the event, recruit volunteers, present the event and explain the cashless system, as well as for the evenings and activities of the programme - **2 posters**: event promotion and the August 1st celebration - **1 booklet** featuring an immersive treasure hunt This project helped me refine my graphic design skills by improving readability, details and production efficiency. ### The posters The Cantonale poster and the National Day poster for August 1st, both in the event's colours: ![National Day and Cantonale posters](https://didier.media/projects/print/cantonale-2024/affiches.avif) ### The flyers The presentation flyer, with the programme of concerts, activities and sports: ![Event presentation flyer](https://didier.media/projects/print/cantonale-2024/flyer-presentation.avif) The volunteer recruitment flyer: ![Volunteer recruitment flyer](https://didier.media/projects/print/cantonale-2024/flyer-benevoles.avif) The cashless system explained step by step, from topping up the wristband to getting a refund: ![Flyers explaining the cashless system](https://didier.media/projects/print/cantonale-2024/flyer-cashless.avif) And the flyers for the programme's events: the Dinner Dance, the Dôle Trail Patrol and the Schlager Evening. ![Dinner Dance flyer](https://didier.media/projects/print/cantonale-2024/flyer-dinner-dance.avif) ![Dôle Trail Patrol flyer](https://didier.media/projects/print/cantonale-2024/flyer-dole-trail-patrol.avif) ![Schlager Evening flyer](https://didier.media/projects/print/cantonale-2024/flyer-schlager-evening.avif) ### The booklet "The secrets of the Cantonale", a booklet that takes visitors on a treasure hunt across the festival: !["The secrets of the Cantonale" booklet with the treasure hunt](https://didier.media/projects/print/cantonale-2024/livret-chasse-au-tresor.avif) > "It was a real pleasure to work with Didier on the FVJC Cantonale 2024. Creative, flexible and always professional, he brought relevant solutions at every step. His work greatly enriched our visuals!" > > — **Daniel Turin**\ > *Communication & media manager, Cantonale 2024* **Tools used:** - **Photoshop**: photo retouching and mockup integration - **InDesign**: booklet layout - **Illustrator**: posters, flyers and illustrations --- ## RetroMania In early 2024, I entered a contest for the **RetroMania** convention: we had to design **5 visual materials** (promotional poster, banner, poster, print and roll-up). One winner was selected per item, out of **50 participants**. I went for a **bright pop-art style** to create an eye-catching effect and reinforce the retro spirit of the event. References like Grendizer, Yoshi and a reinterpretation of the original Doom poster illustrate my retro approach to the visuals. ### The selected design I'm happy to announce that I was the **overall winner for the roll-up**: my design was printed and used at the convention. !["Mobile app" roll-up, the winning design](https://didier.media/projects/print/retromania/rollup-app-mobile.avif) ### The other materials The convention poster: ![Convention poster](https://didier.media/projects/print/retromania/affiche-convention.avif) The print, a reinterpretation of the original Doom poster: ![Poster inspired by the original Doom artwork](https://didier.media/projects/print/retromania/poster-doom.avif) And the banner for the Information and Shop stands: !["Information / Shop" banner](https://didier.media/projects/print/retromania/bache-information-boutique.avif) > "The committee of the RetroMania association selected Didier's work among 50 entries for the quality of the final result and the careful layout. His respect for the guidelines, the harmony of the colours and his attention to detail were particularly appreciated. He also managed to make the requested changes within very short deadlines." > > — **Yvan Haeni**\ > *Co-founder of RetroMania & marketing teacher at CPNV* **Tools used:** - **Photoshop**: photo retouching and mockup integration - **Illustrator**: visual elements and banner layout - **InDesign**: layout of the poster, print and roll-up --- # 🛰️ How this universe works Welcome! As you have probably noticed, this portfolio is not a typical website. Instead of scrolling through pages, you pilot a spaceship and explore a small 3D universe. Here I explain why I built it this way and how it works, even if you know nothing about computers. --- ## 🎯 The goal of this project A portfolio is meant to present my background and my work. I could have settled for a page with text and pictures, but I wanted **the website itself to be a demonstration** of what I can do. This project allowed me to bring together everything I love about the mediamatics trade: - **Design**: the colours, fonts, animations and overall atmosphere - **Web development**: everything happening "under the hood" to make the site work - **3D**: the spaceship, the planets and the space around them - **User experience**: keeping everything easy to use, on a computer as well as on a phone The idea is simple: rather than telling you I can create original web experiences, I would rather let you live one. --- ## 🌌 A small video game in your browser Everything you see is drawn live by your browser, about **60 times per second**, a bit like the frames of a cartoon flashing by very quickly. To do this, I use **Three.js**, a tool that turns the browser into a real video game engine. - **The planets** are spheres I deliberately "dented" to give them this faceted style, called **low-poly**: few faces, clearly visible angles, a clean look. - **The spaceship** follows a little bit of physics: it accelerates, brakes, leans into turns, and its engines spit out flames that follow your movements. - **The scenery** moves too: the network of triangles on the floor parts as the spaceship passes, and streaks appear when you speed up. The stars and streaks are computed so that only what is actually visible on screen is displayed. That is what keeps the site smooth, even on a modest computer. --- ## 🧩 A set of "Lego" blocks To build the site, I use **React**. Imagine that every element (the spaceship, a planet, the minimap, the windows that open) is a Lego block. I create each block separately, then put them together to form the whole universe. The advantage is that everything stays tidy: to add a new planet, I just "place one more block", without having to rebuild the rest. --- ## 📝 The content of the planets The text you are reading right now comes from a simple text file, written in a format called **Markdown**. - It is a bit like a Word document, only much simpler: a few symbols are enough to create a heading, a list or insert an image. - The content is separate from the 3D "engine". So I can change a text or add a project without touching the rest of the site. - Images are saved in a modern format (**AVIF**), often dozens of times lighter than the original files, so they show up quickly even on a slow connection. --- ## 🌍 A website that speaks two languages The site exists in **French** and **English**. On your first visit, it automatically picks your browser's language, then remembers your choice. You can switch at any time by visiting the **Language** planet or from the settings, at the top right. --- ## 🎧 Sound The music, the engine noise and the little button sounds are all handled directly by the browser. The rumble of the spaceship, for example, is not just a recording: it rises in pitch and grows louder with speed, in real time. So as not to disturb you, the music gets quieter while you read a planet's content, and everything mutes automatically when you switch tabs. You can also turn the sound off from the settings. --- ## 🔍 A few secrets This universe also hides a few surprises for the most curious. Keep your eyes open while reading the planets' content… I won't say more! --- ## 🚀 What's next? This project is constantly evolving. I plan to add new projects as I complete them, and a mini-game is already in the works behind the scenes. *Thanks for exploring this universe with me!* --- # ⚖️ Terms of use *Last updated: October 14, 2026* By browsing this site, you accept the terms below. They also explain, openly, which data is collected and why. --- ## 👤 Site owner This site is the personal portfolio of **Didier Blessemaille**, a Swiss-certified mediamatician (CFC). It has no commercial purpose. For any question, you can reach me from the **Contact** planet or on [LinkedIn](https://www.linkedin.com/in/didier-blessemaille/). --- ## 🖥️ Hosting The site is hosted by **Hostinger International Ltd.** ([hostinger.com](https://www.hostinger.com)). --- ## 🎨 Intellectual property The texts, visuals, 3D models and code of this site are my own work, unless stated otherwise. You may not copy or reuse them without my permission. Projects made for clients or associations are shown as references. Their names, trademarks and logos belong to their respective owners. --- ## 🔒 Data protection I comply with the **Swiss Federal Act on Data Protection (nFADP)** and, for visitors from the European Union, the **GDPR**. ### No cookies This site **uses no cookies**, neither for advertising nor for tracking. That is why no banner asks for your consent. ### Audience measurement To know which planets interest visitors most, I use [Umami](https://umami.is), an **anonymous, cookieless** analytics tool. It counts visits, opened planets, country, device type, browser and the site you came from. - Your IP address is **never stored**. - It is **impossible to identify you** or to follow you from one site to another. - If your browser sends the **Do Not Track** signal, you are not counted at all. ### Contact form When you write to me, your first name, last name, email address and message are sent to me by email through the [Web3Forms](https://web3forms.com) service. I use them **only to reply to you**. They are never sold or shared. ### Storage in your browser The site remembers your **language**, whether you have already seen the **tutorial**, and your progress in the **quest**. This information stays on your device, is never sent to me, and can be cleared from your browser settings. The fonts are hosted directly on this site: no data is sent to Google. ### Your rights You can ask me at any time which data I hold about you, have it corrected or have it deleted. Just write to me from the **Contact** planet. --- ## 🔗 External links This site links to other sites, such as LinkedIn. I am not responsible for their content or for how they handle your data. --- ## 📜 Governing law These terms are governed by **Swiss law**. They may change: the date at the top of this page shows the latest version.