Geriausias 2021 m. Svetainės dizainas

Puslapis 1 iš 3: „Neverlands“ pagal aktyvią spalvą

Ne kiekviena interneto patirtis turi būti novatoriška, vizualiai pribloškianti ir kupina netikėtų staigmenų. Dažniausiai svetainės lankytojai tiesiog nori greitai ir lengvai rasti ieškomą informaciją.

Tačiau lygiai taip, kaip madingesniuose podiumuose esantys išoriškesni drabužiai gali subtiliai paveikti aukštesnėje gatvėje randamus labiau dėvimus drabužius, verta interneto dizaineriams bent pusė akies stebėti aukštesnį tinklalapio kūrimo galą. Net tie, kurie atrodo pernelyg prašmatnūs, vis tiek gali suteikti jums įkvėpimo ir idėjų, kurias galite įvairiai įtraukti į savo dizainą.

Atsižvelgdami į tai, mes atsigręžiame į tuos dizainus, kurie jaučiasi tikrai nustumti voką. Šios svetainės ne tik atlieka pagrindinį uždavinį aptarnauti lankytojus to, ko jie ieško, be rūpesčių, bet ir permąsto, kaip svetainė gali atrodyti ir veikti šviežiais, išradingais ir originaliais būdais.



01. „Neverlands“ pagal aktyvias spalvas

Neverlands pagrindinis puslapis

Navigacija pagrįsta stebuklinga valtimi(Vaizdo kreditas: „Active Color“)

Apsilankę naktinio gyvenimo vietą reklamuojančioje svetainėje tikitės kažko prašmatnaus, garsaus, spalvingo ir tikriausiai šiek tiek niūrio. Bet Niekada - kur įsikūrusios dvi aukščiausio lygio Los Andželo naktinio gyvenimo vietos „The Edison“ ir „Clifton's Republic“ - norėjo suprojektuoti ką nors šiek tiek skoningesnio. Taigi jie pasuko Aktyvi spalva , kuris jiems sukūrė svetainę, kuri yra ne kas kita, o įprasta.

Remiantis animacijomis pagal individualiai rankomis pieštas iliustracijas Shannon Stamey , tai tikrai grožio dalykas. Kalbėjomės su įkūrėju ir kūrybos direktoriumi Damjanu Krajačičiumi, kad sužinotume, kaip jiems sekėsi.

Kaip gavai šį neįprastą koncertą?

Mes dirbome su „The Neverlands“ klientu ir savininku Andrew Meieranu, nes jie pirmą kartą atidarė pirmąją vietą LA centre. „Edison“ yra išties įspūdinga naktinė vieta, pastatyta istorinio „LA Higgins“ pastato požeminiame rūsyje ir išsauganti jėgainės elektros generatorius bei pramoninius elementus, kurie pranešė apie naują DTLA ateitį.

Vėliau su tuo pačiu klientu dirbome dar keliuose projektuose, įskaitant „Clifton‘s Republic“ svetainę. Kai prasidėjo šis projektas, mes jau buvome labai giliai įsigilinę į prekės ženklą ir vietas, taip pat buvome gana artimi klientui ir jo išskirtiniam, vizionieriškam ir ekscentriškam stiliui.

„Active Colour“ koncepcija perėjo prie pasirinktinio ranka piešto iliustracinio dizaino metodo ir paralaksiniu būdu valdomų, interaktyvių nukreipimo puslapių(Vaizdo kreditas: „Active Color“)

Koks buvo trumpas?

Klientas visada turėjo fantastišką viziją, kaip šias regimas erdves paversti skaitmeniniu pasauliu. Jie norėjo sukurti nuotykių, smalsumo jausmą, pabėgti nuo įprasto į vaikišką fantazijos pasaulį. Šis projektas buvo ilgametis, daugiau nei dvejų metų, kūrybinis darbas su klientu. Nors laikui bėgant visuotinė samprata išliko gana ta pati, idėjos, kaip ją praktiškai įgyvendinti, nuolat plėtojosi, ir dažnai mes išsamiai susipažinome su iliustracijomis ar tam tikru judesiu ar meno kūriniais.

