New Darja Dodič - CORE · 2018. 8. 24. · Celostna grafična podoba in spletna predstavitev...
Transcript of New Darja Dodič - CORE · 2018. 8. 24. · Celostna grafična podoba in spletna predstavitev...
Darja Dodič
CELOSTNA GRAFIČNA PODOBA IN SPLETNA PREDSTAVITEV KULTURE PLAYNESS
Diplomsko delo
Maribor, 2011
Celostna grafična podoba in spletna predstavitev kulture playness II
Diplomsko delo univerzitetnega študijskega programa
CELOSTNA GRAFIČNA PODOBA IN SPLETNA PREDSTAVITEV
KULTURE PLAYNESS
Študent: Darja Dodič
Študijski program: UN ŠP Medijske komunikacije
Smer: Interaktivna grafična komunikacija
Mentor: izred. prof. dr. Vili Podgorelec
Somentor: doc. dr. Matjaž Duh
Maribor, 2011
Celostna grafična podoba in spletna predstavitev kulture playness IV
ZAHVALA
Zahvaljujem se mentorju izr. prof. dr. Viliju
Podgorelcu in somentorju doc. dr. Matjažu Duhu
za strokovno vodenje in mnenja, ki so pripomogla k
uspešnemu dokončanju diplomske naloge.
Zahvaljujem se dr. Milanu Hosti, vodji filozofsko-
sociološkega eksperimenta imenovanega playness
kultura – za izposojo projekta in prispevano
gradivo za namene diplomske naloge.
Hvala tudi asist. mag. Katji Udir Mišič.
Hvala vsem bližnjim za spodbudne besede in
mojemu Juretu, ki je verjel vame.
Celostna grafična podoba in spletna predstavitev kulture playness V
CELOSTNA GRAFIČNA PODOBA IN SPLETNA
PREDSTAVITEV KULTURE PLAYNESS
Ključne besede: grafično oblikovanje, celostna grafična podoba, spletno oblikovanje,
spletna stran, CMS – sistem za upravljanje s spletno vsebino, Joomla!
UDK: 659.12:004.774(043.2)
Povzetek
Ko na trg vstopamo z novim izdelkom ali storitvijo, je zelo pomembno, da ga/jo dobro
promoviramo in predstavimo ter si tako zagotovimo uspešno prodajo. Del predstavitve na
trgu zajema tudi grafična podoba in spletna stran, ki smo ju izdelali za novo kulturo v
športu – kulturo playness. Playness je naslednje obdobje po fitnesu, wellnessu in selfnessu
kot nova oblika sprostitve in povrnitve razigranosti v naš vsakdan. To dejstvo smo
upoštevali pri oblikovanju znaka, ki je sestavljen iz razgibanih in barvitih figurativnih
človeških teles, ter pri oblikovanju logotipa, čigar tipografija izraža igrivost in trdne
temelje uveljavljajoče se playness kulture. Da bi bile informacije o playness kulturi zbrane
na enem mestu, smo izdelali spletno mesto z glavnimi informacijami o tem, kaj playness
sploh je, izobraževalnim središčem za tiste, ki bi radi postali voditelji playnessa, ter
seznamom centrov, kjer se ta dejavnost izvaja, oziroma možnostjo vpisa novega centra. Za
izdelavo uporabnega in vsebinsko bogatega mesta smo uporabili odprtokodni sistem za
upravljanje spletnih vsebin – CMS Joomla!.
Celostna grafična podoba in spletna predstavitev kulture playness VI
CORPORATE IDENTITY AND WEB PRESENTATION OF
PLAYNESS CULTURE
Keywords: graphic design, corporate identity, web design, website, CMS – content
management system, Joomla!
UDC: 659.12:004.774(043.2)
Abstract
Good promotion and presentation of a product or service are of great importance when
introducing it in the market, because they ensure a successful sale. Parts of such a
presentation are also the corporate identity and the website we have created for playness –
a new culture of sport. Playness reintroduces playfulness in our everyday lives and
represents a new form of relaxation, quite different to fitness, wellness and selfness. This
fact has been taken into account when designing the logo which consists of colorful
figurative human bodies, whereby it reflects playfulness and solid foundations of the
outstanding playness culture. We have developed a website containing all information
about playness: main information about playness, training centers for those who wish to
become playness instructors and a list of centers where such activities can be practiced or
registered at. In order to create a usable and content-rich website, we used an open-source
web content management system – CMS Joomla!.
Celostna grafična podoba in spletna predstavitev kulture playness VII
KAZALO
1 UVOD ........................................................................................................................... 1
2 METODOLOGIJA ...................................................................................................... 3
2.1 NAMEN DIPLOMSKE NALOGE.................................................................................... 3
2.2 CILJI......................................................................................................................... 3
2.3 RAZISKOVALNA VPRAŠANJA .................................................................................... 3
2.4 PREDPOSTAVKE IN OMEJITVE ................................................................................... 4
2.5 PREDVIDENE METODE .............................................................................................. 4
3 CELOSTNA GRAFIČNA PODOBA ........................................................................ 5
3.1 IDENTITETA IN IMIDŽ ............................................................................................... 5
3.1.1 Identiteta .......................................................................................................... 6
3.1.2 Imidž ................................................................................................................ 7
3.1.3 Simbolni identitetni sistem .............................................................................. 8
3.2 LIKI .......................................................................................................................... 8
3.3 PROSTOR ................................................................................................................ 10
3.4 BARVA ................................................................................................................... 11
3.4.1 Barvna modela RGB in CMYK .................................................................... 13
3.4.2 Barvni krog .................................................................................................... 15
3.4.3 Barvni kontrast .............................................................................................. 17
3.4.4 Oblika in barva .............................................................................................. 24
3.4.5 Barve .............................................................................................................. 25
3.5 TIPOGRAFIJA .......................................................................................................... 26
3.6 LOGOTIP IN ZNAK ................................................................................................... 30
4 OBLIKOVANJE LOGOTIPA KULTURE PLAYNESS ...................................... 32
4.1.1 Informacija, identifikacija ali definiranje problema ...................................... 34
4.1.2 Inkubacija ...................................................................................................... 36
4.1.3 Iluminacija ali inspiracija .............................................................................. 37
4.1.4 Verifikacija in implementacija ...................................................................... 39
Celostna grafična podoba in spletna predstavitev kulture playness VIII
5 SPLETNO OBLIKOVANJE .................................................................................... 40
5.1 ZNAČILNOSTI SPLETA ............................................................................................. 41
5.1.1 Tipografija na internetu ................................................................................. 42
5.1.2 Barve na internetu .......................................................................................... 43
5.1.3 Grafični uporabniški vmesnik ....................................................................... 44
5.2 PROSTA IN ODPRTOKODNA PROGRAMSKA OPREMA ................................................ 45
5.3 SISTEM ZA UPRAVLJANJE SPLETNE VSEBINE ........................................................... 46
5.3.1 CMS ............................................................................................................... 46
5.3.2 CMS Joomla! ................................................................................................. 48
5.4 ZASNOVA SPLETNE STRANI KULTURE PLAYNESS .................................................... 50
5.4.1 Načrtovanje .................................................................................................... 50
5.4.2 Struktura ........................................................................................................ 53
5.4.3 Navigacija ...................................................................................................... 55
5.4.4 Barva .............................................................................................................. 55
5.4.5 Tipografija ..................................................................................................... 55
6 IZDELAVA PREDLOGE ZA CMS JOOMLA! .................................................... 56
6.1.1 Index.php ....................................................................................................... 57
6.1.2 Zemljevid strani ............................................................................................. 59
6.1.3 Template.css .................................................................................................. 60
6.1.4 TemplateDetails.xml...................................................................................... 61
6.1.5 Template_thumbnail.png ............................................................................... 63
6.2 POSTAVITEV IN OBJAVA SPLETNE STRANI............................................................... 64
7 SKLEP ........................................................................................................................ 67
8 LITERATURA .......................................................................................................... 68
Celostna grafična podoba in spletna predstavitev kulture playness IX
KAZALO SLIK
Slika 1: Referenčni trikotnik (Repovš, 1995) ................................................................... 6
Slika 2: Prostorski križ (Butina, 1997) ........................................................................... 10
Slika 3: Barvno telo (mrsandersclass.com, 2010) .......................................................... 12
Slika 4: Aditivno mešanje barv ...................................................................................... 13
Slika 5: Barvna modela RGB in CMYK v primerjavi z vidnim spektrom (RGB vs.
CMYK, 2010) .............................................................................................................. 14
Slika 6: Subtraktivno mešanje barv ................................................................................ 15
Slika 7: Barvni krog (Itten, 1999) ................................................................................... 16
Slika 8: Kontrast barve k barvi: rumena, rdeča, modra; Simbol slovenskega predsedstva
Svetu EU (EU2008.si, 2011) ....................................................................................... 17
Slika 9: Svetlo-temni kontrast: Rembrandt, Belsazar, 1635 .......................................... 18
Slika 10: Na obeh slikah je enaka vijolična barva; na zgornji sliki deluje toplo, ker so
sosednje barve hladne, na spodnji pa hladno, saj so sosednje barve tople .................. 19
Slika 11: Hladno-topli kontrast: Mathias Grunewald: Vstajenje, 1515 ............................ 19
Slika 12: Komplementarni kontrast rdeče in zelene: Vincent van Gogh: Le Café de nuit,
1888 .......................................................................................................................... 20
Slika 13: Sumultani kontrast: Cruz Diez .......................................................................... 21
Slika 14: Povečan, spremenjen in zmanjšan simultani učinek ......................................... 21
Slika 15: Različna barvna čistost: Francisco de Goya, Don Manuel, 1784 ...................... 22
Slika 16: Kontrast količine: Vincent Van Gogh: Café Terrace at Night, 1888 ............... 23
Slika 17: Rumena : vijolična = 1:3, oranžna : modra = 1:2, rdeča : zelena = 1:1 ............ 23
Slika 18: Liki s pripadajočimi barvami ............................................................................ 24
Slika 19: Značilnosti črk (Repovš, 1995) ......................................................................... 28
Slika 20: Obstoječe podobe fitnes, welness in selfness klubov, centrov, studiev ............ 35
Celostna grafična podoba in spletna predstavitev kulture playness X
Slika 21: Skice na listu papirja ......................................................................................... 36
Slika 22: Človeške figure ................................................................................................. 36
Slika 23: Tipografiji v ožjem izboru ................................................................................. 37
Slika 24: Črno-bele in barvne kombinacije ...................................................................... 37
Slika 25: Znak in logotip kulture playness za različna področja ...................................... 38
Slika 26: Izbiranje barv pri oblikovanju spletne vsebine ................................................. 44
Slika 27: Spletna stran fitness.org (Fitness.com, 2010) ................................................... 51
Slika 28: Spletna stran wellness.com (Wellness.com, 2010) ........................................... 52
Slika 29: Skica spletne strani ............................................................................................ 54
Slika 30: Navigacijska vrstica .......................................................................................... 55
Slika 31: Tipografija na spletni strani ............................................................................... 55
Slika 32: Privzete Joomla! predloge: beez, ja_purity, rhuk_milkyway ............................ 57
Slika 33: Shema spletne strani po obliki .......................................................................... 58
Slika 34: Div struktura spletne strani ............................................................................... 59
Slika 35: Sestava kaskadnega stila ................................................................................... 60
Slika 36: Primer dela datoteke templateDetails.xml ........................................................ 62
Slika 37: Joomla! pozicije Playness predloge .................................................................. 63
Slika 38: Thumbnail ......................................................................................................... 63
Slika 39: Vstopna stran ..................................................................................................... 64
Slika 40: Vsebina strani, ko je izbran eden izmed glavnih stebrov .................................. 65
Slika 41: Prijava v playness izobraževalni sistem ............................................................ 66
Celostna grafična podoba in spletna predstavitev kulture playness XI
UPORABLJENE KRATICE
CGP – celostna grafična podoba
CMYK – cyan, magenta, yelow (rumena), kontrast
CMS – Content management system
CSS – Cascading Style Sheets
HTML – Hyper Text Markup Language
IIS – Internet Information Services
PHP – Hypertext Preprocessor
RGB – red (rdeča), green (zelena), blue (modra)
WWW – World Wide Web
Celostna grafična podoba in spletna predstavitev kulture playness 1
1 UVOD
Najprej moramo spoznati podjetje, šele potem lahko oblikujemo celostno grafično podobo
(CGP), ki bo izraz realne oziroma želene identitete in imidža podjetja. V informacijski
dobi se spopadamo z veliko količino podatkov, zato oblikovanje nekaj novega,
privlačnega, kar bo vzbudilo pozornost, predstavlja pravi izziv. »Odločitve, kaj bomo
prebrali ali si ogledali in kaj preskočili, so sicer večinoma nezavedne in nenadne, hkrati pa
so med najpomembnejšimi« (Parker, 1997, XX). »CGP je veliko več kot zgolj
identifikacija podjetja. Izraža tudi identifikacijo dosežene ravni kakovosti, vrednosti in
zanesljivosti, je posebne vrste komunikacija podjetja. Kot takšna je močno in učinkovito
komunikacijsko orodje, ki služi kot osnova za uspešno razločevanje podjetja od njegovih
konkurentov. CGP je vključena v splet virov, ki ustvarjajo osnovo za doseganje uspešnosti
poslovanja, dobrega imena, vrednosti blagovne znamke, spodbujanja nakupov, skratka
rezultatov vseh vrst« (Dnevnik d. d., 2001).
Spletne strani nam podajajo informacije o podjetju oziroma organizaciji. Podatki, ki so na
spletu, so nam na voljo 24 ur na dan, kar pomeni stalno dosegljivost. Spletne strani so
nepogrešljiv del komunikacije z uporabniki. Vse več informacij poiščemo na internetu in
če nekega podjetja oziroma organizacije tam ni, bi lahko rekli, da ne obstaja. »Pri
ustvarjanju spletne strani je potrebno najprej definirati namen spletne strani, določiti ciljno
publiko (potencialne obiskovalce), izdelati vsebino in nato vse to grafično in programsko
sestaviti, da nastane skupek strani, ki so funkcionalno povezane med seboj ter se nahajajo
na istem spletnem mestu pod isto domeno« (Spletna stran, 2010). Pri izdelavi spletne strani
je pomembna predvsem njena funkcionalnost. Strani moramo redno posodabljati in
obnavljati, saj bomo s tem pritegnili obiskovalce, da se bodo vračali na našo spletno stran.
Namen spletne strani je posredovanje informacije na kar se da hiter in učinkovit način.
Ljudje smo na internetu zelo nestrpni in prvih nekaj sekund odloča o tem, ali bo uporabnik
nadaljeval z obiskom in raziskovanjem strani ali pa ga bo zapustil in obiskal stran
konkurenčnega podjetja.
Celostna grafična podoba in spletna predstavitev kulture playness 2
Celostna predstavitev podjetja oziroma organizacije zajema tako oblikovanje celostne
grafične podobe kot tudi oblikovanje spletne strani. V diplomski nalogi smo opisali korake,
ki so potrebni za celostno predstavitev podjetja. Prvi del diplomske naloge je tako
posvečen celostni grafični podobi na splošno – od realne identitete podjetja do upoštevanja
likovnih osnov, ki jih potrebujemo pri oblikovanju CGP. V drugem delu diplomske naloge
smo se posvetili spletu, njegovim značilnostim, odprtokodnim programom in podrobneje
spoznali CMS Joomla! – sistem za upravljanje vsebin. Izbrano teorijo smo nato
implementirali v izdelavi celostne predstavitve kulture playness, ki obsega izdelavo
logotipa in spletne strani v CMS Joomla!.
Celostna grafična podoba in spletna predstavitev kulture playness 3
2 METODOLOGIJA
2.1 Namen diplomske naloge
Namen diplomske naloge je predstaviti kulturo playness z izdelavo celostne grafične
podobe in spletnega mesta.
V prvem delu predstavili kaj je celostna grafična podoba skupaj z likovnimi
karakteristikami, ki so pomembne za izvedbo celostne grafične podobe. Pridobljeno znanje
bo osnova za izdelavo znaka in logotipa kulture playness.
V drugem delu bomo pregledali značilnosti spleta in se spoznali s sistemom za upravljanje
spletne vsebine – Joomla!. Na podlagi zbranih informacij bomo oblikovali in naredili
predlogo za CMS Joomla!.
2.2 Cilji
Cilja diplomskega dela sta:
• izdelati prepoznaven logotip in znak kulture playness;
• za kulturo playness izdelati spletno mesto, ki bo ponujalo pomembne informacije o
novi športni kulturi.
2.3 Raziskovalna vprašanja
Naša raziskovalna vprašanja so:
• RV1: Kako izdelati učinkovito in prepoznavno celostno grafično podobo?
• RV2: Kakšni so logotipi, znaki in spletna mesta različnih splošnih športnih kultur?
• RV3: Kako izdelati spletno mesto s pomočjo CMS Joomla!?
Celostna grafična podoba in spletna predstavitev kulture playness 4
2.4 Predpostavke in omejitve
Ker je kultura playness na trgu nova, je pomembno, da je na trgu predstavljena enotno in
bo tako dosegla prepoznavnost. Omejitve so predvsem sposobnost narediti nekaj novega in
vpadljivega, kar bo pritegnilo pozornost. Skupaj z likovnimi predpostavkami in pravili
bomo morali upoštevati tudi želje naročnika. Pri oblikovanju spletne strani bomo združili
omejitve, ki so prisotne na spletu, z možnostmi in funkcionalnostmi, ki nam jih ponuja
CMS Joomla!.
2.5 Predvidene metode
Metoda dela je, po zgledu teorije, s pomočjo grafičnih programov (Adobe Photoshop,
Adobe InDesign) in sistema za upravljanje spletne vsebine (CMS Joomla!) ustvarjanje
celostne predstavitve kulture playness. Metodo deskripcije smo uporabili za opisovanje
pojmov in dejstev, ki smo jih črpali iz obstoječe literature. Komparativno metodo smo
uporabili za primerjavo trenutnega stanja logotipov in znakov ter spletnih mest športnih
kultur.
Celostna grafična podoba in spletna predstavitev kulture playness 5
3 CELOSTNA GRAFIČNA PODOBA
Skozi poglavja, ki sledijo, bomo poskušali odgovoriti na prvo raziskovalno vprašanje:
Kako izdelati učinkovito in prepoznavno celostno grafično podobo?
Grafično oblikovanje je najbolj univerzalno izmed umetnosti. Je povsod okoli nas ter
razlaga, okrašuje, določa pomen svetu. Z grafičnim oblikovanjem se srečujemo na cestah,
pri vseh vrstah napisov, na naših telesih. Grafično oblikovanje ima več funkcij: med seboj
razvršča in razlikuje podjetja ali organizacije, deluje na naša čustva in nam pomaga
izoblikovati občutke o svetu okoli nas (Newark, 2007).
Celostna grafična podoba (CGP) je vizualni prikaz vloge in funkcije družbe, način njene
vizualne komunikacije interno z delničarji in zaposlenimi in na zunaj z njenimi dobavitelji
in kupci. Celostna podoba je sestavljena iz logotipa in imena, ki je v lasti družbe, skupaj s
pravili in navodili o tem, kako se jih uporablja na primer na tiskanem materialu (pisemske
ovojnice, katalogi in poročila), pri oglaševanju, trženju in promociji ter na proizvodih in
storitvah. CGP pogosto določa, katere barve in tipografije je treba uporabljati z logotipi in
imeni, ter želeno razmerje med njimi. Izbrani barve in znaki so lahko v lasti družbe.
3.1 Identiteta in imidž
Kadar govorimo o celostni predstavitvi podjetja, moramo razjasniti nekaj osnovnih
pojmov, ki so temeljna podlaga za uspešno celostno predstavitev podjetja, organizacije,
prireditve ali v našem primeru kulture.
Vsaka organizacija ima svojo identiteto, imidž in simbolni identitetni sistem. Odnosi med
njimi so prikazani v referenčnem trikotniku, ki sta ga predstavila Richards in Ogden leta
1936.
Celostna grafična podoba in spletna predstavitev kulture playness 6
Realna identiteta, imidž in simbolni identitetni sistem organizacije delujejo usklajeno le, če
pogosto preverjamo njihovo stanje in spreminjamo njihove sestavne dele do ravnotežja, ki
vodi k uspešnosti organizacije (slika 1).
Slika 1: Referenčni trikotnik (Repovš, 1995)
3.1.1 Identiteta
Identiteta in imidž ali podoba podjetja sta dva ločena pojma, ki se ju pogosto zamenjuje ali
napačno uporablja. Podjetje prej ali slej postane tržna znamka, prej ali slej ima določeno
tržno vrednost. Da ljudje, kupci, dobavitelji, partnerji in splošna javnost to prepoznajo,
mora podjetje ustvariti svojo identiteto. Tako kot ima vsak izmed nas svoje ime in obraz,
tako ga mora imeti tudi podjetje (Korelc, 2010).
Repovš je opredelil pojem identitete: »Identiteta je kvaliteta ali sposobnost biti isti; je
absolutna ali vsebinska enakost, istost. Identiteta pomeni seštevek vseh poti, ki jih izbere
podjetje ali organizacija, da bi opravljalo svoje poslanstvo in se identificiralo pri vseh
svojih javnostih. Identiteta je manifestacija vsega, kar organizacija je, za čimer stoji in
kamor gre. Z njo se organizacija identificira in razlikuje od drugih, vzpostavlja svojo
notranjo kulturo in jo ohranja z vsakim zaposlenim« (Repovš, 1995, 17). »Za velike
organizacije, lahko oblikovanje celostne grafične podobe traja leta, pozornost pa
potrebujejo konstantno tudi kasneje. Organizacije, ki ne usklajujejo grafičnega dela,
ustvarjajo razpršeno in nepovezano identiteto« (Newmark, 2007, 124).
Celostna grafična podoba in spletna predstavitev kulture playness 7
Identiteta je najprej fizična pojavnost podjetja, kamor spadajo poslovne in proizvodne
stavbe, transportna sredstva, spletna stran, izdelki, skratka vse, kar pomeni fizično
pojavljanje podjetja. Naslednji dejavnik identitete je odnos zainteresiranih kupcev,
dobaviteljev, pogodbenih sodelavcev, širše javnosti med seboj in do podjetja. Pogosto
zanemarjen sestavni del identitete je tako imenovana refleksija, ki govori o tem, kako
človeka, ki je v odnosu z določenim podjetjem, obravnavajo tisti, ki ga obkrožajo
(sodelavci, prijatelji, znanci, družina …). »Ne najlažje dojemljiv dejavnik je osebnost
podjetja, ki jo opredeljujejo njegovi atributi (obnašanje, odzivanje na tržno dogajanje, drža
vodstva in podobno). Idealna slika osebnosti podjetja prikazuje zaposlene in kupce
izdelkov tega podjetja, ki se z osebnostjo podjetja poistovetijo. Izjemen vpliv na identiteto
ima danes tudi kultura podjetja, ki pomeni vpletenost podjetja v širše okolje (socialna,
kulturna, ekonomska, družbeno-politična dogajanja in tako naprej) ter notranji zaposlitveni
ustroj« (Korelc, 2010). Identiteta pa zelo močno vpliva na imidž podjetja.
3.1.2 Imidž
David O'Gilvy je govoril o tem, da potrošniki kupujejo blagovno znamko in ne izdelka. S
tem se je pojavila ideja o imidžu, ki se je kmalu prenesla na podjetja. »Imidž je vtis, ki jo
na osnovi sprejetih signalov oblikuje njegov prejemnik. Imidž je pojem, ki obsega vse, kar
se o neki organizaciji misli, občuti. Je sistem slik, oblikovan skozi vedenje subjekta in
izoblikovan iz občutkov, mišljenj, želja in idealov, asociacij. Je tudi odraz zavestnih in
podzavestnih stanj posameznikov, v katerih nastaja« (Repovš, 1995, 18). Na imidž
vplivajo vse mogoče komunikacije podjetja: tržne komunikacije, kultura podjetja, osebni
stik zaposlenih z zunanjim svetom in tako naprej (Korelc, 2010). Zato je imidž dinamičen
pojem, ki se vzdržuje in spreminja.
»Imidž podjetja, blagovne znamke, ideje ali izdelka se oblikuje z informacijami, ki
obljubljajo potencialnim potrošnikom zadovoljevanje njihovih osnovnih, pa tudi zapletenih
psihosocialnih potreb« (Repovš, 1995, 19). Če ima organizacija opredeljeno svojo vizijo,
politiko, organizacijsko kulturo, filozofijo in poslanstvo, bo uspela doseči zaznavanje teh
opredeljenih lastnosti skozi enopomenske komunikacije. Neformalne komunikacije (stik
zaposlenih z različno javnostjo), formalne (fizične lastnosti izdelkov in storitev) in
formalizirane komunikacije (oglaševalske akcije in druge oblike pospeševanja prodaje)
oblikujejo imidž o organizaciji in vsem, kar organizaciji pripada.
Celostna grafična podoba in spletna predstavitev kulture playness 8
3.1.3 Simbolni identitetni sistem
»Simbolni identitetni sistem je realna identiteta organizacije, prevedena na simbolno raven.
Sestavljajo ga verbalni in grafični simboli, črkopisi, barve in ostale likovne strukture,
razporejene po površinah komunikacijskih sredstev na samosvoj, prepoznaven in
razlikovalen način« (Repovš, 1995, 21). Simbolni identitetni sistem je pojem, ki poleg
celostne grafične podobe vključuje tudi ostale organizacije dražljajev, kot so glasba,
vonjave, okusi in tudi vedenje ljudi. Celostna grafična podoba je kot del simbolnega
identitetnega sistema pomembno orodje za predstavljanje realne identitete organizacij in
vzpostavljanje pravilnega in ustreznega imidža.
3.2 Liki
Likovna teorija je posebna veda, ki raziskuje likovna izrazila in zgradbo likovnih del ter
proučuje zakonitosti dojemanja likovnih del. Likovno teorijo zanimajo predvsem likovna
izrazila, ki so skupna vsem področjem likovne umetnosti. Ukvarja se z analizo likovnih
elementov, likovnih spremenljivk, načel likovnega reda, s pomočjo katerih ustvarjajo svoja
dela različni likovni ustvarjalci: slikarji, kiparji, arhitekti, oblikovalci. Vsem so v likovnem
izražanju skupni pojmi: lik, prostor, barva, oblika itn.
»Lik je v sebi organiziran vidni dražljaj, ki se loči od likovnega ozadja in stopa predenj«
(Repovš, 1995, 82). Definicijo lika v smislu likovne psihologije je podal Katz: »Za nek lik
je značilno, da je omejen, razločen, koherenten oziroma zaprt, strukturiran ali organiziran.
Doživeti neki figuralni lik pomeni doživeti zaznavno enoto, ki jo praviloma ni mogoče
spreminjati po volji. Kolikor močnejši je nek lik, toliko bolj se upira zunanjim vplivom. V
strukturi lika se celota in njeni deli recipročno odločajo, pri tem pa prevladuje kvaliteta
pojavne celote nad kvaliteto delov. Ta zakon je toliko bolj veljaven, kolikor bolj
koherentna je struktura lika« (Butina, 1997, 68). Krog je po Sandersu ekstremen primer
kohezije lika. Tudi ravna linija je koherenten lik. »Koherentnost lika preprečuje ločevanje
delov iz njegove celote, medtem ko nastopijo motnje lika takrat, kadar se v njem jasno
razločijo posamezni deli. Deli neke likovne strukture ali konfiguracije imajo različne
vrednosti. Nekateri deli so nujni za ohranitev integralne strukture, nekateri pa so relativno
nepomembni fragmenti. Tako v karikaturah spreminjajo vse odnose nekega obraza, pa
vendar ostane ohranjena identiteta izraza« (Butina, 1997, 68). Obliki, pravi Butina, ki je
Celostna grafična podoba in spletna predstavitev kulture playness 9
obogatila svojo absolutno vrednost z navezovanjem odnosov z okoljem, pravimo lik. Lik
lahko definiramo tudi geometrijsko: lik ima dve dimenziji, torej je lik vsaka ploskovna
oblika. Likovni pojem lika po mnenju Butine presega geometrijsko pojmovanje.
Wertheimer je lik definiral kot celoto, katere značilnosti niso določene z značilnostmi
njenih individualnih delov, ampak z notranjo povezavo celote (Butina, 1997).
Lik vzbuja asociacije in pomene ter teži k temu, da ga prepoznamo, primerjamo in
poimenujemo z dosedanjimi vidnimi izkušnjami in dogovori. »Ključna značilnost lika, ki
ga tudi opredeljuje, je rob, ki nastaja med likom in likovnim ozadjem« (Repovš, 1995, 82).
Površina okoli lika se imenuje funkcionalna praznina, ki izostruje lik iz ozadja, mu daje
večjo veljavo in ga okrepi kot vidni dražljaj.
Motivacija, stališče, učenja itd. vplivajo na hitrost in vsebino zaznavanja lika. Prav tako so
geometrijsko pravilnejši liki bolj avtoritetni, učljivi in prepoznavni. Like, ki so bili v
sosedstvu z dobrimi informacijami in izkušnjami, smatramo kot pozitivne, če pa so bili
uporabljeni ob slabih informacijah in izkušnjah, pa jih smatramo kot negativne. Ostri liki
delujejo resno, grozeče, inteligentno, dinamično, nevarnejše in polemično, obli pa mehko,
dobrodušno in varovalno.
»Liki in likovne strukture imajo svoj čustven naboj in so nasičeni s pomeni. Simboli kot
likovne strukture so nosilci emocij, ki so se vezale na določeno likovno strukturo z
informacijami in izkušnjami. Ob istem liku, likovni strukturi, simbolu se emocije lahko
menjajo z novimi informacijami in novimi izkušnjami« (Repovš, 1995, 85–86).
Skupaj lahko postavimo več likov, ki delujejo samostojno, vzbujajo asociacije in se
zapolnjujejo s pomeni. Če sta lika eden zraven drugega, se bosta pričela nanašati eden na
drugega. »Začela bosta vsak zase in na račun drugega izgubljati svojo enovito identiteto in
bosta prešla v skupno identiteto z novim nerazdeljenim pomenom« (Repovš, 1995, 83).
Oblika, lik in forma so sinonimi, ki jih med seboj ne ločujemo jasno, vendar so to osrednji
likovni pojmi, ker se v njih povezujejo mnoge likovne prvine v celote.
Celostna grafična podoba in spletna predstavitev kulture playness 10
3.3 Prostor
Za kvaliteten grafični izdelek sta pomembna tako motiv kot tudi ozadje. Zato prištevamo
prostor oziroma slikovno površino k osnovnemu kompozicijskemu elementu. »Pri tem
nimamo v mislih navideznega tridimenzionalnega prostora, v katerega je umeščen narisan
motiv, ampak dvodimenzionalno površino slike« (Rački, 2004, 18).
Ljudje imamo razvit občutek za svoje telo in občutimo svoje telo kot celoto, ki jo tvorijo
telesni deli in odnosi med deli. Iz položaja telesa lahko razločimo osnovne likovne pojme,
ki se odražajo v prostorskem križu. Pokončna drža telesa ponazarja vertikalo kot likovno
pojmovno podobo. Nasprotje pokončne drže je ležanje, likovna podoba pa je vodoravnica.
»Tretji pojem tvorijo poševni, diagonalni položaji glede na oba prva, vertikalno in
horizontalno« (Butina, 1997, 170). Navpičnica in vodoravnica sta torej osnovna pojma
prostorskega križa. Navpičnica oziroma frontalna ravnina (A na sliki 2) gre skozi telo tako,
da razdeli telo na spredaj in zadaj. »Vidni prostor torej leži pred frontalno ravnin.« (Butina,
1997, 170). Druga navpičnica oziroma medialna ravnina (B na sliki 2) stoji pravokotno na
frontalno ravnino in razdeli telo na levo in desno. Tretja očesna ravnina (C na sliki 2) pa
leži pravokotno na prejšnji ravnini in telo deli na spodaj in zgoraj. Talna ravnina (T na sliki
2) zaključi podobo prostorskega križa kot njegova temeljna ravnina, po kateri se gibljemo
v vse smeri. Prostorski križ je izhodišče za likovni prostor.
Slika 2: Prostorski križ (Butina, 1997)
Celostna grafična podoba in spletna predstavitev kulture playness 11
Poznamo tri dimenzije, ki pa jih je mogoče doživljati tudi na dvodimenzionalni likovni
površini. To storimo s pomočjo strukturiranja likov v skladu z nekaterimi psihološkimi
zakonitostmi. Slikar tretjo dimenzijo ustvari z iluzijami, z ustrezno organizacijo likovnih
sredstev:
• prostorsko globino dosežemo z različnimi velikostmi likov. Večji se zdijo bližji,
manjši se potiskajo v globino;
• s prekrivanjem – lik, ki prekriva drugega daje vtis, da je bližje, prekriti lik pa se
umika v globino;
• lik, ki je jasnejši in ima izrisane podrobnosti, se zdi bližji od likov, ki so manj jasni
in izgubljajo podrobnosti;
• sence ob liku ustvarjajo vtis globine. »Predmeti, ki so bližje viru svetlobe, mečejo
na oddaljene svojo senco« (Butina, 1997, 78);
• linearna perspektiva (linije, ki bežijo proti skupni točki) ustvarja prostorsko
globino;
• z zmanjševanjem likov in hkratnim pomanjševanjem razdalje med njimi se ustvarja
vtis prostorske globine;
»Likovni prostor uresničujemo z likovnimi izraznimi sredstvi, torej s čutnimi občutki, ki so
se v toku likovne analize osamosvojili v likovne pojme. Ko se v skladu z zamislijo likovni
pojmi zlijejo z likovnimi materiali, postanejo spet čutno dostopni, konkretno čutno
gradivo, ki nosi v svoji formi vsebino likovnega pojmovanja umetnika. Likovni prostor
umetnik gradi s posebno razporeditvijo likovnih občutkov, ki nastanejo iz zlitja likovnih
pojmov in materialov, in ki so konkretni čutni material likovne forme, ker jih lahko spet
čutno zaznamo« (Butina, 1997, 178–179). Umetnik nikoli ne uporabi vseh izraznih
sredstev, ki so mu na voljo, ampak uporabi samo tiste, ki se skladajo z njegovim
mišljenjem in pojmovanjem sveta in prostora.
3.4 Barva
»Barve so življenje, kajti svet brez barv bi bil videti mrtev. Barve so praideje, so otrok
prvotne brezbarvne svetlobe in njene nasprotne skrajnosti, brezbarvne teme. Tako kot
plamen ustvarja svetlobo, tako tudi svetloba ustvarja barve. Barve so otrok svetlobe,
Celostna grafična podoba in spletna predstavitev kulture playness 12
svetloba pa mati barv. Svetloba, ta prvobitni pojav sveta, nam v barvah razkriva duha in
živahno dušo tega sveta« (Itten, 1999, 8).
Znotraj celostne grafične podobe so barve pomemben del vizualne sporočilnosti. »Barve
same po sebi in tudi v odnosu z drugimi barvami pripomorejo k večji učljivosti,
prepoznavnosti, razlikovalnosti, berljivosti in referenčnosti simbolov in celostnih grafičnih
podob« (Repovš, 1995, 92).
Barva kot subjektivno doživetje nastane z draženjem receptorjev na mrežnici očesa,
človeški možgani pa dražljaj prevedejo v doživetje barve. Elektromagnetno valovanje v
območju vidnega spektra - od približno 380 do 740 nm - se imenuje svetloba. Barva pa je
lastnost svetlobe. »Nekatera telesa odsevajo malone vso svetlobo, ki pada na njihovo
površino, zato se nam prikazujejo bela. Če pa odbijajo le zelo malo vpadne svetlobe, jih
vidimo črne« (Trstenjak, 1996, 17). Če telesa absorbirajo samo sevanje določene valovne
dolžine, druge pa odsevajo, jih vidimo v različnih barvah, in sicer odvisno od valovne
dolžine sevanja. Tako na primer vidimo zeleno, ker odseva od dnevne svetlobe samo
valove s povprečno dolžino 500 nm, druge pa vpija. »Nekatere telesne površine pa
svetlobo tudi presevajo, transmitirajo; to so prozorne površine« (Trstenjak, 1996, 17).
Površina, pri kateri imamo popolno razprševanje, pri kateri se svetloba na vse strani
enakomerno porazdeljuje, se imenuje motna površina.
»Barvo označuje njena barvitost, barvna kvaliteta, ki je lahko svetlejša ali temnejša«
(Butina, 1997, 192). Slika 3 prikazuje barvne lastnosti, ki so:
• barvitost (hue),
• svetlost (value),
• čistost ali nasičenost (saturation).
Slika 3: Barvno telo (mrsandersclass.com, 2010)
Celostna grafična podoba in spletna predstavitev kulture playness 13
3.4.1 Barvna modela RGB in CMYK
»Barvni modeli so namenjeni natančnemu in objektivnemu opisu barv. Vsaka barva v
barvnem modelu je predstavljena kot kombinacija več številčnih vrednosti. Večina barvnih
modelov uporablja za opis posamezne barve 3 parametre - torej jih lahko predstavimo v
tridimenzionalnem prostoru. Obstaja veliko barvnih modelov, ki se uporabljajo za
prikazovanje barv na različnih medijih, kot sta monitor ali papir. Znanih je okoli 400
barvnih sistemov in zbirk barv« (Barvni modeli, 2010).
RGB
RGB (red, green, blue) je kratica, ki prihaja iz angleščine in pomeni rdeča, zelena in
modra, ki so tudi osnovne barve modela. Vsaka od teh barv se lahko pojavi v 256 odtenkih,
kar skupno znaša 16.777.216 barv (Barvni modeli RGB, 2010).
Aditivno mešanje barv
Če na očesno mrežnico hkrati pade več sevanj različnih valov, dobimo mešano svetlobo.
Temu principu pravimo aditivno mešanje barv (Trstenjak, 1996). Aditivno mešanje (slika
4) je mešanje barvnih valenc rdeče, zelene in modre svetlobe (RGB). Tak način mešanja
barv uporabljajo barvni zasloni katodnih cevi za televizijo in računalnike. Barvni vtis bele
barve torej dobimo takrat, ko svetloba različnih valovnih dolžin (RGB) istočasno zadene
na isto mesto na očesni mrežnici. Ko se aditivno združi svetloba dveh aditivnih primarnih
barv, nastane cyan, magenta ali rumena barva. Z mešanjem zelene in modre dobimo
odtenek cyan, z mešanjem rdeče in modre dobimo odtenek magente ter z mešanjem zelene
in rdeče dobimo rumeno.
Slika 4: Aditivno mešanje barv
Celostna grafična podoba in spletna predstavitev kulture playness 14
CMYK
Barvni model CMYK (Cyan, Magenta, Yellow, Kontrast1
»Pretvorba iz barvnega prostora RGB v CMYK je relativno enostavna, prinaša pa določene
izgube nekaterih barvnih tonov, ker sta barvna prostora precej različna in moramo torej s
štirimi osnovni barvami (cyan, magenta, yellow in kontrast) simulirati vse ostale tone. V
praksi se ta izguba odraža v manj nasičenih in manj čistih barvah, nekaterih barv pa barvni
prostor CMYK sploh ni zmožen prikazati. Določene barve so za to še posebej občutljive,
predvsem so to živo oranžni in živo zeleni toni, modra je malo manj občutljiva, rdeča pa je
skoraj enaka« (Barvni modeli CMYK, 2010). Razliko med RGB in CMYK barvnim
prostorom v primerjavi z vidnim spektrom prikazuje
) je sestavljen iz štirih procesnih
barv: cyan, magente, rumene in kontrastne barve. Z različnimi mešanicami teh barv lahko
dobimo vse barve, definirane v tem barvnem modelu. Barvni model CMYK je eden izmed
najpogosteje uporabljanih barvnih modelov v tisku, pa tudi v procesu priprave na tisk.
Barvni prostor CMYK izvira iz barvnega modela CMY. Kontrastna barva je dodana zaradi
neidealnih procesnih barv; v teoriji namreč mešanica vseh treh barv pomeni črno, v praksi
pa dobimo umazano rjavo barvo.
slika 5.
Slika 5: Barvna modela RGB in CMYK v primerjavi z vidnim spektrom
(RGB vs. CMYK, 2010)
1 V nekateri literaturi za četrto barvo barvnega modela CMYK poleg izraza kontrast najdemo še izraz key, ki
prav tako pomeni črno oziroma, bolje rečeno, kontrastno (ključno) barvo: tisto, ki da detajle k sliki (CMYK
color model, 2011).
Celostna grafična podoba in spletna predstavitev kulture playness 15
Subtraktivno mešanje
Pri subtraktivnem (slika 6) mešanju pa ne mešamo svetlobe, ampak pigmente. »Tako
nastala barva namreč ni vsota obeh svetlob, ki bi jih vsaka barva zase prepuščala, ampak je
le ostanek barve, ki je niti ena niti druga tekočina ali barvna snov ne absorbira. Zato
imenujemo tako mešanje, ki pa utegne prav tako dovesti do popolnega zlitja barvnega
vtisa, subtraktivno mešanje barv« (Trstenjak, 1996, 168). Z dodajanjem enakih deležev
cyan, magenta in rumene dobimo črno oziroma v praksi umazano rjavo barvo. Z mešanjem
cyan in rumenega pigmenta dobimo odtenek zelene barve, z mešanjem rumene in magente
dobimo odtenek rdeče ter z mešanjem magente in cyan dobimo modro. Takšno mešanje se
uporablja v tiskarstvu.
Slika 6: Subtraktivno mešanje barv
3.4.2 Barvni krog
Iz primarnih barv rumene, rdeče in modre je zasnovan dvanajstdelni barvni krog, ki je
prikazan na sliki 7. V enakostraničnem trikotniku barvnega kroga so barve razvrščene tako,
da je rumena na vrhu, rdeča desno spodaj in modra levo spodaj. Šesterokotnik vsebuje
sekundarne barve, ki jih dobimo z mešanjem dveh primarnih barv:
• rumena in rdeča = oranžna;
• rumena in modra = zelena;
• rdeča in modra = vijolična.
Celostna grafična podoba in spletna predstavitev kulture playness 16
Slika 7: Barvni krog (Itten, 1999)
Krog je razdeljen na dvanajst enako velikih odsekov. Primarne in sekundarne barve so v
krog vnesene tako, da med dvema nanesenima barvama ostane še en prazen odsek. V tem
odseku se nahajajo terciarne barve, ki jih dobimo z mešanjem ene primarne in ene
sekundarne barve:
• rumena in oranžna = rumenooranžna;
• rdeča in oranžna = rdečeoranžna;
• rdeča in vijolična = rdečevijolična;
• modra in vijolična = modrovijolična;
• modra in zelena = modrozelena;
• rumena in zelena = rumenozelena.
Barvni krog je torej razdeljen na dvanajst enakomernih barvnih delov, vsaka barva pa ima
svoje nezamenljivo mesto. »Barve si sledijo v istem zaporedju kot pri mavrici ali pri
spektralnem traku« (Itten, 1999, 30).
Celostna grafična podoba in spletna predstavitev kulture playness 17
3.4.3 Barvni kontrast
»O kontrastu govorimo takrat, kadar med dvema barvnima učinkoma, ki ju primerjamo
med seboj, lahko opazimo določeno razliko« (Itten, 1999, 32). Glede na značilnosti
delovanja barv lahko ugotovimo sedem različnih kontrastov:
• kontrast barve k barvi;
• svetlo-temni kontrast;
• hladno-topli kontrast;
• komplementarni kontrast;
• simultani kontrast;
• kontrast kvalitet;
• kontrast količin.
Kontrast barve k barvi
Slika 8: Kontrast barve k barvi: rumena, rdeča, modra; Simbol slovenskega
predsedstva Svetu EU (EU2008.si, 2011)
»Tako kot črno-belo predstavlja najmočnejši svetlo-temni kontrast, tako dajo rumena,
rdeča in modra najmočnejši kontrast barve k barvi« (Itten, 1999, 33). Svetlo-temni kontrast
vedno učinkuje barvito, glasno, močno in odločno. Kontrast barve k barvi, ki je prikazan
na sliki 8, je manj izrazit, čim bolj so uporabljene barve oddaljene od treh primarnih.
Celostna grafična podoba in spletna predstavitev kulture playness 18
Oranžna, zelena in vijolična so po svojem značaju šibkejše kot rumena, rdeča in modra, ki
so najmočnejši kontrast barve k barvi. Kontrast lahko upodobimo tudi z drugimi čistimi,
nemešanimi barvami.
Svetlo-temni kontrast
Iz narave smo vajeni zaznavanja svetlobe in teme, svetlega in temnega. Črna in bela
predstavljata najmočnejši svetlo-temni kontrast (slika 9). Razločujemo pa tudi barve enake
svetlosti ali temnosti. »Enake tonske vrednosti vežejo barve drugo na drugo ter jih
združujejo« (Itten, 1999, 41).
Slika 9: Svetlo-temni kontrast: Rembrandt, Belsazar, 1635
Celostna grafična podoba in spletna predstavitev kulture playness 19
Hladno-topli kontrast
Slika 10: Na obeh slikah je enaka vijolična barva; na zgornji sliki deluje toplo,
ker so sosednje barve hladne, na spodnji pa hladno, saj so sosednje barve
tople
Poskusi s subjektivno zaznavo so pokazali, da modrozelen prostor učinkuje hladneje kot
rdečeoranžno obarvan prostor. V barvnem krogu je razvidno, da je rumena barva
najsvetlejša, vijolična pa najtemnejša, kar pomeni, da je med tema dvema barvama
najmočnejši svetlo-temni kontrast. Horizontalno v barvnem krogu ležita rdečeoranžna in
modrozelena, ki sta skrajni vrednosti kontrasta hladno-toplo. Tople barve so: rumena,
rumenooranžna, oranžna, rdeča in rdečevijolična; hladne pa rumenozelena, zelena,
modrozelena, modra, modrovijolična in vijolična. Modrozelena in rdečeoranžna sta kot
skrajna pola vedno hladna oz. topla, vse ostale barve pa lahko učinkujejo ali toplo ali
hladno – odvisno od sosednje barve, ki je lahko hladnejša ali toplejša, kot jasno prikazuje
slika 10. Kontrast hladno-toplo ima nekatere lastnosti, s katerimi sugerira bližino in daljavo
(slika 11), zato je pomembno izrazno sredstvo za perspektivne in plastične učinke.
Slika 11: Hladno-topli kontrast: Mathias Grunewald: Vstajenje, 1515
Celostna grafična podoba in spletna predstavitev kulture playness 20
Komplementarni kontrast
Komplementarni kontrast sestavljata dve pigmentni barvi, ki dasta nevtralno sivočrno
barvo, če ju med seboj zmešamo. V barvnem krogu si komplementarni barvi ležita nasproti
in če sta uravnoteženi, dajeta najbolj uravnotežen par, čisto harmonijo. Komplementarni
pari so:
• rumena : vijolična (tudi skrajna vrednost svetlo-temnega kontrasta);
• rumenooranžna : modrovijolična;
• oranžna : modra;
• rdečeoranžna : modrozelena (tudi skrajna stopnja hladno-toplega kontrasta);
• rdeča : zelena (njeni svetlostni vrednosti sta enaki – slika 12);
• rdečevijolična : rumenozelena.
Slika 12: Komplementarni kontrast rdeče in zelene: Vincent van Gogh: Le
Café de nuit, 1888
»Če komplementarne pare barv razčlenimo, ugotovimo, da vsak od njih vedno vsebuje tri
osnovne barve – rumeno, rdečo in modro:
• rumena : vijolična = rumena : rdeča in modra
• modra : oranžna = modra : rumena in rdeča
• rdeča : zelena = rdeča : rumena in modra« (Itten, 1999, 49).
Celostna grafična podoba in spletna predstavitev kulture playness 21
Simultani kontrast
Slika 13: Sumultani kontrast: Cruz Diez
»Simultani kontrast imenujemo pojav, ko človeško oko ob dani barvi istočasno, torej
simultano, teži tudi po komplementarni barvi; če je ni, jo ustvari sam« (Itten, 1999, 52).
Simultani kontrast (slika 13) nastane v očeh opazovalca, torej realno ni prisoten. Dalj časa
ko opazujemo izbrano barvo in bolj čista kot je, močnejši je simultan učinek. Kot je
razvidno iz slike 14, lahko učinek simultanega kontrasta povečamo ali pa ga povsem
preprečimo. Prvi kvadrat simultani učinek povečuje, saj ima primešano rahlo zeleno –
komplementarno barvo. Srednji kvadrat je nevtralen, zato ga simultani učinek spremeni,
pri tretjem pa je učinek izničen, saj je sivi pridana rahla rdeča. Simultani učinek je
velikokrat nezaželen, lahko pa ga učinkovito izkoristimo.
Slika 14: Povečan, spremenjen in zmanjšan simultani učinek
Celostna grafična podoba in spletna predstavitev kulture playness 22
Kontrast kvalitet
Barvna kvaliteta je stopnja čistosti oziroma nasičenosti barv. »Kontrast barvnih kvalitet
predstavlja nasprotje med nasičenimi, svetlimi barvami in zastrtimi, toplimi barvami.
Spektralne barve, ki nastanejo pri razklonu bele svetlobe, so najbolj nasičene in čiste«
(Itten, 1999, 55). Barve lahko zastremo na štiri načine:
• barvi pridamo belo, s tem postane hladnejša;
• zmešamo jo s črno in jo potemnimo;
• nasičeno barvo lahko zmešamo z belo in črno, tj. s sivo. Tako dobimo svetlejše;
temnejše ali enako svetle tone. Barve postanejo nevtralne in motne;
• primešamo ji ustrezno količino komplementarne barve.
Slika 15: Različna barvna čistost: Francisco de Goya, Don Manuel, 1784
Celostna grafična podoba in spletna predstavitev kulture playness 23
Kontrast količin
Kontrast količin (slika 16) pomeni razmerje velikosti dveh ali več barvnih površin.
Vprašanje je, v kakšnih medsebojnih velikostnih razmerjih morajo biti barvne ploskve, da
so v ravnovesju in da nobena ni bolj izrazita od ostalih. Slika 17 prikazuje, kako je Goethe
uredil barvno skalo količinskih razmerij glede na svetlost in čistost barve.
Slika 16: Kontrast količine: Vincent Van Gogh: Café Terrace at Night, 1888
Slika 17: Rumena : vijolična = 1:3, oranžna : modra = 1:2, rdeča : zelena = 1:1
Celostna grafična podoba in spletna predstavitev kulture playness 24
3.4.4 Oblika in barva
Prav tako so barve razporedili glede na like (slika 18), katerim najbolj ustrezajo, kar nam
pride prav pri reševanju prostorskih problemov:
• kvadrat – rdeča (Rdeča je močna in stabilna osnovna barva. Nima močno
izraženega ekscentričnega in ne koncentričnega gibanja. Daje nam izredno barvno
privlačnost, oko pa jo izostri, zato je primerna za robove in vogale. Najbolj ji
ustreza kvadrat, ki je eden najtrdnejših in najstabilnejših oblik.);
• trapez – oranžna (Oranžna je manj surova barva kot rdeča. Njena rumena prisotnost
jo naredi lažjo, je topla, suha in vsiljiva barva. Primerna je za obrise in fine detajle.
Najbolj ji ustrezajo tiste oblike, ki imajo določene težnje po gibanju – trapez.);
• trikotnik – rumena (Rumena je najbolj svetla in vidna barva, zato deluje ostro, suho
in živahno. Njen vpliv na oko ni dolgotrajen, ampak kmalu preneha, zato je ena
najlažjih barv. Obenem se širi in ustvarja ostro sliko na očesu, to pa je glavni faktor
za povezovanje oblik z barvami. Rumeni torej ustreza trikotnik, ki je zelo ostra in
dinamična oblika, je pa tudi najbolj koncentrična – oži se sama vase. Iz tega stališča
nasprotuje rumeni, ki se širi.);
• krog – modra (Modra je hladna, vlažna in prosojna barva. Dozdeva se nam, da se
krči in umika v prostor. Na mrežnici ustvarja mehke in zabrisane oblike, zato z njo
najlažje ustvarimo občutek globine. Uporabljamo jo tam, kjer niso pomembne
ostrine in detajli, zato ji je najbližje krog zaradi svoje mehkobe in dinamičnosti.);
• stožec – zelena (Zelena je hladna, sveža, mehka in prostorska barva, ki je oko ne
more dodobra odrediti, zato ponavadi ni primerna za ostre robove in detajle. Čista
zelena je najpomembnejša, najprivlačnejša in prijetna za oko. Zeleni ustrezajo
mnogokotniki in stožec.);
• elipsa – vijolična (Vijolična je mehka, zabrisana barva, ki deluje dvoumno in
žalostno. Ni je mogoče dodobra izostriti, zato jo ponavadi ne uporabljamo za
detajle. Najprimernejša oblika zanjo je elipsa.
Slika 18: Liki s pripadajočimi barvami
Celostna grafična podoba in spletna predstavitev kulture playness 25
3.4.5 Barve
Rumena
Je najsvetlejša od vseh čistih barv. Predstavlja snov, ki izžareva svetlobo. Simbolizira
razum in znanje. Rumena v kontrastih učinkuje radostno in žareče. Je intenzivna, ostra,
široka, najbolj ekspanzivna, sili čez okvire. Asociira na veselost, razsvetljenost, sončnost,
inteligenco, akcijo, mladost, strahopetnost, izdajstvo …
Rdeča
Je prilagodljiva in obsega najrazličnejše značaje. Rdeča ima topel značaj, ki se v
rdečeoranžni stopnjuje do ognjene. Rdečeoranžna svetloba pospešuje rast rastlin in krepi
organske funkcije. »V ustreznem kontrastu postane rdeča izraz vročične, bojevite strasti«
(Itten, 1999, 85). Pomeni tudi poduhovljeno ljubezen. Asociira na srečo, agresivnost,
impulzivnost, optimizem, moč, moškost, dinamizem, mobilnost, strast, smrt, vojno, kri…
Modra
Če na modro gledamo z materialno–prostorskega stališča, je vedno pasivna, če pa jo
gledamo z duhovno–nematerialnega, pa je aktivna. Je hladna barva, ki učinkuje
ponotranjeno, introvertirano. Sklada se z živčevjem. Je vedno senčna, po svoji svetlosti se
nagiba k temi. Za nas je simbol vere. Asociira na poduhovljenost, ženskost, konservatizem,
pobožnost, pravico, racionalnost, pasivizem, mir, zadovoljstvo, higieno, melanholijo,
temačnost, dvom …
Zelena
Zelena je barva rastlinskega sveta. »Ko svetloba doseže zemljo, ko voda in zrak sprostita
elemente, takrat požene kvišku oživljajoča moč zelene« (Itten, 1999, 88). Zelena
simbolizira plodnost, zadovoljstvo, mir, upanje, pa tudi združevanje ter prežemanje znanja
in vere. Sivozelena daje občutek zaspane lenobe. Rumenozelena pomeni mladostno,
pomladansko naravo. Zelena asociira na naravo, rodnost, življenje, upanje, blagostanje,
stabilnost, varnost, pa tudi na razpadanje, plesen, sovražnost, ljubosumje …
Celostna grafična podoba in spletna predstavitev kulture playness 26
Oranžna
Oranžna ima sončno svetlost, ki svojo največjo toplo in aktivno energijo doseže pri
rdečeoranžni. Praznična oranžna zlahka postane ponosna in bahava. Oranžna asociira na
komunikacijo, ženitev, organsko, ambicijo, vedrost, ekspanzivnost, bogastvo, radodarnost,
sprejemljivost, zlovoljnost …
Vijolična
Predstavlja nezavedno, skrivnostno, včasih deluje grozeče, drugič osrečujoče, zdaj veselo,
zdaj potrto - odvisno od kontrastov. Če je na večjih ploskvah, deluje grozljivo. Vijolična je
barva nezavedne pobožnosti, potemnjena pa mračnega praznoverja in skrivnostne
katastrofe. Svetlo vijolična razsvetljuje temno pobožnost, je nežna in prijazna.
Črna
Črna barva predstavlja kontrast beli, izraža pasivnost, stanje izpolnjene in nespremenljive
smrti. Asociira na neprodornost, razlikovanje, eleganco, temnost, smrt, bolezen, obup,
zanikanje, notranjo tišino, zlo, greh …
Bela
»Bela je absolutna, pomeni odsotnost in vrhunec barv. Je barva vrnitve, simbol sveta in
absolutna tišina« (Repovš, 1995, 98). Asociira na čistost, osvežitev, popolnost, neskončno
svobodo, resnico, praznino, absolutno tišino, praznost …
3.5 Tipografija
»Če razmislimo o svojih vsakodnevnih dejavnostih, nam hitro postane jasno, da je
tipografija povsod in se ji ne moremo izogniti. "Napisano" se najprej nanaša na "ročno
napisano", vendar obstajajo številni načini predstavitve pisanega jezika z uporabo
tehnologij, kot so tisk, tekstovna sporočila, elektronska sporočila, tiskalniki … Beseda
tipografija vključuje vse te metode komunikacije. Tipografija in pisanje sta povsem
naravno od nekdaj povezana: tipografija je disciplina in strokovna praksa, ki variira med
sporočilom in prejemnikom. Za razumevanje slovnice tipografije, moramo poznati in
Celostna grafična podoba in spletna predstavitev kulture playness 27
razumeti jezik ter vedeti, kako je prilagojen za delovanje v različnih socialnih kontekstih«
(Jury, 2006, 8).
Oblikovalci morajo pri delu izbirati med tipografijo, ki je niso sami zasnovali. To lahko
predstavlja omejitev, posebno takrat, kadar razpoložljiva tipografija ne ustreza estetskim in
tehničnim zahtevam. Ruder pravi, da izbira med že narejenimi tiskarskimi črkami
predstavlja bistvo veščine in ne slabost. (Ruder, 1977, 8).
Tipografija, ki sestavlja besedilo in naslove, ter način, kako je predstavljena, vpliva na
obliko in sporočilnost bolj kot katerikoli drug vizualni element. Vsaka pisava bralcu
sporoča določene informacije, kot so razpoloženje, drža, ton, pomaga pa nam tudi pri
razumevanju sporočila. »Dober oblikovalec naj ne meša med seboj tiskanega in pisanega.
Tisk ne more nikoli doseči enkratne spontanosti rokopisa« (Ruder, 1977, 22). Pri
oblikovanju moramo biti dosledni – slediti moramo tipografskemu vzorcu, ki smo si ga
zamislili. Ruder pravi, da naj bi podjetje v javnosti nastopalo z enotno tipografsko podobo,
od najpreprostejših tiskovin, do zahtevnega oglaševalskega materiala. »Za vzpostavitev
enotne pojavnosti je treba uporabljati naslednje tipografske elemente v kar se da stalnih
oblikah: znak, značilno ime podjetja, barvo in ureditev« (Ruder, 1977, 214).
Tipografija je oblikovanje besedila iz tiskanih črk na določeni likovni površini. Tipografija
je značilno oblikovanje pretežno verbalnega sporočila na likovni površini. V oblikovanje
se poleg črk vključuje tudi druge like z ilustracijami in fotografijami, da se ustvari in
okrepi sporočilnost komunikacijskega sporočila. Izbor črkopisa, velikosti črk, vrsta
naslonila, črkovni, besedni in vrstični presledki dajejo končno podobo sporočila, ki tudi s
svojo tipografsko podobo ustvarja imidž organizacije. »Najvažnejša naloga tipografskega
oblikovalca je posredovanje tiskanega sporočila. Nečitljiv in neberljiv tisk je izdelek brez
vrednosti. Tipograf, pravi Ruder, daje besedi vidno obliko in jo ohranja za prihodnost«
(Ruder, 1977, 34). V CGP mora izbrana tipografska podoba komunikacijskih sporočil
izražati strateška izhodišča organizacije in podobo, kakršno želi organizacija ustvariti v
očeh ciljne javnosti. »Črke so osnova tipografskega oblikovanja. Različne črke kot
fonetični simboli sestavljajo abecedo. Vsaka črka ima veliko pojavnosti, ki so se ustvarjale
skozi zgodovino. Vsaka pojavnost posamezne črke ima svoj karakter, ki ga oblikujejo
značilnosti (slika 19), kot so: verzalka, mala črka, višina male črke, serifi, vratovi in repi,
loki, zožitve in odebelitve, okenca, grebeni, ostroge, prehodi itd.« (Repovš, 1995,
117,118).
Celostna grafična podoba in spletna predstavitev kulture playness 28
Rep: del črke, ki sega pod osnovno črto.
Serifi: kratke prečne zaključne poteze na koncu črke – tudi ime za pisave s serifi.
Višina verzalke: razdalja med osnovno črto in vrhom velike tiskane črke.
Višina x: višina malih tiskanih črk.
Votlina, okroglina: notranjost pri nekaterih črkah.
Vrat: del črke, ki sega v zgornje črkovno polje (povzeto po Parker, 1997).
Slika 19: Značilnosti črk (Repovš, 1995)
Črke so lahko pisane pokončno ali ležeče. Kurzivne črke delujejo bolj zaupno, saj so bližje
rokopisu. V besedilu se lahko menjajo značilnosti črk z namenom poudarka ali
razlikovanja besede ali dela besedila. Črke so lahko tudi tanke, svetle, navadne, polkrepke,
krepke, odebeljen ali zožene, normalne, razširjene. Značilnosti se lahko tudi kombinirajo,
na primer razširjene krepke.
Črkovna družina so vse črke in spremljajoči znaki znotraj določenega črkopisa v različnih
debelinah in širinah, v pokončni ali poševni obliki.
Besedilo lahko poravnamo na sredinsko, levo, desno ali obojestransko naslonilo. »Najmanj
utrujajoče in najhitrejše je branje besedila z obojestranskim naslonilom. Robovi besedila so
navpično poravnani na njegovem levem in desnem robu« (Repovš, 1995, 119). Sredinska
poravnava je utrujajoča in težko berljiva, saj se besedilo v vsaki vrsti začne in konča v
drugačni razdalji od glavnega roba likovne površine. Tudi besedilo z desnim naslonilom je
težko berljivo, močno pa se zmanjša hitrost branja.
Celostna grafična podoba in spletna predstavitev kulture playness 29
Širina besedila močno vpliva na čitljivost besedila. »Preširok stavek se spreminja v
dekorativno sivino in ga je težko brati. Proti koncu vrstice se bralec že utrudi, prekinitev ob
začetku nove vrstice pa ga osveži. Čitljivost je odvisna od števila črk v vrstici. Vrstica s
50–60 črkami je dobro čitljiva« (Ruder, 1977, 43).
Presledki med črkami, besedami, vrsticami ter prostor okoli besedila vplivajo na čitljivost,
berljivost in estetsko vrednost tiskanega besedila. »Presledke med besedami je potrebno
nadzorovati, da so tam, kjer se zahteva nemoten pretok informacij, prostori majhni, kolikor
je le mogoče. Kljub temu da je prostor med posameznimi črkami že v naprej določen s
strani oblikovalca pisave, ga moramo vedno preveriti« (Jury, 2006, 94). »Presledki morajo
biti z belino črk harmonično usklajeni. Z razdaljo med črkami tipograf lahko učinek
notranje beline črk poveča ali zmanjša« (Ruder, 1977, 52). Berljivost je slabša, če je
razmik med besedami in črkami premajhen. Premajhni presledki med vrsticami ustvarjajo
gmoto enega lika, iz katerega je težko razbrati posamezne vrstice teksta. Če pa je razmik
med vrsticami prevelik, se pogled ujame v praznino, čitljivost in berljivost pa sta tako
slabši. Tesni črkovni presledki povečajo izraznost praznine znotraj črk, ki je pri krepkih
črkah večja kot pri svetlih. Postavljanje črkovnih presledkov, tako imenovano
spacioniranje, je težavno delo, saj so si črke med seboj različne zaradi specifičnih oblin,
vršičkov, prečk, repov itd. Postavljene ena zraven druge, skupaj s praznino tvorijo različne
protioblike. »Logotipi, naslovi in naslovna besedila, postavljena brez krojenja
(spacioniranja), izražajo neprofesionalno in slabo estetsko kulturo grafičnih oblikovalcev«
(Repovš, 1995, 121).
Besedilo lahko členimo s praznimi prostori, črtami, barvami, različnimi črkopisi in
različnimi pojavnostmi črk. Vse to razgiba likovno podobo, ustvarja poudarke, razbija
monotonost, povečuje čitljivost ter ustvarja estetsko in pomensko vsebino tipografske
podobe.
Poleg črk in praznine so osnovni elementi tipografskega oblikovanja tudi pika, črta in
ploskev, s katerimi vzpostavljamo arhitekturo komunikacijskega sporočila. V pomoč so
nam pri organizaciji likovnega gradiva. S piko, črto in ploskvijo tipografijo omejujemo,
ločujemo, z njimi ustvarjamo ravnotežje, umirjamo, ostrimo napetost, odpiramo,
ustavljamo pogled ali pa ga vodimo, poudarjamo ali potiskamo v ozadje.
Celostna grafična podoba in spletna predstavitev kulture playness 30
Tipografska podoba je celoten vidni vtis oziroma zaznava, ki je zgrajena z različnimi
tipografskimi sredstvi na likovnem ozadju komunikacijskega sredstva. CGP izraža želeno
realno identiteto z opredeljeno značilno tipografsko podobo, ki daje vtis načrtovane, vedno
prepoznavne urejenosti likovnega gradiva.
Samara Timothy pravi, da so vsa tipografska pravila namenjena temu, da jih lahko
prekršimo. Pravila ostajajo ista – kako pa so uporabljena, je tisto, kar se spreminja.
Učinkovito tipografsko oblikovanje se začne z razumevanjem bistvenih lastnosti,
skrivnostjo, kako lahko manipuliramo s temi lastnostmi in kako ta manipulacija vpliva na
tipografijo (Timothy, 2006).
3.6 Logotip in znak
Beseda "logotip" izhaja iz grške besede "logos" besedo in "tupos" vtis. Logotip lahko
poimenujemo tudi blagovna znamka, storitvena znamka, znamka (Newark, 2007, 120).
Logotip je prepoznavni simbol podjetja, objekta, objave, osebe, storitve ali ideje. Je znak,
ki se nahaja na dnu televizorja, na vrhu škatle s kosmiči ali v glavi pisma. Na žalost ima
beseda "logo" veliko pomenov in uporabljajo se različne besede za opis iste stvari, logotipa
(Sean, 2004).
Angleški izraz logo prevajamo z besedo znak (Logotip, 2011). Znak je lahko besedni,
simbolni, slikovni ali kombinacija le-teh (Newark, 2007, 120). »Logotip je ime
organizacije ali blagovne znamke, ki je izpisano z značilnimi črkami« (Repovš, 1995).
Logotip je razlikovalni znak podjetja, izdelka, storitve ali vrste proizvodov in storitev iz
istega vira. Logotip je lasten podjetju, ki ga reprezentira in ga lahko zaščitimo kot
blagovno znamko, trgovsko ime ali registrirano znamko. Lahko je tipografski, figurativen,
abstrakten ali kombinacija naštetega. Je eden izmed osnovnih elementov celostne podobe
ali identitete blagovne znamke. Logotip podjetja, celostna podoba, blagovna znamka
označujejo natančen simbol, ki predstavlja podjetje v vsaki komunikaciji z zunanjim
svetom. Za gradnjo zaupanja potencialnih strank do podjetja je nujno potrebna preprosta in
učinkovita interpretacija ciljev, vrednot in strokovnega znanja. Javno identiteto lahko
danes ustvarimo s pomočjo vizitk, dopisnih listov, brošur, oglasov, oblačil, spletne strani,
promocijskih materialov … (Dabner, 2010).
Celostna grafična podoba in spletna predstavitev kulture playness 31
Oblikovanje logotipa sega daleč v zgodovino identificiranja znamke, ki se nanaša ne le na
komercialno uporabo (kot blagovna znamka za podjetje ali organizacijo), ampak tudi na
osebni, rodovni in kulturni kontekst. Izhaja iz simbolike in znakov, in ker obstaja iz
predneolitskega časa, logotip dandanes nikomur ni tuj. Takoj prepoznaven, zapomnljiv in
dobro zasnovan logotip je prilagodljiv na več načinov, od dimenzij do uporabe, vendar
dovolj prožen, da nemudoma ohranja svojo identiteto v mislih gledalcev in skozi prihodnji
razvoj. To je hkrati temelj in osnovno načelo za razvoj blagovne znamke. Odločitve o
slogu, barvi, estetiki in tipografiji logotipa ustvarijo temelj, na katerem bo zasnovana
celotna marketinška strategija. Oblikovalec nato implementira bistveno idejo v sistem
elementov, ki prikazujejo edinstveno sliko in idejo, s tem pa ustvarja identiteto podjetja.
Znaki in logotipi podjetja/organizacije so prvo, kar opazimo in si najbolj zapomnimo od
vsega poslovnega premoženja. Profesionalno oblikovani logotipi zgradijo originalno
poslovno identiteto ter umeščajo organizacijo v svet informacij in simbolov. Med
kakovostne znake in logotipe danes spadajo vse tiste stvaritve, ki jih odlikuje:
• posebnost;
• praktičnost;
• grafičnost;
• enostavnost forme;
• eno sporočilo;
• primernost (Korelc, 2010).
Ivan Chermayeff, Tom Geismar in Steff Geisbuhler (oblikovalci znakov Mobil, National
Geographic, Chase Bank …) so podali temeljno formulo logotipa: Znamka je oboje: oblika
in vsebina, podoba in ideja. Da bo učinkovita, mora biti njena oblika dovolj razširjena, da
jo bo mogoče prepoznati in dovolj nenavadna, da je ne bo mogoče pozabiti. Zasnovana
mora biti dovolj sodobno, da odraža svojo dobo, vendar ne preveč, da ne izgine pred
desetletjem. Nazadnje, biti mora enostavna, da si jo lahko zapomnimo in primerna idejam
in aktivnostim, ki jih predstavlja (Newark, 2007, 120).
Celostna grafična podoba in spletna predstavitev kulture playness 32
4 OBLIKOVANJE LOGOTIPA KULTURE PLAYNESS
Do ideje vodijo različne poti, a proces ustvarjalnega mišljenja je mogoče opisati po enotni
metodologiji. Kreativno snovanje grafičnega simbola po Repovšu je sestavljeno iz treh faz:
informacije, inkubacije in iluminacije (Repovš, 1995). Graham Wallas je proces
ustvarjalnega reševanja problemov s stališča psihologije definiral s štirimi fazami:
priprava, inkubacija, iluminacija in verifikacija. Srića dodaja še zadnjo fazo,
implementacijo. Faze se med seboj do neke mere prekrivajo, vendar z njihovo pomočjo
vseeno lahko bolje spoznamo pot do inventnih metod in novih, izvirnih idej (Srića, 1999,
55).
V prvi fazi pripravi, informacije oziroma identifikacije mora oblikovalec dobiti čim več
informacij o organizaciji, ki želi imeti prenovljeno, ali v našem primeru, novo celostno
grafično podobo. Oblikovalec se mora razgledati po literaturi, ki obravnava grafično
oblikovanje, in po letnih pregledih simbolov in CGP-jev s celega sveta. Potrebno je čim
natančneje definirati problem, razumeti moramo cilj, ki ga želimo doseči.
»V fazi inkubacije oblikovalec razmišlja o odnosih med zbranimi informacijami, ki se
grupirajo na različnih miselnih nivojih in prihajajo iz ene informacijske gmote v drugo;
vsaka od njih je oplemenitena s stališči in ostalimi vedenjskimi lastnostmi oblikovalca«
(Repovš, 1995, 103–104). »Inkubacija (ali čakanje, da čas prinese rešitev) je pogosto
najpomembnejša faza pri ustvarjalnem premagovanju problemov. Včasih lahko traja samo
sekundo ali minuto, včasih pa se lahko razvleče na dneve, tedne in celo leta« (Srića, 1999,
59). Čas inkubacije je spremenljivka, ki je neodvisna od kreatorja grafičnega simbola.
Inkubacijska doba bo krajša, če bo imel oblikovalec več informacij o tipu simbola, želenih
barvah …
Naslednja faza je tako imenovana iluminacija (razsvetljenje, rojstvo ideje) ali inspiracija
(navdih). »Intuitivni prebliski ne pridejo takrat, ko se povsem izključimo. Pojavijo se
takrat, ko smo popolnoma v problemski situaciji. Takrat um odkrije informacije, ki
Celostna grafična podoba in spletna predstavitev kulture playness 33
manjkajo, in tako se nam podzavestno posreči odkriti nekaj novega«2
• »Učljivost simbolov lahko merimo s številom prezentacij, ki so potrebne, da lahko
osebe dokaj natančno opišejo ali narišejo simbole« (Repovš, 1995, 106).
(Srića, 1999, 61).
Izoblikuje se ideja, ki je celovita in dokončna, opredmetena in neponovljiva. Ni nujno, da
bo ustrezala naročniku oz. realni identiteti organizacije, zato se bo mogoče potrebno vrniti
v fazo inkubacije.
Ko zamisel razvijemo, testiramo, ocenimo in sprejmemo, sta na vrsti verifikacija in
implementacija (izvedba). V fazi verifikacije se ideja izpopolnjuje in vpleta manjše
popravke. Izvedbi zamisli sledi načrt njene konkretne uporabe (Srića, 1999, 63).
Proces snovanja se začne v oblikovalčevi glavi, s pomočjo pisala pa se prenese na papir, in
šele kasneje, ko je ideja že vizualizirana, na računalnik. Skice nastanejo v inkubacijski fazi.
Dobro jih je ponuditi v presojo naročniku. Oblikovalci so komunikatorji, ki morajo imeti
talent, znanje in izkušnje, da lahko v likovne strukture simbolov vkodirajo načrtovana
sporočila organizacij. Dober simbol mora bit učljiv, prepoznaven, razlikovalen, berljiv in
referenčen. Te lastnosti med seboj delujejo sinergično, na primer dobra berljivost povečuje
učljivost.
• »Prepoznavnost je lastnost simbola, ki se meri s časom, ki je potreben, da simbol
prepoznamo v množici drugih simbolov ali vidnih dražljajev« (Repovš, 1995, 106).
• Razlikovalnost pomeni, da je simbol sestavljen iz likovnih struktur, ki ga močno
razlikujejo od ostalih simbolov. Simbol z dobro razlikovalno lastnostjo ne
zamenjamo zlahka s kakšnim drugim simbolom, ker je dovolj značilen, unikaten.
• »Berljivost je ključna pozitivna lastnost tipografskih grafičnih simbolov« (Repovš,
1995, 106). Preizkuša se s časom, ki ga potrebujemo, da iz določenega simbola
natančno razberemo zlog ali besedo.
• Referenčnost je sposobnost simbola, da predstavlja stvari, dogodke, ideje.
»Referenčnost simbolov merimo po tem, koliko jih ljudje pripisujejo določenim
organizacijam, dejavnostim ali idejam« (Repovš, 1995, 106).
2 Prvotni vir: Roy Rowan, The Intuitive Manager, Wildeood House, Aldershot, 1987, 143.
Celostna grafična podoba in spletna predstavitev kulture playness 34
4.1.1 Informacija, identifikacija ali definiranje problema
V procesu informacije moramo pridobiti čim več podatkov o organizaciji. Slediti moramo
cilju, ki je: izdelati prepoznaven logotip in znak kulture playness. Najprej pa je treba
kulturo playness predstaviti.
Kaj je playness? »Playness kultura je kazalec utopične in žal zgolj navidezne realizacije
blaginje človeka. Če se je človek lahko uprl avtoritarnemu discipliniranju množic v obliki
enotnih nacionalnih telovadnih sistemov (sokoli, turnerji itd.), ki so poudarjali podrejenost
državi; če se je človek lahko uprl do skrajnosti privedene tekmovalnosti, ki je iz
posameznika svobodno vlekla zadnje atome energije; če se človek lahko upira notranjemu
glasu (ponotranjeni diktator) morale in estetskih idealov avtomatizitranih fitnes podob; in
če se človek težko upira dionizičnemu razvratu wellness in selfness dobrot; se zagotovo ne
more upreti playness kulturi. Namreč, playness kultura pooseblja in simbolizira idealno
družbeno stanje blaginje vseh. Playness kultura ugotavlja in priznava, da je razigran človek
najmanj izigran človek. Playness kultura se ne ozira po telesu, temveč cilja na človečnost
samo (na humanost) in je zato edina sposobna vključiti otroško, žensko, moško, bolno,
staro, hetero, homo itd. telo, kar prejšnjim obdobjem ni uspelo. Playness kultura odraža
visoko stopnjo blaginje, medčloveškega zaupanja in libertarne urejenosti družbenih
struktur (socialna varnost in materialna preskrbljenost), ki so razbremenjene (pa čeprav
zgolj za kratek čas) borbe za položaj. Gre za sinergijski presežek vsote značilnosti vseh
prejšnjih razvojnih faz telesne kulture (disciplina, podrejenost skupini, tekmovalnost,
egoizem, askeza, usmerjenost k rezultatu, usmerjenost k procesu, podrejenost
ponotranjenim idealom, individualizem, elitizem, hedonizem, eroticizem itd.). Igra in
igrivost se ob koncu borbe za položaj pokažeta kot edini koncept trajnosti, ki lahko ohranja
človeka v humani kondiciji. Playness kultura končno postavi človeka v središče in ne dela
ali igre kot prejšnji ideološki sistemi. Zato se v playness kulturi človek lahko resno igra ali
igrivo dela in pri tem ohranja svoje dostojanstvo kot človek, ki osmišlja svoje bivanje in pri
tem uživa, ustvarja. V playness kulturi smo priča razcvetu človeka kot človeka (in ne kot
telovadca-državljana, športnika-individuuma, narcisa, bon-vivana, perverzneža in
brezbrižneža)« (Hosta, 2009).
Za dobro celostno grafično podobo je potrebno pregledati že obstoječe celostne podobe. V
drugem raziskovalnem vprašanju smo se spraševali, kakšni so logotipi, znaki in spletna
mesta različnih splošnih športnih kultur.
Celostna grafična podoba in spletna predstavitev kulture playness 35
Kultura playness je edinstvena in nova na trgu, zato takih podob še ni. Predhodniki
playnessa pa so fitnes, welness in selfness, zato smo poiskali že obstoječe podobe le-teh, ki
so razvrščene na sliki 20.
Ugotovili smo, da obstajajo nekatere značilnosti, ki se ponavljajo. Pri znakih za fitnes
prevladujejo človeške figure in žive, močne ter predvsem tople barve. Tipografija pri fitnes
logotipih ima poudarjene linije in ostre robove.
Pri wellnessu in selfnessu so barve umirjene, hladnejše in svetlejše. Tipografija, ki se
pojavlja, ima mehke, zaokrožene linije. Ponazarja nežnost, razvajanje, umirjenost,
uživanje.
Slika 20: Obstoječe podobe fitnes, welness in selfness klubov, centrov, studiev
Celostna grafična podoba in spletna predstavitev kulture playness 36
4.1.2 Inkubacija
Naročnik je izrazil željo, naj bo logotip kulture playness igriv, živahen, vpadljiv in hkrati
vabljiv. Nastale so skice, prikazane na sliki 21. Znak in logotip smo si zamislili kot
kombinacijo človeških figur ter določene tipografije.
Slika 21: Skice na listu papirja
Izdelali smo več človeških silhuet, ki so prikazane na sliki 22. Človeška silhueta ponazarja
igrivost, gibanje, zabavo. Več figur v skupini predstavlja playness kot možnost
skupinskega športa in druženja. Različne velikosti figur se nanašajo na družino oziroma
otroško, žensko, moško, bolno, staro, hetero, homo, skratka raznovrstno telo, ki se lahko
udejstvuje v playness kulturi.
Slika 22: Človeške figure
Celostna grafična podoba in spletna predstavitev kulture playness 37
Izbrati je bilo treba tudi tipografijo, ki bo ustrezala namenu playness kulture. Odločali smo
se med pisavama Bolonewt in Arista (slika 23). Prva pisava je tanjša z ostrimi linijami,
druga pa debelejša z mehkejšimi linijami. Obe delujeta igrivo, vendar Arista s svojimi
zaobljenimi potezami doda mehkobo, kljub temu pa ohranja čistejše linije.
Slika 23: Tipografiji v ožjem izboru
4.1.3 Iluminacija ali inspiracija
Slika 24: Črno-bele in barvne kombinacije
Skice, ki so nastale v fazi inkubacije, smo prenesli na računalnik in iskali rešitve, ki so
prikazane na sliki 24. Človeška telesa na sliki 25, ki se pojavljajo kot znak kulture
playness, so predstavljena figurativno, brez detajlov na obrazu in prave silhuete. Figure
dvigajo roke v zrak v znak gibanja, zdravja, dobrega počutja, vitalnosti, razigranosti …
Celostna grafična podoba in spletna predstavitev kulture playness 38
Različne velikosti figur se nanašajo na družino oziroma otroško, žensko, moško, bolno,
staro, hetero, homo, skratka različna telesa, ki se lahko udejstvujejo v playness kulturi.
Slika 25: Znak in logotip kulture playness za različna področja
Izbor barv je temeljil na različnih barvnih odtenkih s prevlado toplih. Figure so različnih
barv, saj je tudi kultura playness namenjena široki paleti ljudi in zajema vrsto različnih
aktivnosti. Tako nas rumena navdaja z akcijo, radostjo in igrivostjo, ki je pri kulturi
playness poglavitna, zelena je barva življenja, združevanja in vitalnosti, modra pa
simbolizira zadovoljstvo. Rdeča barva tipografije simbolizira veselje in energičnost. Da
vse skupaj ne bi prešlo v agresivnost in vročekrvnost, je pridana zelena barva napisa
culture, center ali guru, ki osveži in ohladi celoto.
Odločili smo se za tipografijo Arista, saj je igriva in razgibana. Robovi črk so zaobljeni,
kar deluje mehko in povezano, v kontrast temu pa je tipografija odebeljena, kar prida
Celostna grafična podoba in spletna predstavitev kulture playness 39
odločnost in trdnost. V črki P je negativen prostor v obliki kroga, kar lahko razumemo kot
povezanost ljudi v playness kulturi ali skupen prostor, celoto, ki nudi igrivost. Ker gre pri
kulturi playness tudi za vzpostavitev centrov, je v logotipu označeno, ali gre za playness
kulturo na splošno ali za playness center ali za playness guru – izobraževalno središče.
4.1.4 Verifikacija in implementacija
»Dobra zamisel se potrjuje z uporabo« (Srića, 1999, 62). Primeri uporabe znaka in logotipa
kulture playness so predstavljeni v prilogi.
Skozi predhodna poglavja smo odgovorili na prvo in deloma na drugo raziskovalno
vprašanje:
• Kako izdelati učinkovito in prepoznavno celostno grafično podobo?
• Kakšni so logotipi, znaki in spletna mesta različnih splošnih športnih kultur?
Najprej smo pregledali obstoječo literaturo. Spoznali smo, zakaj sta pomembna identiteta
in imidž podjetja. Pregledali smo likovno teorijo, saj nam je to znanje dalo temelje, ki so
potrebni za zasnovo celostne grafične podobe. Na prvi stopnji kreativnega snovanja je
treba pridobiti čim več informacij, ki nam bodo v pomoč pri oblikovanju. Med drugim je to
tudi pregled obstoječega stanja logotipov in znakov različnih športnih kultur, ki smo jih
izbrali in analizirali. Po naslednjih stopnjah kreativnega snovanja smo nato izdelali znak in
logotip kulture playness.
Celostna grafična podoba in spletna predstavitev kulture playness 40
5 SPLETNO OBLIKOVANJE
Spletne strani so pomemben del podobe podjetja. Vse več informacij poiščemo na
internetu, torej si prav tam tudi ustvarimo prvi vtis o podjetju, organizaciji, znamki …, kar
je ključnega pomena. Pri oblikovanju moramo biti pozorni na vsebino, funkcionalnost in
strukturo. Funkcionalnost spletne strani prevlada nad obliko, saj na spletu iščemo točno
določene informacije, do katerih želimo priti hitro in na enostaven način.
World Wide Web
Spletne strani oziroma World Wide Web so razvili okrog leta 1980 v Švici. »Spletne strani
so datoteke, ki jih lahko na zaslonu vidimo kot manjše programe. Datoteke so shranjene na
računalnikih, ki so stalno priključeni v omrežje Internet« (Mrhar, 2002, 9). Glavna
značilnost spletnih strani je povezanost.
HTML
Hyper Text Markup Language je označevalni jezik za izdelavo spletnih strani. Predstavlja
osnovo spletnega dokumenta. S pomočjo HTML lahko ustvarimo strukturo in semantično
ureditev dokumenta. Pišemo ga lahko v vsakem urejevalniku besedil in je dokaj preprost,
zato ga lahko kombiniramo tudi z drugimi programskimi jeziki.
CSS
Kratica CSS pomeni v angleščini Cascading Style Sheets oziroma slovensko kaskadne
slogovne ploskve. Z njimi določamo slogovne značilnosti spletnih strani, kot so odmik
besedila od roba, pisave, ploskve, črte, ozadja, seznami, slike … CSS je glavni element v
izdelavi spletnih strani, odkar vključuje skupek navodil, ki brskalniku povedo, kako
predstaviti stran. Lahko se nahaja v HTML-kodi ali posebej, kot pripet dokument. CSS je
jezik s svojo sintakso in konceptualno strukturo. Dovoljuje prilagodljivost in hitrost, ki je
ni treba vmešavati v osnovno drevo dokumenta. CSS se lahko nanaša na več določenih
oznak (tags), ki jih določimo v HTML-kodi. S CSS-stili nam ni treba spreminjati vsakega
Celostna grafična podoba in spletna predstavitev kulture playness 41
elementa posebej, ampak z enim ukazom, na primer, določimo, kakšno podobo bodo imeli
vsi glavni naslovi na spletni strani. Urejena CSS-koda ima še eno poglavitno prednost, tj.,
da jo spletni iskalniki ali pajki lažje zaznajo, kar je poglavitnega pomena pri optimizaciji
spletnih strani.
Ključni koncepti kaskadnih stilov:
• CSS-stili elegantno razgradijo stran in omogočajo lažje preoblikovanje in
posodabljanje strani;
• omogočajo izbiro določenega stila in odstranitev vseh elementov, ki niso nujno
potrebni za predstavitev strani;
• omogočajo predstavitev iste strani z različnimi stili za različne medije (ekran,
mobilne naprave, tisk), brez da bi posegali v vsebino strani.
Spletna stran www.csszengarden.com prikazuje zmožnosti in fleksibilnost kaskadnih
stilov. Na strani lahko izbiramo med več CSS-stili, medtem ko vsebina ostaja vedno ista.
5.1 Značilnosti spleta
Oblikovanje za splet je postalo hitro razvijajoče se področje. Oblikovalec mora spoštovati
in reinterpretirati osnove oblikovanja in načela, da izpolnjujejo vse razvijajoče se
zmožnosti tehnologije. Poleg vključevanja na področja, kot so oblikovanje vizualnih
informacij, estetika in kompozicija, mora spletni oblikovalec dokazati tudi razumevanje
sodobnih tehnoloških obravnav, kot so kodiranje, interakcija z uporabnikom in spletni
trendi.
Najbolj neposredna pot za ustvarjanje spletne strani, ki je tako uporabna kot tudi dobro
zasnovana, je razumevanje omejitev in svoboščin, ki izhajajo iz tehnologije, in prepletanje
le-tega s pričakovanji strank in občinstva. Uporabnikova resolucija ekrana, razlike med
brskalniki, osebne nastavitve uporabnika in starost uporabnikovega računalnika igrajo
veliko vlogo pri odločanju, kako pripraviti vsebino za določen projekt.
S časom, porabljenim za oblikovanje, in ključnimi vidiki, kot so kompozicija, barva in
sporočilo, ki prihaja v ospredje pri spletnem oblikovanju, prezentacija postane
interpretacija napisane kode. Programiranje kode je tok navodil, ki podrobno opišejo, kako
Celostna grafična podoba in spletna predstavitev kulture playness 42
bodo brskalniki sestavili vsebino in posnetke v vizualno prezentacijo, ki jo mi kot končni
uporabniki vidimo. Spletni razvijalci in programerji so razširili "internetni jezik" za
ustvarjanje širokih možnosti, vključno z inovacijami, kot so flash animacije, dinamične
interakcije, komunikacije v realnem času in obdelava podatkov na strani.
Oblikovalci pripravijo stran v poljubnem oblikovalskem programu in jo potem prenesejo v
kodo. Najpomembneje je, da se zavedamo, da je spletna stran le sredstvo za posredovanje
sporočil občinstvu.
Včasih so bile spletne strani narejene s pomočjo kompleksnih omrežij tabel, z malo
slikami, ki so sestavljale celoto. Leta 2001 je World Wide Web Consortium nadgradil
HTML v XHTML in sprejel CSS, ki dovoljuje uporabniku ločitev oblike od vsebine. Z
mislijo na spletno prihodnost ali njeno razširjenost, je glavni razlog za ločitev oblike od
vsebine ta, da izolacija pomaga pri zagotavljanju varnosti prihodnjim brskalnikom z
zmanjšanjem kompleksnosti strukture strani, ki tudi vodi k lažjemu osveževanju vsebine
ob ohranitvi oblike.
Poznamo dve vrsti spletnih strani: statične in dinamične. Statična spletna stran je spletna
stran s fiksno vsebino, ki je zapisana neposredno v datoteko spletne strani. Spletno stran
lahko tako ureja le programer oziroma tisti, ki je vajen jezika, iz katerega je spletna stran
sestavljena, in ima pravice za dostop do datotek. Za pripravo statične spletne strani zadošča
samo osnovno znanje označevalnega jezika HTML.
Dinamična spletna stran je spletna stran z lahko spreminjajočo se vsebino, ki je zapisana
ločeno od spletne strani v podatkovni bazi. Spletno stran lahko preko ustreznega vmesnika
ureja vsak informacijsko pismen uporabnik. Za pripravo dinamične spletne strani je poleg
znanja označevalnega jezika HTML potrebno še znanje enega od zahtevnejših spletnih
programskih jezikov ter znanje enega od podatkovnih jezikov SQL (Statična spletna stran,
2010).
5.1.1 Tipografija na internetu
Internet ohranja hitro nalaganje strani celo na najpočasnejši računalnikih, saj pisave, ki jih
strani uporabljajo, niso vključene v vsako spletno stran. Uporabljene pisave so vzete iz
nabora datotek, ki so naložene na vsak računalnik. Tako je postalo vsakdanje, da se za
spletno vsebino uporabljajo pisave, ki so največkrat na voljo. Ta omejitev je prisotna že od
Celostna grafična podoba in spletna predstavitev kulture playness 43
začetkov interneta in je navdušila številne oblikovalce za uporabo omejenega števila pisav
za dosego uspešnih in osupljivih strani. Najpogostejše pisave so:
• Arial;
• Courier;
• Georgia;
• Times New Roman;
• Verdana;
• Trebuchet MS;
• Comic Sans;
• Lucida;
• Impact; • Tahoma (Dabner, 2010, 153).
5.1.2 Barve na internetu
Monitorji prikazujejo širok spekter barvnih vrednosti. Končni izdelek variira od nastavitev
posameznega monitorja. Barva na internetu je zapisana v šestnajstiškem sistemu.
Sestavljena je iz znaka # in šestih številk od 0 do 9 ali črk od a do f (slika 26). Koda se
nanaša na primarne barve: rdečo, zeleno in modro (RGB), od katerih vsako barvo
predstavljata dva znaka v kodi. Tako #000000 pomeni črno barvo, #ffffff belo, #ff0000
rdečo, #00ff00 zeleno in #0000ff modro barvo. Za spletne strani lahko uporabljamo 216
"web-safe3
3 Pred nekaj leti so računalniki lahko prikazovali samo 256 barv. Poleg razvijalcev programske opreme so
kontrolo nad barvnimi paletami dobili še spletni oblikovalci. Pojavila se je potreba po prikazovanju več kot
samo 256 barv, saj so bile nekatere barve na spletu le približki pravih. »Da bi se tem težavam ognili, je
Netskape določil posebno paleto 216 rezerviranih barv, ki bi jih moral biti brskalnik vedno sposoben
prikazati. To paleto so poimenovali "web safe colors", oziroma barve, varne za splet. Te barve naj bi se tako
v brskalniku prikazale vedno enako, ostale barve pa bi dobili z razprševanjem« (barvno upravljanje na spletu,
2011).
" barv (Dabner, 2010, 153).
Celostna grafična podoba in spletna predstavitev kulture playness 44
Slika 26: Izbiranje barv pri oblikovanju spletne vsebine
5.1.3 Grafični uporabniški vmesnik
Oblikovanje za splet ni isto kot oblikovanje za tisk. Spletne strani morajo ustrezati in
pravilno delovati na več napravah in brskalnikih. Omogočena mora biti enostavna
navigacija, da takoj najdemo informacije, ki jih iščemo. Tukaj pride v poštev oblikovanje
vmesnika, ki lahko naredi velike razlike.
Standardna funkcija večine strani je meni, ki se običajno nahaja na vrhu strani vodoravno
ali v stolpcu ob strani. Biti mora viden in v pomoč uporabnikom pri navigaciji na strani.
Navigacijski meni mora biti vedno na istem mestu in imeti konstantno obliko, medtem ko
brskamo po strani. Pomembno je, da ustvarimo stran, ki je uporabna in ima potrebne
funkcije na očitnem mestu, da jih lahko najdemo, ter ostalo vsebino na voljo. Ponavljajoče
se vsebine, blogi in strani, namenjene zabavi, uspevajo obdržati obiskovalce s
posodabljanjem vsebine in enostavnostjo uporabe.
Pozorni moramo biti na sodobne dogovore, kot so stolpne postavitve in stili okvirjev. To
ohranja stran posodobljeno, ponuja največjo funkcionalnost in tudi varuje pred
prekrivanjem z že dogovorjenimi stili. Ena izmed njih je na primer podčrtanost povezav.
Ko načrtujemo novo stran, se je najbolje nagibati k preprosti interaktivnosti, saj nočemo
preobremeniti uporabnikovega brskalnika s prepočasnim nalaganjem strani.
Pri oblikovanju spletnih strani moramo biti organizirani. Najprej si moramo skicirati stran
kot zemljevid, kjer določimo zgradbo strani. Če razumemo, kako se bo uporabnik gibal po
spletni strani, lahko predvidevamo in vplivamo na to, kako bi uporabnik želel biti voden po
vsebini. Enostavna navigacija je ključnega pomena.
Chris Jones pravi, da je ključnega pomena razumeti končnega uporabnika in vsebino
spletne strani. Ne smemo oblikovati zase, ampak za občinstvo in vsebino. Ključ uspešne
Celostna grafična podoba in spletna predstavitev kulture playness 45
spletne strani je razumevanje uporabnika in vsebine spletne strani. Prepogosto so spletne
strani odraz kreatorjevega tehničnega in oblikovnega znanja, namesto s poudarkom na
uporabnosti spletne strani in enostavnega dostopa do informacij. Jones pravi, da ni nič
narobe, če kršimo te meje, vendar ne smemo pozabiti upoštevati končnega uporabnika:
oblikovati za občinstvo, oblikovati za vsebino in ne oblikovati samo zase (Chris Jones,
Graphic design school, 2010, 155).
Prostor
»Na spletnih straneh bomo prostorski učinek najpogosteje pričarali s senčenjem oz.
svetlobo, ki pada na predmete« (Hribar, 2001, 11).
5.2 Prosta in odprtokodna programska oprema
Prosta programska oprema uporabniku dovoljuje uporabo, razmnoževanje, razširjanje,
razumevanje, spreminjanje in izboljševanje programov.
Odprtokodna programska oprema uporabniku omogoča dostop do izvorne kode, ki jo lahko
skladno s svojimi potrebami spreminja in dopolnjuje.
Razvoj programov z odprto kodo spremlja veliko razvijalcev, ki so med seboj preko
medmrežja povezani v skupnost Open Source Community, ki ima urejeno notranjo
organizacijo in disciplino. Takšen razvoj odprtokodnih programov zagotavlja manjši obseg
programskih napak, programi pa so tako kvalitetnejši. Odprta koda je povzročila
spremembo pravil na trgih informacijske tehnologije, ker prinaša drugačen razvojni model
in odnos do uporabnikov.
Programska oprema, razvita z odprto kodo, je brezplačna, kot je na primer operacijski
sistem Linux, spletni strežnik Apache, zbirka podatkov MySQL, pisarniški paket
OpenOffice in drugi.
Pogosto je razvita v okviru nekomercialnih in prostovoljnih pobud in jo je mogoče povsem
legalno uporabljati brez plačila licenčnine ali druge oblike denarnega nadomestila
avtorjem. To ne pomeni, da za uporabo tovrstne programske opreme ne veljajo licenčna
pravila. Pogoji uporabe in distribucije posameznih delov odprte programske kode ali
programskih produktov kot celote so določeni v okviru ene od licenčnih pogodb, ki jih
določa združenje OSI (Open Source Initiative) oziroma v okviru pravic in načel, ki jih
Celostna grafična podoba in spletna predstavitev kulture playness 46
uveljavlja združenje FSF (Free Software Foundation) (Pojem proste in odprtokodne
programske opreme, 2010).
5.3 Sistem za upravljanje spletne vsebine
Učinkovita uporaba interneta postaja vse bolj pomembna pri komunikaciji
in promociji tako v poslovnem kot zasebnem delovanju. Znanje o generiranju spletnih
vsebin predstavlja pomemben vidik kreativnosti in informacijske pismenosti. Kot pravi J.
Nielsen, vodilni strokovnjak na področju načrtovanja in uporabnosti spletnih vsebin, bodo
šole kmalu pričele učiti otroke pripravljati spletno vsebino, saj bo to postala ključna
spretnost pri iskanju službe. Orodja za upravljanje z vsebinami so pri tem nepogrešljiva,
saj omogočajo udejanjanje intelektualnih konceptov (Sisplet.org, 2010).
5.3.1 CMS
Sistem za upravljanje vsebine (CMS - Content Management System) omogoča generiranje,
urejanje in vzdrževanje vsebine spletnih strani brez znanja programiranja v HTML.
Sistem CMS je programska rešitev, ki omogoča nadzor celotnega življenjskega cikla
vsebine. Tak cikel obsega ustvarjanje, upravljanje, urejanje, objavo, preiskovanje in
pravočasno odstranjevanje ter arhiviranje. Ključni element, ki ločuje sistem CMS od
običajnega orodja za pripravo in objavo spletne strani, je urejena shramba vsebine, ki nam
omogoča na primer vnaprej določen delovni tok dokumentov, nadzor različic, zaščito
izbranih vsebin, učinkovito preiskovanje ali pa časovno odvisno objavo (Mesojedec,
2010).
Ločujemo dva nivoja CMS. V najširšem smislu se CMS lahko nanaša na individualne
CMS, to je na vsa spletna mesta v posameznih podjetjih, organizacijah ali pri drugih
subjektih, kjer so ažuriranje spletnih vsebin poenostavili z vmesnikom in se s tem izognili
neposrednemu HTML-programiranju in vsakokratnem nalaganju novih ali spremenjenih
spletnih strani.
Po drugi strani pa se izraz CMS pogosteje nanaša zgolj na splošna orodja CMS – lahko bi
rekli tudi na meta CMS, s katerim je mogoče izdelati individualne CMS za posamezne
Celostna grafična podoba in spletna predstavitev kulture playness 47
uporabnike. Meta CMS so torej namenjeni izdelavi strukture in oblike spletnega mesta. Pri
meta CMS torej v osnovi ločimo dve funkcionalnosti:
• generiranje strukture, kjer spletnemu mestu strukturiramo oziroma implementiramo
določeno arhitekturo, povezavo in funkcionalnost;
• določenemu spletnemu mestu oziroma njegovi strukturi prilagajamo poljubno
obliko, generiranje oblike pa je razmeroma neodvisna funkcionalnost.
Če so individualni CMS sistemi namenjeni urednikom, novinarjem ipd. in torej ne
zahtevajo nobenega tehničnega znanja, ki bi presegalo nivo veščin, potrebnih za
obvladovanje urejevalnikov (npr. Word), pa pri meta CMS potrebujemo določena tehnična
znanja. Slednje posebej velja za generiranje oblike, medtem ko se generiranje strukture vse
bolj poenostavlja.
V primeru meta CMS – torej orodij, s katerimi generiramo individualne CMS – gre lahko
za različne nivoje aplikacij:
• enostavne aplikacije za generiranje in vzdrževanje osebnih sporočil (BLOG);
• sisteme za povezovanje spletnih strani (WIKI);
• klasična odprtokodna ali komercialna CMS-orodja;
• sisteme za publiciranje spletnih vsebin (WPS);
• interna CMS-orodja specializiranih podjetij za izdelavo spletnih mest;
• za portale novic (NEWSPORTALS);
• za najbolj kompleksne sisteme za upravljanje z vsebinami velikih organizacij
(ECM – Enterprise Content Management).
V določenem smislu lahko k meta CMS prištevamo tudi običajna orodja za oblikovanje
spletnih strani, ki postajajo vse bolj zmogljiva in prevzemajo tudi vse več funkcij meta
CMS. Dodati pa velja, da so kljub vsemu navedena orodja v osnovi še vedno namenjena
profesionalnim uporabnikom s tehničnim znanjem.
Pri izbiri in uporabi odprtokodnih orodij CMS se lahko srečamo z naslednjimi težavami:
• morda ni povsem jasno kako je z dovoljenjem za uporabo;
• razvoj sistema se lahko preneha ali zaide v slepo ulico;
• nihče ne zagotavlja delovanja sistema;
Celostna grafična podoba in spletna predstavitev kulture playness 48
• nepraktična uporaba, ki zahteva veliko lastnega dela (Sisplet.org, 2010).
CMS je zbirka procedur, ki so lahko ročno ali računalniško podprte in omogočajo:
• preprostejše ustvarjanje kakovostne vsebine, ki je skladna z vnaprej določeno
podobo;
• možnost upravljanja na daljavo;
• boljše sodelovanje med različnimi ustvarjalci;
• lažji nadzor nad časovno-kritičnimi elementi za objavo in učinkovitejšo zamenjavo
zastarelih vsebin;
• visoko prilagodljivost in preprosto dodajanje novih zmožnosti;
• večjo varnost;
• lažje stopnjevanje obsega;
• nižje stroške vzdrževanja.
Seveda so naštete zmožnosti in prednosti predvsem ideali, ki se jim želijo različni sistemi
CMS bolj ali manj uspešno približati. Nedvomno pa so danes ti sistemi že dosegli stopnjo,
ko njihove prednosti niso več vprašljive.
Podjetja in posamezniki želijo redno ažurirane strani, zato je CMS vedno bolj priljubljen.
Osveževanje spletne strani s sistemom CMS je zelo preprosto, enostavno se lahko dodaja
nove vsebine, osvežuje stare, nalaga slike in druge večpredstavnostne vsebine, vključuje
dodatke in nadgradnje.
Med CMS-sisteme se uvršča tudi Wiki sisteme (znana Wikipedija) in bloge (Wordpress).
Najbolj razširjen CMS je odprtokodna Joomla!, razširjena pa sta tudi Drupal in Plone.
5.3.2 CMS Joomla!
Iz številne ponudbe sistemov CMS je v začetku leta 2005 izstopilo ime Mambo. Mambo je
izdelek avstralskega podjetja Miro, ki sistem CMS ponuja v dveh oblikah: kot plačljiv tržni
izdelek z ustrezno podporo, in kot odprtokodno podlago (MOS, Mambo Open Source), ki
jo prilagajamo in vzdržujemo sami, koda pa nam je na voljo pod dovoljenjem GPL. Iz
Mamba 4.5.2 je avgusta 2005 nastala Joomla! 1.0. Ime Joomla! je fonetični zapis besede iz
Celostna grafična podoba in spletna predstavitev kulture playness 49
svahilija, ki pomeni "vsi skupaj" ali "kot celota". Leta 2007 je bila na voljo Joomla! 1.5,
danes pa je na voljo že verzija 1.6 (What is Joomla?, 2010).
Joomla! je sistem za upravljanje vsebin (CMS), ki omogoča izgradnjo spletnih strani in
močnih spletnih aplikacij. Enostavna je za uporabo, omogoča razširitve in je odprtokodna,
torej dostopna vsem (What is Joomla?, 2010).
Z Joomla! lahko naredimo strani za:
• korporativna spletna mesta ali portale;
• spletne trgovine;
• spletne strani manjših podjetij;
• spletne strani dobrodelnih ali neprofitnih organizacij;
• spletne strani društev in klubov;
• šolske ali izobraževalne spletne strani;
• poslovne intranete ali ekstranete;
• osebne spletne strani;
• spletne skupnosti uporabnikov;
• spletne revije ali časopise.
Joomla! lahko namestimo na poljubno podlago, ki podpira strežnik Apache, zbirko
MySQL in seveda tolmač za PHP. Če je omenjena podlaga pripravljena, je namestitev
Joomla! zelo enostavna. Sistem je zelo priljubljen tudi zato, ker ga lahko takoj po
namestitvi uporabljamo brez težav in posebnih znanj. Dodajanje vsebine je preprosto, prav
tako uporaba nekoliko "naprednejših" funkcij, kot so organizacija menijev, urejanje
uporabnikov in zaščita vsebine. Vse se, kot je pri sodobnih sistemih CMS v navadi, opravi
prek spletnega vmesnika. V zaščitenem, administrativnem delu imamo celotno
funkcionalnost sistema na voljo prek "nadzorne plošče", ki je z velikimi, preglednimi
ikonami precej podobna svojim sorodnikom iz sodobnih operacijskih sistemov.
Seveda pa prava moč sistema leži v njegovi modularnosti in razširljivosti. Tu se pokaže
resnična moč sistema in široka skupnost razvijalcev, ki stoji za njim. Sistem v Joomla! je
zgrajen iz ene ali več vsebinskih predlog (templates), ki določajo videz in obnašanje
spletišča. Že tu je izbira izjemna. Na spletu so na voljo številne brezplačne in plačljive
Celostna grafična podoba in spletna predstavitev kulture playness 50
predloge, vsak dan pa je več ponudnikov, ki izdelujejo prilagojene predloge. Predlogo
lahko z znanjem HTML, CSS in PHP izdelamo tudi sami.
Zmogljivosti Joomla! določajo številni moduli (modules), ki upravljajo različne vrste
vsebine. Že v osnovni namestitvi dobimo vse potrebno za srednje zmogljivo spletišče (npr.
urejevalnik novic, najrazličnejše izbirne menije, možnost iskanja, kanale RSS, spletne
ankete, oglase, celo analizo obiska spletišča ...). Omogočena je možnost dopolnjevanja in
celo zamenjava posameznih modulov. Tudi module v celoti vzdržujemo (nameščamo,
nadgrajujemo, odstranjujemo) kar prek spletnega vmesnika.
Kot smo omenili, za veliko večino temeljnih potreb poskrbi že osnovna namestitev
Joomla!, za druge pa so na spletu na voljo dodatki, s katerimi pokrijemo želene
funkcionalnosti.
Joomla! je z modularno zasnovo, ki jo ponuja, priložnost za razvijalce večjih spletišč in
intranetov, ki lahko močno osnovo nadgradijo z lastnimi razširitvami v obliki modulov in
tako hitro razvijejo svojo rešitev.
Gre torej za zmogljiv sistem za uporabljanje vsebin, ki ga je preprosto uporabljati. Ima tudi
široko skupnost uporabnikov in razvijalcev, kar pomeni tudi ustrezno podporo.
5.4 Zasnova spletne strani kulture playness
5.4.1 Načrtovanje
Načrtovanje spletne strani je prvi korak k celostni zasnovi spletnega mesta. Ko načrtujemo
spletno stran, moramo določiti organiziranost in funkcionalnost spletne strani. Pregledati
moramo že obstoječe strani konkurence. Ker je kultura playness nova, konkurence še ni,
oziroma so konkurenca predhodna obdobja fitnesa, wellnessa in selfnessa. Ogledali smo si
splošne strani fitnesa (slika 27) in welnessa (slika 28) na spletu.
Celostna grafična podoba in spletna predstavitev kulture playness 51
Slika 27: Spletna stran fitness.org (Fitness.com, 2010)
Celostna grafična podoba in spletna predstavitev kulture playness 52
Slika 28: Spletna stran wellness.com (Wellness.com, 2010)
Celostna grafična podoba in spletna predstavitev kulture playness 53
Zanimala nas je predvsem postavitev elementov na strani. Na obeh straneh se logotip
nahaja levo zgoraj in ker beremo od leve proti desni, je to mesto tudi najprej opaženo. Na
strani fitness.com je pogled usmerjen k ponudbi včlanitve v fitness združenje, medtem ko
to na strani wellness.com ni posebej poudarjeno, je pa prav tako omogočeno.
Na strani fitness.com je glavni meni postavljen pregledno - na sredini strani in v obliki treh
stolpcev, kjer je zajeta najpomembnejša vsebina in nas s klikom vodi do želene kategorije,
kjer lahko vidimo tudi razširjen meni do drugih vsebina. Wellness.com ima horizontalni
glavni meni. Jedra strani na uvodni strani fitness.com ni, z izbiro kategorije pa si lahko
ogledamo tudi ostalo vsebino.
Pri oblikovanju in postavitvi spletne strani moramo upoštevati želje naročnika. Želje
naročnik so bile:
• spletna stran v angleškem jeziku,
• barvita stran v barvah logotipa in znaka,
• preglednost,
• enostavnost,
• hiter dostop do treh stebrov playnessa (playness culture, playness center, playness
guru).
5.4.2 Struktura
Naslednji korak pri zasnovi spletnega mesta je določitev strukture in razpored vsebine.
Stran smo si po zgradbi zamislili podobno kot fitness.com (slika 29). Na vseh straneh bo
vidna glava strani, kjer bo logotip in možnost iskanja. Pod glavo se bo nahajal splošni
menu z novicami, predstavitvijo, seminarji itd. Na prvi strani bo uporabnik lahko izbiral
med tremi kategorijami, playness culture, playness guru in playness center. Povezava
Playness culture bo vsebovala pomembne informacije o sami playness kulturi. Playness
guru bo izobraževalno središče, kjer bodo na voljo učne ure playnessa in seznam možnih
vadb. Tukaj bo možna tudi prijava uporabnikov. Playness center bo podal informacije
uporabnikom o playness centrih in izvajalcem playnessa podajal informacije o vpisu na
seznam centrov. Noga strani bo prav tako vidna v vseh pogledih.
Celostna grafična podoba in spletna predstavitev kulture playness 55
5.4.3 Navigacija
Navigacija je pomemben del spletnega mesta. Uporabniki s pomočjo navigacije raziskujejo
vsebino strani, zato mora biti pregledna, konsistentna in razumljiva. Uporabnik mora v
vsakem trenutku vedeti, na kateri strani in kje znotraj strukture spletne strani se nahaja. V
ta namen bo na spletni strani pod splošnim menijem na voljo navigacijska vrstica (slika
30), ki bo uporabniku vedno kazala pot do mesta, kjer se nahaja.
Slika 30: Navigacijska vrstica
5.4.4 Barva
Poglavitna barva spletnega mesta playness kulture bo rdeča, ki je zelo aktivna barva s
toplim značajem. Pojavljale se bodo tudi barve, izvzete iz znaka in logotipa.
5.4.5 Tipografija
Tipografija (slika 31) bo na celotni strani konsistentna. Uporabili bomo pisavo Georgia v
barvi #666 in velikosti 12px.
Slika 31: Tipografija na spletni strani
Celostna grafična podoba in spletna predstavitev kulture playness 56
6 IZDELAVA PREDLOGE ZA CMS JOOMLA!
Pogledali si bomo, kako izdelati spletno mesto s programom CMS Joomla! in s tem
odgovorili na tretje raziskovalno vprašanje (RV3).
Joomla! predloga je vrsta datotek v Joomla! CMS-sistemu, ki nadzorujejo predstavitev
vsebine. Predloga ni spletna stran, prav tako ni mišljena kot celotna podoba spletne strani.
Predloga je osnovni model za ogled spletne strani. Za učinek popolne spletne strani je
pomembna tudi vsebina, ki je shranjena v podatkovni bazi Joomla!. Spletna stran, ki je
vidna kot končni produkt, ni statična, ampak dinamična, kar pomeni, da je dinamično
ustvarjena iz vsebine, shranjene v bazi podatkov. Stran je ustvarjena skozi različne PHP
ukaze, ki so zapisani v predlogi. Ker dinamične strani ne moremo videti v WYSIWYG-
urejevalniku4
slika 32
(na primer Dreamweaver), si pomagamo z lokalnim strežnikom, ki ga
namestimo na računalnik. Izbrali smo program OKO-XAMPP – sistem za hitro
vzpostavitev spletišča na OS Windows. Gre za odprtokodni sistem, ki je na voljo na spletni
strani Centra odprte kode Slovenije (www.coks.si/index.php5/OKO-XAMPP). Sistem je
sestavljen iz projekta XAMPP, ki vsebuje sistem hitrega spletišča s podporo Apache,
MySQL, PHP, Perl, ki ima že dodan sistem za upravljanje vsebin – Joomla!. Sistem nam
omogoča hitro izdelavo in objavo dinamičnih spletnih strani. Joomla! nam z namestitvijo
ponuja nabor privzetih predlog ( ). Na spletu lahko najdemo številne brezplačne in
plačljive predloge, mi pa smo se odločili, da bomo izdelali novo predlogo, prilagojeno
potrebam predstavitve kulture playness.
Ko namestimo sistem Joomla!, v internetni brskalnik vpišemo localhost in ime mape, kjer
se nahaja CMS Joomla!. V našem primeru je to http://localhost/playness/.
4 WYSIWYG je angleška kratica za What You See Is What You Get (slovensko: Kar vidiš, boš tudi dobil).
Kratica opisuje programe, pri katerih uporabniški vmesnik omogoča, da uporabnik med delom vidi, kakšen
bo končni dokument. Večina programov omogoča vsaj predogled končnega izdelka. Kadar gre za spletne
strani, pa je končni izdelek odvisen tudi ob brskalnika, v katerem jo prikazujemo (wikipedia.org -
WYSIWYG, 2010).
Celostna grafična podoba in spletna predstavitev kulture playness 57
Slika 32: Privzete Joomla! predloge: beez, ja_purity, rhuk_milkyway
Mapa playness torej označuje ime naše predloge, znotraj nje pa se nahaja več datotek.
Ustvarimo mapo, ki jo poimenujemo css in v katero bomo shranili datoteko s kaskadnimi
stili. Naslednja mapa se imenuje images, kjer bodo shranjene slikovne datoteke, ki so
potrebne za obliko spletne strani. Potrebujemo še:
• php-datoteko, ki smo jo poimenovali index, kjer bo določena struktura spletne
strani;
• xml-datoteko, poimenovali smo jo templateDetails, kjer bodo zbrani podatki o
predlogi, uporabljene datoteke in definirane Joomla! pozicije;
• prazno html-datoteko, prav tako z imenom index, s katero preprečimo neposreden
dostop do strani Apache index;
• datoteko template_thumbnail.png, ki je sličica celotne spletne strani;
• favicon.ico, ki se pojavi pred spletnim naslovom v našem brskalniku.
Seveda so imena map in datotek (razen index, ki je standardno ime) lahko poljubna, vendar
logično poimenovanje pripomore k razumevanju strukture predloge.
6.1.1 Index.php
Preden pričnemo izdelovati predlogo, moramo vedeti, kako bo oblikovana, s čimer smo se
ukvarjali v prejšnjih poglavjih. Zgradba strani je definirana v datoteki index.php s pomočjo
div-enot oziroma oddelkov (skupin elementov), ki jih lahko oblikujemo s kaskadnimi stili.
Po obliki spletne strani smo izdelali shemo, na kateri so označene pozicije in poimenovanje
div-enot, kot prikazuje slika 33. Za samo strukturiranje div-enot v datoteki index.php sta
pomembna njihova zaporedje in hierarhija (slika 34). V datoteki template.css elementom
določimo obliko, pozicijo, barve … Kasneje bomo v datoteki templateDetails določili tudi
pozicije, kamor bomo v Joomla! administraciji vstavljali vsebino.
Celostna grafična podoba in spletna predstavitev kulture playness 58
Slika 33: Shema spletne strani po obliki
Celostna grafična podoba in spletna predstavitev kulture playness 59
Slika 34: Div struktura spletne strani
6.1.2 Zemljevid strani
Struktura strani po vsebini:
Zgornji meni:
• Home;
• News;
• Introduction;
• Links;
• Seminars;
• Network;
• Contact.
Playness meni:
• Playness culture;
• Playness guru:
- Education center;
- Games and exercises;
- Emotionality;
- Mindfulness;
Celostna grafična podoba in spletna predstavitev kulture playness 60
- Spirituality;
- Playness Forum;
• Playness center:
- Fitness center;
- Wellness center;
- Sport club;
- School or kindergarten;
- Outdoor solutions.
6.1.3 Template.css
Kaskadni stili imajo dva glavna dela: selektor in eno ali več lastnosti. Selektor je običajno
HTML-element, ki mu želimo dodati stil oziroma lastnost. Lastnost pa je sestavljena iz
imena lastnosti (»property«) in vrednosti. CSS.lastnost se vedno konča s podpičjem (;),
skupina lastnosti pa je obkrožena z zavitimi oklepaji. Primer je prikazan na sliki 35
(W3Schools Online Web Tutorials, 2010).
Slika 35: Sestava kaskadnega stila
Celostna grafična podoba in spletna predstavitev kulture playness 61
V datoteki index.php smo div-om dodali id oziroma razredno (class) oznako. Id se
uporablja za določitev sloga za en oziroma edinstven dokument. Id uporablja atribut
elementa HTML in se v kaskadnih stilih označi z znakom #.
Razredni izbirnik se uporablja za določitev sloga skupini elementov. To nam omogoča
določitev stila za katerikoli html-dokument z istim razredom. Razred uporablja atribut
elementa HTML in se v kaskadnih stilih označi s piko (.). Lahko tudi določimo, kateri
specifičen HTML-element bo uporabljal določen razred.
Kaskadne stile lahko pripnemo k dokumentu na tri načine:
• kot zunanji stil, ki ga pripnemo v dokument;
• kot notranji stil, ki ga določimo v glavi HTML-dokumenta;
• inline, neposredno k HTML-elementu.
Pri Joomla! predlogi bomo uporabili zunanji stil, ki ga v dokument php vstavimo z
ukazom:
<link rel="stylesheet" href="templates/playness/css/template.css" type="text/css" />.
6.1.4 TemplateDetails.xml
TemplateDetails (slika 36) vsebuje podrobnosti predloge, ki jih Joomla! potrebuje in
uporabi pri nameščanju predloge, ko je zapakirana v format zip. Datoteka xml vsebuje
informacije o imenu predloge, datumu izdelave, avtorju, avtorskih pravicah, verziji in opis
predloge. Datoteka vsebuje tudi seznam vseh datotek (<filename>), ki so uporabljene za
predlogo in Joomla! pozicije (<position>).
Joomla! pozicije so ograde v predlogi, ki definirajo položaj in ukažejo Joomla!, kam
postaviti vsebino, dodeljeno za določen položaj. Oblikovalec predloge ima tako popoln
nadzor nad pozicijami modulov. Če na primer določimo pozicijo modula "left", bo vsebina
modula, ki ji bomo v administraciji pripisali pozicijo "left", prikazana tam, kjer bomo s
kodo določili "left" pozicijo modula (Module positions, 2011). Koda, s katero v predlogi
določimo pozicijo:
<jdoc:include type="modules" name="left" />.
Celostna grafična podoba in spletna predstavitev kulture playness 62
Ime pozicije je lahko poljubno, vendar smiselno izbrano, zaradi lažje orientacije pri
izdelavi predloge.
V Joomla! lahko kadarkoli pogledamo vse možne pozicije modulov za trenutno predlogo.
Če v naslovu Joomla! spletne strani dodamo ?tp=1, se nam prikaže spletišče in posamezni
položaji, ki so določeni v predlogi (Preprečite pogled pozicij modulov, 2011). Pozicije
playness predloge prikazuje slika 37.
Slika 36: Primer dela datoteke templateDetails.xml
Celostna grafična podoba in spletna predstavitev kulture playness 63
Slika 37: Joomla! pozicije Playness predloge
6.1.5 Template_thumbnail.png
Template thumbnail (slika 38) ustvarimo z namenom predogleda strani v Joomla! template
managerju. Thumbnail ne sme biti prevelik, primerna širina je 225px širine in 150px
dolžine.
Slika 38: Thumbnail
Celostna grafična podoba in spletna predstavitev kulture playness 64
6.2 Postavitev in objava spletne strani
Slika 39: Vstopna stran
Celotna stran ima širino 950 px. Sestavljena je iz glave, glavne vsebine in noge. Višina
vstopne strani (slika 39) je 634 px, kar pomeni, da je uporabnikom vidna celotna stran.
Glava je sestavljena iz več elementov. Najpomembnejši je logotip z znakom, ki je
postavljen zgoraj levo, kjer je najbolj opazen; osrednji element je slika z igralnimi
pripomočki za izvajanje playnessa. Zgoraj desno je omogočena možnost iskanja po
ključnih besedah po celotni strani. Na dnu glave se nahaja splošni meni, kjer bodo
objavljene novice, predstavitev, seminarji, kontaktne informacije …
Postavitev elementov v jedru strani se spreminja glede na to, katere informacije nas
zanimajo. Vstopna stran postavi v ospredje tri stebre playnessa s kratkimi opisi oziroma
uvodi (splošne informacije o playnessu – playness culture, izobraževalnem središču –
playness guru in evidenci centrov, kjer se playness izvaja – playness center). Če brskamo
po splošnem meniju, se stebri ohranijo, vsebina iz splošnega menija pa se prikaže pod
stebri. Ko izberemo enega od treh stebrov, se razmerje strani nekoliko spremeni.
Celostna grafična podoba in spletna predstavitev kulture playness 65
Glava strani se skrči, zamenja pa se tudi osrednja slika (slika 40), ki je sedaj ožja. Z
osrednjih stebrov se umaknejo opisi, ostane pa naslov. S tem pridobimo več prostora za
glavno vsebino. Na levi se sedaj pojavi prostor za podmeni.
Slika 40: Vsebina strani, ko je izbran eden izmed glavnih stebrov
Za vsebino, predstavljeno pod playness guru, bo potrebna prijava (slika 41). V ta namen
smo pripravili obrazec za prijavo, ki se pojavi, ko izberemo steber playness guru. Če je
uporabnik že registriran, vnese uporabniško ime in geslo, če pa še ni, lahko ustvari račun.
Za nov račun mora vnesti ime, uporabniško ime, elektronski naslov in geslo. Ko se prijavi,
se vsebina preusmeri na prvi podmeni playness guruja, levo pa se pojavi okvirček s
pozdravnim sporočilom in možnostjo odjave. Ko je uporabnik prijavljen, se na levi prikaže
pozdravno sporočilo z možnostjo odjave.
Celostna grafična podoba in spletna predstavitev kulture playness 66
Slika 41: Prijava v playness izobraževalni sistem
Stran je sedaj končana in gostuje na lokalnem strežniku. Da bo vidna širši javnosti, jo je
treba prenesti na drug strežnik.
Najprej izvozimo podatkovno bazo, nato pa celotno stran, vključno s predlogo, prenesemo
na nov strežnik ter uvozimo bazo. Stran sedaj lahko vidimo preko naslova
http://www.playness.org. Testirali smo jo z brskalnikoma Mozilla Firefox 3.0 in Internet
Explorer 8.
Odgovorili smo tudi na tretje raziskovalno vprašanje, kako izdelati spletno mesto s
pomočjo CMS Joomla!. Spoznali smo, kaj Joomla! sploh je in kaj nam omogoča.
Pregledali smo, kako je sestavljena predloga za Joomla!, in jo tudi izdelali.
Celostna grafična podoba in spletna predstavitev kulture playness 67
7 SKLEP
Naš cilj je bil izdelati učinkovito predstavitev kulture playness z izdelavo celostne grafične
podobe ter spletnega mesta.
Pri snovanju celostne grafične podobe in spletne strani kulture playness je bil potreben
celovit pristop. Za oblikovanje znaka in logotipa je bilo treba združiti likovno teorijo,
estetska pravila in naročnikove želje. Pri zasnovi spletnega mesta pa poleg naštetega še
praktičnost in uporabnost (kakršna naj bi stran bila) z možnostmi, ki nam jih pri izdelavi
spletnega mesta ponuja sistem Joomla!.
Preden smo začeli z izdelovanjem znaka in logotipa, smo morali spoznati playness kulturo
– kaj pravzaprav to je in kakšen je njen namen. Izpostaviti smo morali razlike med
panogami, kot so fitnes, welness in selfness. Pri playnessu se lahko človek »resno igra ali
igrivo dela in pri tem ohranja svoje dostojanstvo kot človek, ki osmišlja svoje bivanje in pri
tem uživa, ustvarja« (doc. dr. Milan Hosta – Ensico S, d. o. o. & Mednarodni inštitut za
trajnostni razvoj, diplomacijo in politiko športa). Prav to je bilo glavno vodilo pri
oblikovanju podobe kulture playness.
Za spletno mesto smo izdelali novo predlogo, ki je prilagojena vsebinskim zahtevam in
potrebam predstavitve playness kulture. Sistem Joomla! smo izbrali zato, ker je enostaven
za uporabo ter kasnejše urejanje, dodajanje in dopolnjevanje vsebin. Izdelek, ki je nastal,
še zdaleč ni končan. Z razvojem kulture se bo razvijalo tudi spletno mesto. V času, ko se
kultura šele uveljavlja, so pomembnejše informacije o sami kulturi, ko pa bo v razcvetu, bo
treba uporabnike privabiti k vpisu njihovih centrov na stran. Spletno mesto bo torej treba
redno posodabljati v skladu z razvojem kulture playness.
Celostna grafična podoba in spletna predstavitev kulture playness 68
8 LITERATURA
Barvni model CMYK. Wikipedija, prosta enciklopedija. 15.4.2010.
<http://sl.wikipedia.org/wiki/Barvni_model_CMYK>.
Barvni modeli. Wikipedija, prosta enciklopedija. 15.4.2010.
<http://sl.wikipedia.org/wiki/Barvni_modeli>.
Barvni model RGB. Wikipedija, prosta enciklopedija. 15.4.2010.
<http://sl.wikipedia.org/wiki/Barvni_model_RGB>.
Barvno upravljanje na spletu. 9. feb 2009. Slo-Tech. 14.4.2011. <http://slo-
tech.com/clanki/09003/>.
Butina, M. Prvine likovne prakse, Ljubljana: Debora, 1997.
CMYK color model. Wikipedia, the free encyclopedia. 13.4.2011.
<http://en.wikipedia.org/wiki/CMYK_color_model>.
Color Resource Guide - MR. SANDERS CLASS. 15.4.2010.
<http://www.mrsandersclass.com/color-resource-guide.html>.
Content management system. Wikipedia, the free encyclopedia. 10.5.2010.
<http://en.wikipedia.org/wiki/Content_management_system>.
Content management system. Wikipedija, prosta enciklopedija. 10.5.2010.
<http://sl.wikipedia.org/wiki/Content_Management_System>.
CSS Syntax. 11.5.2010. <http://www.w3schools.com/css/css_syntax.asp>.
Dabner, D, Calvert S., Casey A. Graphic Design School: the principles and practice of
graphic design, London: Quatro Publishing plc, 2010.
EU2008.si - Simbol slovenskega predsedstva Sveta EU. 4.5.2011.
<http://www.eu2008.si/si/The_Council_Presidency/Symbol/index.html>.
Fitness.com. 13.7.2010. <http://www.fitness.com/home.php>.
Celostna grafična podoba in spletna predstavitev kulture playness 69
Hosta, M., Ensico S, d.o.o., Od fitnessa preko wellnessa k playnessu, Ljubljana:
Mednarodni inštitut za trajnostni razvoj, diplomacijo in politiko športa, 2009.
Hribar, P. Spletne strani - Zvijače in nasveti. Nova Gorica: Flamingo založba, 2001.
Itten, J. Umetnost barve: študijska izdaja. Jesenice: [samozal.] R. Reichman, 1999.
Jury, D. What is typography? Switzerland: RotoVision SA, 2006.
Korelc, T. Kako do dobrega imena in simbola. Avgust 2000. Podjetnik. 15.4.2010.
<http://www.podjetnik.si/default.asp?ClanekID=98>.
Logotip. Wikipedija, prosta enciklopedija. 15. 4. 2010.
< http://sl.wikipedia.org/wiki/Logotip>
Mesojedec, U. Članki - Urejanje vsebin brez muk. maj 2006. Monitor. 13.5.2010.
<http://www.monitor.si/clanek/urejanje-vsebin-brez-muk/>.
Module positions - Joomla! Documentation. 14.4.2011.
<http://docs.joomla.org/Module_positions>.
Mrhar, P. XHTML 1.1 in slogi CSS2. Nova Gorica: Flamingo Založba, 2002.
Newmark, Q. What is graphic design. UK: RotoVision SA, 2007.
Pojem proste in odprtokodne programske opreme. Inštitut OKO. 10.5.2010. <
http://www.institut-
oko.si/index.php?option=com_content&view=article&id=51&catid=35&Itemid=54&lang=sl>.
Preprečite pogled pozicij modulov. 14 Februar 2011. Si Joomla. 14.4.2011.
<http://www.sijoomla.com/vodici/vodici-triki/80-pregled-pozicij-modulov>.
Rački, T. Veščina likovne kompozicije v slikarstvu, oblikovanju, fotografiji, filmu,
kiparstvu, in gledališču. Ljubljana: JSKD, 2004.
Repovš, J. Kako nastaja in deluje učinkovita, tržno usmerjena celostna grafična podoba
kot del simbolnega identitetnega sistema organizacij. Ljubljana: Studio Marketing, 1995.
RGB vs CMYK. Supremeprint. 15.4.2010.
<http://www.supremeprint.net/index.php?lay=show&ac=article&Id=538763157>.
Roger, C. Parker Grafično oblikovanje. Ljubljana: Pasadena, 1997.
Ruder, E. Tipografija. Ljubljana: Partizanska knjiga, Znanstveni tisk, 1977.
Celostna grafična podoba in spletna predstavitev kulture playness 70
Sean, A., Noreen, M., Terry, S. Logo design workbook : a hands-on guide to creating
logos. United States of America: Rockport Publishers, 2004.
Sisplet.org. 15.4.2010.
<http://www.sisplet.org/2009/11/CMS_/Kaj_je_CMS/Opredelitev/>.
Sisplet.org. 15.4.2010. <http://www.sisplet.org/2009/11/CMS_/Kaj_je_CMS/Pomen/>.
Strmole, M., Slak, S., Kruhar, S. Oblika + vsebina = prepoznavnost. 27.07.2001. Družba
Dnevnik, d. d. 18.5.2010. <http://www.dnevnik.si/tiskane_izdaje/dnevnik/6557>.
Spletna stran. Wikipedija, prosta enciklopedija. 15.4.2010.
<http://sl.wikipedia.org/wiki/Spletna_stran>.
Srića, V. Ustvarjalno mišljenje. Ljubljana: Gospodarski vestnik, 1999.
Statična spletna stran. 11.5.2010. <http://projekt.gotdns.org/staticna/index.html>.
Šuštaršič, N., Butina, M., De Gleria, B., Skubin, I., Zornik, K. Učbenik za likovno teorijo v
vzgojno-izobraževalnem programu umetniška gimnazija — likovna smer. Ljubljana:
Debora, 2007.
Timothy, S. Typography workbook : a real-world guide to using type in graphic design.
United States of America: Rockport Publishers, 2004.
Trstenjak, A. Človek in njegova pisava. Ljubljana: Tiskarna učne delavnice, Zbirka
Sopotja, 1986.
Trstenjak, A. Psihologija barv, Ljubljana: Inštitut Antona Trstenjaka za psihologijo,
logoterapijo in antropohigijeno, 1996.
W3Schools Online Web Tutorials. 11.5.2010. <http://w3schools.com/>.
Wellness.com. Your guide to the best of health and wellness. 13.7.2010.
<http://www.wellness.com>.
What is Joomla?. 10.5.2010. <http://www.joomla.org/about-joomla.html>.
WYSIWYG. Wikipedija, prosta enciklopedija. 14.4.2011.
<http://sl.wikipedia.org/wiki/WYSIWYG>.
Celostna grafična podoba in spletna predstavitev kulture playness 71
Priloge
Priloga A: Celostna grafična podoba