Bye bye materiale design

Overvejer du materialedesign til dit næste projekt? Tænk igen.

“Crystal Gradation” af Paul Klee (1921)

Før du læser…

Hvis du synes, du er for følsom til at læse tekst skrevet med kritisk tænkning, skal du være opmærksom, hvis du vil efterlade en kommentar. Der var så mange kommentarer, der kun er produkter af mærkelig, betinget forbindelse til dette “værktøj”, som resulterede i at forfattere skrev irrelevant tekst, med følelsesmæssigt drevet reaktion. Husk, at intet værktøj er perfekt, og at kritisere dem kun hjælper dem med at forbedre og verden bliver et bedre sted. Husk desuden mindst, at dette er en meningsartikel (i modsætning til mange andre på nettet), som du har al din ret til at være uenig i.

Hvad designretningslinjerne som Material Design (herefter MDG) har forsøgt at opnå, var først at tjene dets skabers interesser; så at sige Google hvilke MDG der blev oprettet til og af. Derefter, og følgelig, var det at skabe en slags web-literacy for slutforbrugerne af WWW. Denne internetlitteratur betyder dybest set at skabe brugsvaner for mennesker, der bruger daglig information hver dag og går rundt på forskellige platforme i mellemtiden uden kontinuerligt at forbruge og producere data.

World Wide Web er en kæmpe jungel. Alt er bare en støjfaktor i et uendeligt kosmos, ligesom det er i selve naturen.

Lad os først dekonstruere, hvorfor Materialedesign ikke passer godt til de fleste applikationer, i hvert fald i resten af ​​det 21. århundrede.

Forkert fundament

MDG blev bygget ikke med så meget dybtgående designviden, der spænder over århundreder (Gestalt, Vitrivius osv.). Det blev bygget kun med en relation til materiale i den virkelige verden, deraf navnet… Det, de overvejede og prøvede at gentage, var det virkelige livsfænomener af materiale, hovedsageligt papir, for at være materialet i læsning (antager jeg).

Dette er en for tidlig, lavvandet og uden tvivl forkert tilgang til design til nettet. Hvorfor? Hovedårsagen er, at opfattelsen af ​​information adskiller sig meget fra papir (er) til skærm (er), og ikke kun mellem disse to gigantiske koncepter; men også forskellige kontekster inden for hvert af disse anvendelsesområder.

Først og fremmest med "papir" og "blæk"; hvad henviser du til? Henviser du til avis, magasin eller en roman eller en leksikon eller en illustrationsbog, en børnebog eller en tegneserie eller en plakat eller et tegn eller hvad? Alle disse verdener har deres individuelt forskellige designprincipper for deres implementering, som ikke engang kan udskiftes i mellem. Så hvordan kan du tage det helt og anvende til en helt anden?

Og nettet er i sig selv et kæmpeområde, der er meget tydeligt.

Shade Porn

MUI har denne papirkomponent, der er overalt. I ingen anden løsning, som jeg har set, udfyldes visuelle oplysninger for at stakke ting oven på hinanden så meget. Jeg mener, at du ikke klipper stykker af en avis og stakler de stykker oven på hinanden, mens du læser på en søndag morgen, gør du?

Tjek dette fra Google Cloud Platform, der bruger MDG:

Prøv at give mening om det virtuelle 3D-rum, der er skabt uden grund, men en forvirring forårsaget af genstande, der forsøger at tiltrække brugerne opmærksomhed ved at simulere en illusionær afstand til seernes øje ...

Jeg kender dig ikke, men jeg vil ikke have, at en webside skal vises, som flere mennesker forsøger at sælge mig forskellige ting på samme tid i en basar.

En bruger har en opmærksomhed til enhver tid, og det respekteres bedst af ethvert givet medium, som hun midlertidigt interagerer med.

Et andet eksempel er dette virkelig interessante, men underlige. Kan du finde illusionen på dette billede nedenfor?

Applinjen (øverst) vises over hovedindpakningen, men ikke navigationen. der vises på samme højde som indpakningen. Så hvordan er det muligt i den virkelige verden?

Du kan sidde fast i dette og aldrig komme nogen steder, ligesom i MDG

Årsagen til at jeg ønskede at dele denne særlige information er, at det faktisk er uden for dækningen af ​​dette eksempel. Brugen af ​​papirkomponenten i MDG og dermed MUI er allestedsnærværende, og på grund af alle de givne nuancer er designere og udviklere sandsynligvis nødt til at konfrontere sådanne problemer, som de bliver nødt til at løse, hvis de vælger at vedtage MDG.

Interaktion mellem mennesker og maskiner

MDG blev lavet primært (men ikke udelukkende) til mobil (især til Android-apps i Play Store). Mobil betyder ikke kun "mindre skærme". Det betyder også interaktion med finger vs mus. Finger er langt større end musen, og det har forskellig følsomhed og handlinger implementeret for at arbejde på en enhed og dens skærm. Derudover betyder det, at de operationer, der kan udføres på en skærm på mobilen, er meget mere begrænsede end de er på skrivebordet på grund af størrelsesproblemer. Der er lige så mange detaljer, som MDG og MUI adresserer på en god måde, men disse svarer ikke nødvendigvis til de fleste applikationers behov og sammenhængen meget godt.

Hvis du udvikler en app primært til Android eller generelt på mobil, og du ikke har meget designressourcer; Du kan helt sikkert drage fordel af at vedtage MDG. Ikke desto mindre opfordres det meget til at sikre, at du ikke tager alt, som det er tildelt, og at du tilpasser det til dine egne behov. Ikke desto mindre kan dette i sidste ende tage dig mere tid end at opbygge dine egne retningslinjer inspireret af alle andre ...

