10 webbdesigntrender att titta på år 2018

När 2017 avvecklas är det en bra tid att reflektera över prestationerna under det gångna året och börja tänka på mönster som ännu inte kommer att komma.

Om man tittar på senare design, redesigner och till och med bara design tweaks, börjar några tydliga trender framstå som de främre löparena i 2018. Här är en titt på några av webbdesigntrenderna som sannolikt blir populära (och många av dessa koncept kan också användas för tryckdesign).

1. Asymmetriska nät

Åldern för perfekt symmetri är över. Medan splitskärmsdesign var en stor trend år 2017, utvecklas den perfekta halv och halv visuella konturen.

Designers delar upp de visuella elementen på skärmen med ett mer asymmetrisk rutmönster.

För att få det här konceptet att fungera måste det finnas ett tydligt balans mellan element så att den ena sidan av designen inte överväldigas. Rymd- och textelementen balanserar ofta bilder som hjälper till att rita ögat över designen.

Och allt kommer samman eftersom mönstren fortfarande lever på ett galler, vilket hjälper till att hålla allt organiserat. (Elementen i Club of the Waves design ovan, är organiserad på ett sådant sätt, vilket är anledningen till att den asymmetriska designen känns så balanserad.)

2. Mer ljus färg

Ljus färg verkar vara designtendensen som bara vill hålla fast. Det var en stor del av plattformen och lika viktigt för Material Design, och båda koncepten är fortfarande en del av många projekt.

Även utan egenskaper av platt eller Material är djärv färg iögonfallande och kan hjälpa till att dra en användare till en design. Ljusa och djärva färgval har en ny känsla och överklagande till yngre användare.

Dessa färgval kan också skapa en oväntad estetik och skapa en funkier vibe för webbplatser och företag som kanske inte är kända för den här tonen. Ford, ovanför, kommer inte att tänka på som ett progressivt, höftföretag, men designen för Make It Drivable microsite utstrålar dessa känslor.

3. Bottom Sticky Elements

Alla de små annonserna längst ner på applikationer och mobila webbplatser gör sig också till skrivbords- och surfplattformar. Och det är inte bara annonser i den här skärmen, chattlådor, popup-fönster, meddelanden och även navigationselement håller sig fast på skärmens undersida.

Denna mindre obtrusiva plats är ett utmärkt visningsområde och mobilanvändningen har utbildat användare att dessa typer av placeringar är acceptabla.

Och om det fungerar. En annons längst ner på skärmen, som den från Burlap och Blue bloggen ovan, verkar bara så mycket mindre i vägen (och mindre i ditt ansikte) än en märkskylt. Användaren ser det fortfarande, men det döljer inte innehållet.

4. Röst- och naturligt språksökning

Framtiden för webbdesign är inte 100 procent visuell. En del av det hörs.

Från att utforma gränssnitt som kan? Höra? och förstå röstkommandon för att införliva söktermer som efterliknar naturligt språk, integrera en värld av röst och språk kommer att vara absolut nödvändigt för webbdesignprojekt.

Och medan några av dessa andra trender kanske inte är ännu mer populära i slutet av 2018, kommer röst- och natursprogsökning bara att växa i bruk och popularitet. Du bör börja planera för det nu så att du enkelt kan integrera den i framtida projekt.

5. Vätskeformer

Medan skarpare polyformer och geometri var stora år 2017, blir mjukare former med en mer flytande look och till och med animeringar alltmer populär.

Mjuka linjer är en naturlig utveckling av polygonstrenden. När Design Shack presenterade poly-former trenden tidigare i år, läser beskrivningen? En av de bästa delarna av denna mångsidiga trend är att var och en av dessa mönster är så annorlunda.? Polygoner är vanligen plana, tvådimensionella former, även om det på webbplatsen är några polygoner som animerar drag och verkar ha mer 3-D egenskaper.

Samma kännetecken håller för mer flytande former; nyckelfaktorn är att i stället för skarpa skärande linjer är varje form gjord av släta kurvor som strömmar genom hela konstruktionen.

6. Subtile Animation

