Das könnte dich auch interessieren

Du hast deinen AdBlocker an?

Es wäre ein Traum, wenn du ihn für t3n.de deaktivierst. Wir zeigen dir gerne, wie das geht. Und natürlich erklären wir dir auch, warum uns das so wichtig ist. Digitales High-five, deine t3n-Redaktion

Design

Material Design: Google enthüllt neue Designsprache für Android, Chrome und das Web

    Material Design: Google enthüllt neue Designsprache für Android, Chrome und das Web
(Quelle: Google.com)

Google hat auf seiner Entwicklerkonferenz eine neue, produktübergreifende Designsprache namens „Material Design“ vorgestellt, die zukünftig auf alle Produkte (Android, Chrome und Googles Webseiten) angewendet werden soll.

Neue Designsprache „Material Design“ für alle Produkte – auch für Smartwatches

Als erste Neuerung hat Google auf seiner eigenen Entwicklerkonferenz in San Francisco eine neue Designsprache vorgestellt. Mit dem Namen „Material Design“ soll dieser Look zukünftig auf alle Geräte und alle Produkte von Google gebracht werden. Dabei bietet Google Vorschriften und Anweisungen für sämtliche Formfaktoren: Laptop, Tablet, Smartphone, Fernseher und Smartwatch.

Material Design: Grundstein für Android „L“

Sowohl die neue Android-Version „L“ soll „Material Design“ verwenden, als auch Chrome-Produkte und Googles diverse Webdienste, wie etwa Google+ und wahrscheinlich auch die Google-Suchseite.

Das neue „Material Design“ von Google wird auch auf die Gmail-App angewendet. (Screenshot: youtube.com)
Das neue „Material Design“ von Google wird auch auf die Gmail-App angewendet. (Screenshot: youtube.com)

Alle Elemente verfügen über eine Tiefen-Koordinate

„Material Design“ sieht auf den ersten Blick aus wie herkömmliches Flat-Design welches in den letzten Jahren in der UI-Szene besonders populär geworden ist. Einige Google-Produkte setzen schon jetzt fast vollständig auf den neuen Look, zum Beispiel Google+. Die Ähnlichkeit zum Flat-Design beruht darauf, dass auch das neue Material Design stark auf Icons und Schriftarten als tragende Design-Elemente setzt. Deswegen hat Google auch die hauseigene Android-Font „Roboto“ noch einmal verfeinert.

Außerdem kommen großflächige, einfarbige Elemente zum Einsatz mit kontrastreichen und sehr bunten Farben. Im Gegensatz zum klassischen Flat-Design verfügen UI-Elemente im Material Design allerdings nicht nur über eine X- und Y-Koordinate auf dem Bildschirm, sondern auch über eine Z-Koordinate, also einen dreidimensionalen Faktor. Damit kann Google die Elemente unabhängig voneinander überlagern, animieren und deren Schatten berechnen – also gar irgendwie gar nicht so flat.

Im „Material Design“ verfügt jedes UI-Element auch über einen z-Index, also eine  Tiefen-Koordinate. (Screenshot: Youtube.com)
Im „Material Design“ verfügt jedes UI-Element auch über einen z-Index, also eine Tiefen-Koordinate. (Screenshot: Youtube.com)

Material Design: Ausführliche Guidelines und Ressourcen ab sofort erhältlich

Alle ausführlichen Guidelines und Details für App-Entwickler finden sich ab sofort auf der zugehörigen Google-Seite. Dort schreibt Google auch vor, wie Animationen innerhalb einer App gestaltet werden sollen. Außerdem gibt es eine kompakte, und abstraktere Vorstellung der neuen Designsprache in einem 12-seitigen PDF-Dokument.

http://t3n.de/news/wp-content/uploads/2014/06/Google_Material_Design_01-595x371.jpg

1 von 17

http://t3n.de/news/wp-content/uploads/2014/06/Google_Material_Design_16-595x371.jpg

2 von 17

