Zašto sve web stranice izgledaju isto?

Internet pati od nedostatka mašte, pa sam zamolio svoje studente da ga redizajniraju

Fotografirao Pankaj Patel na Unsplash-u

Internet je danas blag. Sve izgleda isto: generički fontovi, bez izgleda da bi se mogli razgovarati, zamjenjive stranice i odsutnost ekspresivnog vizualnog jezika. Čak je i mikrotipografija nered.

Čini se da je web dizajn danas vođen tehničkim i ideološkim ograničenjima, a ne kreativnošću i idejama. Svaka stranica sastoji se od kontejnera u spremnicima u kontejnerima; ponekad tekst, ponekad slike. Ništa nije doista dizajnirano, jednostavno se pretpostavlja.

Ironično je da današnje web tehnologije imaju ogromne mogućnosti dizajniranja. Imamo mogućnost implementacije gotovo svake zamislive ideje i izgleda. Možemo stvoriti radikalne, iznenađujuće i evokativne web stranice. Možemo kombinirati eksperimentalnu tipografiju s generativnim slikama i interaktivnim iskustvima.

Pa ipak, čak i web stranice za dizajnere temelje se na spremnicima u kontejnerima. Najpopularniji portali za kreativne oglase na webu - Dribbble i Behance - toliko su dosadni da su u osnovi izmjenjivi. (Pogledajte glavnu sliku.)

Dribble nasuprot Behance. Možete li uočiti razliku? Zahvaljujem Davidu Rehmanu što mi je to pokazao. Sve snimke zaslona: Boris Müller

Kako se to dogodilo?

Postoji nekoliko razloga. Tehnološki okviri poput Content Management Systems (CMS) i blogovske platforme poput WordPressa temelje se na predlošcima. Web stranice na tim okvirima nisu zasebno izrađene, već se generiraju u pokretu spajanjem različitih vrsta medija kao što su slike, naslovi, tekst tijela i videozapisi. Predlošci nisu dizajnirani. Umjesto toga, to su pravila za kombiniranje povezanih vrsta podataka. Izvan predloška, ​​ove platforme korisnicima obično nude način da utječu na vizualni izgled stranice. Ono što vidite je ono što ste izlili u predložak.

Drugim riječima, predloške su sadržajno agnostički. I u tome je problem.

Jedno od temeljnih načela dizajna je duboka i smislena povezanost forme i sadržaja; oblik treba odražavati i oblikovati sadržaj. Njihovim odvajanjem krši se ovo načelo i stvara se generički spremnik sadržaja. U dizajnerskom smislu predloške su besmislene; obrazac ne dodaje ništa sadržaju.

Jedno od temeljnih načela dizajna je duboka i smislena povezanost forme i sadržaja.

Postoji puno drugih razloga nedostatka kreativnosti za web dizajn. Većina ih je ekonomskih i pragmatičnih. Na primjer, puno je vremena za dizajn pojedinačnih stranica. S obzirom na brzinu internetskih vijesti i učestalost novih članaka, velike web stranice jednostavno nemaju resurse za dizajn stranice od početka. Nadalje, web dizajn još uvijek je pitanje tehničke stručnosti: HTML, JavaScript i CSS ostaju izazovni alati za dizajnere. Ne postoji web dizajn ekvivalentan direktnim i obvezujućim tijekovima rada za izdavanje na stolnim računalima.

Sumnjam da je kriva i kreativna i intelektualna lijenost dizajnera. U doba mobilnog razvoja, generičkog, okvirnog razvoja, izgleda da se nitko ne muči vizualnim i kontekstualnim integritetom web stranice.

Kako se možemo nositi s tim izazovom? Kako danas mogu izgledati izražajne i avangardne web stranice?

Ponekad, ako želite dizajnirati budućnost, morate ponovno otkriti prošlost.

Retro web dizajn

Svoju prvu web stranicu dizajnirao sam prije otprilike 23 godine u grupi za istraživanje i razvoj na Sveučilištu umjetnosti u Bremenu, Njemačka. Stvaranje web stranica u to je vrijeme bilo vruće. Web je bio mlad. Stranice su pokrenule moju maštu.

