...retourner à « Guide des menus » ?
Onglet V¶
Ceci intéressera particulièrement ceux qui souhaitent produire des « effets spéciaux ».
En écrivant la partie du programme qui modifie l'état de toutes les pièces de la page, j'ai réalisé à quel point cela ressemble à de l'animation. C'est essentiellement la même chose : une séquence d'étapes pour déplacer chaque élément vers différentes positions sur la page.
J'ai donc ajouté des fonctions pour « capturer l'état ». Ainsi, nous pouvons avoir un bloc unique à l'écran représentant la collection des états capturés, dans l'ordre de leur création.
Cet onglet est extrêmement complet, même s'il ne paie pas de mine. Allons-y...
HTML Fury est une ébauche¶
Je n'ai jamais terminé la transition de cet onglet pour en faire quelque chose d'utile; c'est donc un vestige montrant un test abandonné. Le concept qui en est issu (séparer et joindre) a été réutilisé pour les fonctions des blocs de l'accumulateur d'état (touches b et B).
Animateur de première classe¶
Parlons d'abord des boutons de la rangée supérieure. Il y en a un pour insérer un bloc de style (CSS), un pour le JSON et un pour le Script (JS).
Leur fonctionnement est évident : passez en mode aperçu en direct pour modifier le contenu de ces pièces. Le style deviendra actif immédiatement, tandis que les blocs JSON et Script seront ajoutés plus tard au fichier sauvegardé.
Style, JSON et Script¶
Ces trois éléments ne sont pas que des boutons. Vous pouvez glisser des fichiers CSS, JSON et « .js » directement sur l'écran, et leur contenu sera placé dans l'un de ces blocs. C'est un moyen très rapide de composer une nouvelle page avec des composants préparés à l'avance. Par exemple : créez un fichier CSS avec des classes, puis utilisez ces classes dans le programme. Vous verrez les effets instantanément.
Entrées des boutons de la barre latérale¶
Nous avons une longue liste de boutons que nous pouvons insérer dans l'espace HTML. Ils contiennent (pour la plupart) des commandes que nous pouvons tester directement, ou dont nous pouvons extraire le code (Onglet I, code).
Il est important de noter que j'ai configuré ces boutons pour utiliser une fonction d'animation différente de celle du mode de test (MAJ + ENTRÉE). Le conflit entre ces fonctions est ce qui crée les « effets ».
Édition active (Active Editing)¶
C'est assez complexe à manipuler, mais vous pouvez essayer de l'utiliser pour modifier certaines positions dans les cadres (frames) à la volée.
Filtres CSS¶
Beaucoup aimeront cette fonction car elle a un impact visuel majeur, notamment le FLOU (Blur). Utilisez-le avec parcimonie : si tout est flou tout le temps, on s'en lasse vite !
Une astuce méconnue : le bouton « drop » permet d'obtenir un « filtre de chute » (drop filter). Au lieu d'appliquer le filtre à une seule pièce, c'est tout ce qui se trouve derrière le filtre qui est modifié. Pratique pour flouter toute une page, par exemple. Notez qu'on ne peut pas les empiler; c'est un effet unique à la fois.
Comment créer des effets¶
Pour créer différents effets, il faut simplement expérimenter. Je ne peux pas vous dire exactement ce qui fera un « bon » effet; vous devez essayer et juger par vous-même. Utiliser vos propres graphismes et votre imagination aide énormément.
Pourquoi les effets fonctionnent-ils ?¶
C'est très simple : nous avons deux fonctions informatiques différentes qui se « battent » l'une contre l'autre. En changeant le rythme, nous obtenons toutes sortes d'effets intéressants de ce conflit.
Il y a une fonction appelée « all » qui démarre via les boutons du menu latéral, et une autre appelée « group » ou « grp » qui démarre dans la fenêtre de test (MAJ + ENTRÉE).
Utilisez les BOUCLES (Loops)¶
Les deux types de fonctions ont un bouton de boucle. Ce seront probablement vos boutons principaux. Assurez-vous de régler la « cadence » (rate) dans HDUB pour la fonction « all », et apprenez à la modifier dans la fenêtre de test (la molette de la souris est le moyen le plus rapide).
N'ayez pas peur de bidouiller¶
Lancez-vous, ne réfléchissez pas trop et n'ayez jamais peur de tout chambouler. Vous êtes dans un navigateur, rien de grave ne peut arriver. Lorsque vous obtenez un effet qui vous plaît, copiez son code et gardez-le précieusement, ou insérez-le dans le code « au clic » d'un bouton. Et bien sûr, sauvegardez toujours avec la touche S.
