Avis du studio DA du 03/11 (07h00) et relecture de 8ccdda3 :
- règle du perché : il faut au-dessus de l'arête un vide au moins égal à la hauteur
de l'oiseau, sinon il va en marge ou derrière la carte. Les perchés entre cartes
rapprochées (numérique, logiciel-libre, économique, sommaire du livre, commande,
citoyenne, événement) passent en marge, derrière, ou partent ;
- productions-collectives : 8 oiseaux ramenés à 4, sans colonne ni chevauchement.
Les oiseaux retirés vont sur des pages qui en avaient peu : monnaie-libre
(boulangère, vigneronne), tarifs-eau (potier), décision (tisserand),
cloud-libre (imprimeuse 3D). Les 61 restent rendus ;
- pas trois oiseaux sur la même verticale (commande, numérique) ;
- au téléphone, l'oiseau de la page se tient au bout de la ligne de l'intitulé ;
- seuil 1024 pour un perché dont le bloc n'a de vide au-dessus qu'en deux colonnes
(accordéoniste et factrice de l'accueil) ;
- numerique/[slug] : les oiseaux des sections larges tiennent dans 152 px de marge
à 1200 px ;
- en-tête : de 768 à 1023 px, boutons resserrés au lieu d'un débordement ; le
logotype du kit ne change pas.
Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>
105 lines
5.3 KiB
Markdown
105 lines
5.3 KiB
Markdown
# Consignes d'Yvv — design du site
|
|
|
|
Ce fichier rassemble les consignes qu'Yvv donne en conversation, avec leur date. Les consignes
|
|
entre guillemets sont recopiées mot pour mot ; les autres le disent. Elles l'emportent sur les choix
|
|
d'interprétation des sessions.
|
|
|
|
Pourquoi ce fichier : la graduation de la console, donnée le 29/09, s'est perdue avec le transcript
|
|
où elle était écrite. Une consigne qui ne vit que dans une conversation finit par disparaître.
|
|
|
|
## Accueil — la console des trois curseurs
|
|
|
|
Code : `app/components/home/HomeConsole.vue`. Libellés : `site/pages/home.yml > console`.
|
|
|
|
### 29/09/2026
|
|
|
|
Le transcript a été effacé. Ces quatre consignes sont reconstituées d'après le commit `201cfbb` et le
|
|
relais de la session orch le 03/11 : ce ne sont pas les mots d'Yvv.
|
|
|
|
- l'axe de la console a Asservissement en bas et Émancipation en haut ;
|
|
- une animation où les curseurs bougent lentement, pour qu'on ne croie pas devoir les manipuler ;
|
|
- « AUTONOMIE » devant les légendes des curseurs ;
|
|
- « Autonomie numérique, économique, citoyenne » et « Code source, création monétaire, décision »
|
|
mis en valeur.
|
|
|
|
### 03/11/2026, vers 03h58 (à la session orch)
|
|
|
|
Mot pour mot, d'après `~/harness/etat/reponses-yvv.md` :
|
|
|
|
> « Et retrouve les consignes, comme par exemple celles pour l'animation (curseurs qui montent au
|
|
> rollover et ne fait pas descendre les autres, je t'avais donné une graduation). »
|
|
|
|
### 03/11/2026, entre 05h40 et 05h45 (relayée mot pour mot par la session orch)
|
|
|
|
> « Je t'avais dit déjà tout ça. Au rollover, numérique monte à 3/4, économie monte à 1/2, citoyenne
|
|
> monte à 2/3. Les curseurs restent. Si on rollover à nouveau ils refont leur montée. Et le pavé
|
|
> correspondant s'affiche bien sûr au même rollover. »
|
|
|
|
Ce que fait le code :
|
|
- Un survol à la souris, un focus au clavier ou un tap sur un curseur arrête pour de bon la rotation
|
|
automatique.
|
|
- Le curseur touché repart d'en bas et monte en 1,1 s à son cran : numérique 0,75, économique 0,50,
|
|
citoyenne 0,667. Il y reste.
|
|
- Le panneau de l'axe s'affiche au même geste.
|
|
- Les autres curseurs ne bougent pas. Un curseur jamais touché reste là où il était.
|
|
- Un nouveau survol rejoue la montée.
|
|
- Avant tout geste, l'animation du 29/09 continue : la rotation et la dérive des curseurs bas. L'axe
|
|
mis en avant monte à son cran, et non plus vers 0,9. C'est une décision d'orch du 03/11 à 05h51, qui
|
|
découle de la graduation : l'animation et la main donnent les mêmes niveaux.
|
|
- Sous `prefers-reduced-motion`, il n'y a aucune transition, mais les crans sont les mêmes.
|
|
- Un défilement au doigt qui part d'un curseur ne compte pas comme un survol.
|
|
|
|
## Les oiseaux (identité du studio DA)
|
|
|
|
Code : `app/components/ui/OiseauPose.vue` (placement), `app/components/ui/Oiseau.vue` et
|
|
`app/utils/oiseaux.ts` (kit du studio DA, copiés tels quels). Les places sont dans chaque page.
|
|
|
|
### 03/11/2026, 05h08 (relayée mot pour mot par la session orch)
|
|
|
|
> « fais un effort sur le positionnement des oiseaux, là ils sont en colonne, c'est trop régulier,
|
|
> trop papier peint, fais mieux que ça, peuple le fond intelligemment par rapport aux contenus, varie
|
|
> les tailles et les emplacements »
|
|
|
|
### 03/11/2026, vers 05h45 (réponses au formulaire, relayées par la session orch)
|
|
|
|
- « Posés sans flotter » : un oiseau posé sur une arête est immobile sur sa ligne de sol. Seul l'oiseau
|
|
de fond, derrière une carte, peut garder un léger mouvement.
|
|
- « Un oiseau par page » sous 768 px.
|
|
- « Les 61 tout de suite » : les places du plan, plus les oiseaux restants sur les sous-pages.
|
|
- Pour le kit : « Oui, à intégrer » (au formulaire du studio DA).
|
|
|
|
Ce que fait le code :
|
|
- Chaque oiseau est accroché au bloc dont il fait le métier, et se tient sur une vraie arête :
|
|
- perché sur le haut d'une carte ;
|
|
- près d'un titre ;
|
|
- en marge, à côté de son bloc ;
|
|
- derrière une carte, en grand et pâle.
|
|
- Jamais deux fois le même oiseau sur une page.
|
|
- Entre 768 et 1199 px, seuls les oiseaux perchés restent.
|
|
- Sous 768 px, au plus un oiseau par page.
|
|
|
|
### 03/11/2026, 07h00 : avis du studio DA (relayé par la session orch, ce ne sont pas les mots d'Yvv)
|
|
|
|
« kit : ok », avec trois constats de composition :
|
|
- trop d'oiseaux autour du seul bloc de productions-collectives ;
|
|
- des perchés qui mordent sur la carte du dessus (numérique) ;
|
|
- l'un d'eux mord aussi sur le coin d'une carte à 375 px.
|
|
|
|
La règle de DA, pour toutes les pages : un oiseau perché n'a sa place que s'il y a, au-dessus de
|
|
l'arête, un vide au moins égal à sa hauteur. Sinon, il va en marge ou derrière la carte.
|
|
|
|
La relecture du même jour ajoute : pas trois oiseaux sur la même verticale dans une marge.
|
|
|
|
Ce que fait le code depuis :
|
|
- Aucun oiseau perché entre deux cartes rapprochées. Ceux qui y étaient sont passés en marge ou
|
|
derrière la carte.
|
|
- Au téléphone, l'oiseau de la page se tient au bout de la ligne de l'intitulé, au-dessus du titre.
|
|
- Un perché dont le bloc n'a de vide au-dessus qu'une fois la grille en deux colonnes ne s'affiche
|
|
qu'à partir de 1024 px (`seuil`).
|
|
- Productions-collectives garde 4 oiseaux. Les autres sont partis sur des pages qui en avaient peu :
|
|
- monnaie-libre : boulangère, vigneronne ;
|
|
- tarifs-eau : potier ;
|
|
- décision : tisserand ;
|
|
- cloud-libre : imprimeuse 3D.
|
|
- Toujours les 61 oiseaux rendus sur le site.
|