hideout-lastation.com
Paradis Pour Les Concepteurs Et Les Développeurs


Stylie - Un générateur d'animation Web CSS gratuit

Si vous avez de la difficulté avec la syntaxe CSS3 et que vous voulez un moyen simple de créer des animations, Stylie est un excellent outil pour sauvegarder.

C'est l'un des nombreux générateurs de code libre avec un accent sur les effets animés CSS pur. Stylie est totalement gratuit et open-source, hébergé sur GitHub et alimenté par une bibliothèque d'images clés appelée Rekapi.

La bibliothèque Rekapi utilise JavaScript, c'est donc une alternative au CSS pur. Et heureusement, l'application Web Stylie prend en charge les deux méthodes, de sorte que vous pouvez exporter du code en CSS pur ou en JavaScript .

Par défaut, la première page charge une animation continue avec une animation linéaire. Vous pouvez jouer avec ceci en éditant les paramètres par défaut dans l' onglet Mouvement ou en éditant l' onglet Keyframes .

Dans la liste des images clés, vous pouvez ajouter de nouvelles images clés, modifier leur durée totale et modifier les styles d'animation, y compris les mouvements basés sur l'axe X / Y.

Tout d'abord, cela aura l'air extrêmement déroutant, surtout si vous n'avez jamais fait d'animation d'images clés auparavant. Cependant, plus vous jouez avec cette application, plus cela a du sens.

Par défaut, vous disposez d'une tonne d' options d'accélération différentes à utiliser et elles sont toutes faciles à personnaliser.

Le graphique Motion est beaucoup plus difficile à apprendre, mais il vous donne beaucoup plus de contrôle sur l'accélération de votre animation. Stylie vous permet même de sauvegarder des effets de mouvement personnalisés et de les réutiliser dans l'onglet Images clés pour d'autres animations.

Si je pouvais me plaindre d'une chose, c'est le manque de réactivité de l' application web.

Je ne pouvais pas obtenir l'application entière pour tenir sur mon écran MacBook Pro 13 "même avec le navigateur entièrement maximisé. Cela peut être un problème car la page n'a pas de barre de défilement verticale et beaucoup d'options (comme le code exporté) sont trouvées plus bas dans le volet des paramètres.

Mais mis à part cet ennui mineur, je l'ai fait fonctionner très bien sur mon moniteur plus grand. Et, la qualité d'exportation est comme rien d'autre que vous trouverez sur le web.

Jetez un coup d'oeil à l'application Stylie pour voir comment cela fonctionne et essayez de jouer avec certaines des options. Une fois que vous faites votre animation, vous pouvez exporter le CSS ou le JavaScript et l'utiliser pour tout projet que vous aimez.

Si vous éprouvez des difficultés à apprendre l'interface, vous pouvez également visionner ce bref tutoriel d'une durée d'environ 9 minutes et couvrant toutes les fonctions principales.

Nouvelle ressource pour les développeurs Web - Avril 2018

Nouvelle ressource pour les développeurs Web - Avril 2018

Ce mois-ci, nous avons vu quelques annonces de noms notables dans la technologie. Par exemple, Apple a ouvert un nouveau système de base de données, Google a publié un nouvel outil pour mesurer la vitesse de votre site sur mobile, et Github avec un cours gratuit pour vous aider à démarrer avec Git, Github, et le codage en général.En out

(Conseils techniques et de conception)

Collaboration en temps réel sur votre site Web avec TogetherJS

Collaboration en temps réel sur votre site Web avec TogetherJS

On ne peut nier que la collaboration en temps réel est devenue une partie importante du web moderne. Google Drive est un excellent exemple de la façon dont la collaboration simultanée en temps réel est un moyen essentiel de travailler en ligne ces jours-ci. En appliquant le même concept, Mozilla Labs a présenté son propre outil appelé TogetherJS, une bibliothèque JavaScript basée sur HTML5 pour faciliter la collaboration en temps réel entre les utilisateurs.TogetherJS

(Conseils techniques et de conception)