Loading
Comment l'esthétique sci-art et le mouvement expressif créent une expérience de portfolio vivante.
La plupart des systèmes de design commencent par un moodboard. Exira-X a commencé par une question.
Comment se sent-on au bord de ce qu'on comprend ? Pas le bord confortable — le vrai. Là où la physique devient étrange, où le comportement de l'IA cesse d'être explicable, où une simulation produit quelque chose que son créateur n'avait pas prévu. Cette sensation d'être simultanément certain et incertain — ancré dans la méthode, suspendu au-dessus d'un abîme d'ignorance.
C'est ce que je voulais que le design ressente. Chaque décision — couleur, mouvement, typographie, espacement — est une tentative de rendre cette sensation lisible sans l'expliquer. Le moment où on explique un sentiment, il cesse d'être un sentiment et devient sa description. Le rôle du design est de produire l'expérience directement.
Le seul rôle du design : Produire l'expérience directement. Le moment où on explique un sentiment, il cesse d'être un sentiment et devient sa description.
Les interactions à ressort portent l’élan ; les changements brefs de couleur et d’opacité doivent rester discrets et immédiats.
La décision de design la plus importante n'était pas un choix de couleur ou un appariement typographique. C'était une décision cosmologique.
L'univers observable — tout ce qu'on peut voir, mesurer et toucher — représente environ 5 % de ce qui existe. Les 95 % restants sont la matière noire et l'énergie noire : on sait qu'ils sont là à cause de la façon dont ils façonnent le comportement de la matière visible, mais on ne sait absolument pas ce qu'ils sont réellement. On ne les a jamais détectés directement. On ne le fera peut-être jamais. Ils gouvernent tout et sont invisibles à tout ce qu'on a construit.
Cette dualité n'est pas un thème que j'ai appliqué au design. C'est la structure à partir de laquelle le design a émergé. Deux modes, deux physiques, deux façons de se tenir dans l'univers.
Le mode clair est la physique qu'on peut tenir dans ses mains. Le mode sombre est la physique qui soutient tout le reste sans s'annoncer.
Quand on bascule entre les modes, on ne change pas un paramètre de préférence. On change de quel côté de l'univers on se tient. Que l'utilisateur le sache ou non est sans importance — ce qui compte, c'est s'il le ressent. Un choix de design qui nécessite une explication a déjà partiellement échoué. Les meilleurs choix s'impriment avant que l'explication arrive.
Il y a quelque chose qui me dérange dans la plupart des animations web : elles utilisent des courbes d'accélération.
Ease-in, ease-out, cubic-bezier — ce sont des approximations polynomiales de la façon dont les choses devraient bouger si la physique était commode et sans friction et si le monde était fait de gradients lisses. Mais les objets réels ne s'accélèrent pas. Ils oscillent. Ils dépassent leur cible. Ils se stabilisent par amortissement à mesure que l'énergie se dissipe dans le milieu. Un ressort atteint l'équilibre. Il ne glisse pas vers un arrêt selon un calendrier.
Exira-X réserve la physique des ressorts aux interactions où l’élan communique un changement d’état. Les changements brefs de couleur, d’opacité et de focus utilisent un timing CSS discret ; chaque transition n’a pas besoin de se mettre en scène.
// Configuration pour les interactions où l’élan porte du sens
const springConfig = {
type: "spring",
stiffness: 280,
damping: 22,
mass: 0.8,
};
// No duration. No bezier. The physics determines when it stops.Les simulations vivantes et les transitions spatiales portent de l’élan et se stabilisent naturellement ; les bordures de cartes et les changements de couleur restent rapides et discrets. Cette hiérarchie est essentielle. Le mouvement doit se comporter comme les systèmes décrits par le site quand la physique apporte du sens, puis disparaître quand il ne ferait qu’ajouter du bruit.
Règle de mouvement : Si supprimer une animation rend l'expérience moins bonne, gardez-la. Sinon, supprimez-la.
Ce principe est plus difficile à appliquer qu'il n'y paraît. La tentation est toujours d'ajouter : une transition de plus, un état de survol de plus, une animation d'entrée de plus. Chaque ajout semble du polissage isolément. Combinés, les ajouts s'accumulent en bruit — un site où tout bouge et rien n'a d'emphase. J'ai supprimé plus d'animations que je n'en ai livrées. Ce qui reste n'est pas minimal par minimalisme. C'est minimal parce que tout ce qui n'était pas nécessaire rendait les choses nécessaires plus difficiles à voir.
L'atome rotatif sur la page d'accueil a été qualifié de décoratif par des personnes qui l'ont regardé rapidement. Il ne l'est pas.
Le noyau représente les trois disciplines fondamentales — physique, IA, robotique — non pas comme une liste mais comme un centre de gravité. Pas égaux dans leurs relations mais organisés autour d'une question commune : comment la complexité émerge-t-elle de la simplicité ? Le noyau est cette question. Tout gravite autour.
Les électrons sont les projets. Chacun occupe une orbite spécifique pour une raison. Particle Life est proche — physique pure, la traduction la plus directe de la loi naturelle en comportement visible. Creature Evolution est plus loin — physique plus calcul, le processus d'optimisation aveugle de l'évolution doté d'un substrat numérique. Mind Map est encore plus loin — le calcul tendant vers quelque chose comme la compréhension, le langage comme domaine plutôt que l'espace ou le temps.
Les traînées orbitales sont délibérées. La destination compte moins que le chemin. Exira-X n'est pas un ensemble de produits finis exposés. C'est un enregistrement de mouvement — questions posées, expériences menées, résultats qui ont surpris ou déçu, directions qui se sont avérées plus intéressantes qu'elles ne le semblaient de loin. Les traînées montrent que quelque chose est en mouvement. Une position statique serait un mensonge sur ce qu'est ce travail.
La lueur pulse. Pas sur une minuterie, pas déclenchée par le survol. Elle respire — une oscillation lente et continue qui ne correspond à aucune action de l'utilisateur. Parce que le travail est vivant au sens où il est en cours, inachevé, en train de changer. Une lueur statique serait une affirmation d'accomplissement. Le pulse est une affirmation de processus.
J'utilise le terme pour décrire ce que fait ce site, mais il vaut la peine d'être précis parce que le terme est utilisé librement.
Le sci-art n'est pas la science illustrée pour un large public. Ce n'est pas de l'art avec des thèmes scientifiques — une peinture d'un trou noir, une sculpture en forme d'hélice d'ADN. Ce sont des utilisations décoratives de l'imagerie scientifique, et ce n'est pas ce que ce site essaie de faire.
Le sci-art, tel que je l'utilise, est une tentative spécifique : rendre accessible le sentiment de la découverte scientifique. Pas le contenu, pas l'explication, pas la version simplifiée. Le sentiment — la désorientation de rencontrer un résultat qu'on n'attendait pas, la reconnaissance que l'univers est organisé différemment de ce qu'on supposait, le plaisir particulier d'un motif apparaissant là où il n'y avait que du bruit.
C'est une cible bien plus difficile que l'illustration. L'illustration est une traduction — prendre le contenu scientifique et le rendre visuellement. Le sci-art est une génération — produire chez le spectateur une expérience ressentie qui est structurellement similaire à l'expérience de faire de la science, sans nécessiter aucune des connaissances préalables.
Chaque décision de design sur ce site vise cette cible. Le système de couleurs n'explique pas la physique — il encode le registre émotionnel de chaque domaine, de sorte que passer d'un domaine à l'autre ressemble à se déplacer entre différents types de savoir. Le système de mouvement ne simule pas la physique — il utilise la dynamique physique pour que le comportement du site soit cohérent avec le comportement des systèmes qu'il décrit. La typographie ne fait pas référence à la science — elle distingue systématiquement les données du sens, le fait de l'argument, la machine de l'humain.
Si tout cela fonctionne est genuinement incertain. Le design visant l'expérience émotionnelle opère toujours avec un retour incomplet. On peut observer ce sur quoi les gens cliquent et combien de temps ils restent. On ne peut pas observer s'ils ont ressenti ce qu'on essayait de leur faire ressentir. Le fossé entre intention et réception est la partie du design qui ne se ferme pas.
Le design changera à mesure que les projets changeront. C'est un engagement, pas une possibilité.
À mesure que Particle Life devient plus complexe — plus de types de particules, plus de règles d'interaction, plus grande échelle — le langage visuel doit contenir cette complexité sans perdre le sens de ce que le projet questionne. À mesure qu'Ayri passe d'un concept à un système déployé, le site a besoin d'un moyen de représenter l'intelligence en interaction qui n'est pas simplement une interface de chat — parce qu'une interface de chat est un outil, et Ayri est un projet, et ces deux cadres nécessitent des traitements visuels différents.
Le design et le travail ne sont pas des choses séparées. Le design est un projet sur les mêmes questions que les projets — sur comment rendre les systèmes invisibles visibles, comment créer de l'expérience plutôt que simplement de la description, comment construire quelque chose qui communique par la forme plutôt que seulement par le contenu.
Le portfolio est le premier projet du portfolio.
C'est un principe, pas un slogan. Cela signifie que le design peut être faux et doit être corrigé. Cela signifie que le nouveau travail crée de nouveaux problèmes de design. Cela signifie que la version un n'est pas une chose terminée qui a été lancée — c'est la position d'ouverture d'une enquête en cours.
C'est la version un.
Plus à lire
L'interface doit inviter au jeu sans masquer la causalité, montrer les preuves sans devenir un mur de tableaux et fonctionner sur mobile.
Le projet a commencé comme expérience visuelle. Il m'a appris que l'espacement, la mesure, la reproductibilité et l'interface forment un même problème scientifique.
La plupart des portfolios de développeurs se ressemblent. Je voulais que le mien ressemble à un manuel de physique.