webthinking® Trendpaper
Bildquelle: Rosa, 6 Jahre
Interface Design Nicht Logos prägen Marken, sondern Erlebnisse! Ein paar knackige Werte und Botschaften mit einem stylischen Logo sowie einer emotionalen Bildwelt, und fertig ist die Marke? Weit gefehlt! Auch Markenbilder werden heute maßgeblich durch die Digitalisierung geprägt: Das Navigationssystem im Auto zeigt uns den richtigen Weg, der Kühlschrank präsentiert köstliche Kochrezepte, die Skibrille empfiehlt uns die beste Abfahrt, und unsere persönliche Schaltzentrale Smartphone tragen wir ständig mit uns herum. In wenigen Jahren werden sich viele weitere Dinge aus unserem Umfeld in interaktive Bildschirme verwandeln. Die Zahl der Kontaktpunkte für Marken steigt damit ins Unermessliche, und gleichzeitig sinkt die Aufmerksamkeit für einzelne Angebote. Ein konsistentes Erscheinungsbild wird als Orientierungsfunktion sicherlich seinen Stellenwert behalten. Viel wichtiger aber wird die Erlebnisqualität in der Interaktion mit der Marke.
Höchste Zeit also, sich mit Interface Design als Baustein der Markenführung zu befassen. Ginge es nämlich nach Google, würden Marken als Erfüllungsgehilfen in den Hintergrund treten und den wesentlichen Dialog in den Bereichen Orientierung, Information, Auswahl und Kauf dem Onlinegiganten überlassen. Denn Google ist ein „Interface“ – eine Schnittstelle – und kann es sich deswegen erlauben, auch mal mit seinem Logo zu spielen. Interfaces sind mehr als grafische Oberflächen, die ein dahinterliegendes technisches System ansteuern. Services werden durch sie nutzbar und zum Teil begehr-
lich, und Marken können ihre Werte und Persönlichkeit in direkte Handlungen und Erlebnisse übersetzen. Vom Ease of Use zum Joy of Use – von der Gestaltung zum ganzheitlichen Nutzungserlebnis.
Die Analogie mit einem Ladengeschäft liegt auf der Hand: Gibt es ein harmonisches Ambiente, das mich willkommen heißt? Fühlt sich alles stimmig an und lädt mich zum Verweilen ein? Kann ich mich gut orientieren und mein eigenes Tempo beim Erkunden bestimmen? Ist der Verkäufer freundlich und einfühlsam? Kennt er mich und gibt mir die richtigen Informationen und Ratschläge? Werde ich positiv überrascht und kann ich eine kleine Geschichte mitnehmen? Diese Fragestellungen lassen sich 1:1 auf Interfaces übertragen. Die Herausforderung für Marken besteht darin, Interfaces zu entwickeln, die sich sowohl empathisch dem Menschen, als auch situativ dem Medium anpassen. Das verlangt eine genaue Kenntnis des Nutzers und seiner Bedürfnisse sowie ein prozessorientiertes Verständnis der User Experience Spezialisten.
Unser Trendpaper Interface Design gibt Ihnen Einblicke zum aktuellen Stand und zu zukünftigen Entwicklungen in der Gestaltung von Webanwendungen und mobilen Applikationen. Machen auch Sie Ihre Marke zum digitalen Erlebnis!
webthinking® Trendpaper / Interface Design
Konzentriere Dich auf den Nutzer, und alles andere kommt von alleine Dieser Leitspruch von Google gilt übergreifend für alle guten Interfaces. Und weil Google seine Erzeugnisse oft kostenfrei zur Verfügung stellt, gibt es auch die Designrichtlinien des neuen „Material Design“ ansprechend und nachvollziehbar aufbereitet, wie in einer guten Vorlesungsreihe über Designprinzipien. Das Designsystem folgt mit Einfühlungsvermögen und Klarheit den Regeln der guten Gestaltung und führt so zu schnell erfassbaren und selbsterklärenden Oberflächen und Interaktionen. Die Definition von modularen Mustervorlagen (so genannten Design Patterns) hilft dabei, ein konsistentes Erscheinungsbild zu gewährleisten und ganz nebenbei auch noch Kosten in der Umsetzung zu sparen. Quelle: http://www.google.com/design/
Wer sich nicht anpassen kann, fliegt raus Nein, hier geht es nicht um die darwinsche Evolutionstheorie, sondern um dynamische Websites. Responsive Webdesign, also die automatische Anpassung der Website-Inhalte an unterschiedliche Ein- und Ausgabegeräte, hat sich inzwischen als Standard etabliert. Dabei geht es nicht nur um die visuelle Darstellung, sondern auch um den Kontext und damit um eine situationsspezifische Auswahl oder Informationstiefe der Inhalte. Auf einem großen Desktop-Monitor lassen sich wesentlich mehr Informationen gleichzeitig erfassen als auf einem Smartphone. Und das ist auch der Grund, warum Googles Suchalgorithmus bewertet, wie „mobile“ optimiert eine Internetseite angelegt ist. Quelle: http://www.awwwards.com/websites/responsive-design/
Schönschreiben ist wieder Pflichtfach Gute Typografie ist nicht nur für die Lesbarkeit eines Textes entscheidend, sondern ein wichtiger Bestandteil des gesamten Nutzungserlebnisses. Typografie als „Designsystem“ unterstützt die Gliederung von Inhalten und Funktionen. Sie erleichtert die Orientierung und verdeutlicht Interaktionen. Die Entwicklung neuer Schrifttypen für digitale Anwendungen und die Einführung von Webfonts ermöglichen es seit einiger Zeit, Websites an das Corporate Design von Marken anzupassen oder einen eigenständigen typografischen Eindruck nicht nur über Bilddateien, sondern über editierbaren Systemtext zu erzeugen. Goodbye Arial... Quelle: https://edgewebfonts.adobe.com/fonts
Bewegende Bilder sind das Tor in eine andere Welt Wir fordern hiermit kein Revival der beliebten Fototapete mit Sonnenuntergang, sondern sprechen von der Macht, die großformatige Bilder auf uns ausüben. Während das Cinemascope-Format schon Kinobesucher in den 60er-Jahren faszinierte, sind es heute vollformatige Abbildungen und Videos auf Internetseiten. Diese ermöglichen einen emotionalen Einstieg und beschleunigen die Wahrnehmung der Zusammenhänge. Wer also in ein markenspezifisches Bildkonzept investiert, kann eine Reihe von Vorteilen genießen: stärkere Identifikation und damit Markenbindung, höhere Verweildauer, ein lebendiges Storytelling und natürlich eine klare Differenzierung vom Wettbewerb. Quelle: https://www.airbnb.de/
Mit dem Zeigefinger den Lauf der Geschichte beeinflussen Scrollen, Sliden und Swipen, so nennen sich neudeutsch einige der Gesten, mit denen wir uns durch Websites und Anwendungen bewegen. Spätestens seit Tablets auf dem Markt sind, haben sich unsere Interaktionsmuster deutlich verändert. Was früher in hierarchischen Kategorien gestapelt wurde, kommt heute als interaktiver „One- oder Single-Pager“ daher. Und das nicht ohne Grund: Die lineare Struktur einer Scroll-Seite kann wie beim Film als Erzählstrang genutzt werden und so einen narrativen Ansatz verfolgen. Visuelle Effekte wie „Parallax Scrolling“ lassen die Bühne sowie den Hintergrund lebendig werden, und die Keyword-Dichte auf der Seite trägt positiv zur besseren Platzierung bei. Quelle: http://moto.oakley.com/
Bitte hier und jetzt den roten Knopf drücken Das wäre zwar nach wie vor einfach, denn ein roter Knopf verleitet jedes Kind, darauf zu drücken. Was danach passiert, wissen wir meistens nicht, und so verbirgt sich dahinter auch auf Websites so manche unliebsame Überraschung. Doch es geht auch eleganter und einfühlsamer: durch Smart Transitions. Im Prinzip verbergen sich dahinter komplexe Mikrointeraktionsmodelle, die eine Reihe von intuitiv gesteuerten Entscheidungen beim Nutzer unterstützen. Über eindeutige Click- und Hover-Gesten sowie animierte Scroll-Events und visuelle Übergänge bekommt der Nutzer mehr Informationen und wird unterschwellig bei der Erreichung seines Ziels unterstützt. Quelle: https://www.bluhomes.com/
Ganzkörpereinsatz für berauschende Erlebnisse Nun, nicht ganz was Sie jetzt vielleicht denken, aber der Mensch nutzt zur Kommunikation schon immer alle Ausdrucksformen, die ihm zur Verfügung stehen. Tastatur und Maus waren dabei eigentlich nicht vorgesehen, also ist es nur logisch, dass wir jetzt zu unseren „natürlichen“ Verständigungsmustern zurückkehren. So genannte „Tangible Interfaces“, die eine greifund fühlbare Interaktion ermöglichen, Mimik- und Gestensteuerung, die körperliche Signale verarbeitet, sowie Sprachsteuerung bieten zusammen genommen multisensorische Erlebnisse, mit denen sich Messen, Showrooms oder auch Lernanwendungen in erfahrbare Markenwelten verwandeln lassen. Quelle: https://www.leapmotion.com/
Daten sind das neue Öl Und auch diese müssen erst an die Oberfläche, sprich auf den Bildschirm gelangen. Doch der normale Mensch hat so seine Probleme mit dem Erfassen von Daten. Meistens sind sie viel zu abstrakt, und es erschließen sich keine Zusammenhänge. Informationen haben oft unterschiedliche Qualitäten und können nicht einfach miteinander in Kontext gesetzt werden. Abhilfe schaffen hier so genannte „Dashboards“, also übersichtliche Ansammlungen von Informationsgrafiken auf einem Bildschirm. Insbesondere in Service- und Verwaltungsapplikationen können diese von großem Nutzen sein, denn die Datenvisualisierungen helfen beim schnellen Erfassen und ermöglichen sogar Interaktionen. Quelle: https://www.geckoboard.com/
Wie sich die hier vorgestellten Interface Design Beispiele auf Ihr Unternehmen übertragen und zu innovativen Anwendungen und Services weiterentwickeln lassen, zeigen wir Ihnen gerne in einem persönlichen Gespräch. Wir freuen uns über Ihre Kontaktaufnahme. Dazu steht Ihnen Ronny Drews telefonisch unter +49 30 89658427 oder per E-Mail an r.drews@diefirma.de gerne zur Verfügung.
die firma . experience design Schwalbacher Straße 74 D-65183 Wiesbaden T +49 611 2385010 www.diefirma.de www.twitter.com/diefirma www.youtube.com/diefirmatube www.facebook.com/diefirma