Om du tittar på någon hemförbättring visar på tv, kan den mest upprepade frasen vara? Öppna konceptlayout.? Visste du att du kan göra din väg till en öppen konceptlayout i webbdesign också? Denna design trend är mer än bara en hemförbättringside.
Öppna koncept är ett roligt och funktionellt visuellt mönster som kan hjälpa användarna att navigera på din webbplats samtidigt som man styr digitala rotor. Så här gör du det med 10 mini-fallstudier och exempel!
Öppna Concept Primer
I hemdesign är en öppen konceptlayout en där flera utrymmen kommer samman på ett sätt som har ett flöde som maximerar utrymme från rum till rum, till exempel en stor planlösning för kök och bostadsutrymme.
? Det visuella flödet måste vara uppenbart för användarna, så de vet exakt vad de ska göra?I webbdesign är konceptet väldigt mycket detsamma. En öppen konceptlayout skapar utmärkt flöde mellan element på ett ljust och luftigt sätt. Designen maximerar användningen av vitt utrymme och använder enkla element med mycket harmoni, balans och ett enkelt flöde.
Användning av färg kan vara fet eller strömlinjeformad och sidorna kan innehålla en kort eller långrullning.
Dessa layouter fungerar ofta bäst med en detaljerad plan och flöde för designen som slutar i ett enda samtal till handling. Att försöka blanda och matcha för många delar och delar kan resultera i en jumbled design. Den viktigaste saken att tänka på när man arbetar med en öppen konceptdesign trend är att det visuella flödet måste vara uppenbart för användarna så att de vet exakt vad man ska göra med designen och hur man navigerar den.
GrowX
GrowX använder en bra kombination av vitt utrymme, rena bilder och text och en intressant funktion med en välvd rubrik för att blanda element i ett öppet utrymme.
Den lagringseffekt som används här med text och bilder är en vanlig teknik med öppna konceptdesigner. Använda lager kan hjälpa till att dra användaren från ett element till nästa och hålla det visuella flödet i rörelse.
Varningen med öppna konceptdesigner är att användarna kan gå vilse i rymden. Tack vare ett smart trick? och lagrade element, användare vet bara var man ska titta på den här webbplatsen.
NooFlow
Medan de flesta öppna konceptidéer gör att du omedelbart tänker på vitt utrymme som faktiskt är vitt, visar NooFlow att färgen kan vara lika fantastisk.
Designen blandar element med en balanserad text jämfört med bilddesign i en nästan skärmad estetik. Vad som sammanför allt är att medan ljuset är ljust är färgpalett enkelt. Genom att eliminera andra nyanser har den öppna designen ett flöde som känns enkelt och uppmuntrar användarna att flytta genom designen.
Open Wear
Open Wear använder ett komplett split-screen-koncept, men med riktning som riktar användarna i innehållsriktningen.
Denna design ser ännu öppnare ut tack vare bildval. Innehållet här gör det möjligt för mycket vit i bilderna som balanserar den vita bakgrunden. Sammantaget känns det visuella utrymmet luftigt och friskt även om det finns många element och visuella ingångspunkter.
Tänk på samma design med ett vänster foto som oftast är mörkt. Det skulle förändra hela konceptkonceptet och flödet.
Brightscout
Brightscout skapar flöde på ett diagonalt sätt från logotyp och navigering till textelement till en bild (eller vice versa, beroende på var ditt öga går först).
Det öppna konceptet ser här ut och fungerar väldigt som ett plan med ett hem med hjälp av designtekniken med samma namn. Det finns distinkta inträdespunkter med imaginära linjer som berättar användaren var man ska gå nästa.
Och uppmaningen till handling är accent med en stor knapp och färg. Funktionalitet är uppenbart och enkelt.
Duotix
Överdriven användning av rymden är ett vanligt tema när det gäller öppna begrepp. Rymden berättar användaren där en sak slutar och en annan börjar.
Duotix använder detta mönster av utrymme genom hela konstruktionen för att skapa visuell åtskillnad mellan innehållsblock, var och en med egna samtal till handling. Vidare, på rullningen växlar vita och färgade bakgrunder för att hjälpa användaren att röra sig. (Det är där det öppna konceptflödet kommer in.)
PopularPays
Med parallaxrullning, enkel animering och extrema marginaler, PopularPays, skapar du flera mellanslag för innehåll samtidigt som du skapar funktionalitet.
Bilderna och texten är engagerande, särskilt när de kombineras med animerade effekter.
Vad som är trevligt med den här designen är att det visar att flera trender kan fungera konsert för att skapa något som inte är överväldigande men har en tydligt modern känsla. Det tar rätt innehåll att dra av en design med flera trender, och i allmänhet fungerar enklare innehållsplaner bäst.
abel
Precis som några av de andra exemplen, lagrar Abel element för att hålla ögat flyttat från föremål till objekt. Vad som är trevligt med den här versionen av den öppna konceptplanen är att mycket av utrymmet ligger högst upp på sidan med tyngre saker nedan.
Samma visuella tema fortsätter på rullningen med mellanslag ovanför och under elementen för att skapa separata utrymmen i den öppna konceptdesignen.
Det här exemplet visar att inte alla e-handelswebbplatser måste ha en full och rörig känsla för att vara effektiva.
Hampshire Light
Skönheten i Hampshire Light-designen är att den använder en öppen koncept webbdesign för en hemdesign produkt. (Tala om trender som flyttar från digitala till fysiska världar!)
Vad som gör detta designarbete är användningen av asymmetriskt utrymme och ljus färg. Allt om designen innebär en öppen och luftig känsla, från gula accenter till transparent typografi över bilden till det öppna? logotyp.
En annan viktig detalj i denna design är överdriven linjeavstånd. Den lättare sans serif typsnittet kunde ha varit ett riskabelt val, men tack vare korta text- och avståndsledningar bidrar det till den övergripande känslan av den öppna konceptdesignen.
Walking Men
Med subtil animering, mjuk färg och gott om utrymme kan Walking Men få dig att tänka på högt i tak och möjligheter. Den enkla designstrukturen innehåller ett innehållselement per sida med en rolig klick-till-rullefunktion.
Estetiken är öppen och konstant och användaren har en känsla av att flytta från rymden till rymden, trots att de står stilla (teoretiskt) i ensidigt format.
krux
Crux kan innebära det öppna konceptets planlösning i mitt eget hem, med de tyngsta designelementen som drivs mot de yttre kanterna.
Centrallogotypen och call-to-action ger en uppenbar kontaktpunkt så att de andra elementen inte uppträder rörigt eller ur sin plats. Sidans sidnavigering drar allt tillsammans som en färdplan för sortering för penndesignen, vilket kan vara lite svårt för vissa användare att navigera med sin nästan runda form utan tydliga inmatnings- eller utgångspunkter.
Slutsats
Det finns en bra chans att du kanske redan införlivar några öppna koncept i dina mönster. Är det här en trend som du gillar?
Vi ser den öppna konceptdesignutvecklingen som något med viss uppehållskraft, eftersom den är förankrad i designteori. Layouts som använder utrymme väl kommer aldrig att gå ut ur stil (även om det vi kallar brukar tendera att förändras över tiden).