Bukvar digitalnog marketinga.

minimalist-apartment

“Flat” dizajn 2013

Ova godina donela je jedan novi talas u dizajnu digitalnih medija, koji se kratko zove “flat” (ravan). Radi se o poprilično radikalnom zaokretu, koji je na prvi pogled ljudima malo čudan i neočekivan, ali ima svoj smisao. Najbolji primer je iOS i iPhone – preko noći ljudima se bukvalno “promenio telefon” i svi su bili u šoku. Sve ono što je nekada bilo 3D, reljefno, podražavalo neki izgled iz prirode, sada je postalo ravno i oslobođeno bilo kakvih suvišnih detalja. Evo ovde jedne dekonstrukcije same suštine ovog dizajna i pregleda najbitnijih trendova.

minimal

Osnovna ideja: declutter – veliko spremanje

Pokušaću najpribližnije da ilustrujem kako se desio ovaj zaokret u dizajnu: Zamislite da imate jedan stan koji ste godinama punili stvarima. Dovlačili ste u njega sve postojeće aksesoare, ukrase, punili ga raznim dodatnim policama, skupljali ste stvari od rodbine, prijatelja, niste bacali nijednu kutiju, nepotreban poklon, sve ste nekako ređali tu po stanu na sve strane, pod parolom da želite da vam dom odiše toplinom i dušom, a i “nikad se ne zna kad će nešto od toga da zatreba”.

Vremenom, sve je više stvari. Sve postaje zbijeno, jedno do drugog, počinje da se zavlači prašina u nepristupačne delove i sve je teže održavanje stana. Stan počinje da odiše čemerom i teretom, postaje nemoguće raditi bilo kakav posao jer je sve prepuno distrakcija, a hodanje po stanu se pretvara u preskakanje i izbegavanje raznih objekata.

Jednog jutra, vlasnik stana se probudio i rekao “ne mogu više da trpim ovaj lom!”. Narednih nekoliko dana oslobađa se svih stvari  i ostavlja samo minimum koji mu je potreban za život. Nešto pobaca, nešto razdeli rodbini, odnese za sirotinju, nešto proda… prekreči ceo stan, i na kraju u njemu ostanu krevet, sto, stolice, malo osnovnog nameštaja i par slika.

Upravo identična stvar se desila sa dizajnom digitalnih medija. Godinama smo imali punjenje sadržajem, samo da sadržaja bude što više. Na sve strane bili su pozivi na klikove, pogledajte i ove tekstove, pogledajte i one tekstove, dugmići za lajk, šer, tvit, pin, i tako dalje.

Sada se jednostavno sve to “počistilo” i ide se na dizajn sa što manje distrakcija.

Kraj skeuomorfizma

Već deset godina, opšti stil dizajna bio je nešto što se zove skeuomorfizam – podražavanje realnog sveta na digitalnom mediju. Ljudi su se trudili da im sve izgleda što više prirodno – sa senkama, reljefno, sa teksturama drveta, papira… jer je to bio način da se pobegne od “kompjuterskog” izgleda. Mnogi ljudi imali su strah od novih tehnologija, od kompjutera, i ideja je bila da se ljudima kreira iluzija da nisu u interakciji sa kompjuterom, već sa nekim stvarima na koje su navikli u opipljivom svetu. Dakle, ovo je bilo skroz opravdano.

Sada, svi su se navikli na kompjutere. Svi su otvorili Fejsbuk, došli su online čak i oni za koje nikada ne bismo pomislili, i digitalni mediji su postali prihvaćeni među širokim narodnim masama. Sa druge strane, rodili su se i stasali novi mladi ljudi kojima su digitalni mediji nešto osnovno i jedino. Prestaje potreba za podražavanjem prirode – kompjuterski interfejs, dugmići, meniji, mogu slobodno da izgledaju “kompjuterski” jer nema više straha da neće biti prihvaćeni ako budu ono što jesu.

Difuzija inovacija u dizajnu

Još jedna stvar je jako važna, a to je kako i kada uopšte dolazi do smene trendova, ne samo u ovom slučaju. Na ovom blogu pisao sam o difuziji inovacija – sociološkom mehanizmu za širenje bilo kakvih trendova u društvu. Kreće od early adoptera, ljudi koji su uvek prvi u svemu, dolazi do rane i kasne mase, i na kraju dolazi do “laggards” – ljudi koji poslednji usvajaju bilo šta.

difuzija-inovacija

