Tool-Tipp: Moving Letters mit Anime.js und CSS

Dieter Petereit

ist seit 1994 im Netz unterwegs, aber bereits seit über 30 Jahren...

Animierte Schriften sind ein Hingucker. Richtig eingesetzt, können sie ein Design aufwerten. Moving Letters stellt dir 16 fantastische Effekte bereit.

Der schwedische Designer und Entwickler Tobias Ahlin hat einen imposanten Backlog an Referenzen. Zunächst zeichnete er als einer der ersten Mitarbeiter von Spotify für deren Design verantwortlich. Heutzutage entwickelt er bei Mojang fleißig an Minecraft mit. Daneben schmeißt er immer mal wieder kleinere und größere Side-Projects in die Menge, wie der Kölner Prinz die Kamelle.

Bewegte Buchstaben mit einfachen Mitteln

Sein Open-Source-Projekt Moving Letters etwa ist eine wachsende Sammlung mit animierten Texteffekten. Tobias setzt dabei auf CSS und JavaScript, unter Unterstützung durch die Animations-Engine Anime.js.

Code-Schnipsel zum Mitnehmen. (Screenshot: Dr. Web)

Dabei ist die Website zum Projekt selbst schon ein imposantes Design-Stück, das es an Animation nicht mangeln lässt. Auf der Landing Page findest du alle Efffekte schön übersichtlich aufgereiht. Per Klick auf einen Text öffnet sich die jeweilige Detailansicht, die dann neben dem optischen Effekt auch die erforderlichen Code-Schnipsel in HTML, CSS und JavaScript bereithält. So baust du den jeweiligen Effekt ganz simpel per Copy und Paste in deinen eigenen Projekte nach.

Ahlin liefert weitere nützliche Tools für Webentwickler

Tobias stellt den Code unter der liberalen MIT-Lizenz zur Verfügung. Deshalb kannst du ihn frei, auch in Kundenprojekten, verwenden. Tobias Ahlin kennst du vielleicht schon von seinen anderen beiden, ähnlichen Projekten SpinKit und TypeSource. MIt dem SpinKit stellt er in gleicher Weise animierte Zustandsanzeiger vor, während TypeSource eine Inspirationsquelle für die Verwendung von Google Webfonts ist.

Alle drei Projekte haben sich einen Bookmark in des Designers Toolbox verdient.

Dieter Petereit

ist seit 1994 im Netz unterwegs, aber bereits seit über 30 Jahren in der IT daheim. Seit Anfang des neuen Jahrtausends schreibt er für diverse Medien, hauptsächlich zu den Themenfeldern Technik und Design. Man findet ihn auch auf Twitter und Google+.

Hinterlasse einen Kommentar

Hinterlasse den ersten Kommentar!

Benachrichtige mich zu:
avatar
wpDiscuz