Material Design: Ein Blick auf das heutige Webdesign

Material Design

Es ist fast zwei Jahre her, seit Google auf der Google I / O-Konferenz das entwickelt und angekündigt hat Material Design Als Designregelung, die implementiert werden sollte und die sich zunächst auf die Reproduktion von Inhalten im Android-Betriebssystem konzentrierte, sollte sie zu einem Trend im Web und auf jeder Plattform werden, was wir heute bestätigen können. Obwohl wir es gelegentlich erwähnt haben, ist die Wahrheit, dass wir nie aufgehört haben, diese Kodierung eingehend zu betrachten, und deshalb werden wir heute ihre Prinzipien und ihre charakteristischsten Merkmale überprüfen.

Was sind die bestimmenden Merkmale des Materialdesigns? Was hat das mit der Flat Design Bewegung zu tun?

Was kann man zu diesem Trend im Webdesign sagen?

Sein Name kommt von seinem praktischsten Sinn, Materie oder Materialien müssen so effizient wie möglich organisiert und strukturiert werden und Sie werden sich darauf konzentrieren. Diese Bewegung strebt vor allem Flexibilität, Ergonomie und die Fähigkeit an, die Erstellung einer Website zu falten und zu vereinfachen. Aber nicht nur die räumliche Dimension wird einen wichtigen Platz einnehmen, sondern auch die der Zeit, da die Elemente jetzt zu bestimmten Zeiten bestimmte Positionen einnehmen, dh die Dynamik wird auch ein Schlüsselfaktor sein. Darüber hinaus werden diese Faktoren unausweichlich vom Intellekt und der Logik geleitet, was letztendlich zu einer Suche nach Realismus und der räumlichen Darstellung physikalischer Materie führt. Tatsächlich werden die Gesetze der Physik und damit die Elemente (Bilder, Schaltflächen, Bedienfelder ...) können sich nicht kreuzen, da sie ein höheres Gewicht und eine größere visuelle Dichte haben. Stattdessen überlappen sie sich gegenseitig.

Ordnung, Klarheit, Lesbarkeit

All diese Prinzipien ergeben sich natürlich aus der Art und Weise, wie die grafischen Komponenten verwaltet und verteilt werden, einschließlich der Typografie, die vor allem eine klar lesbare Lösung darstellt. Die Textstruktur wird konventionell und fließend sein, die visuelle Hierarchie wird durch die Verwendung von mehr motiviert oder weniger starke Töne, die Kontraste erzeugen, die auch durch Größe und Reihenfolge nuanciert werden.

Beleuchtung und Realismus

Die Logik manifestiert sich vor allem in der Verwendung von Lichteffekten und der Verwaltung von Licht und Schatten. Die Beleuchtung ist ein hervorragender Indikator für Nähe, Relevanz und Situation. Daher wird dies ein grundlegendes Instrument sein, um die Hierarchie zu beeinflussen, von der wir gesprochen haben. Jetzt haben Schaltflächen, Bilder und alle Elemente Schatten, die den Grad der Nähe anzeigen und uns helfen, uns auf der Webbühne zu positionieren.

Bewegung ist das effektivste Werkzeug, um die Aufmerksamkeit auf sich zu ziehen und den Betrachter zu führen

Seine Sprache wird in den Augen des Benutzers offensichtlich, grafisch und aufschlussreich sein. Bei der Auswahl einer Option oder eines Werkzeugs kommt es auf uns zu und erweitert seine Abmessungen und umgekehrt, wenn wir es nicht mehr verwenden. Außerdem ändert ein Gegenstand seine Farbe oder blinkt, wenn er unbedingt unsere Aufmerksamkeit erregen muss.

Rhythmus, Ordnung, Sprache

Vergessen wir nicht, dass wir tief im Inneren in einer Art Diskurs sprechen. Wir gehen die Ressourcen durch, die uns das Webdesign bietet, und daher haben alle technisch-expressiven Parameter eine Bedeutung: Von der Reihenfolge des Erscheinungsbilds, zum Beispiel zuerst die Bilder und dann die schwebenden Schaltflächen, bis zu der Geschwindigkeit, mit der sie in welche Richtung erscheinen sie tun es und zu welchem ​​Zweck bewegen sie sich. All dies ist wichtig, da nicht nur dem Benutzer angegeben wird, woher die Informationen stammen, sondern auch die Reise erleichtert wird. Die Elemente sind so angeordnet, dass der Lesevorgang intuitiv, einfach und unterhaltsam ist. Zweifellos ist Animation und Dynamik eine grundlegende Säule.

Unbegrenzte Codierung

Alle diese Prinzipien oder Standards, die wir überprüfen, wurden für die Implementierung auf jedem Medium und jeder Plattform entworfen und entwickelt, unabhängig von ihrer Art und der Bildschirmgröße. Von Mobiltelefonen, Tablets oder Computern. Alle möglichen Unterstützungen und Ziele unterstützen diese visuelle Sprache, und tatsächlich ist ihre Transversalität und Kompatibilität einer ihrer wesentlichen Bestandteile.

Flaches Design ist nicht dasselbe wie Materialdesign

Obwohl sie viele Gemeinsamkeiten haben, wie zum Beispiel das Bekenntnis zum durchschlagendsten Minimalismus, gibt es auch enorme Unterschiede zwischen beiden Codes. Sie sind jedoch nicht inkompatibel und können sicherlich perfekt kombiniert werden, um die besten Ergebnisse zu erzielen. Wir werden jedoch in einem späteren Beitrag darauf eingehen.


Hinterlasse einen Kommentar

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

*

*

  1. Verantwortlich für die Daten: Miguel Ángel Gatón
  2. Zweck der Daten: Kontrolle von SPAM, Kommentarverwaltung.
  3. Legitimation: Ihre Zustimmung
  4. Übermittlung der Daten: Die Daten werden nur durch gesetzliche Verpflichtung an Dritte weitergegeben.
  5. Datenspeicherung: Von Occentus Networks (EU) gehostete Datenbank
  6. Rechte: Sie können Ihre Informationen jederzeit einschränken, wiederherstellen und löschen.

  1.   Jerko Alfaro sagte

    Fran, ich fand deine Publikation sehr interessant. Es gibt nicht viele Informationen auf Spanisch zu diesem Thema. Wenn Sie interessiert sind, habe ich die spanische Übersetzung der Material Design-Spezifikation in meinem Blog. Mein Interesse ist wie bei Ihnen, dass die Informationen die meisten Menschen erreichen, damit sie sie nutzen können.

    Grüße

  2.   Grafikdesign-Studio sagte

    Sehr guter Artikel !! Ich wusste nichts über "Material Design", sondern über "Flat Design", wenn auch nur für bestimmte Geschmäcker. Ich werde versuchen, einige der Tipps zu befolgen.

    un saludo
    Christian