UI-tendenser, der vil forme 2020

Lad mig spørge dig noget, der måske lyder lidt som science-fiction. Har det nogensinde fundet dig, at planeten Jorden måske har bevæget sig lidt hurtigere for sent - men vi skal endnu ikke bemærke det? Det ser ud til, at det først var i går, at vi gennemgik det, vi forventede, da vi flyttede ind i 2018. Alligevel mærkeligt nok er det næsten 2019 allerede!

Kom til at tænke på det, men 2018 har været et dæk i året for UI-design. Tingene er nu meget enklere sammenlignet med tidligere år - takket være de eksponentielle vækstdesignværktøjer, der har oplevet i nyere tid. Du behøver ikke engang at være en kodende guru længere for at oprette et professionelt udseende sted med stor UI på bare få minutter.

Og det dækker næppe basen. Ændringer i brugerpræferencer har også stor indflydelse på, hvordan vi har designet grænseflader i 2018.

At sætte det i perspektiv, 94% af internetbrugere stoppede med at have tillid til websteder med dårligt design - så der er simpelthen ikke plads til kompromiser længere.

Da rulning nu er bredt accepteret, prioriteres websteder ikke længere med at placere de bedste ting øverst. Du kan sprede dem forholdsmæssigt inden for grænsefladen. Men igen har vi lært at være ekstremt omhyggelige med det overvejelse 40% af de besøgende forlader, hvis det samlede layout viser sig at være lurvet.

Og det er ikke alt, hvad de hader. Brugere er også blevet trætte af kun indholdsskyvere 1% klikker på dem. Det er interessant, at afbøde det ved at fjerne indhold også ville være en forkert bevægelse siden 86% af besøgende på webstedet vil se kritiske produkt- og serviceinfo så snart landet på hjemmesiden.

Fascinerende, ikke?

Så lad os være ærlige - UI-design har aldrig været så spændende. Brugere ændrer sig, enhedsteknologi udvikler sig astronomisk, internethastigheden er nu på formel 1-niveau, og vi støttes af en lang række designværktøjer på nettet. Kombiner alt dette med de moderne UI-designerkompetencer, og du er helt sikkert enig i, at 2019 helt sikkert vil være endnu mere virkningsfuldt.

Så hvilke trends ser vi frem til?

Mobil først

Mobiloptimering er et buzzword, der tilsyneladende ikke går på pension snart. Tendensen har eksisteret i et par år nu for at sige det mildt. Og du har ret i at forudsige, at vi vil se øget vedtagelse af mobilbaserede UI-design i 2019.

Du kan også antage, at bortset fra den tilsvarende teknologi, er der intet nyt, der muligvis kommer frem i dette rum - i det mindste i de næste 12 måneder eller deromkring. Fair nok, men få dette ...

Du kan se, i ganske lang tid har vi først brugt den samme gamle tilgangsdesign til pc, inden vi skiftede til mobil. I retrospektiv var desktop UI hovedfokus, fordi størstedelen af ​​trafikken kom fra pc-brugere.

Derefter skete der noget interessant i slutningen af ​​2016- mobiltrafik overgåede i sidste ende pc-trafik. Ved udgangen af ​​det år var mobiltelefoner ramt 50.31% af markedsandelen, mens tabletter tilsatte op til 4.9%.

mobil markedsandel

Ikke desto mindre prioriterede vi dog stadig på desktop-grænsefladen, fordi det så skete, at pc-brugere fastholdt føringen i den kumulerede mængde tid, der blev brugt online. I Nordamerika var f.eks. Surfing af mobiltelefoner stadig bagud i 2017, hvilket tegner sig for 33% af surfetiden.

surfing tid

Nå, kom til at tænke på det, vi vidste alle, at det kun var tid til, at mobile i sidste ende fik fat på pc'er i dette også. Og i 2018 var tabellerne fuldstændigt vendt med mobiloptagelse 52.2% af alle globale websider.

trafikandel

Hvad betyder det for UI?

Til at begynde med forventer vi et skift i UI-designtilgang. Udviklere vil begynde at ændre deres prioriteter ved først at fokusere på mobil UI før de designer til pc. Mobilbrugere har forrang frem for pc-brugere.

Brug af skygger og dybde

Der kan ikke benægtes, at fladt UI-design har deres fordele. Men lad os indse det. De er nu blevet for ensformige og ganske vist ret kedelige.

Desværre var det udfordrende at bruge 3D-design på grund af den resulterende besværlige grafik. Indlæsning af en webside med f.eks. En 3D-grænseflade tog typisk længere tid end en med et fladt design.

