Manuel Rauber Thinktecture AG

Kennt man die wichtigen Methoden des Animationsframeworks, ist es oft ein geschicktes Kombinieren, um tolle Ergebnisse zu erreichen.

Große graue Buttons in großen grauen Fenstern – Anwendungen wie wir sie von früher kennen, aber nicht unbedingt lieben gelernt haben. Aber sie haben ihren funktionalen Zweck erfüllt. Auch heutigen Anwendungen erfüllen ihren funktionalen Zweck, aber sie sind einen Schritt weiter. Statt grau auf grau gibts oftmals durchdachte farbliche Designs. Und viel wichtiger: Von subtilen, kleinen, unterstützenden bis hin zu großen, pompösen und erstaunlichen Animationen ist alles mit dabei. Ziel ist dabei die Unterstützung des Benutzers, also die Verbesserung der User Experience.

Internetseiten wie Dribbble oder Awwwards sind tolle Inspirationsquellen für interessante User-Interface- und User-Experience-Konzepte oder deren Implementierung. Dahinter stecken oftmals nicht einfache JavaScript-Skripte, die man mal eben in seine eigene Anwendung einbauen kann, sondern oftmals sehr viel Engagement, Arbeit und Zeit. Die steigende Zahl an Firmen, die eine Stelle für UI-/UX-Developer oder UI/UX Engineer ausschreiben, zeigt die Bereitschaft, mehr und mehr in diese Bereiche zu investieren, um die Benutzerzufriedenheit zu erhöhen.

Ein gutes UI gepaart mit einer guten UX hilft immens bei der Steuerung einer Anwendung durch den Benutzer. Sie funktionieren nicht nur gut bei ihrer Nutzung, sondern es macht auch noch Spaß. Oftmals merken wir Benutzer gar nicht, wie gut die UX einer Anwendung ist, wenn diese dementsprechend durchdacht und implementiert ist. Wir merken eher, wenn etwas mal nicht ganz rund ist oder der Arbeitsablauf nicht stimmt.

Das heißt aber auch, dass wir Entwickler unser Skillset erweitern müssen. Sicherlich müssen wir nicht in der Lage sein, die Arbeit eines spezialisierten UX Engineers in vollem Umfang zu erledigen, aber wir sollten in der Lage sein, kleine subtile und unterstützende Elemente entwickeln zu können. Natürlich beschränkt sich die Arbeit eines UX Engineers nicht nur darauf, tolle Animationen zu erstellen. Diese sind oftmals das Ergebnis eines oder mehrerer Workshops des UX Engineers zusammen mit seinem Kunden zur Verbesserung von Arbeitsabläufen. Aber oftmals sind es auch genau diese kleinen subtilen Animationen, die eine Anwendung zum Leben erwecken, und man dann gerne damit arbeitet.

Im Rahmen des Artikels wollen wir uns daher grundlegend mit dem von Angular angebotenen Animation-API beschäftigen, dessen sehr ausdrucksstarke domänenspezifische Sprache kennenlernen und erste Animationen selbst erstellen. Der Artikel wird durch eine Beispielanwendung begleitet, die auf GitHub zu finden ist und auf Angular 5+ basiert. Daher ist das hier im Artikel gezeigte API basierend auf Angular 5.

Den vollständigen Artikel lesen Sie in der Ausgabe:

Windows Developer 1.18 - "Angular 5"

Alle Infos zum Heft
579821394Tolle UX mit Angular Animations
X
- Gib Deinen Standort ein -
- or -