Materiaalontwerp: een blik op het webdesign van vandaag

materiaal ontwerp

Het is bijna twee jaar geleden dat Google ontwikkelde en aankondigde op de Google I / O-conferentie het materiaal ontwerp als een ontwerpverordening die zou worden geïmplementeerd en die, hoewel deze aanvankelijk was gericht op de reproductie van inhoud in het Android-besturingssysteem, bedoeld was om een ​​trend te worden op internet en op elk platform, iets dat we vandaag kunnen bevestigen. Hoewel we het af en toe hebben genoemd, is de waarheid dat we nooit zijn gestopt om deze codering diepgaand te bekijken, dus vandaag gaan we de principes en de meest karakteristieke kenmerken ervan herzien.

Wat zijn de bepalende kenmerken van materiaalontwerp? Wat heeft het te maken met de Flat Design-beweging?

Wat te zeggen over deze trend in webdesign?

De naam komt van de meest praktische betekenis, materie of materialen moeten op de meest efficiënte manier worden georganiseerd en gestructureerd en u zult zich erop concentreren. Deze beweging streeft vooral naar flexibiliteit, ergonomie en de mogelijkheid om een ​​website te vouwen en te vereenvoudigen. Maar niet alleen de ruimtelijke dimensie zal een belangrijke plaats innemen, maar ook die van de tijd, aangezien de elementen nu op bepaalde momenten bepaalde posities zullen innemen, dat wil zeggen dat dynamiek ook een sleutelfactor zal zijn. Bovendien zullen deze factoren onontkoombaar worden geleid door het intellect en de logica, wat uiteindelijk leidt tot een zoektocht naar realisme en de ruimtelijke representatie van fysieke materie, in feite houdt het rekening met de wetten van de fysica en daarmee de elementen (afbeeldingen, knoppen, panelen ...) kunnen elkaar niet kruisen omdat ze een groter gewicht en visuele dichtheid hebben, maar wat ze zullen doen is elkaar overlappen.

Orde, duidelijkheid, leesbaarheid

Al deze principes vloeien natuurlijk voort uit de manier waarop de grafische componenten worden beheerd en gedistribueerd, inclusief de typografie, die vooral een duidelijk leesbare oplossing zal zijn, de tekstuele structuur zal conventioneel en vloeiend zijn, visuele hiërarchie gemotiveerd door het gebruik van min of meer sterke tonen die contrasten genereren die ook door grootte en volgorde worden genuanceerd.

Verlichting en realisme

De logica komt vooral tot uiting in het gebruik van lichteffecten en het beheer van zowel licht als schaduw. Verlichting is een goede indicator van nabijheid, relevantie en situatie, en daarom zal het een fundamenteel instrument worden om de hiërarchie waarover we spraken te beïnvloeden. Nu zullen knoppen, afbeeldingen en alle elementen schaduwen hebben die de mate van nabijheid aangeven en ons helpen onszelf op het webpodium te positioneren.

Beweging is het meest effectieve hulpmiddel om de aandacht te trekken en de kijker te begeleiden

De taal zal duidelijk, grafisch en verhelderend zijn in de ogen van de gebruiker. Bij het kiezen van een optie of hulpmiddel, zal het ons benaderen, zijn afmetingen uitbreiden en omgekeerd wanneer we het niet meer gebruiken. Ook zal een item van kleur veranderen of knipperen als het absoluut onze aandacht moet trekken.

Ritme, orde, taal

Laten we niet vergeten dat we diep van binnen spreken in een discoursvorm. We doorlopen de bronnen die webdesign ons biedt en daarom hebben alle technisch-expressieve parameters een betekenis: van de volgorde van verschijnen, bijvoorbeeld eerst de afbeeldingen en dan de zwevende knoppen, tot de snelheid waarmee ze verschijnen, in welke richting ze doen het en met welk doel ze verhuizen. Dit alles is belangrijk omdat niet alleen de gebruiker wordt aangegeven waar de informatie vandaan komt, maar ook de reis wordt vergemakkelijkt, de elementen zijn gerangschikt om het leesproces intuïtief, gemakkelijk en plezierig te maken. Animatie en dynamiek zijn ongetwijfeld een basispijler.

Onbeperkt coderen

Al deze principes of normen die we herzien, zijn ontworpen en ontwikkeld voor implementatie op elk medium en platform, ongeacht de aard en de schermgrootte die het presenteert. Van mobiele telefoons, tablets of computers. Alle mogelijke ondersteuningen en bestemmingen ondersteunen deze beeldtaal en in feite is de transversaliteit en compatibiliteit ervan een van de essentiële ingrediënten.

Plat ontwerp is niet hetzelfde als materiaalontwerp

Hoewel ze veel gemeenschappelijke punten delen, zoals de toewijding aan het meest klinkende minimalisme, zijn er ook enorme verschillen tussen beide codes. Ze zijn echter niet onverenigbaar en kunnen zeker perfect worden gecombineerd om de beste afwerkingen te verkrijgen, maar daar zullen we in een later bericht over praten.


Laat je reactie achter

Uw e-mailadres wordt niet gepubliceerd. Verplichte velden zijn gemarkeerd met *

*

*

  1. Verantwoordelijk voor de gegevens: Miguel Ángel Gatón
  2. Doel van de gegevens: Controle SPAM, commentaarbeheer.
  3. Legitimatie: uw toestemming
  4. Mededeling van de gegevens: De gegevens worden niet aan derden meegedeeld, behalve op grond van wettelijke verplichting.
  5. Gegevensopslag: database gehost door Occentus Networks (EU)
  6. Rechten: u kunt uw gegevens op elk moment beperken, herstellen en verwijderen.

  1.   Erko Alfaro zei

    Fran, ik vond je publicatie erg interessant. Er is niet veel informatie in het Spaans over dit onderwerp. Dus als je geïnteresseerd bent, ik heb op mijn blog de Spaanse vertaling van de Material Design-specificatie. Net als jij, is het mijn interesse dat de informatie het grootste aantal mensen bereikt, zodat ze er hun voordeel mee kunnen doen.

    groeten

  2.   grafisch ontwerpstudio zei

    Zeer goed artikel !! Ik wist niets van "Material Design" maar van "Flat Design", al was het maar voor mijn persoonlijke smaak. Ik zal proberen enkele tips op te volgen.

    groeten
    David