Hogyan használd a brutalizmust a weboldalakon, avagy mire jó a nyers erő?

A brutalista webdesign stílus egyfajta lázadás

A brutalizmus mint webdesign trend a tartalom alapú megközelítésből nőtte ki magát. A legelső brutalista webdesign layout-ok elnagyolt, kicsit minimalista benyomást keltő, elsősorban szövegeket tartalmazó weboldalak voltak. A brutalizmus a webdesignban egy “ellenreakció” (antidesign), a pixelpontos vágykeltő, manipulatív vizuális világok ellen, a felhasználót irányító animációk ellen, sok esetben pedig úgy általában a megszokott sémák és sablonok ellen. A brutalista webdesign ha kell, felrúgja a megszokott grides layoutokat, de képes szembe menni a harmonikus palettákkal és kompozíciókkal is.

A brutalizmus rövid története

Az ‘50-es években egy Angliából induló építészeti irányzattal kezdődött, mely részben Le Corbusier elveiből nőtte ki magát. Jellemző vonásai a látszóbeton alkalmazása és a funkcionális részletek építészeti látványelemként való használata. Amikor látszanak a csövek, a szerkezet, és nem törekszünk arra, hogy szép felületekkel takarjuk el a működés elemeit, akkor mindenképpen brutalizmusról beszélhetünk.

A „brutális” kifejezést használták az ilyen stílusú épületekre, de egy elmélet szerint a kifejezés nem a brutális szóból származik, hanem a francia béton brut- ból, ami nyers betont jelent. Nézd meg, mit jelent a brutalizmus az építeszetben.

A brutalizmus, mint stílus irányzat megjelenik az online világban is

A stílus és a gondolatmenet szép lassan bekúszott a különféle művészeti irányzatokba is, ahol a megszokott, unalmas, és harmóniára törekvő alkotások ellentéteként használták a lázadó művészek. Valahogy így került fel az internetre is, amikor megnyílt a lehetőség az online térben történő alkotásra. A brutalizmus a weben viszonylag új jelenségnek számít, 2017-től tartja a szakma számon, mint deklarált stílust.

Ahogy ezekre az épületekre, úgy az ilyen stílusú weboldalakra is igaz, hogy a szakmabelieket lázba hozó koncepció egy átlagember számára nem feltétlenül értelmezhető. Az egyik leginkább megosztó, és könnyen félreértett stílus irányzatról van szó.

Az elmúlt években az internetet elérhető tervezési trendek közül a brutalizmus minden bizonnyal a legszembetűnőbb és a legkevésbé definiált. Mutathat rokonságot a minimalizmussal, bár a köznyelvben most minimalista, letisztult weboldalakon a nagyon szép, általában tipográfiai alapú weboldalakat értjük. A mögöttes gondolati koncepció alapján azonban a felesleges díszítő elemek elhagyása és a tartalom központúság mindenképpen közös vonás.

Vannak, akik a csúnya weboldalak szinonimájaként használják a terminust, pedig nem feltétlenül kell anti-design elvek mentén megtervezni egy brutalista stílusú weboldalt.

A Bloomberg.com éles, semmitmondó dizájnja 2016-ban jött létre és 2018-ban finomodott. Gyakran a brutalizmus online elterjedésének vezető példájaként emlegetik.

A brutalista webdesign alapelvei

Az olvasónál marad az irányítás, sem tagolással, sem vágykeltő képekkel, sem animációval nem befolyásolja a megértést, az információ feldolgozását.

• funkció, működés áll a középpontban
• a tartalom funkcionális, közlésre szolgál
• nincsenek felesleges díszítő elemek
• nincsenek vizuális hangulatkeltő elemek
• sok esetben a tagolás sem segíti a figyelem irányítását
• a tipográfiát sem használja díszítőelemként
• szembemegy az aktuális paletta trendekkel
• szembemegy az aktuális oldal layoutokkal
• nem törekszik harmóniára

Rob Whiting, a Spencer Group terméktervezési vezetője úgy véli, hogy a felhasználói felület jövője „visszafogott színekben, nagyméretű, könnyen olvasható tipográfiában és egyszerű, feladat-központú interakciókban rejlik”. A brutalista weboldalak ezt a tervezési elméletet egészen a határokig viszik. A brutalizmus további jellemzőről a UXDesign oldalain is olvashatsz.

Ezek olyan webhelyek, amelyek nem biztos, hogy díjat nyernek az Awwwardson, de a „nagy, könnyen olvasható tipográfia és az egyszerű, feladat-központú interakciók” szempontjából valami olyasmit kínálnak, ami könnyen ragadós példa lehet.