Overvældende overvågningsindikatorer

Jeg må først indrømme, at dette har været en god måde at indikere brugerne på, hvor de berører en given berøringsskærmsenhed i betragtning af den tvetydige karakter af finger-skærmens håndgribelighed. Det har også været nødvendigt; da brugerne ikke med det samme får at vide, hvor de rører ved.

Men herregud, det kan let være overvældende:

Overlever du at kigge på dette i mere end tiår, slet ikke bruge det længe?

Da MDG blev udviklet til slutforbrugere på mobile enheder (hovedsageligt til Android-apps grundlæggende), blev brugsfrekvensen betragtet som temmelig lav (pr. App). Således lavede de mange interaktioner visuelt ret resonante (som når du berører / klikker der er en cirkelanimation, der angiver, hvor du klikker). Dette skyldes, at brugere, der ikke rigtig kender dynamikken i en mobilapp, kunne have en let forståelse af deres interaktion med øjeblikkelig feedback. Så selv når de bruger forskellige apps, er der en sammenhæng i hele oplevelsen.

Ikke desto mindre kan disse interaktioner let være overvældende for sådanne brugere, der bruger en dataintensiv applikation efter kort brugstid og distraherer dem fra, hvad de vil gøre. Der er mange forskelle, der opstår mellem vanerne hos mennesker, der sidder på deres sofaer ved hjælp af en bestemt app en gang imellem på en telefon - vs. - mennesker, der bruger en tung, datastyret desktop-applikation konsekvent, som et krav til, måske, deres daglige arbejde, som de får betalt for.

Så der er så mange forskelle, man skal tage højde for, når man designer til primært desktop vs mobil og høj kontra lav brugsfrekvens.

Dårligt antal datakomponenter

Hvad er en data-oprindelig komponent? Det er en slags komponent, der primært er designet og bygget til enten: visning, indtastning eller tilpasning af et givet dataindhold i stedet for at fokusere på den form, det tager. F.eks. Er skuffe en ikke-data-oprindelig komponent, skønt den kan indeholde nogle. Der henviser til, at tabel eller form eller endda foder er gode eksempler på data, der stammer fra data. Du kan se gode eksempler på hver af disse komponenter, hvis du klikker på de givne links for også at se de biblioteker, de tilhører.

Formularer er måske de mest anvendte komponenter i vores tidsalder og er derfor svære at designe og opbygge sammenhængende. MUI-bibliotek har ikke engang en komponent, der beskæftiger sig med det (Det har kun de grundlæggende inputkomponenter) Eksempel er hentet fra Ant.design som en god en

Det glemte anker nævnes ikke engang

Dette afsnit tilføjes, efter at artiklen er offentliggjort (25. januar, 2018)

I MDG er der 4 (fire) forskellige sektioner dedikeret til knapper.

Der er dog ingen oplysninger om et af de mest grundlæggende elementer i historien til HTML: anker:

Jeg synes personligt, at dette er meget trist. Forankringer skaber forbindelserne, der giver os mulighed for at navigere gennem WWW uden at skulle forpligte os til noget. De er grundlaget for interoperabiliteten af ​​nettet. Du kan klikke på et link fra en artikel til en anden og surfe rundt på weblæsning, og det hele takket være de hyperlinks, der aktiverer det. Desuden bruges ankere eller bare “links” ofte til også at navigere i en web-applikation. Det er bare et meget grundlæggende aspekt af Internettet.

Forankringer er i modsætning til knapper også en god måde at holde læsefærdigheden konsistent på; ved at bevare typografien på et afsnit og samtidig give midler til at hoppe ud af det uden visuel rod.

Ikke desto mindre nævner Material Design ikke det engang. Dette er for mig et bevis på, at det primært eller endda udelukkende er lavet til apps, især Android.

Konklusion

Retningslinjer for materialedesign og bibliotekerne, der er oprettet i overensstemmelse hermed, har tidligere behandlet mange af de problemer, som det 21. århundrede har brug for, lige siden. Først og fremmest er det bare en "konsistens" af den samlede oplevelse. Når vi bruger 100'erne af forskellige UI'er, ønsker vi som brugere at vide, hvad der er en knap, og hvad er en menu dybest set ...

Selv hvis en designretningslinje eller bare designet i sig selv er "dårlig" eller "dårlig", hvis det er tilstrækkeligt udbredt; så bliver det konsistent for brugerne, fordi brugerne skaber deres vaner i overensstemmelse hermed. Jeg tror, ​​Material Material har opnået et godt mønster for at opbygge en mere engagerende brugsadfærd, der omdanner folk fra Facebook-nyhedsfeeds tilskuere til knudepunkter, der aktivt træffer en beslutning og kan klikke på en knap.

MEN, hvad jeg prøver at promovere er at engagere brugerne til at opleve weblitteratur bedre. Vi har ikke brug for flere smarte knapper eller smarte overgange. Vi har ikke brug for et sexere nyt bibliotek. Det, vi har brug for, er at informere mennesker bedre og udarbejde bedre og sundere retningslinjer, der tager fat på grundlæggende menneskelige opfattelsesparadigmer. Vi har ikke noget valg at inspirere fra Gestalt-principper, Vitrivius-principper og enhver anden, der er lavet i historien.

Hvis du har brug for andre, skal du tage lidt tid på at undersøge, og vær ikke bange for at skabe en raffineret og syntetiseret ved hjælp af andre. Personligt har ant.design (oprettet af Alibaba) virkelig imponeret og inspireret mig til at fortsætte forskningen på dette og uddybe det videre.

Her er allerede en samling af en blanding af både retningslinjer og biblioteker, som du kan bruge:

Tak til Doruk Demircioğlu for at have peget på dette: https://adele.uxpin.com/