Nors paprastai turime daug aiškesnį, strategiškesnį ir apibrėžtesnį procesą, šiuo atveju nusprendėme leisti, kad projekto meninis pobūdis mus veda įvairiais būdais. Kadangi klientas pats buvo itin kūrybingas ir meniškas, nematėme jokio kito būdo, kaip sėkmingai įgyvendinti projektą. Kartais, norėdami sukurti ką nors naujo ir netikėto, turite sugriežtinti taisykles.

Tonas yra įdomus ir fantastiškas(Vaizdo kreditas: „Active Color“)

Kokie buvo jūsų vizualiniai įkvėpimai?

Tiek svetainės idėją, tiek spalvas daugiausia įkvėpė nuostabūs Cliftono Respublikos ir „The Edison“ interjerai, kurie tiesiogine prasme yra šie fantastiški pasauliai, į kuriuos galite pasinerti. Nors „Clifton“ sudaro septynios skirtingos vietos tame pačiame 5 aukštų pastate , kiekvienoje erdvėje yra pagrindinė šiluma, o šilti bronzos, vario ir aukso tonai prasiskverbia į jausmus. Norėjome išplėsti šią spalvų schemą, kad ji būtų kiek tinkamesnė kiekvienai vietai ar nukreipimo puslapiui, todėl išplėtėme spalvų paletę, įtraukdami pastelines bliuzas, arbatžoles ir įvairias kitas spalvas.

Kai kurias spalvų paletes aiškiai įkvėpė ranka pieštos iliustracijos, ir mes sulenksime puslapį, kad jis atitiktų. Kitu metu mes pritaikysime iliustracijų atspalvius ir spalvas, kad jos visos susilietų ir atitiktų darnesnį stilių.

Kas sukūrė iliustracijas?

Iliustracijos yra Shannon Stamey darbas, kurį užsakė klientas. Kartu su klientu ir „Stamey“ sumanėme nusileidimo ekranus ir iliustracijas, kurias Stamey įgyvendino iki galo. Tai, ko negalėjome nudažyti rankomis, galėjome rasti atsargų vaizduose arba viešosios nuosavybės archyvuose. Klientas Andrew Meieranas pats yra istorikas, turintis neįtikėtinų žinių ir aistrą to laikotarpio menui, todėl jam buvo naudinga rasti ir nuspręsti dėl daugelio elementų.

„Active Color“ dirbo atgal, kad tipografija atitiktų meną(Vaizdo kreditas: „Active Color“)

Kaip jūs priartėjote prie tipografijos?

Tai buvo praktiškumo ir atsitiktinumo pusiausvyra. Mes neturėjome jokios vizualinės tapatybės sistemos, su kuria galėtume dirbti, nei iš anksto apibrėžto stiliaus, nei logotipo, todėl mes tarsi dirbome atgal, kad rastume šriftus, kurie atitiktų meno kūrinius. Mes norėjome, kad viskas atrodytų žmogiška, natūralu ir tinkama, tačiau tuo pačiu metu šiek tiek stebuklinga pasirinkdami.

Kokias technologijas naudojote kurdami svetainę?

Mes naudojome pasirinktinį „WordPress“ diegimą, kad galėtume valdyti galą. Svetainė yra visiškai pritaikyta iš anksto užkoduota su daugybe „JavaScript“ ir CSS. Mes pakeitėme siaubingą atvirojo kodo paralakso scenarijų, kurį sukūrė Matthewas Wagerfieldas, kaip pagrindinis variklis, nukreipiantis nukreipimo puslapio judėjimą. Mes taip pat sukūrėme daugybę kitų pasirinktinių funkcijų, esančių vietų puslapiuose, tokiuose kaip „The Edison“, „Clifton's Republic“ ir „Pacific Seas“, kai vartotojai slenka, todėl jaučiasi lyg nusileistum į miestą, medžių laju žemyn ar į vandenyną.