Generalno pravilo glasi – onog momenta kada neki trend dođe do “late majority” i “laggards”, vreme je da se taj trend promeni i da se kreira neki novi. Na primer, neki font ili vrsta fontova postanu moderni. Počinju da ih koriste top dizajneri, high-end brendovi u svojim kampanjama. Zatim počinju da ih koriste i manje kompanije. Onog momenta kada taj font zateknete na radnji “Butik Mara” u Dobanovcima, to znači da je vreme da se taj trend promeni. Na ovaj način kruže svi trendovi, ne samo u dizajnu, već i u modi, svuda.

Ovo žene jako dobro znaju. Neki modni trend postane  popularan i kreće od “ranih usvajačica” koje to prve nose. Na primer, letnje čizme. Onog momenta kada letnje čizme počnu da nose devojke koje su do juče nosile Air Max patike, “rane usvajačice” zauzimaju stav “ne bih u životu više to obula” i počinju da nose nešto novo.

Skeuomorfizam je došao do nivoa da je korišten apsolutno svuda, i jednostavno, po gornjoj formuli, bio je krajnji trenutak da se taj trend napusti.

Ovo su sve kombinacije faktora koje su dovele do “flat” dizajna.

Vizuelne karakteristike

Pre svega, osnovna karakteristika novog dizajna su tanki fontovi i tanke linije. Za naslove se koriste light verzije fontova, koje su se do sada koristile uglavnom u modnoj industriji i među luksuznim brendovima. Korišćenje light fontova za naslove ima svoju svrhu – a to je da debljina slova u naslovu bude prividno ista kao i debljina slova u tekstu kojim je ispisan sadržaj.

naslov

Što se same tipografije tiče, ovo je istovremeno i kraj trenda sa naslovima u bold condensed fontovima. I “slab serif” trend, poput fonta Museo , odlazi u prošlost.

Ogromni prazni prostori

Osnovna karakteristika ovog novog dizajna su velike margine. Kad kažem velike, to znači toliko velike da na prvi pogled deluje kao greška – jer smo se navikli na sajtove natrpane informacijama, gde je sve jedno do drugog. Pogledajte recimo home page kompanije Dropbox, koja vredi preko 4 milijarde dolara. Toliko vredna kompanija usudila se da stavi na svoj home page jednu sliku, jedno dugme, i par reči. A svi ljudi od kojih žive treba da se prijave preko tog sajta.

Skrolovanje više nije problem – prazni prostori dovode do toga da se informacije moraju poprilično skrolovati, ali sva istraživanja pokazuju da ljudi zapravo vole da skroluju.

Primera ima puno, možete pogledati neke od njih ovde: Primer1 Primer2  Primer3

Ikonice i bilo koji delovi interfejsa su poprilično razuđeni, ikonice su često i monohromatske. Ovim se postiže efekat preglednosti i fokusa. Nešto kao razlika između radnje koja drži u izlogu 150 cipela, i radnje koja drži tri cipele, a oko njih je ogroman prazan prostor.

prostor

Senke nisu potpuno nestale. Ustvari, često se javljaju senke pod ekstremno oštrim uglovima, kao da svetlo pada po tom 2D principu.

Sve linije su tanke, nema nigde nikakvih debelih ivica. Često se kombinuju površine sa ogromnim fotografijama u pozadini i površine koje su potpuno jednobojne, kao ovde i li ovde.

Dosta dobrih primera može se naći na Pinterestu ili Dribblu. Takođe, pročitajte i odličan članak o ovome na uvek dobrom Smashing Magazinu.

Dizajniranje stvari na ovaj način je poprilično zanimljivo, i kada se jednom uhodate i pohvatate način razmišljanja, ide prilično glatko. Ako ste pronašli neki dobar link sa primerima, pošaljite ga ovde u komentarima. Hvala!

Naučite kompletan digitalni marketing od mene na Masterboxu

Najbolji način da naučite digitalni marketing je na platformi Masterbox, gde se nalaze svi moji kursevi.

Na Masterboxu ima jedno 100 puta više materijala nego ovde, učite direktno od mene na zabavan i kreativan način. Preko 5000 ljudi je do sada prošlo kroz te kurseve. Imate i podršku u Fejsbuk grupi u kojoj odgovaram na sva pitanja.

Pogledajte detalje i prijavite se ovde.

Vidimo se na kursevima!

 