Sredinom devedesetih borili smo se s ograničenjima HTML-a. Mogli smo koristiti samo sigurne fontove poput Arial, Times ili Verdana. Morali smo koristiti rasporede tablica, jednobojne fontove ili GIF-ove ako želimo učiniti nešto uzbudljivo. HTML je u početku sadržavao isključivo sadržaj i morali smo raditi protiv tehnologije da bismo dizajnirali stranicu.

Istodobno je eksplodirala eksperimentalna tipografija. Od tipografija Die Neue Die Jaue u dvadesetim godinama dvadesetog stoljeća do kompjutorskog izgleda aprila Greimana osamdesetih, dizajneri su doveli u pitanje status quo i pokušali pronaći vizualni jezik koji bi predstavljao ideje i revolucije njihovih epoha. Do sredine devedesetih neobična kombinacija tehnološkog i kulturnog napretka omogućila je vrlo radikalnu pasminu grafičkog dizajna. Mogli ste ga vidjeti u djelima Irme Boom, Davida Carsona, Paula Schera, Nevillea Brodyja i mnogih drugih.

U usporedbi s vizualnom eksplozijom svijeta grafičkog dizajna, rane su web stranice još uvijek prilično hromi. (Muzej web dizajna to vrlo dobro dokumentira.)

Htjeli smo napraviti grafički dizajn u pregledniku, ali nitko nije znao kako - ili koje pogreške mogu biti napravljene. Nije bilo očekivanja kako bi web stranica trebala izgledati. Nije bilo standarda. Bez CMS-a (skoro), bez CSS-a, bez JS-a, bez videa, bez animacije.

Sada je dobar trenutak kao i svaki da se ospori vizualna sukladnost interneta.

Brzo naprijed za 2018. godinu i sve možemo učiniti u pregledniku. Od golemog rasporeda do mikro-tipografije, animacije i videa. A što činimo s tim nevjerojatnim mogućnostima? Kontejneri u kontejnerima. Gigabajti vizualno blagih stranica s mobilnim uređajima onečišćenim JavaScriptom. Generički predlošci koji slijede ista vizualna pravila. Da je moj mlađi ja mogao vidjeti stanje web dizajna 23 godine kasnije, bio bi jako razočaran.

Problem web dizajna nije ograničenje tehnologije već ograničenja naše mašte. Postali smo previše poslušni vizualnoj saglasnosti, ekonomskoj održivosti i pretpostavljenim očekivanjima.

Međutim, svaka kriza stvara priliku. Sada je dobar trenutak kao i svaki da se ospori vizualna sukladnost interneta. Jao, prestar sam i previše buržoask da bih smislio radikalan, eksperimentalni i najsuvremeniji pristup web dizajnu. Ali mogu tražiti od svojih učenika da to urade.

2017. godine održao sam tečaj web dizajna na programu dizajna sučelja u Potsdamu u Njemačkoj. Svaki je tim zamoljen da smisli redizajn postojeće web stranice. Zadatak je bio vrlo jasan: postupajte prema pregledniku kao praznom platnu i stvarajte izražajna, maštovita vizualna iskustva. Koristite tehnološki potencijal trenutnih web tehnologija kao kanal za svoju kreativnost. Nemojte biti ograničeni pitanjima upotrebljivosti, čitljivosti i fleksibilnosti. Imati stav. Zanemari Erwartungskonformität.

Bio sam vrlo zadovoljan rezultatom nastave. (Sve rezultate možete vidjeti na ovoj preglednoj stranici.) Evo četiri projekta koji predstavljaju različite pristupe izazovu.

1. ZKM Frederic Haase i Jonas Köpfer

Redizajn ZKM-a