http://t3n.de/news/wp-content/uploads/2014/06/Google_Material_Design_14-595x371.jpg

3 von 17

http://t3n.de/news/wp-content/uploads/2014/06/Google_Material_Design_15-595x371.jpg

4 von 17

Das neue „Material Design“ von Google wird auch auf die Gmail-App angewendet. (Screenshot: youtube.com)
Das neue „Material Design“ von Google wird auch auf die Gmail-App angewendet. (Screenshot: youtube.com)

5 von 17

http://t3n.de/news/wp-content/uploads/2014/06/Google_Material_Design_13-595x371.jpg

6 von 17

http://t3n.de/news/wp-content/uploads/2014/06/Google_Material_Design_11-595x371.jpg

7 von 17

http://t3n.de/news/wp-content/uploads/2014/06/Google_Material_Design_09-595x371.jpg

8 von 17

http://t3n.de/news/wp-content/uploads/2014/06/Google_Material_Design_10-595x371.jpg

9 von 17

Im „Material Design“ verfügt jedes UI-Element auch über einen z-Index, also eine  Tiefen-Koordinate. (Screenshot: Youtube.com)
Im „Material Design“ verfügt jedes UI-Element auch über einen z-Index, also eine Tiefen-Koordinate. (Screenshot: Youtube.com)

10 von 17

http://t3n.de/news/wp-content/uploads/2014/06/Google_Material_Design_06-595x371.jpg

11 von 17

http://t3n.de/news/wp-content/uploads/2014/06/Google_Material_Design_07-595x371.jpg

12 von 17

http://t3n.de/news/wp-content/uploads/2014/06/Google_Material_Design_04-595x371.jpg

13 von 17

http://t3n.de/news/wp-content/uploads/2014/06/Google_Material_Design_05-595x371.jpg

14 von 17

http://t3n.de/news/wp-content/uploads/2014/06/Google_Material_Design_02-595x371.jpg

15 von 17

http://t3n.de/news/wp-content/uploads/2014/06/Google_Material_Design_03-595x371.jpg

16 von 17

http://t3n.de/news/wp-content/uploads/2014/06/Google_Material_Design_vorschau-595x313.jpg

17 von 17

Finde einen Job, den du liebst zum Thema Android

7 Reaktionen
Granaton
Granaton

Die Entwicklung war schon lange abzusehen. Als Reaktion auf Euren schön recherchierten Artikel über Flat Design Anfang 2013 habe ich Eure Beispiele genauer analysiert und fast überall auch die Raumperspektive darin entdeckt. Erinnert Ihr Euch noch an meinen Kommentar dazu? Das ist jetzt eineinhalb Jahre her. Flat Design mit Perspektive.
http://granaton.com/das-flache-netz/
Google hat einen Namen dafür vergeben und Spielregeln dazu verfasst. Neu ist der Trend aber nicht.

Antworten

ben_
ben_

Ach und … die Messlatte ist ja gerade bei Android nicht die UI-Vorgaben von Google, sondern die Frage, ob sich da überhaupt jemand dran hält. Die katastrophale UX von einem durchschnittlichen Android, entsteht ja durch das Chaos, dass all die Third-Party-Apps anrichten, die meinen, sie wüßten es besser.

Antworten

ben_
ben_

Schön. Ich weiß noch, wie beeindruckt ich vor über zwei Jahren zum ersten Mal ein Windows-Phone in den Händen hatte. Das sagt ja auch einiges über Google aus, dass sie zwei Jahre brauchen, um das einzusehen und zu kopieren.

Antworten

cephei
cephei

Metro Design mit neuem Namen?

Antworten

Andreas
Andreas

Sehr gelungenes Design

Antworten

Björn Dorra

Sehr schöne Konventionen für Anwendungen. Jetzt dürfen wir mal gespannt sein, wenn "uns" Entwicklern auch Code gezeigt wird...

- Björn Dorra, Founder http://netzaktiv.de

Antworten

Melde dich mit deinem t3n-Account an oder fülle die unteren Felder aus.

Abbrechen