PAGE online

Task Force Micro-UX

Im Web und in den einschlägigen App-Stores buhlen immer mehr funktionsgleiche Anwendungen um die Gunst der User. Aber warum ist eine Applikation am Ende erfolgreicher als ihre Mitbewerber? Oft lautet die Antwort: Microinteractions.

Im Web und in den einschlägigen App-Stores buhlen immer mehr funktionsgleiche Anwendungen um die Gunst der User. Aber warum ist eine Applikation am Ende erfolgreicher als ihre Mitbewerber? Oft lautet die Antwort: Microinteractions.

In PAGE 01.2015, die ab dem 03.12.2014. am Kiosk liegt, klären wir, was Microinteractions wirklich bewirken können, wie der Gestaltungs- und Entwicklungsprozess aussieht und wer daran beteiligt ist. Außerdem zeigen wir Praxisbeispiele. Insbesondere gehen wir auf Googles neuen Styleguide im Material Design ein, der das Prinzip der Microinteractions geradezu mustergültig umsetzt.

Geprägt hat den Begriff Microinteractions der amerikanische Interaction Designer Dan Saffer, der 2013 sein gleichnamiges Buch veröffentlichte. Dan Saffer hat auch eine eigene Seite zum Thema Microinteractions:
http://microinteractions.com/

Im Blog der amerikanischen Agentur User Interface Engineering in Massachusetts findet sich zudem ein Interview mit Dan Sagffer über Microinteractions:
http://www.uie.com/brainsparks/2014/08/01/dan-saffer-big-considerations-from-microinteractions/#transcript

Hier geht es zu Googles Styleguide zum Material Design:
https://www.google.com/design/spec/material-design/introduction.html

Die amerikanische Agentur Hugeinc hat für Google den Styleguide Material Design umgesetzt und berichtet darüber in ihrem Blog:
http://hugeinc.com/case-study/material-design
http://hugeinc.com/ideas/perspective/micro-ux

Anregende und diskussionswürdige Blogposts finden sich hier:

http://www.fastcodesign.com/1672922/the-future-of-ux-design-tiny-humanizing-details

http://de.slideshare.net/OneNorthInteractive/1nwebinar-microinteractions-the-details-that-delight

http://www.creativebloq.com/web-design/improve-your-site-microinteractions-10134906

http://www.dtelepathy.com/blog/inspiration/40-more-delightful-examples-of-attention-to-detail

http://konigi.com/notebook/meaningful-transitions-collection-transition-patterns

Praxisbeispiele sammeln beispielsweise die Blogs
Little Big Details: http://littlebigdetails.com/
und
SixUX: http://sixux.com/

Wenn es darum geht, Designschemata in einer wiederverwertbaren Form abzulegen, haben sich Pattern Libraries als effektive Instrumente erwiesen, wie sich an mehreren Stellen im Netz nachlesen lässt.
http://www.produktbezogen.de/bauanleitung-pattern-library-1/
http://boagworld.com/design/pattern-library/

http://ux.mailchimp.com/patterns
http://alistapart.com/blog/post/getting-started-with-pattern-libraries

Beispiele für Pattern Libraries finden sich hier:

BBC
http://www.bbc.co.uk/gel

Mailchimp
http://ux.mailchimp.com/patterns

Starbucks
http://www.starbucks.com/static/reference/styleguide/

Yelp
http://www.yelp.com/styleguide#forms

Mehr zum Thema »Microinteractions« finden Sie in PAGE 01.2015 im PAGE Shop!

Produkt: Download PAGE - Microinteractions - Animationen und Transitions - kostenlos
Download PAGE - Microinteractions - Animationen und Transitions - kostenlos
Best Practices für Web und Mobile. Coding-Tipps für CSS3. Tools, Bibliotheken und Generatoren fürs Prototyping & Wireframing

Schreibe einen Kommentar

Deine E-Mail-Adresse wird nicht veröffentlicht. Erforderliche Felder sind mit * markiert.

Das könnte dich auch interessieren