site-avancement
🙃
4 juin
Update nouveau code sur ma première page
Du coup l'ensemble fonctionne dans la même logique que mon précédent code, et notamment sur un petit soucis que j'avais déjà.
→ Lorsque je veux centrer les paragraphes dans le viewport, cela décale également la visibilité des éléments de la zones « cave ».
Du coup : j'ai modifié ce paramètre :
.item-cave {
display: block;
position: absolute;
top: 0;
left: 0;
right: 0;
height: 100vh;
transform: translateY(100vh);
}
comme ceci tout bêtement :
.item-cave {
display: block;
position: absolute;
top: 0;
left: 0;
right: 0;
height: 100vh;
transform: translateY(70vh);
}
je sais pas si il y a une manière « plus propre » pour régler le soucis.
item-cave = la classe des éléments du « cave » si jamais.
Aussi pour mes deux dernières parties, je vais voir si c'est possible de créer des hyphes qui se développent depuis les paragraphes en eux-mêmes.
Précisions retours :
Pourquoi pas déclencher /lire les phrases l’une après l’autre ?
→ c'était prévu je n'ai juste pas retouché à cette page depuis les premiers tests, aïe pardon ;-;
laisse l’anim dans son dernier état (plutôt que la ramener au début
→ en sommes je veux faire ceci, je me disais que c'était plus simple devant le jury que l'animation ne s'arrête pas
La couleur des liens, par contre, même si le bleu fait une référence au « par défaut »
Je comptais changer ça t'inquiète pas ...
Des espaces insécables ?
pareillement je comptais le faire ;-;
« Moisissure » entre guillement
J'ai peut-être pas assez de recule sur la manière dont ça peut être perçu
Moisissure = une forme de vie marginale et qui peut être multiple. Ce sont des organismes, les guillemets sont présents pour signifier que c'est une appellation pas précise, de défaut.
text-shadow bourrin...
Oui, je venais juste de tester que le text-shadow qui augmente à chaque partie, et je suis d'accord c'est rude
25 mai
j'ai passé une bonne partie de l'aprem à essayer de faire un chemin svg directement dessiné dans html pour essayé de faire un élément visuel qui pousse petit à petit entre les titres et les corpus de textes pour indiquer la direction de lecture (j'avais sinon pré-dessiné une flèche, mais au-delà de sa forme qui n'allait pas, cétait le svg static, déjà dessiné qui ne mintéressait pas, même si on peut l'animer, on peu (je crois) faire cette effet de "pousse"). Ce qui faisait que tous les éléments de ma pages n'étaient plus visible ou trop galère à placer avec mon flex qui permet le scroll horizontale, ça doit être des histoire de placement, de position sois dans html directement ou alors en css mais je sais pas.
sinon faut également que je m'occupe de ce « suite » :
(on voit pas trop il y'a un léger letter-spacing)
22 mai
Julien, pour que tu puisses me faire des retours, si tu as le temps, je réunis mes avancées dans ce bloc (désolé si c'est mal expliquer je le fais avant d'aller dodo).
→ Le site depuis la première page actuellement + réflechir au nom de domaine du site pour définir comment on doit comprendre le site (pour l'instant j'ai plus la volonté d'utiliser un nom de domaine qui fasse écho à l'entité humaine de la fiction, pour témoigner qu'il s'agisse bien de son site. Sans doute le mieux à faire pour qu'on comprenne qu'on est sur la page perso de l'humain·e, c'est de réaliser une sorte de première page qui permet d'indiquer cela, je ne sais pas encore trop comment) + comment il est diffusé, par exemple auto-hébergé.
Aussi, les deux premières pages de mon site sont pour l'instant trop à part avec le reste, du coup faut je rende le tout cohérent. Et lors du rdv avec Vincent, il m'a souligné qu'on ne comprenait directement le scroll horizontal, il faudrait que je fasses un élement visuel qui permette de l'indiquer.
Des petites retouches sur chaque partie de ma fiction :
→ « Mes inattentions »
→ « Foyer sensible »
→ « Faire place, laisser demeurer »
→ « Habiter, se soucier »
Alors par rapport au titres, volonté de le faire croître petit à petit. Le troisième titre assez complexe car plus long que le suivant, l'évolution de l'un à l'autre est un peu étrange, donc je pense que je vais le raccoucir.
3eme titre :
4eme titre :
Les paragraphes, je souhaite également que ceux de la première soit plus rudes, voir bloc, pour que finalement au fur et à mesure des parties, ils soient plus mouvant, agités, flottants.
Honnêtement c'est pas encore un choix très assumé, surtout pour la première où pour le coup c'est très rude à lire.
Une erreur que j'ai réalisé sans faire exprès que je garde dans un coin de la tête :
Les élements en sous-lecture (photos, citations) pour l'instant pas bien fait et cracra désolé.
Les dessins de « Moisissures » doivent être encore à travailler, notamment sur le rythme de croissance de celle-ci, en gardant tjrs l'idée de les disposer sur le mot moisissure. ( si ce n'est pas tjrs le cas c'est parce que je l'avais fait mais j'ai entre temps pas mal bougé le texte).
Je dois également travailler sur une arborescence pour montrer j'ai construit ma fiction, le fils conducteur d'origine avec les bribes de textes, et de comment ces derniers s'articulent finalement dans ma fiction :
Bref j'espère que j'ai rien oublié, bonne nuit 💤
Si jamais ma dernière avancée de la fiction, mais vu comme dans les cas je vais voir ça avec jp :
hotes-croise-es_24-mai.pdf
Lien du site :
→ 16/05 avancée → bcp de test svg → essayer de changer l'échelle d'un svg + gérer la taille du texte avec, j'ai eu pas mal de confusions. + faut que je commence à voir comment intégrer la photos microscopes
il y a ceci : https://codepen.io/hrousley/pen/dywbmWe → pour mon texte au fur et à mesure, le span risque d'être trop chiant à grande échelle mais cet exemple se rapproche de la forme quand in n'y aura "plus" « moisissure » dans la fiction
Mes tests svg :
(sur l'atelier également si jamais)
test-1
test-2
test-3
test-4
test-5 avec deux morceaux de textes
Grossièrement, l'idée de la page home de mon site :
→ encore bcp à faire lol
⤷Vu comme c'est encore brouillon et assez brusque, je vais essayer d'expliquer l'objectif de cette mise en forme. Même si j'ai pas encore entièrement mon texte ahah, le but est d'essayer de faire en sorte que le texte croisse petit à petit, en le découpant par bribes. Le premier morceau est le plus petit et le dermier est le plus développé lol. Cela me permet de diriger la lecture tout lui donnant une forme décomposer, ainsi que de dessiner une forme rizhome. J'aimerai travailler les timmings, les rythmes de développement également, le code couleur, retravailler la composition de base, je veux bien de l'aide de julien avec le js pour faire des mouvements automatisés, et sans doute d'autres choses.
Avancée mise en forme de la fiction :
test-1_page1
test-2_page1
test-3_page1
j'utilise un filtre svg sur les titres :
<svg>
<filter id="filtre-un">
<feTurbulence type="turbulence" basefrequency="0.03" numOctaves="1">
</feTurbulence>
<feDisplacementMap in="SourceGraphic" scale="10">
</feDisplacementMap>
</filter>
</svg>
avec lequel on peut faire pas mal de choses :
04-05
Jusqu'à que je revoie les profs, je vais avancer sur le mise en forme du reste de mon texte + avec les images.
cette semaine je fais des test pour écrire avec le plotter avec corentin.
Je voulais prendre en photos des fissures d'extérieur, j'avais pas la carte sd de mon appareil photo et là il pleut haha.
Maquettes :
un des soucis avec cette mise en forme c'est que c'est trop static. Le texte l'impression de mouvements sans mouvements :
autre font :