Iki šiol didžiausias iššūkis buvo tai, kaip sukurti sklandžią naršyklės patirtį, kai tiek daug skaidrių PNG juda paralaksiniu judesiu. Daug laiko buvo skirta vaizdų ir scenarijų optimizavimui, kad būtų galima juos pašalinti iš kelių naršyklių.

Visi trūkstami vaizdiniai ištekliai ar iliustracijos buvo gauti iš atsargų vaizdų ir toliau meniškai manipuliuoti, kad atitiktų svetainės stilių ir koncepciją.(Vaizdo kreditas: „Active Color“)

Perėjimai yra labai efektyvūs: kaip juos sukūrėte?

Su daugybe koregavimų ir eksperimentų! Mes buvome šiek tiek riboti, kad galėtume paprašyti papildomų iliustracijų, jei reikia, todėl kartais tekdavo lopyti kūrinius, pratęsti meno kūrinius, jais manipuliuoti. Kai turėjome paruoštą turtą, skyrėme daug laiko, kad sureguliuotume perėjimus, kad srautas būtų sklandus. Tai buvo puikus balansas tarp to, ko norėjome vizualiai, ir to, kas buvo techniškai įmanoma kiekvienoje naršyklėje su ribota atvaizdavimo galia.

kaip nupiešti tikrovišką skeletą

Kaip privertėte svetainę dainuoti mobiliajame telefone?

Vertimas į mobilųjį telefoną iš tikrųjų buvo gana sklandus. Šis projektas buvo sunkus darbalaukyje, tačiau žinojome, kad nukreipimo puslapiai gerai veiks mobiliajame telefone, nes taip juos sumanėme nuo pat pradžių. Mes žinojome, kad dėl gerokai sumažinto vaizdo dydžio perėjimai bus sklandūs. Galiausiai mažame ekrane negali būti per daug daiktų, todėl mes galėjome apipjaustyti daiktus ir supaprastinti vartotojo sąsają. Visa tai suteikė sklandesnę, tiesmukesnę mobiliojo ryšio patirtį.

Fantazijos iliustracijų pasirinkimas

Išsami įvairių nukreipimo puslapių ir išteklių koncepcija ir siužetinė schema(Vaizdo kreditas: „Active Color“)

Kokia didžiausia pamoka, kurią išmokote?

Ta kantrybė yra dorybė. Šiame projekte mes tikrai turėjome jo turėti. Esmė ta, kad norėdamas ką nors padaryti gerai, turi būti pasirengęs skirti laiko ir pasistengti, o tam reikia kantrybės.

Kalbant apie techninę ir meninę dalykus, projektas mums priminė, kaip labai mėgstame „box box“ svetaines, pradedant žaibiškai pastatytomis svetainėmis, kurias dievinome, tuo metu internetas buvo kur kas įvairesnis ir netradiciškesnis. Tačiau, atsižvelgiant į naujausius naršyklės pokyčius, mes vėl galime pasiekti išskirtinių įspūdžių, kurie nepatenka į dėžę, ir džiaugiamės galėdami naudoti šį supratimą, kad galėtume nukreipti mus į būsimus projektus. Mums pasisekė, kad šiuo atveju mes dirbome su labai unikaliu klientu, vertinančiu estetiką ir originalumą.

Kitas puslapis: atraskite antrąjį 2020 m. Svetainės dizainą ...

„Creative Bloq“ sukūrė šį turinį mokamos partnerystės su „Adobe Stock“ dalimi. Šio straipsnio turinys yra visiškai nepriklausomas ir atspindi tik „Creative Bloq“ redakcinę nuomonę.

  • 1
  • du
  • 3

Dabartinis puslapis: „Neverlands“ pagal aktyvią spalvą

Kitas puslapis Malūnas pagal studijos išvestį