Nå, indtil webbrowsere begyndte at forbedre sig markant. Og designere, på den anden side, udviklede en enestående teknik til at drage fordel af skygger for at introducere illusionen om dybde.

skygger og dybde

I 2019 forventer vi derfor at se en gradvis brug af skyggevariationer for at opnå forskellige 3D-interface udsigter.

F.eks. Kan designere, der søger at henlede opmærksomheden på specifikke elementer, skabe falske skygger med varierende grad af blødhed og intensitet. Slutresultatet er et element, der ser ud til at svæve over resten i 3D.

En anden populær teknik er at placere skygger i mønstre for at skabe forskellige niveauer af strukturer og derefter bringe interface-elementerne til live.

Gæt hvad så? De seneste fremskridt i UI-designværktøjer har yderligere udvidet den dynamik, der følger med disse designmetoder. Du kan nu let kombinere skygger med gitter og parallaxlayouts for systematisk at udvide den tilsvarende dybde og dermed opnå mere realistiske 3D-illusioner.

Med andre ord vil avanceret brug af skygger fortsat opnå en mere raffineret dybde på 2D-display. Og på den måde fjerne behovet for specielle 3D-skærme.

Minimalisme

I år 2000 spænder den gennemsnitlige menneskelige opmærksomhed, i det mindste ifølge en undersøgelse af microsoft, var 12 sekunder. Gæt hvad så? I 2015 var det overraskende faldet til 8 sekunder - underholdende kortere end en standard guldfisk.

Bare når vi troede, at det umuligt kunne blive værre, gjorde internettet folk mere utålmodige- 47% af dine besøgende forventer nu, at dine sider indlæses på mindre end 2 sekunder. De kan simpelthen ikke stå og vente længere. Faktisk forlader 40% af dem, hvis det tager længere end 3 sekunder.

Overraskende nok har mange webdesignere ikke taget dette alvorligt. Den nuværende gennemsnitlig sidehastighedshastighed er 8.66 sekunder- på trods af Googles anbefaling på færre end 3 sekunder for 2018.

sideindlæsningstider

Og det er ikke alt. Det viser sig, at situationen er betydeligt dårligere for mobilwebsteder, da de tager en gennemsnit på 22 sekunder at indlæse. Desværre hænger det desværre ikke 53% af de mobile sidebesøgere i mere end tre sekunder.

Men hvordan har dette at gøre med UI?

Selvom indlæsningshastigheder normalt bestemmes af flere faktorer, er det overordnede design af brugergrænsefladen særdeles ekstremt kritisk. Det er her kædereaktionen begynder.

Så hvad betyder dette for 2019?

Godt, Googles hastighedsopdatering i juli 2018 var begyndelsen på slutningen af ​​komplekse, grafik-tunge UI'er, der i væsentlig grad kompromitterer lastehastighederne. Vi skifter nu i stigende grad mod godt strømlinede magre minimalistiske UI'er, der indlæses meget hurtigere.

I det væsentlige indebærer minimalisme at opnå en ideel balance mellem enkelhed, bekvemmelighed og funktionalitet. Dette formår ikke kun at forbedre de samlede hastigheder og rangering af søgemaskiner, men også reducere den tilsvarende trafikhastighedsrate.

Overlappende effekter

Den moderne æra med grafisk design introducerede overlappende effekter for at kombinere flere lag, skabe en følelse af plads og vigtigst af alt gøre grænseflader mere fængslende.

Men hold på. Hvad er en overlappende effekt i første omgang?

Generelt involverer dette placering af elementer som billeder, tekst og farver for at overlappe hinanden stilfuldt. Jeg ved, at du allerede er stødt på overlappende grafik på flere websteder nu.

overlappende effekter

Nå, ganske vist, har designtrenden været ved at vokse betydeligt godt i løbet af de sidste par år. Men med moderne enheder, der nu kommer med meget bedre farvegradientgengivelse, forventes det, at 2019 vil udløse omfattende vedtagelse af overlappende effekter på både pc'er og mobile UI'er.

Samsung Mobile skiftede f.eks. Fra LCD-skærme til meget avanceret OLED-teknologi da de udgav Galaxy S7 for to år siden. Derefter tilsluttede Apple sig båndvognen med iPhone X, som nu har en større skærmkontrast end sine LCD-forgængere. Virksomheden har endda det planer om at opretholde dette på alle iPhone-modeller, der er planlagt til 2019.

