Articles tagués animation
Site MDA61 : épisode 1
Publié par Zacharie PACEY dans Création web le 16 février 2012
Voici la page d’accueil temporaire du futur site de la Maison des adolescents de l’Orne, dont le développement commencera prochainement (cliquer sur l’image ci-dessous pour voir la page en ligne).
Bien que temporaire, cette page d’accueil présente une carte interactive animée de l’Orne, dont j’ai particulièrement soigné les effets d’animation car cette carte a vocation à rester dans le futur site définitif.
Voir les effets d’animation de cette carte à www.maison-des-adolescents-61.fr
Site du parcours historique de Sées : page d’accueil temporaire
Publié par Zacharie PACEY dans Création web le 1 février 2012
Après la conception de la signalétique de son parcours historique (voir articles 1, 2, 3, 4 et 5), la ville de Sées m’a confié la réalisation du site dédié au parcours, afin de garantir l’homogénéité graphique de l’ensemble du projet. J’ai proposé que ce site se présente comme une carte interactive.
Ce site, qui demandera un certain temps de développement, n’aurait pas pu être finalisé avant l’ouverture au public, imminente, du site web global de la ville.
Plutôt qu’un simple message « site en construction », il m’a semblé nécessaire, pour commencer le plus tôt possible à donner envie aux internautes de découvrir le circuit, de réaliser une page d’accueil temporaire la plus aboutie et informative possible.
- Un diaporama présente quelques-uns des documents figurant sur les panneaux et attise ainsi la curiosité pour le circuit ;
- des logos déclenchant une animation de texte apportent une sensation d’interactivité et de sophistication ;
- un bouton très repérable permet de télécharger le plan bilingue.
Cliquer sur l’image ci-dessous pour voir la page en ligne.
Animations Flash pour le site d’Isabelle Lépinay
Publié par Zacharie PACEY dans Création web le 22 février 2011
J’ai profité de l’occasion d’une mise à jour du site pour dynamiser deux pages au moyen de nouvelles animations. Comme toujours, plutôt que de récupérer des codes sur internet, je crée ces animations intégralement afin de garantir leur originalité : mon commanditaire est assuré d’avoir une création sur mesure, et qu’on ne verra nulle part ailleurs sur le web.
La page d’accueil (www.isabelle-lepinay.com), totalement refondue graphiquement, présente désormais deux animations : l’une, discrète, agrémente le nom « Lépinay » d’un effet vaporeux élégant. L’autre anime le menu, d’une façon originale : lorsqu’on place la souris sur l’un des trois liens, les deux autres glissent vers la droite, se mettant en retrait derrière l’accordéon. Les observateurs remarqueront l’effet d’animation rotatif discret des puces, qui apporte une touche de sophistication au menu.
La page orchestre (www.isabelle-lepinay.com/orchestre.html) est tout entière une animation : lorsqu’on arrive sur la page, une introduction présente le logo de façon animée, éclairant sa signification (j’ai déjà parlé ici de la création du logo, voir l’article correspondant).
Une fois l’animation introductive terminée, un effet de transition original fait apparaître la page orchestre. L’effet de transition est bien sûr lui aussi une création, je l’ai conçu en partant de l’idée des boutons accordéon associée à celle d’une boule à facettes.
Page Orchestre avec logo animé en introduction
et effet de transition personnalisé vers la page
Pour que l’expérience du visiteur soit la plus fluide possible, j’ai codé la page pour gérer au mieux la situation quelle que soit la vitesse de connexion. Ainsi, pendant que l’introduction (animation du logo) s’exécute, la page se charge. Lorsque l’introduction est finie, si le chargement de la page l’est aussi l’effet de transition commence immédiatement. Si le chargement n’est pas tout à fait fini, un message d’attente s’affiche et l’effet de transition est suspendu, pour ne démarrer qu’une fois le chargement terminé.
La partie la plus riche du site reste la section « L’accordéoniste » : pratiquement chaque page présente une animation originale.