Jak vytvořit ekologický webový design
(a ukázka)
Organický design se běžně používá u výrobků, jako jsou židle, elektronická zařízení, knihy a domácí výzdoba.
Podle stejných zásad se organický webový design nedávno stal trendem.
Profesionální designéři a firmy se přirozeněji zaměřili na vytváření svých webových stránek, log a obalů, což zanechalo za sebou zjevně technologický lesk z počátku devadesátých let.
Ano, kolegové designéři, je bezpečné říci, že nová věk organického designu pro webové stránky a firemní loga vstoupila v platnost.
Ať už je to jasné nebo jemné, ať už skenované prvky nebo grafiky, které napodobují přírodu, organický webový design získal mnoho podob. Ale co znamená organický design? Co dělá to úspěšné? Pojďme to zjistit…
Co vytváří organický webový design?
Ačkoli název naznačuje, že se dělá nějaké ekologické prohlášení, organický webový design je spíše o přenášení přírodních prvků do technologického prostředí.
Tyto prvky by mohly být reprezentací přírodních materiálů v designu (dřevěné zrna, textilie, zemitá textury) nebo něco abstraktnějšího, který zachycuje odliv a tok přírody (předměty, materiály, barvy, tvary). Organický návrh webových stránek je široký a může být rozdělen do čtyř kategorií.
- Použití materiálů, textur a tkanin, které naznačují organické prvky
Objekty, jako je muslin, pytlovina, papyrus, papír, páska a dřevo. Tyto položky pocházejí z přírodního prostředí, a tak poskytují rozložení přirozené odvolání. - Použití abstraktních esencí přírody
Barvy, tvary, grafika, materiály a kartáče, které napodobují "tok" přírody. Jsou to jemnější než dřevěné zrna a muslíny a jsou určeny pouze jako náznak organické esence. Vidíme to na webových stránkách, které mají moderní grafickou úpravu a jemný přírodní vzhled. Zvláště, plasty jsou nejběžnější materiály, které se používají k dosažení organického vzhledu: nepravděpodobné, že materiály jsou v designu webových stránek správné. - Vytvoření celku, který je větší než součet jeho částí
Je-li vytvořen snímek, který používá pouze štětce nebo grafiku, aby vytvořil jiný obrázek, můžeme říci, že získáme více z obrazu jako celku než součet jeho částí: štětce nebo grafika. To se objevuje častěji v záporném prostoru, protože kartáče mohou být použity k načrtnutí nebo vyplnění jiného obrázku. Když přidáme části, získáme jednu věc - štětec - ale když se podíváme na celý, získáváme dvě věci: štětcem a vytvořeným obrázkem. Toto je běžné u typografií, protože je můžeme použít k vytvoření úplně jiného obrazu, ať už hraním s negativním prostorem nebo přidáním štětců. - Lepší interpretace "organického" webového designu
Obecně definujeme organické látky jako něco, co přichází přímo z přírody, ale může to být také něco, co člověk vytvořil (a pak zanedbával), jako například opuštěný kus dřeva z budovy nebo materiály, které kdysi zdobily domov a jsou nyní obarveny. Organický v tomto smyslu znamená něco úplně jiného: přebírá objekty, které zanechává společnost. Staré fotografie, roztrhané látky, zoufalá tapeta: všechny ty mohou být stejně organické jako kus dřeva nebo listu.
V posledních letech organický design získal "esenciální" kvalitu. Essentialist organický design je více minimalistický ideál: používejte pouze to, co potřebujete k dosažení toho, co jste po.
Například pokud bychom chtěli vytvořit obraz negativního prostoru a štětců, mohli bychom použít pouze množství štětce potřebné k vytvoření tohoto obrazu. Essentialist organický design vede k modernějšímu vzhledu a rozšiřuje se v oboru web designu.
Tyto čtyři kategorie mohou být hrány a manipulovány, aby získaly pocit, který je pro vás a vašeho klienta správný. Smíchejte s nimi a porovnejte s nimi: všechny mohou úspěšně spolupracovat.
Rady pro úspěšný organický web design
- Zemní barvy mohou být živé
Vypálené pomeranče, tmavě šedé purpury a olivy mohou být stejně vzrušující jako světle žluté a jasně červené. Navíc lépe pracují společně a protože budete s největší pravděpodobností využívat neutrální tóny v organickém designu, můžete použít více z těchto barev bez toho, aby jste ohromili design. - Vibrující barvy mohou být také organické
Červená nebo kobaltová modrá auta mohou být stejně zemitá a organická jako hnědé a šedé. Najděte tyto barvy ve vinobraní nebo přirozeném vzoru nebo utrpěte vzorem, který má tyto tóny. Mohou být osvěžující, pokud jsou používány se ztlumenou paletou. - Rovnováha, rovnováha, rovnováha
Prostředí zůstává stabilní přes pečlivou rovnováhu prvků a design se nijak neliší. To je ještě důležitější v organickém designu. Vyvážit ty šedé odstíny s více barevnými. Uklidněte dřevěné pozadí s plochými, velkými nebo jednoduchými tabulkami nebo divovými vrstvami nebo dokonce i monochromatickou strukturou papíru. Jedna past s organickým designem, stejně jako u každého designu, spočívá v tom, že můžete mít příliš mnoho dobré věci, a linka mezi úspěšným a přehnaným může být v pořádku. - Organické neznamená to, že by se to mohlo stát moderním
Jen proto, že chcete organický design neznamená, že musíte opustit své moderní vlivy. Můžete mít chrome-vypadat pozadí, purpurové doplňkové barvy nebo neorganické písma. Změkčení moderního designu netrvá moc, ani nepotřebuje květinový vektor. Jednoduchá zvlnění grafiky, štětce nebo vektoru může dosáhnout přirozené podstaty v pohodě. - Mysli jinak
Příroda je mnohem víc než zřejmé. Vybrat nepravděpodobné položky, které jsou přirozené, ale jsou méně časté, jako světlo. - Urban oblasti jsou také prostředí
Jen proto, že je odstraněn z lesa, neznamená, že už není "prostředí". Myslete na betony nebo damašek.
Chcete-li vidět organický návrh webových stránek v akci, podívejte se na následující webové stránky. Tyto webové stránky ilustrují všechny nebo některé ze čtyř kategorií organického návrhu webových stránek vysvětlených výše.
Mooiův zázemí, složitý dřevěný vzor, je zde hlavní a přirozený prvek. Mooi dodává živý červený odstín, jen jeden z mála moderních dotyků v tomto designu, které nezbavují jeho organický pocit.
30A Guide hraje s abstraktnější interpretací organického designu, zahrnující rustikální papíry, staré fotografie negativy a razítka. Navíc nám 30A dává pocit, že jsme narazili na již existující, ne-digitální prostředí.
I Love Dust obsahuje mnoho moderních prvků, ale má organické náznaky: animovanou slzovou kapku, kruhové písmo a květinové vektory.
Zatímco vliv není zřejmý, rozvržení Entry 5 Productions má ekologický vzhled: Na hlavičkových linkách a logu máme zaoblené hrany, stejně jako dobré množství měkkých, přirozených tónů. Zatímco jemné, tyto organické vlastnosti se odrazí od moderního vzhledu Entry 5 Productions.
Obvykle můžeme uvažovat o papírech, lesech a tkaninách, které by zobrazovaly organický design, ale materiály, jako je kůže, jsou stejně přirozené a méně běžně používané při tvorbě webových stránek. Kromě toho nabízí sedlový kůže organický pocit pomocí starých map, štítků a čalounění.
Web Maremma je dobrým příkladem toho, jak je celok více než součet jeho částí. Pokud se podíváme na logo, vidíme, co je zamýšleno: "W" a "M." Nicméně, když zlomíme celý do jeho jednotlivých částí, dostaneme neúplné dopisy. Takže to, co získáme jako celek, jste to hádali, víc než díly dohromady.
Tento moderní kus obsahuje cementové pozadí, zaoblené hrany a organicky vyhlížející pozadí pro spodní textové oblasti. Tyto typy přídavků jsou typické v organickém designu.
Nejen, že pozadí je hrubá struktura papíru, ale Lorelei Web Design obsahuje červenou odkapávku nebo rozlití nějakého druhu. Nepravděpodobný prvek, ano, ale je to přirozené.
Hubové bílé cihly vystupují tady, ale co je důležitější, je to, že se na nich objeví dropshadow a měkký pohyb těchto obrázků. Stín nás nutí cítit, jako by tam byly vždycky obrazy a pohyb obrazů, když se vznáší, napodobuje tok přírody. Zelená, i když živá, je zjevně ekologická.
Co vyniká pro Kulturbanause je rozbitá zeď, což naznačuje, že tato zeď se časem rozpadla. Navíc máme z druhé strany vodu, která proniká na ostrovy země. Toto využívá dvě formy organického designu najednou: použití zjevných přirozených obrazů a nastavení a použití něčeho, co je opotřebované a rozpadá.
Pixel Umbrella je přirozeným příkladem v jeho stěžejním pozadí - texturovaná šedá zeď, která se dotýká betonu nebo omítky - a měkkých křivek písma (jmenovitě "b" v "deštníku").
Pták může být dobrým přírůstek pro získání organického vzplanutí, ale barvy písma jsou to, co řídí rozložení Janic Designu. CSS je zaměřením na takové uspořádání a Janic Design přidává organické přání pomocí různých odstínů zelených, tealy, žlutých, hnědých a hlubokých šedých blues.
Když se ostatní cítí moderní, přidejte do svého loga trochu přirozený pocit. Logo značky Josh Puckett je zřetelně organické a barvení kapičky pouze posiluje jeho přirozenou podstatu.
Co není organické o designu webu I Love Colors? Barvy, vektory, roztrhané papíry a texturované pozadí přispívají k organickému přitažení tohoto rozvržení.
Greydient používá rotaci ve velkých obrázcích, ale každý z nich má organické přání, s přídavkem, včetně zchátralých předmětů, jako je to, co vidíte zde, a květinové kartáče.
Květiny, ptáci a obrazy podobné oblakům. Organický design, který je tak zřetelný, nemůžete mu chybět.
Obraz na světě je pěkný, ale logo Oypro - které vypadá jako několik okvětních lístků - a měkké okraje na linkách jsou tím, co dokončuje organický pocit. Samozřejmě také pomáhají víry přirozené barvy.
Uspořádání Orange Label má mnoho moderních vlastností s využitím čtvercových textových oblastí a jednoduché barevné schéma. Orange Label však přidává organický design s využitím obrysů přírodních objektů, měkkých okrajů a především textových oblastí, které se cítí jako z negativního prostoru.
Dalším příkladem zřetelného organického designu je rozložení VixML, které se skládá z vodnatých a zakalených obrazů, nastavení města a zaoblených okrajů.
Brown Blog Filmy mohou mít těžké využití dřeva v jeho designu, ale dřevěné prkna jako odkazy a 'visel' obrázek loga jsou to, co vrcholu organické kouzlo tady.
Kromě stromu a křivkového písmene na logu je třeba vzít na vědomí dva organické položky: ručně psané písmo na navigaci a hlavní pozadí.
To, co dělá Got Aqua jako zvláštní příklad organického designu, není obraz lebky nebo rukopisu, ale spíše korokové pozadí. Je to zajímavá volba pro přirozený pocit, ale je to přirozená a skvělá neutrální struktura.
Co je zábavné si vzpomenout na přírodu, je, že nespočívá pouze z kůry a ptáků (a podobně). To také sestává ze světelných vln, plynů, jisker, světla, mezi (jasně) jinými věcmi. Noe Design hraje s těmito nepravděpodobnými zdroji inspirace, což nám dává intenzivní barvy a text, který se zdá být osvětlený.
Bell 2 Lodge se odlišuje tím, že grafika je velká a je zřejmou kombinací vektoru a fotografie. Vidíme, že dřevo je obraz skutečného dřeva, zatímco použité listy jsou jasně grafiky, které byly postaveny v programu. Je to příkladná hra o tom, co je člověkem a co v podstatě není.
Logo společnosti Folio je hlavní organická složka na webu, která využívá zjednodušené, zaoblené tvary, které mají přirozenou atmosféru. Také prostřednictvím samostatných kruhů a grafických bitů 'J' získáváme produkt, který je více než součet jednotlivých tvarů.
Kódování je to, co je na paměti, kromě zřejmých organických doplňků, jako je barva, listy a obloha. Kódování používané pro provozování portfolia Mathieu Furnona dělá přechod od obrazu k obrazu bezproblémový a přirozený.
Kombinace tmavých odstínů s chladnějšími modrými a krémy a také "vyvedeným" účinkem na polovinu loga přinášejí zřetelné organické doteky na zřetelné lesy a papíry.
Přidání "ručně psaného písma", které je napojeno na grafické písmo, je pouze jedním aspektem organického designu.
Přirozené kaštany, pomeranče, melouny a hnědé barvy zmírňují ostrou, moderní bílou barvu v tomto uspořádání.
Podívejte se za stromy; vodní barvy a hluboké, ale zemité odstíny v záhlaví obrazu přinášejí dramatický, ale organický zájem.
Napsal výhradně pro WDD Sarah Thompson.
Jaké textury a tóny upřednostňujete při vytváření organického pocitu? Jako uživatel, který si myslíte, že je atraktivnější: jemné nebo zřetelné organické témata?