Og hvem står mest for at drage fordel?

Som forventet drager den grafiske designverden meget fordel af dette for at skabe overlapninger med skarpere, sprødere gradueringer, der ser mere naturlige ud. Vi elsker, hvordan OLED-skærme væsentligt har afbødet det største problem med overlappende elementer - brugere bliver distraherede af de underliggende sekundære elementer på grund af dårlig kontrast.

Denne tendens vil også udløse udviklingen af ​​gennemsigtighed i UI-design. Vi vil se øget brug af "glaslignende" strukturer på UI'er, da designere drager fordel af gennemsigtighed for at få frem både primær og sekundær grafik samtidig, uden at nødvendigvis forstyrre den tilsigtede vægt.

Rammeløse design

Og stadig på moderne enheder har du helt sikkert bemærket det mest fremragende ved deres generelle udvendige design i dag. Nej, jeg taler ikke om, hvordan de nu overforbruger glas på stort set alle overflader.

Okay, jeg indrømmer, at det måske har noget at gøre med det. Af en eller anden underlig grund hader alle nu tilsyneladende visningsrammer. Større producenter af smartphone- og tv-skærme formindsker gradvist afstanden mellem skærmens kontur og deres tilhørende enhedskanter. For at afslutte udseendet vælger de at kombinere det med afrundede enhedskanter.

Samsung har endda gået foran med at fjerne kantrammer helt ved at udvide nogle af deres smartphone-skærme forbi kanterne. Apple har på den anden side besluttet at dække hele iPhone-ansigtet med skærmskærmen, hvilket kun giver plads til ørestykket.

rammeløs kant

Kom til at tænke på det, jeg antager, at det har alt at gøre med uendelig illusion - behovet for at få skærmen til at virke som en del af det naturlige miljø. Og for at være ærlig fungerer det ganske godt for brugere, der efter sigende finder skærmene for at være mere fordybende.

Måske overraskende nok er denne tendens spredt over til appbranchen. UI'erne skifter gradvist fra indrammede konturer til glatte linjer kombineret med afrundede kanter. Derfor har dette hjulpet grænseflader med at integreres problemfrit med enhedsskærmbillederne og derefter skabe et rammeløst perspektiv på fuld skærm.

Idet enhedsproducenter fortsætter denne tendens ind i 2019, forventer vi, at UI'er gradvist falder den gamle generation af skarpe kanter for glatte, afrundede, rammeløse design.

Micro-Animationer

De er subtile og kan til tider virke ubetydelige. Men den enkle sandhed er dette - mikro-animationer i UI'er har vist sig at være ekstremt magtfulde til at engagere og hjælpe brugere, når de navigerer.

Har du set de knapper, der ændrer farve, når du ruller hen over eller klikker på dem? Du har bestemt også stødt på menuindstillinger, der vises for at vise yderligere indstillinger, så snart markøren lander på dem. De er alle eksempler på mikro-animationer, der skaber små visuelle effekter til at berige brugeroplevelsen.

mikro-animationer

Da bevægelige elementer er særligt effektive til at fange opmærksomhed, er der allerede mange designere, der udnytter dem til at drive brugerne mod forskellige konverteringspunkter. Denne tendens er så udbredt nu, at jeg ville være villig til at satse en formue, at du ikke kan finde mere end fem websteder, der endnu ikke har implementeret en form for mikro-animationer.

Så få dette. Alle de dominerende webbrowsere understøtter i øjeblikket mikroanimationer tilfredsstillende godt på både pc og mobil. Så jeg vil sige, at tendensen er her for at forblive, når vi nærmer os 2019 - forventer, at UI'er kommer med systematisk strukturerede visuelle hierarkier.

Konklusion

Alt i alt har vi kun dækket nogle af de mest bemærkelsesværdige tendenser. Vi ser helt sikkert flere spændende ting op, når tiden går, og vi kan ikke vente til 2019 med at få bolden til at rulle.

Når det er sagt, hvad mener du nøjagtigt, at det kan vise sig at være den mest effektive UI-designtrend? Og hvilke andre bemærkelsesværdige tendenser vil du tilføje til denne liste?

header image med tilladelse fra Walid Beno

Bogdan Rancea

Bogdan er et grundlæggende medlem af Inspired Mag og har akkumuleret næsten 6 års erfaring i denne periode. På fritiden kan han lide at studere klassisk musik og udforske billedkunst. Han er også ganske besat af fixies. Han ejer allerede 5.