Metro Design: Schweizer Designideen auch für Websites und Apps

Übersichtliche und nutzerfreundliche Oberflächen

Metro ist der Codename einer Typografie-basierten Design-Sprache von Microsoft. Ein Schlüssel-Prinzip ist es, sich besser auf den Inhalt von Anwendungen zu konzentrieren und mehr auf Typografie und weniger auf die Grafik. Frühe Beispiele von Metro Design Prinzipien können in Encarta 95 und MSN 2.0 gefunden werden. Die Designsprache im Windows Media Center und Zune wurden offiziell als Metro Design entwickelt und während der Enthüllung von Windows Phone 7 eingeführt. Unter dem Namen Microsoft Design-Sprache hat es sich seitdem zum Design von Produkten anderer Unternehmen entwickelt, darunter die Xbox 360-System-Software, Xbox One, Windows 8, Windows Phone und Outlook.

Die Formensprache Metro Design beruht auf den Gestaltungsprinzipien des klassischen Schweizer Grafik-Designs. Der Text wird als primäre Form der Navigation begünstigt. Microsoft Designer entschieden, um bei der Neugestaltung der Programmschnittstelle Zune einen stärkeren Fokus auf eine saubere Typografie zu legen. Dieser Grundsatz und die neue Zune-UI wurden mit dem Windows Phone eingeführt und danach auch auf das neue Betriebssystem Windows 8 angewandt. Flache farbige "Live-Kacheln" wurden während der Entwicklung des frühen Windows Phone in die Designsprache eingeführt.

Die Vorteile des Designs liegen in der intuitiven Nutzerführung. Statt wie bisher Icons auf einem Desktop zu suchen, navigiert der Nutzer beim Metro Design über Kacheln, die wie eine Vorschau funktionieren. Durch Antippen öffnet sich dann die Software. Die übrigen Elemente bleiben aber am Bildschirmrand präsent. Durch längeres Draufhalten auf eines der Elemente am Bildschirmrand wird es größer. Wischt man über den Bildschirm, dann verschwindet das Fenster mit der Software. Durch das Wischen über eine Gruppe von Kacheln gelangt man zu einer anderen Gruppe. So gewinnt der Nutzer durch Metro Design einen schnellen Überblick über die Inhalte. Metrodesign schafft klare Strukturen.

Für die Gestaltung von Website-Benutzeroberflächen für die Nutzung auf Touchscreens bietet Metro Design Chancen einer besseren Nutzerfreundlichkeit. Auch die Möglichkeit sich von anderen Websites optisch abzusetzen und dennoch eine gute Usability zu gewährleisten spricht für das Design. Wir beraten unsere Kunden über den Nutzen von Metro Design gerne bei der Realisierung solcher Benutzeroberflächen für E-Commerce oder CMS-Lösungen mit Magento, Shopware, OXID eSales und TYPO3.

Referenzen