L\u2019id\u00e9e de d\u00e9part \u00e9tait assez simple, je voulais enfin cr\u00e9er un site qui regroupe un peu tout ce que je fais, mes formations, mes vid\u00e9os YouTube, mes exp\u00e9rimentations autour de Blender, de l\u2019intelligence artificielle, du design, du vibe coding, et aussi les petites applications et les jeux vid\u00e9o que j\u2019ai pu cr\u00e9er au fil de mes cours ou simplement pour tester des id\u00e9es.<\/p>\n
Le but n\u2019\u00e9tait pas vraiment de v\u00e9rifier s\u2019il \u00e9tait possible de cr\u00e9er un site avec une IA. Cela fait d\u00e9j\u00e0 au moins deux ans que je sais que c\u2019est possible, et on a maintenant suffisamment d\u2019exemples pour ne plus vraiment se poser la question. Ce qui m\u2019int\u00e9ressait surtout, c\u2019\u00e9tait de voir \u00e0 quelle vitesse j\u2019allais pouvoir le faire, \u00e0 quel point le processus serait fluide, et surtout jusqu\u2019o\u00f9 j\u2019allais pouvoir pousser mes id\u00e9es sans avoir les comp\u00e9tences techniques d\u2019un d\u00e9veloppeur web.<\/p>\n
Je savais que Codex allait pouvoir me g\u00e9n\u00e9rer des pages, organiser le contenu et produire quelque chose de fonctionnel. En revanche, je pensais que j\u2019allais passer beaucoup plus de temps \u00e0 lui faire comprendre ce que je voulais, notamment sur les aspects graphiques, les animations, les transitions ou certains d\u00e9tails un peu plus sp\u00e9cifiques \u00e0 la direction artistique que j\u2019avais en t\u00eate.<\/p>\n
Au final, c\u2019est probablement ce qui m\u2019a le plus surpris, pas le fait que Codex sache cr\u00e9er le site, mais la facilit\u00e9 avec laquelle j\u2019ai pu le construire avec lui.<\/p>\n
Je suis habitu\u00e9 \u00e0 travailler sur le design, l\u2019image, la composition, la 3D ou la direction artistique, mais je ne suis pas d\u00e9veloppeur web. Je peux avoir une id\u00e9e assez pr\u00e9cise de ce que je veux voir \u00e0 l\u2019\u00e9cran, sans forc\u00e9ment savoir comment la traduire proprement en HTML, en CSS ou en JavaScript.<\/p>\n
Avec Codex, cette partie technique est presque devenue secondaire.<\/p>\n
Je pouvais lui expliquer ce que je voulais avec mes mots, lui demander de modifier la taille d\u2019un \u00e9l\u00e9ment, de rendre une animation plus fluide, de d\u00e9placer une section, de changer la mani\u00e8re dont une page apparaissait ou simplement de retravailler un d\u00e9tail parce que visuellement, quelque chose ne me convenait pas.<\/p>\n
Certaines demandes \u00e9taient pr\u00e9cises, d\u2019autres beaucoup moins, et pourtant il arrivait g\u00e9n\u00e9ralement \u00e0 comprendre la direction que je voulais prendre. Quand le r\u00e9sultat n\u2019\u00e9tait pas tout \u00e0 fait bon, je lui demandais de reprendre, de simplifier ou d\u2019aller dans une autre direction, et on avan\u00e7ait comme \u00e7a, progressivement.<\/p>\n
C\u2019est assez difficile \u00e0 r\u00e9sumer en disant simplement que l\u2019IA g\u00e9n\u00e8re du code, parce que dans la pratique, j\u2019avais beaucoup plus l\u2019impression de travailler avec quelqu\u2019un \u00e0 qui j\u2019expliquais mes id\u00e9es qu\u2019avec un outil auquel je demandais des lignes de programmation.<\/p>\n
Le site s\u2019est construit tr\u00e8s rapidement, avec une page d\u2019accueil, diff\u00e9rentes pages pour les formations, les vid\u00e9os, les applications, les jeux vid\u00e9o, le blog et les autres \u00e9l\u00e9ments que je voulais pr\u00e9senter.<\/p>\n
Je pensais honn\u00eatement que certains d\u00e9tails allaient me demander plusieurs heures, ou que j\u2019allais devoir abandonner certaines id\u00e9es parce qu\u2019elles seraient trop compliqu\u00e9es \u00e0 mettre en place. En r\u00e9alit\u00e9, la plupart ont \u00e9t\u00e9 int\u00e9gr\u00e9es assez facilement.<\/p>\n
Le site complet a donc \u00e9t\u00e9 cr\u00e9\u00e9 en quelques heures \u00e0 peine, ce qui \u00e9tait nettement plus rapide que ce que j\u2019avais imagin\u00e9 au d\u00e9part.<\/p>\n
Il y a quand m\u00eame eu une partie un peu moins fluide, la connexion avec l\u2019h\u00e9bergement.<\/p>\n
J\u2019utilise OVH, et il a fallu retrouver les bonnes informations, comprendre quels acc\u00e8s utiliser, v\u00e9rifier les param\u00e8tres, connecter le d\u00e9p\u00f4t GitHub et faire en sorte que l\u2019ensemble communique correctement.<\/p>\n
Cela m\u2019a pris environ une heure, avec quelques essais, quelques erreurs et ce moment assez classique o\u00f9 l\u2019on se demande si le probl\u00e8me vient de l\u2019identifiant, du mot de passe, du serveur, du port ou simplement du fait qu\u2019on n\u2019est pas dans le bon menu.<\/p>\n
Codex m\u2019a n\u00e9anmoins guid\u00e9 pendant toute cette \u00e9tape. Il m\u2019indiquait les informations dont il avait besoin, o\u00f9 j\u2019\u00e9tais susceptible de les trouver dans l\u2019interface OVH et comment les utiliser.<\/p>\n
Une fois cette configuration termin\u00e9e, tout est devenu \u00e9tonnamment simple.<\/p>\n
Codex a pu prendre en charge la mise en ligne, puis les mises \u00e0 jour suivantes. Depuis, lorsque je modifie une page, ajoute un contenu ou corrige un d\u00e9tail, il peut envoyer directement la nouvelle version du site en ligne.<\/p>\n
C\u2019est certainement la partie qui m\u2019a le plus bluff\u00e9.<\/p>\n
Apr\u00e8s la petite heure n\u00e9cessaire pour r\u00e9gler les acc\u00e8s avec OVH, la gestion du d\u00e9ploiement est devenue compl\u00e8tement transparente. Il n\u2019y a pas eu de bugs particuliers, pas d\u2019erreurs \u00e0 chaque mise \u00e0 jour, pas de proc\u00e9dure compliqu\u00e9e \u00e0 recommencer, tout est rapide, fluide et fonctionne simplement.<\/p>\n
C\u2019est \u00e0 ce moment-l\u00e0 que je me suis r\u00e9ellement rendu compte que je n\u2019\u00e9tais pas seulement en train de cr\u00e9er une s\u00e9rie de pages web, mais un vrai site que j\u2019allais pouvoir continuer \u00e0 faire \u00e9voluer tr\u00e8s facilement.<\/p>\n
J\u2019avais d\u00e9j\u00e0 cr\u00e9\u00e9 diff\u00e9rentes petites applications et quelques jeux vid\u00e9o en vibe coding, principalement pendant mes cours ou pour illustrer ce qu\u2019il \u00e9tait possible de r\u00e9aliser avec les outils d\u2019intelligence artificielle.<\/p>\n
Mon id\u00e9e initiale \u00e9tait simplement de les int\u00e9grer au site.<\/p>\n
Je voulais cr\u00e9er une cat\u00e9gorie consacr\u00e9e aux applications, une autre aux jeux vid\u00e9o, et utiliser les projets existants comme exemples.<\/p>\n
Ils avaient \u00e9t\u00e9 cr\u00e9\u00e9s \u00e0 diff\u00e9rentes p\u00e9riodes, avec diff\u00e9rents outils et sans v\u00e9ritable direction artistique commune, mais ce n\u2019\u00e9tait pas forc\u00e9ment un probl\u00e8me. Ils fonctionnaient, ils permettaient de montrer des id\u00e9es et ils pouvaient d\u00e9j\u00e0 servir de support p\u00e9dagogique.<\/p>\n
Puis j\u2019ai vu \u00e0 quelle vitesse le site se construisait.<\/p>\n
Je me suis dit que, puisque j\u2019\u00e9tais capable de cr\u00e9er l\u2019ensemble du site en aussi peu de temps, je pouvais probablement me permettre de reprendre les applications et les jeux pour les adapter compl\u00e8tement \u00e0 sa direction artistique.<\/p>\n
Ce qui aurait repr\u00e9sent\u00e9 un travail assez cons\u00e9quent auparavant devenait beaucoup plus raisonnable. Au lieu d\u2019int\u00e9grer des projets visuellement tr\u00e8s diff\u00e9rents les uns des autres, je pouvais recr\u00e9er leurs interfaces, harmoniser les couleurs, les typographies, les boutons, les animations et faire en sorte que tout donne vraiment l\u2019impression d\u2019appartenir au m\u00eame univers.<\/p>\n
Cela me permettait aussi de reprendre les id\u00e9es que j\u2019avais d\u00e9j\u00e0 utilis\u00e9es pendant mes cours, d\u2019en tester de nouvelles et de voir ce que les mod\u00e8les r\u00e9cents \u00e9taient capables de produire.<\/p>\n
J\u2019ai donc utilis\u00e9 plusieurs outils pour recr\u00e9er ou d\u00e9velopper les applications et les jeux, notamment Gemini, GLM 5.2 et CoWork d\u2019Anthropic.<\/p>\n
L\u2019objectif n\u2019\u00e9tait pas forc\u00e9ment de r\u00e9aliser un comparatif tr\u00e8s m\u00e9thodique entre les mod\u00e8les. Je voulais surtout tester leur capacit\u00e9 \u00e0 transformer une id\u00e9e en application utilisable, tout en respectant une direction artistique d\u00e9j\u00e0 d\u00e9finie.<\/p>\n
C\u2019\u00e9tait \u00e9galement une mani\u00e8re de voir comment chacun r\u00e9agissait \u00e0 des demandes assez similaires, comment il organisait une interface, comment il g\u00e9rait les interactions, le design, les petits d\u00e9tails graphiques ou les fonctionnalit\u00e9s qui pouvaient sembler simples au d\u00e9part mais qui demandaient parfois plusieurs ajustements.<\/p>\n
Il y avait aussi une diff\u00e9rence importante avec mes pr\u00e9c\u00e9dentes exp\u00e9rimentations, cette fois, les applications n\u2019\u00e9taient pas cr\u00e9\u00e9es ind\u00e9pendamment les unes des autres. Elles devaient fonctionner seules, bien s\u00fbr, mais aussi s\u2019int\u00e9grer correctement dans le site.<\/p>\n
Il fallait donc conserver une certaine coh\u00e9rence graphique entre des projets parfois tr\u00e8s diff\u00e9rents, sans pour autant donner l\u2019impression qu\u2019ils \u00e9taient tous identiques.<\/p>\n
C\u2019est l\u00e0 que le r\u00f4le humain reste encore tr\u00e8s pr\u00e9sent.<\/p>\n
Les mod\u00e8les peuvent produire tr\u00e8s rapidement une premi\u00e8re proposition, parfois m\u00eame une proposition d\u00e9j\u00e0 assez convaincante, mais il faut encore \u00eatre capable de d\u00e9cider si l\u2019interface est lisible, si les choix graphiques sont coh\u00e9rents, si l\u2019exp\u00e9rience est agr\u00e9able et si le r\u00e9sultat correspond r\u00e9ellement \u00e0 l\u2019intention de d\u00e9part.<\/p>\n
Dans mon cas, l\u2019IA m\u2019a surtout permis d\u2019aller beaucoup plus vite dans l\u2019ex\u00e9cution. Les choix de direction artistique, les corrections, les arbitrages et la mani\u00e8re dont l\u2019ensemble devait fonctionner restaient li\u00e9s \u00e0 ce que je voulais obtenir.<\/p>\n
Le site doit bien s\u00fbr me permettre de pr\u00e9senter mes activit\u00e9s, mes formations et mes diff\u00e9rentes prestations aupr\u00e8s des \u00e9coles, des organismes de formation, des entreprises ou des agences qui peuvent avoir besoin d\u2019un formateur sur Blender, l\u2019intelligence artificielle, le design ou la cr\u00e9ation num\u00e9rique.<\/p>\n
Il regroupe \u00e9galement mes contenus, mes vid\u00e9os et diff\u00e9rents projets qui \u00e9taient jusque-l\u00e0 un peu dispers\u00e9s.<\/p>\n
Mais il est aussi pens\u00e9 comme un futur support p\u00e9dagogique.<\/p>\n
Les applications et les jeux vid\u00e9o vont me permettre de montrer directement pendant mes cours ce qu\u2019il est possible de cr\u00e9er avec les outils actuels. Je pourrai pr\u00e9senter une id\u00e9e, expliquer comment elle a \u00e9t\u00e9 d\u00e9velopp\u00e9e, montrer les diff\u00e9rentes \u00e9tapes, comparer certains r\u00e9sultats et surtout permettre aux apprenants de tester eux-m\u00eames les projets.<\/p>\n
Le site, en lui-m\u00eame, devient \u00e9galement un exemple assez parlant.<\/p>\n
Je peux montrer qu\u2019il est aujourd\u2019hui possible de partir de z\u00e9ro, de cr\u00e9er un site relativement complexe, de g\u00e9rer son design, son contenu, ses animations et sa mise en ligne en quelques heures, m\u00eame sans \u00eatre d\u00e9veloppeur web.<\/p>\n
Cela ne veut pas dire que tout se fait automatiquement ou qu\u2019il suffit d\u2019\u00e9crire une phrase pour obtenir imm\u00e9diatement un site professionnel.<\/p>\n
Il faut savoir ce que l\u2019on veut montrer, organiser les informations, juger le r\u00e9sultat, corriger ce qui ne fonctionne pas et avoir une id\u00e9e assez claire de l\u2019exp\u00e9rience que l\u2019on souhaite proposer.<\/p>\n
Dans mon cas, mes connaissances en design et en direction artistique m\u2019ont \u00e9videmment aid\u00e9, m\u00eame si je n\u2019avais pas les comp\u00e9tences techniques n\u00e9cessaires pour construire le site de mani\u00e8re traditionnelle.<\/p>\n
L\u2019IA n\u2019a pas d\u00e9cid\u00e9 \u00e0 ma place de ce que devait \u00eatre le site, elle m\u2019a surtout permis de le r\u00e9aliser beaucoup plus rapidement et beaucoup plus facilement.<\/p>\n
Cette exp\u00e9rience pose \u00e9videmment la question de l\u2019\u00e9volution du m\u00e9tier de web designer, m\u00eame s\u2019il faut \u00e9viter d\u2019en tirer des conclusions trop rapides.<\/p>\n
Pour le moment, les comp\u00e9tences d\u2019un web designer restent une vraie valeur ajout\u00e9e.<\/p>\n
Cr\u00e9er un site professionnel ne consiste pas uniquement \u00e0 produire une interface agr\u00e9able. Il faut r\u00e9fl\u00e9chir \u00e0 la navigation, \u00e0 l\u2019ergonomie, \u00e0 la mani\u00e8re dont les informations sont organis\u00e9es, au public cibl\u00e9, aux performances, au r\u00e9f\u00e9rencement, \u00e0 l\u2019accessibilit\u00e9 et aux objectifs commerciaux du projet.<\/p>\n
Une personne qui utilise Codex pour cr\u00e9er son premier site ne pensera pas n\u00e9cessairement \u00e0 tous ces \u00e9l\u00e9ments. Elle risque de se concentrer sur ce qu\u2019elle voit, sans forc\u00e9ment comprendre les probl\u00e8mes qui peuvent exister derri\u00e8re l\u2019interface.<\/p>\n
Un web designer exp\u00e9riment\u00e9 poss\u00e8de cette culture et cette capacit\u00e9 \u00e0 analyser un besoin dans son ensemble.<\/p>\n
En revanche, il va probablement pouvoir travailler beaucoup plus vite.<\/p>\n
Quand je dis qu\u2019un web designer pourrait cr\u00e9er dix fois plus rapidement, c\u2019est \u00e9videmment une simplification, mais elle permet de comprendre la direction g\u00e9n\u00e9rale. Une grande partie du temps qui \u00e9tait auparavant consacr\u00e9e \u00e0 la production technique peut maintenant \u00eatre utilis\u00e9e pour tester davantage d\u2019id\u00e9es, proposer plusieurs versions, corriger plus rapidement ou consacrer plus de temps \u00e0 la r\u00e9flexion.<\/p>\n
Cela implique forc\u00e9ment une \u00e9volution des offres et de la mani\u00e8re de travailler.<\/p>\n
Un web designer pourra produire davantage, mais il devra aussi probablement trouver davantage de clients, revoir ses tarifs, proposer des services diff\u00e9rents ou se positionner davantage sur le conseil, la strat\u00e9gie, l\u2019exp\u00e9rience utilisateur et la direction artistique.<\/p>\n
Les m\u00eames outils pourront aussi l\u2019aider \u00e0 pr\u00e9parer ses offres, cr\u00e9er du contenu, automatiser une partie de sa communication ou faciliter sa prospection, donc la transformation ne concerne pas seulement la production des sites.<\/p>\n
\u00c0 plus long terme, la question reste quand m\u00eame ouverte.<\/p>\n
On peut assez facilement imaginer un outil comme CoWork capable de g\u00e9rer une partie de plus en plus importante du travail, analyser un brief, proposer une direction graphique, cr\u00e9er le site, le mettre en ligne, analyser les r\u00e9sultats et apporter des corrections.<\/p>\n
Aujourd\u2019hui, il reste encore des choses auxquelles l\u2019utilisateur doit penser lui-m\u00eame, notamment tout ce qui concerne la strat\u00e9gie, le public cibl\u00e9 ou la coh\u00e9rence g\u00e9n\u00e9rale d\u2019une offre.<\/p>\n
Cela peut n\u00e9anmoins \u00e9voluer tr\u00e8s vite, et il serait un peu na\u00eff de penser que les outils vont simplement rester au niveau actuel.<\/p>\n
Pour le moment, je vois surtout l\u2019IA comme un moyen de r\u00e9aliser beaucoup plus facilement des projets que je n\u2019aurais probablement pas entrepris seul, ou qui m\u2019auraient demand\u00e9 beaucoup trop de temps.<\/p>\n
Dans le cas de ce site, je savais qu\u2019il \u00e9tait possible de le cr\u00e9er avec l\u2019IA. Ce que je n\u2019avais pas anticip\u00e9, c\u2019\u00e9tait \u00e0 quel point l\u2019ensemble allait \u00eatre rapide, fluide et finalement assez agr\u00e9able \u00e0 construire.<\/p>\n
Je pensais devoir me battre davantage avec la technique, abandonner certaines id\u00e9es ou accepter un r\u00e9sultat beaucoup plus g\u00e9n\u00e9rique. Au final, j\u2019ai pu cr\u00e9er le site que j\u2019avais en t\u00eate, refaire mes applications pour les adapter \u00e0 sa direction artistique, automatiser la mise en ligne et transformer l\u2019ensemble en outil professionnel et p\u00e9dagogique.<\/p>\n
Ce n\u2019\u00e9tait donc pas vraiment une exp\u00e9rience destin\u00e9e \u00e0 prouver que l\u2019IA pouvait cr\u00e9er un site.<\/p>\n
C\u2019\u00e9tait simplement la cr\u00e9ation de mon site, avec des outils qui m\u2019ont permis de le faire beaucoup plus facilement que ce que j\u2019avais imagin\u00e9.<\/p>\n","protected":false},"excerpt":{"rendered":"
Cr\u00e9er un site complet, harmoniser ses applications et automatiser sa mise en ligne : retour sur une exp\u00e9rience beaucoup plus fluide que pr\u00e9vu.<\/p>\n","protected":false},"author":1,"featured_media":0,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"footnotes":"","muskalab_likes":0},"categories":[1],"tags":[],"class_list":["post-6","post","type-post","status-publish","format-standard","hentry","category-uncategorized"],"muskalab_header_image":"https:\/\/muskalab.fr\/assets\/blog\/creation-site-codex.png","muskalab_english":{"title":"I Built My Website with Codex, and It Was Much Easier Than Expected","excerpt":"Building a complete website, bringing its applications into one visual system and automating deployment: a look back at a process that proved far smoother than expected.","available":true},"_links":{"self":[{"href":"https:\/\/muskalab.fr\/blog\/wp-json\/wp\/v2\/posts\/6","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/muskalab.fr\/blog\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/muskalab.fr\/blog\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/muskalab.fr\/blog\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/muskalab.fr\/blog\/wp-json\/wp\/v2\/comments?post=6"}],"version-history":[{"count":0,"href":"https:\/\/muskalab.fr\/blog\/wp-json\/wp\/v2\/posts\/6\/revisions"}],"wp:attachment":[{"href":"https:\/\/muskalab.fr\/blog\/wp-json\/wp\/v2\/media?parent=6"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/muskalab.fr\/blog\/wp-json\/wp\/v2\/categories?post=6"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/muskalab.fr\/blog\/wp-json\/wp\/v2\/tags?post=6"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}