Le logo qui s’anime — cinq propositions

Chaque effet se joue tout seul à l’arrivée, et le bouton dessous le rejoue. Le logo est à sa taille réelle de téléphone (102 × 27 px) : si tu dois plisser les yeux pour voir l’effet, c’est qu’il est bien discret. Donne-moi un numéro.

1

Le filet turquoise

Un trait d’un pixel se trace sous le mot, marque un temps, puis se retire par la droite. Le logo ne bouge pas d’un cheveu : ni transformation, ni flou, ni opacité sur l’image.

au chargement, une fois par session — 2,4 s

Sous un logo qui est aussi un lien, un trait turquoise peut se lire deux secondes comme un simple soulignement.

2

La lumière sur l’acrylique

Une bande claire traverse l’intérieur des lettres, comme un reflet qui glisse sur une plaque acrylique — le matériau que tu vends. Le logo sert de pochoir : rien ne déborde du dessin.

au chargement, une fois par session — 1,5 s

C’est le plus visible des cinq. Si tu le trouves trop présent, on baisse l’opacité de la bande, c’est une valeur.

3

L’encre qui se pose

Le logo arrive comme une impression : il monte de trois pixels, se densifie, et un flou d’un demi-pixel se résorbe. Puis plus jamais.

au tout premier chargement, une seule fois — 0,9 s

Le flou sur un serif aussi fin peut passer une fraction de seconde pour un défaut d’affichage. C’est le réglage le plus délicat des cinq.

4

Le souffle

Une variation de 1,2 % d’échelle, si lente qu’on ne la voit pas : on la sent. Le logo respire au lieu d’être posé.

en continu — un cycle de 22 s

La seule des cinq qui ne s’arrête jamais. Dans un en-tête vu sur toutes les pages, c’est aussi la seule dont on peut se lasser.

5

Au contact

Rien ne bouge tant qu’on ne va pas vers lui. Au contact, l’encre se remplit de turquoise de gauche à droite, et repart en sortant.

au survol ou au doigt — 0,42 s

Sur téléphone il n’y a pas de survol : toucher le logo lance la navigation vers l’accueil, donc l’effet se voit à peine. C’est une animation d’ordinateur.

Une contrainte qui a tout dicté : ton logo est une image, pas un dessin vectoriel. On ne peut donc ni l’animer lettre par lettre, ni faire tracer ses contours. Les numéros 2 et 5 contournent ça en se servant du logo comme pochoir : la couleur n’apparaît que sur l’encre des lettres, jamais autour.