20 Responses

  1. Ok. Lepota je u jednostavnosti – davno je utvrđeno i definisano. Dugo smo imali previše sadržaja u svakom pogledu. Kad otvoriš neki sajt, sve je razigrano, svetluca, poziva da se klikne na ovo i ovo i ovo, prosto ne znaš više na šta si kliknuo a na šta nisi, i sve se na kraju izgubi u zamršenom klupku informacija koje ne mozeš da popamtiš. Moraš da se vratiš da pregledaš opet i opet – verovatno je to i cilj. Da ti dugo veže pažnju za neki sajt, te da se informacija utisne u mozak.
    A onda novi stil. Redukcija prekomernog sadržaja. Pojednostavljenje fontova, sličica, svega. Ogromni prazni prostori, monohromatske sličice, redukcija sadržaja. Meni to liči na drugu krajnost. Treba naći neku ravnotežu između te dve krajnosti.

  2. Pa odavno je tako. Samo ti to nisi znao dok nisi instalirao iOS7. Windows phone ima flat dizajn od 2010 koji je postao cool jos 2008.

  3. Svidja mi se sto uvek nadjes dobre primere, adekvatne slicice, kao i grafike, da razbijes monotoniju suvoparnog teksta. Tako da na kraju tekst postane zanimljiv, razumljiv cak i laicima. Strucnjaci ce uvek naci neke zamerke, ali to je normalno, jer uglavnom svi mislimo da najbolje znamo…

  4. Vratija se stari Istok,

    Batali provociranje i hejtovanje po netu i piši ovakve tekstove.

    BTW mogao si da dodaš i priču o raznovrsnosti boja u Flat dizajnu

  5. Ima li neko neki prijedlog za fontove za vijesti na news portalu? Ovo sa slike su Helvetica light i regular, čini mi se?

  6. Mislim da je trebalo spomenuti i Microsoft koji je btw prvi implementirao navedeni flat dizajn.

  7. Ne spomenuti Microsoft i Metro design koji je i definisao flat-style i glavne karakteristike istog je krajnje neozbiljno.

    Svoditi pricu o flat design-u na Apple i iOS je ostrasceno, ali u ovoj situaciji skidam kapu Apple-u koji je ostavio sujetu po strani zarad funkcionalnosti primenjujuci isti stil dizajna koji je vec postojao na Windows Phone-u, znajuci da ce biti prozivki o kopiranju WinPhone UIa, ali i dalje verujuci u funcionalnost tako izabranog resenja.

    Sa druge strane, licemerno je sto su isto to “kopiranje” godinama zamerali Google-u.

  8. Mnogo bolje pisati ovako nesto, nego one socio-politicke tekstove. Bolje ti lezi. ;) Mani se politike i palamudjenja…

    Iako se ne slazem sa tekstom u celovitosti, mnogo mi je vise prijao od recimo prethodnog kurir-like texta. :)

  9. najbolji je primjer windows 8,
    i ono sto je meni revolucionarno u cijeloj ovoj prici jeste da je windows nametnuo stil! Sve karekteristike ovog stila su jako detaljno navedene u njihovoj eksplikaciji.

    Inspirisani internacionalnim tipografskim stilom iz 60ih, dizajneri iz mikrosofta su uveli na velika vrata kvalitete iz tog stila u GUI vode, a sudeci po tome koliko je doba Helvetike trajalo, ovo bi moglo da se zadrzi neko vrijeme..

    Momci iz meka su prilicno kasnili sa svojim redizajnom i sistem im je izgledao kao dinosaurus prije redizajna tako da su pokupili savjete iz mikrosofta i redizajniraliisti. Da se desilo suprotno, da je mek bio prvi, uveliko bi se pljuvalo po windowsu kako su plagijatori, a ovako se josh stavlja za najbolji primjer IOS.. hmm

  10. “”Metro” is the codename of a typography-based design language by Microsoft. A key design principle is better focus on the content of applications, relying more on typography and less on graphics ”
    wikipedia

  11. Mada osim flat dizajna, čini mi se da je Apple sa iOS7 “započeo” eru dinamičnog interfejsa, koristeći slojeve i dubinu kao elemente interfejsa. To je nešto što Windows 7 npr ima, pa je sa Windows-om 8 nestalo. Ali na mobilnom uređaju to postaje atraktivnije zbog same prirode uredjaja. Nešto poput: http://youtu.be/mbj3XSvDyw8?t=10s i čini mi se da će se u tom pravcu ići. Na kraju, i pozadina će biti suvišna. Zameniće je život.

  12. Just for the record, sto kaze nas narod, Apple mnogo kaska u ovom stilu za drugim it kompanijama.

Leave a Reply

Your email address will not be published. Required fields are marked *

minimalist-apartment

“Flat” dizajn 2013

Naučite kompletan digitalni marketing od mene na Masterboxu

Najbolji način da naučite digitalni marketing je na platformi Masterbox, gde se nalaze svi moji kursevi.

Na Masterboxu ima jedno 100 puta više materijala nego ovde, učite direktno od mene na zabavan i kreativan način. Preko 5000 ljudi je do sada prošlo kroz te kurseve. Imate i podršku u Fejsbuk grupi u kojoj odgovaram na sva pitanja.

Pogledajte detalje i prijavite se ovde.

Vidimo se na kursevima!

 