Frederic i Jonas odabrali su internetsku stranicu Zentrum für Kunst und Medien (ZKM) kao polazište za svoje eksperimente i istraživanja. Vrlo prikladan izbor jer je ZKM jedan od najistaknutijih izložbenih prostora za medijsku umjetnost u Njemačkoj, ali web stranica ZKM-a prilično je konvencionalna. Funkcionalno je, ali nedostaje mu avangardna tvrdnja koju umjetnička djela prenose na izložbama.

Frederic i Jonas cilj je bio osmisliti koncept, vizualni jezik i tehničku postavku za web mjesto ZKM koja predstavlja progresivni pristup muzeja. U srži njihovog koncepta nalazi se generativni pokretač dizajna: Svaki put kada se stranica učita, stvara se novi izgled.

Pogledajte redizajn ZKM-a.

2. Streem Daria Thiesa, Bele Kurek i Lucasa Vogela

Redizajn Streema

Streem je umjetnički i ulični časopis. To je i pozornica za nadolazeće umjetnike i platforma za socijalna pitanja. Streem uključuje radove iz ilustracije, slikarstva, fotografije, dizajna, pisanja i novinarstva. Daria, Bela i Lucas kombinirali su te različite utjecaje i svoje nacrte temeljili na konceptualnoj gradskoj strukturi. Za svoj prototip stvorili su četiri različita susjedstva koja svaki predstavljaju odjeljak časopisa. Njihov pristup kombinira snažne ilustrativne stilove s prostornom tipografijom kako bi stvorio čitljiv grad.

Pogledajte redizajn Streema.

3. Medij Amelie Kirchmeyer i Fabian Schultz

Redizajn medija

Amelie i Fabian zauzeli su se vrlo strukturalno. Umjesto pronalaska odgovarajućeg oblika za određenu priču, cilj im je bio raspustiti web stranicu i razvrstati je na semantička, sintaktička i statistička svojstva. Njihova je zamisao bila pokazati fluidnost i prirođenu zloporabu HTML-a. Dekonstruirali su Srednje postove i stvorili okruženje koje omogućuje čitateljima da razbiju duge blokove teksta u eksperimentalni tipografski prostor.

Pogledajte redizajn medija.

4. Hakerske vijesti Fabiana Dinklagea i Floriana Zia

Preuređenje Hacker News

Fabian i Florian pretvorili su Hacker News u interaktivnu vizualizaciju. Web-lokacija na društvenim mrežama je agregator vijesti koji se fokusira na informatiku i informatičku tehnologiju. Dizajn mu je gole kosti, ali ima složenu funkcionalnost za glasanje i rasprave. Fabian i Florian preuzeli su postojeću strukturu i pretvorili je u tipografski prostor vremenskih linija i mreža. Vizualna prezentacija temelji se na slijedu i povezanosti vijesti i komentara. Svoj su dizajn povezali i s API-om Hacker News-a, tako da ga zapravo možete koristiti za čitanje stranice. Pogledajte redizajn Hacker News.

David Carson je jednom rekao: "Ne brkajte komunikaciju sa čitljivošću." Ovaj savjet trebali bismo primijeniti u trenutnom stanju web dizajna. Čitljivost, upotrebljivost, reaktivnost, a osobito pristupačnost, ključne su osobine suvremenog weba. Ali ne bi trebali definirati i ograničavati njegov vizualni repertoar. Ako stereotipe izjednačavate sa upotrebljivošću, niste razumjeli ni vizualni dizajn niti dizajn koji je usredotočen na ljude.

Kao prvo, želio bih vidjeti radikalniji, generativni, evokativni, promišljen, adekvatan, sadržajno određen i inteligentan web dizajn. Želio bih ponovno otkriti web kao prostor za eksperimentalne eksperimente. Volio bih se češće iznenaditi. Ne znam kako će Internet izgledati u naredne 23 godine, ali nadam se da danas ne izgleda poput weba.

Ažuriranje: ovaj je esej privukao veliku pažnju i pokrenuo vrlo živu raspravu! Hvala vam na svim povratnim informacijama - napisao sam kratak odgovor na najčešća pitanja rasprave: "Uravnotežavanje kreativnosti i upotrebljivosti":