Nathaniel Smith, a tilde.town munkatársa kijelentette a Washington Postban, hogy a brutális weboldalak gyakoribbak, mint gondolnánk. – „Nézzük meg a Craigslistet. Ez egy teljesen brutális weboldal … és a kereskedelemben is nagyon sikeres.”

Mutatunk egy idióta biztos e-kereskedelmi webhelyet is.

Példák a brutalista stílusú weboldalakra

Nem véletlen, hogy az legtöbb példát designer stúdiók és szabadúszó webdesignerek weboldalai között találjuk. Minden olyan témakörnél szóba jöhet, ahol az újszerűségről, a jövőről, a valódi kreativitásról, a formabontó vagy éppen forradalmi megoldásokról van szó. Egy fenntartható fejlődésről szóló weboldal esetén, egy flow-élmény konferenciánál, vagy egy innovatív technológiai megoldás kommunikációjához is szóba jöhet a brutalizmus. Azonban ahhoz, hogy ez a stílus a szakértelem látszatát keltse, és a szokatlansága ne hibának vagy dilettantizmusnak hasson tűpontos stílusérzék, és a brutalizmus mögött húzódó koncepció mély megértése szükséges.

XXIX Design Studio

Az XXIX design stúdió weboldala tipikus példa a brutalizmusra. A fonttípusok 30px felettiek, de nem ritka az 50px-es fontméret sem az olvasható szövegek esetében. Nem riadnak vissza az egymást átlapoló szöveg dobozoktól sem, kattintásra a háttérben lévő szöveg olvashatóvá válik. Nem baj, ha belelóg a következő tartalomblokkba és kitakarja a munkatársak portréit. Az oldalt böngészve meglepve fogod tudomásul venni, hogy egyáltalán nem létkérdés minden információnak egyszerre látszania a képernyőn, és a menüpontok, tabok, illtetve fülek használata csak egy elhagyható konvenció, amolyan megszokás.

Olyan apróságokban is hozza a brutalista stílust, mint a nem hagyományos, kicsit bumfordi egér kurzor, de sok más apró konvencióval is szakít, miközben nem akadályoz semmiben. Az email küldéshez az információt lábjegyzetben találjuk meg, a szövegen belüli kiemeléseket egy oda nem illő fonttípussal oldják meg. Igazi mestermunka a portfólió oldalak megvalósítása, ahol visszacsempészik az esztétikus megjelenést, és pontosan annyit használnak fel a brutalizmusból, ami még nem fáj. Például a portfólió képek teljes oldalszélességűek, és nem kockáztatják meg, hogy átfedve keresgéld őket, egymást kitakarva.

Kattints a példákra, ha meg akarod élőben nézni a weboldalakat, vagy vess egy pillantást az Awwwards brutalista stílusúnak megjelölt honlapjaira. De sok élő példát találhatsz ebben a kifejezetten brutalista stílusú website-okat listázó oldalon is.

Mire jó a brutalizmus és mire használd webdesignerként?

Egy webdesignernek mindenképpen érdemes az ismert sablonok megkérdőjelezésének képességét megőriznie. A szkepticizmus egészséges lehet, de valaminek az öncélú tagadása önmagában még nem fog jó weboldalakat eredményezni. A brutalizmus elveiből az ésszerűséget, a funkcionalitást érdemes szem előtt tartani, mert ez egybecseng a responsivitás igényeivel is, a mobil képernyőkön úgyis egyoszlopossá vasalódik ki a legzseniálisabb oldal layout is.

Van egy nagyon fontos dolog a brutalizmus gondolatiságában, ami könnyen lehet egy weboldal sikerének kulcsa is: engedjünk nagyobb teret a felhasználónak az információk értelmezésében. A manipulatív, érzelemkeltő design helyett, a lineárisan megnézhető videók, a figyelmet lekötő animációk helyett, hagyjuk, hogy a felhasználó fedezze fel a tartalmat és az összefüggéseket. Egyre nagyobb az igény a józan, önrendelkező, értelem alapú internet felhasználás iránt, amihez a fancy design elemeket háttérbe kell szorítanunk a felhasználó érdekében.

Jó kompromisszum lehet kisvállalkozói környezetben a harmonikus paletta és a látványos képanyag megtartása, miközben elrendezésekben, navigációs megoldásokban vagy éppen a hülye-biztos nagybetűs tipográfiával kicsit megtörjük a megszokott sablonokat. Nem baj, ha a végén senki nem fogja a brutalizmus címkéjével ellátni a kész weboldalt.