20 Responses

  1. Ok. Lepota je u jednostavnosti – davno je utvrđeno i definisano. Dugo smo imali previše sadržaja u svakom pogledu. Kad otvoriš neki sajt, sve je razigrano, svetluca, poziva da se klikne na ovo i ovo i ovo, prosto ne znaš više na šta si kliknuo a na šta nisi, i sve se na kraju izgubi u zamršenom klupku informacija koje ne mozeš da popamtiš. Moraš da se vratiš da pregledaš opet i opet – verovatno je to i cilj. Da ti dugo veže pažnju za neki sajt, te da se informacija utisne u mozak.
    A onda novi stil. Redukcija prekomernog sadržaja. Pojednostavljenje fontova, sličica, svega. Ogromni prazni prostori, monohromatske sličice, redukcija sadržaja. Meni to liči na drugu krajnost. Treba naći neku ravnotežu između te dve krajnosti.

  2. Pa odavno je tako. Samo ti to nisi znao dok nisi instalirao iOS7. Windows phone ima flat dizajn od 2010 koji je postao cool jos 2008.

  3. Svidja mi se sto uvek nadjes dobre primere, adekvatne slicice, kao i grafike, da razbijes monotoniju suvoparnog teksta. Tako da na kraju tekst postane zanimljiv, razumljiv cak i laicima. Strucnjaci ce uvek naci neke zamerke, ali to je normalno, jer uglavnom svi mislimo da najbolje znamo…

  4. Vratija se stari Istok,

    Batali provociranje i hejtovanje po netu i piši ovakve tekstove.

    BTW mogao si da dodaš i priču o raznovrsnosti boja u Flat dizajnu

  5. Ima li neko neki prijedlog za fontove za vijesti na news portalu? Ovo sa slike su Helvetica light i regular, čini mi se?

  6. Mislim da je trebalo spomenuti i Microsoft koji je btw prvi implementirao navedeni flat dizajn.

  7. Ne spomenuti Microsoft i Metro design koji je i definisao flat-style i glavne karakteristike istog je krajnje neozbiljno.

    Svoditi pricu o flat design-u na Apple i iOS je ostrasceno, ali u ovoj situaciji skidam kapu Apple-u koji je ostavio sujetu po strani zarad funkcionalnosti primenjujuci isti stil dizajna koji je vec postojao na Windows Phone-u, znajuci da ce biti prozivki o kopiranju WinPhone UIa, ali i dalje verujuci u funcionalnost tako izabranog resenja.

    Sa druge strane, licemerno je sto su isto to “kopiranje” godinama zamerali Google-u.

  8. Mnogo bolje pisati ovako nesto, nego one socio-politicke tekstove. Bolje ti lezi. ;) Mani se politike i palamudjenja…

    Iako se ne slazem sa tekstom u celovitosti, mnogo mi je vise prijao od recimo prethodnog kurir-like texta. :)

  9. najbolji je primjer windows 8,
    i ono sto je meni revolucionarno u cijeloj ovoj prici jeste da je windows nametnuo stil! Sve karekteristike ovog stila su jako detaljno navedene u njihovoj eksplikaciji.

    Inspirisani internacionalnim tipografskim stilom iz 60ih, dizajneri iz mikrosofta su uveli na velika vrata kvalitete iz tog stila u GUI vode, a sudeci po tome koliko je doba Helvetike trajalo, ovo bi moglo da se zadrzi neko vrijeme..

    Momci iz meka su prilicno kasnili sa svojim redizajnom i sistem im je izgledao kao dinosaurus prije redizajna tako da su pokupili savjete iz mikrosofta i redizajniraliisti. Da se desilo suprotno, da je mek bio prvi, uveliko bi se pljuvalo po windowsu kako su plagijatori, a ovako se josh stavlja za najbolji primjer IOS.. hmm

  10. “”Metro” is the codename of a typography-based design language by Microsoft. A key design principle is better focus on the content of applications, relying more on typography and less on graphics ”
    wikipedia

  11. Mada osim flat dizajna, čini mi se da je Apple sa iOS7 “započeo” eru dinamičnog interfejsa, koristeći slojeve i dubinu kao elemente interfejsa. To je nešto što Windows 7 npr ima, pa je sa Windows-om 8 nestalo. Ali na mobilnom uređaju to postaje atraktivnije zbog same prirode uredjaja. Nešto poput: http://youtu.be/mbj3XSvDyw8?t=10s i čini mi se da će se u tom pravcu ići. Na kraju, i pozadina će biti suvišna. Zameniće je život.

  12. Just for the record, sto kaze nas narod, Apple mnogo kaska u ovom stilu za drugim it kompanijama.

Leave a Reply

Your email address will not be published. Required fields are marked *