Små, enkla animeringar kan överraska och glädja användare. De kan också hjälpa till att ge information och leda användaren genom ett mer aktivt engagemang med designen.

Men subtil animering handlar inte om en laddningsfunktion som döljer fördröjningstid, det är rörelse inom själva konstruktionen.

Från svävar till filmer till illustrationer som verkar komma till liv, kan subtil rörelse vara ett utmärkt verktyg för att bidra till att skapa användarengagemang. För att få ut det mesta av subtil animering i designen håller du dig till ett par grundläggande regler: Välj bara en animation? Trick? och hålla fast vid det, animationen ska känna sig realistisk och efterlikna fysikens lagar, tvinga inte ljud eller klicka på åtgärder för rörelse och se till att animationen spelar på en pålitlig slinga så att användarna vet när animationen är klar. (Det är ett tecken på att de kan gå vidare för att göra de saker de kom till webbplatsen för i första hand.)

7. SVG-bilder

Skalerbar vektorgrafik blir allt vanligare som de-faktorens bildtyp för webbplatser. SVGs är lätta vektorgrafik som säkerställer att grafik, ikoner och logotyper ser pixel perfekt oavsett skärmstorlek eller upplösning.

Alla skärmar med hög upplösning bidrar till ökningen av detta filformat.

SVGs fungerar också bra med stillbilder och multimediebildsupplevelser, inklusive 3D-bilder, filmtecken, logotyper och 360 graders fotografering.

8. Split Screen Desktop, Stacking Mobile

Split-skärmdesignmönster växer bara i popularitet. Även de mer perfekt splittrade stilar.

Dessa mönster är så populära eftersom de ger bra upplevelser på både skrivbordskärmar och mobila enheter eftersom delat innehåll visas sida vid sida och staplas lika bra. (På så vis finns det en konsekvent men enhetsspecifik upplevelse för användarna.)

Medan många tidiga split-skärmdesigner verkligen delades upp väljer många designers en split-skärm, plus ett extra toppskikt med text eller branding för att ge en effekt som har mer djup.

9. Fler Scrolling Animationer

Parallaxrullningsanimationer har varit så populära att vissa designers börjar skaka bort från dem. Men det betyder inte att du måste skrapa animeringar helt och hållet.

Det finns många andra sätt att använda rullning för att uppmuntra användarengagemang. (Och du kan också blanda i en liten parallax, bara bli inte galen med den.)

Doggo for Hire ovan, använder en rullningsanimering som släpper konfetti på hunden som bilden visar när användarna bläddrar. Rullningen dikterar hur snabbt konfetti faller (och även uttrycket på hundens ansikte när det händer). Bläddra snabbt för en upplevelse av videostil; bläddra långsammare för att ta in allt innehåll på vänster sida av skärmen.

Letar du efter mer scroll-action inspiration? Hitta det här.

10. Vit utrymme utan minimalism

Designers älskar vitt utrymme. (Många av oss älskar också minimalism, även om kunder inte älskar det så mycket.)

Kompromissen är utformad med gott om vitt utrymme, men med en mycket mindre minimalistisk känsla. Genom att lägga till fler färg- och designelement till en design med mycket utrymme kan den känna sig mer full.

Designkalender gör ett bra jobb med utrymme och förpackning med innehåll och element samtidigt - se till att klicka på exemplet och bläddra igenom för att se det i åtgärd - så att det finns gott om plats för överdimensionerade element att andas.

Designers arbetar med vitt utrymme på många andra sätt också. Ta en titt tillbaka genom många av de andra ovan nämnda trenderna och hur mycket vitt utrymme spelar en roll där också.

Slutsats

Börjar det nya året inspirera dig att prova något nytt? Kommer det att vara en av dina resolutioner?

Var noga med att använda designtrenderna med omsorg. Ibland kan de bästa idéerna växa daterat snabbt. Andra slutar med en mer tidlös känsla; Röstgränssnitt är förmodligen här för att stanna ett tag. Prova dem, byt till en befintlig design och ha kul. Det är det som spelar med designtrender handlar om.