Celostna podoba ali komedija zmešnjav? Čas je, da naredite red!

Kateri logotip je pravi: logo.jpg, logo-final.png ali novi-logo.pdf?

Celostna grafična podoba (CGP) ni celostna, če ni konsistentna. Kar pa v digitalni dobi ni tako preprosto. Nobena redkost ni, da logotip, ob vsaki uporabi prepuščen na milost in nemilost raznim dodelavam in prilagoditvam, mutira v četico datotek, raztresenih po raznih dropboxih in priponkah in nihče več ne ve, katera verzija je “tista prava”.

Celostna podoba seveda ni zgolj logotip. Zlasti na spletu je sestavljena iz več sto elementov, ki se za nameček z vsako oblikovno nadgradnjo vsaj delno spremenijo.

Že zagotavljanje konsistentnosti v okviru enega spletnega mesta zna biti izziv, kaj šele, če želimo red na vseh kanalih in v vseh medijih, kjer objavljamo. Kako ta mozaik ikon, gumbov, pasic, obrazcev, fotografij, ilustracij in tipografij obdržati pod nadzorom?

Rešitev je aplikacija DSM (Design System Manager), ki samodejno posodablja elemente CGP, kar od skrbnika ne zahteva posebnega napora.

Kaj je Design System Manager (DSM)?

Nič več copy-pastanja, pošiljanja po e-pošti in ponavljanja vedno istih navodil. Oblikovalci in izvajalci se prijavijo v spletno storitev DSM, kjer jih čaka urejena, vedno posodobljena verzija celostne podobe. Posamezni elementi so opremljeni z navodili in kodo za programerje. Ne glede na to, koliko izvajalcev je vpetih v pripravo vaših pristajalnih strani, aplikacij ali portalov, vaša celostna podoba bo vedno enovita.

A splet je dinamično okolje. Hitro napoči čas, ko je treba osvežiti stil gumbov, zamenjati ikone ali celo posodobiti logotip. Centralno vodena knjižnica DSM je pod nadzorom skrbnika celostne podobe, ki vsako predlagano spremembo ali nadgradnjo najprej odobri, takoj zatem je že na voljo vsem ostalim izvajalcem.

Z DSM povezane spletne strani in aplikacije se ob odobritvi sprememb avtomatično posodobijo. Posodobljeni elementi so takoj pripravljeni za uporabo, tudi v klasičnih (tiskanih) medijih.

Komu je DSM namenjen?

DSM vam lahko prihrani precej časa in živcev če

• upravljate obsežno spletno mesto,
• komunicirate preko različnih kanalov, klasičnih in spletnih,
• sodelujete z različnimi agencijami in izvajalci
• v agenciji skrbite za CGP svojih naročnikov.

V Creatimu uporabljamo DSM rešitev ameriškega ponudnika InVision, ki omogoča usklajevanje oblikovalcev, UX strokovnjakov in programerjev glede CGP in nam tako prihrani precej časa.

Prednosti DSM

• DSM skrbi za enoten izvorni podatek ali single source of truth in omogoča nadzor nad verzijami posameznih elementov. Vedno lahko posamezen element vrnemo v stanje iz katerekoli prejšnje (druge) verzije.
• DSM omogoča hitro vključitev novih članov ekipe, krivulja učenja in spoznavanja z materijo je tako bistveno krajša.
• Marketinška ekipa naročnika lahko elemente iz knjižnice izvaža in uporablja še na drugih projektih.

In najboljši del? Ko spremenimo podobo enega elementa v knjižnici, na primer gumba na spletni strani, se ta preko API klica avtomatično spremeni tudi na vseh spletnih straneh, kjer je ta element uporabljen.

Ali s tem zapletamo delo oblikovalcev in programerjev?

Kratek odgovor: ne.

Predstavljajmo si nalogo oblikovalske ekipe (ni pomembno ali gre za interno ekipo ali za ekipo zunanjega izvajalca), ki mora za obstoječo stranko izdelati pristajalno stran za nov produkt.

Projektna naloga med drugim zahteva:

• Spremembo Call To Action (CTA) gumbov, ki naj se spremenijo na vseh spletnih mestih naročnika
• Oblikovanje in implementacijo novega spletnega obrazca

Seznanjanje s pravili celostne podobe, zlasti pa iskanje potrebnih datotek in informacij, je mukotrpno delo. Zato naročnik nalogo najraje zaupa “hišnemu” oblikovalcu, ki pozna materijo, vključno s podrobnostmi, ki niso nikjer zapisane. Zadnja verzija celostne podobe tako “živi” v glavi enega človeka.

Kar je ok, dokler si ta oblikovalec pri padcu s kolesom ne zlomi roke.

In kaj sedaj? Priprava promocije novega produkta je v polnem razmahu, človek, ki največ ve o tem, je pa v bolnici. Deadline je za vogalom, a nihče v firmi ne ve, kje so logotipi, kje je zadnja verzija ikon, kje je original videa, ki ga je treba dodelati. Čas je za paniko!

V primeru DSM je drugače. Ker ima naročnik vzpostavljeno knjižnico elementov z navodili vred, lahko delo prevzame katerikoli oblikovalec, tudi programerjem je vse jasno.

Če se vrnemo k naši projektni nalogi: oblikovalec bo po navodilih naročnika preoblikoval CTA gumbe in jih v knjižnici shranil kot novo verzijo obstoječih gumbov, naročnik pa bo pregledal in potrdil spremembe.

Po potrditvi se katalog elementov posodobi in ker so CTA gumbi na spletni strani preko vtičnika (API) povezani s knjižnico, je sprememba takojšnja. Če se naročnik kasneje odloči, da želi vseeno ostati pri prejšnji verziji, jo samo v zgodovini sprememb spet določi kot glavno verzijo.

Recimo, da spletni obrazec za razliko od CTA gumbov še ne obstaja, torej ga je treba izdelati. Oblikovalec iz knjižnice v Sketch uvozi (kliče) obstoječe elemente in jih nadgradi v nov obrazec. Tega shrani kot nov element knjižnice. Po potrditvi naročnika se pripravi koda, s katero razvijalci nov element vključijo v pristajalno stran.

Kaj pa klasična knjižnica elementov CGP? Ni več potrebna. Vse spremembe (vključno z opombami in verzijami) so varno shranjene v DSM in pripravljene za naslednji projekt.

Uvedba uporabe DSM je preprosta in postopna

Uporaba DSM pomeni večjo učinkovitost projektne ekipe, a vsaj na začetku zahteva nekaj trme, da se premagajo ustaljeni delovni vzorci, kar pa je težko doseči čez noč. Svojim naročnikom zato vedno svetujemo postopen prehod na DSM.

Da bo prehod potekal tekoče, začnemo DSM knjižnico graditi postopoma. Odlična priložnost za uvedbo DSM je prenova spletnega mesta. Elemente nove spletne strani že v startu prilagodimo in opremimo z relevantnimi informacijami za uvoz v knjižnico. Z vsakim naslednjim posegom v spletno mesto dodamo nove gradnike in tako gradimo digitalno knjižnico CGP elementov, prilagojeno standardnim procesom za načrtovanje uporabniške izkušnje v digitalnem svetu.

Razmišljate o prenovi spletnega mesta? Mimogrede lahko naredite še red na področju celostne podobe. V Creatimu vam z veseljem pomagamo. Oglasite se!