egy képzőművészeti csoporthoz

Az előadások a következő témára: "egy képzőművészeti csoporthoz"— Előadás másolata:

1 egy képzőművészeti csoporthoz
Weboldal tervezése egy képzőművészeti csoporthoz Szolnoki Ágnes, új média grafikus szak

2 Brief A csoportról Háttér
Egy több éve együtt dolgozó, nem hivatásos festőket összefogó alkotó közösség, akik pályázatokon és kiállításokon, ill. nyaranta alkotótábo-rokon vesznek részt. Heti rendszerességgel közösen alkotásoknak Szilágyi János grafikus- és festőművész vezetésével, és bárki csatlakozhat a csoporthoz, aki szeretne egy nyitott, jó hangulatú közösségben alkotni. Háttér A képzőművészeti csoportnak magam is tagja vagyok, így egy személyben lehettem a weboldal megrendelője és kivitelezője is.

3 Brief Feladat Célkitűzés Célcsoport
Megjelenési felület tervezése, ahol a közösség, ill. a tagok külön-külön is megmutathatják munkáikat. Első lépésként névadás, majd arculattervezés. Végül a csoport honlapjának megtervezése. Célkitűzés A csoport kreativitását, jó hangulatú közös alkotásokat és azok eredményeit közvetíteni a honlap arculatával az érdeklődők felé. Célcsoport A honlap mindazoknak szól, akik szeretik a képzőművészetet, szívesen nyomon követnék a csoportunk munkáit, eseményeit, vagy csatlakozni szeretne hozzánk.

4 Brief A logó megtervezése előtt
Találó név keresése a csoport tagjaival közösen. 2011 májusától már van nevünk: spiriTUSz csoport Csoport létrehozása a Facebookon az ideiglenes logóval Névadó ünnepség saját fotókkal

5 A logó Inspirációk A logó végleges változatának elkészítéséhez a következő logók inspiráltak:

6 Logó kialakulásának fázisai
A logó Logó kialakulásának fázisai

7 A logó Logotípia Színrendszer Embléma
A két kiválasztott betűtípussal kontraszt kialakítására törekedtem. Színrendszer fekete – a tusra utalás erősítéseként, narancs – a fekete szín mellé egy melegebb, vidámabb színt választottam, ami lendületet ad a logónak. Embléma A festészetre és a csoport nevéből kiemelt „TUS” szóra történő utalásként egy fekete színű tuspacát használtam fel, és az így kiemelendő szót kivágtam belőle, mintha a tuspaca ilyen különlegesen folyt volna szét az adott felületen.

8 A logó A logó használata
A narancs és fekete színek miatt a logót csak fehér alapon szabad használni, minden oldalánál 10%-os margóval. Ügyelni kell arra is, hogy a spiritusz szó dőlése, illetve színe se változzon.

9 A logó A logó használata
A csoporttagok már használatba is vették a logót, az egyéni kiállítá-saikhoz készített egyedi meghívóikon feltüntetve hangsúlyozzák a csoport-hoz való tartozást.

10 Arculati elemek Az elkészült logóval a csoport Eötvös 10 év végi kiállításra a következő arculati elemeket tervezetem meg: meghívó

11 Arculati elemek Az elkészült logóval a csoport Eötvös 10 év végi kiállításra a következő arculati elemeket tervezetem meg: plakát

12 Arculati elemek Az elkészült logóval a csoport Eötvös 10 év végi kiállításra a következő arculati elemeket tervezetem meg: molinó

13 Arculati elemek A spiriTUSz csoport arculati elemeinek megjelenései különböző helyeken: A csoport év végi kiállításának hirdetése az Eötvös 10 oldalán

14 Arculati elemek A spiriTUSz csoport arculati elemeinek megjelenései különböző helyeken: Megjelenés a Kép a falon című oldalon

15 Arculati elemek A spiriTUSz csoport arculati elemeinek megjelenései különböző helyeken: Megjelenés a Múzeumok éjszakája programjában

16 Arculati elemek A spiriTUSz csoport arculati elemei és azok megjelenései különböző helyeken: A csoport hírének terjedése az év végi kiállításunk megnyitóját követően a Facebookon

17 A honlap arculata Tervezés
Egy egyszerű, könnyen kezelhető, átlátható honlap. Bemutatkozási lehetőség a csoport tagjainak. A közösség eseményeinek megjelenítése. Rugalmasan bővíthető felület kialakítása új tagoknál. is könnyen nyomon követhetőek.  Főoldal használatával sugallni, hogy itt érdemes több időt is eltölteni.

18 A honlap arculata Arculat
A logó elemeinek ismétlődésére törekedtem az oldalon az összhatás elérésnek érdekében, emellett a többi elemmel is az alkotásra, festészetre, rajzra kívántam utalni. Több változaton keresztül jutottam el a végeredményhez:

19 A honlap arculata Az első változat
Fehér felületen pacákból és a logóból kialakított menüpontok. A tagok nevei már a főoldalon szerepelnek, ahonnan saját oldalaikra jutunk tovább. A nevek mozgatható elemekként jelentek meg Drag AP Element alkalmazásával. De ezt a megoldást később elvetettem, mert céltalannak tűnt az elemek mozgathatósága.

20 A honlap arculata Az első változat
Ezek után elkésztettem egy olyan változatot is, ahol ha az egérrel rámentem a névre, az adott csoporttag egyik festménye lett látható, és ezután rákattintva jutottam tovább a tag oldalára.

21 A honlap arculata Az első változat
A megjelenő képet később kicseréltem a kép egy jellemző részletére, a formáját pedig úgy alakítottam ki, mintha a nagy fehér papírfelületből egy kis darabot kiszakítottam volna. Végül ezt a változatot is elvetettem, mert így túl sok elem jelent meg a főoldalon, és több új tag felvétele esetén már megnehezítette volna az oldal átláthatóságát.

22 A honlap arculata A második változat
Az oldal szerkezetét megváltoztatva egy öt oldalból álló honlap elkészítése mellett döntöttem. Az újabb változatnál egy merített papíron jelenítettem meg az információkat, háttérnek először egy rajztáblát helyeztem el, de a kép nem adta jól vissza a rajta lévő festékfoltokat, ezért inkább egy barna csomagolópapírra utaló háttérre cseréltem le, és így jobban kiemeltem vele a merített papírt.

23 A honlap arculata A második változat
A főoldalon kívül a következő oldalak kerültek kialakításra: rólunk: bővebb információ a spiriTUSz csoportról, történetéről, tagok: az alkotóközösség tagjainak bemutatkozási lehetősége, ahol megtekinthetőek a munkáik is események: a korábbi és soron következő közös és egyéni kiállítások, ill. alkotótáborok felsorolása kapcsolat: információk a közösség elérhetőségeiről.

24 A honlap arculata A harmadik és egyben végső változat
A hátteret lecseréltem egy, a csoport tevékenységét jobban kifejező, kézzel készített akvarellre utaló képre.

25 A honlap arculata A harmadik és egyben végső változat
További tuspacát is elhelyeztem a felületeken.

26 A honlap arculata A harmadik és egyben végső változat
Az almenü kialakításánál is egy egymástól jobban elkülönülő, és az aktív almenüpontoknál feltűnőbb kiemelést alakítottam ki, amelynek alapmintáját egy ecsettel húzott vonal adja.

27 A honlap arculata A harmadik és egyben végső változat
A tagok oldalon a legördülő almenük képeire kattintva egy-egy, az adott tag alkotásait tartalmazó galériába juthatunk tovább, melyet a Clearbox magyar fejlesztésű, ingyenesen letölthető programmal valósítottam meg. Ezzel a programmal egy galérián belül nem csak képek, hanem weboldalak és akár kisfilmek is elhelyezhetővé váltak.

28 A honlap arculata A harmadik és egyben végső változat
Az események oldalon a kiállítások meghívóinak, és a kiállításokról készült fotóknak, esetleg kisfilmeknek megte- kinthetőségét a tagok oldalnál említett módon oldottam meg.

29 A honlap arculata A harmadik és egyben végső változat
Az események galériájához több, véletlenszerűen egymásra tett fotót helyeztem el, melyek mozgat- hatóak. A galériákat jelképező fotókon található tuspacákra kattintva léphetünk be az adott esemény galériájába

30 A honlap arculata A harmadik és egyben végső változat
A kapcsolat oldalon az elérhetősé- geknél elhelyezett ikonok alap esetben tusfoltokra utaló változatban jelennek meg, de amint az egérrel ráállunk az adott képre, az az eredeti formájában lesz látható.

31 A honlap arculata Almenü
A minél jobb helykihasználás érdekében a tagok és az események oldalaknál az almenüt Spry Accordion Panelbe helyeztem el, ahol a fülekre kattintva látható a tartalom.

32 A honlapnál alkalmazott színrendszer
A honlap arculata A honlapnál alkalmazott színrendszer

33 A honlap arculata Üres területek
Kerültem az oldalak túlzsúfolását, ezért az oldalakon elhelyezett üres terekkel tettem szellősebbre őket.

34 A honlap arculata Hierarchia

35 A honlap arculata Betűtípus
Verdana betűtípust választottam, mivel ez a betű minden gépre tele-pítve van, így gond nélkül megje-lenhetnek vele az oldal szövegei. A betűkeverést alkalmazva egy talpas betűvel terveztem még izgalmasabbá tenni az oldal megjelenését. A főcímek esetében a átlátszó hátterű képeket illesztettem be, amelyeken Poor Richard típussal jelenítettem meg a főcímek neveit. Erre azért volt szükség, mert nem ismeri fel minden gép, viszont a logóban szereplő betűtípust kívántam megismételni az összhatás elérése érdekében. A képaláírások esetében is ezt a betűtípust alkalmaztam.

36 Kulcsszavak A jól megválasztott kulcsszavakra a weboldal optimalizálás miatt van szükség, hogy az oldalunk az ezekre a szavakra kereső portálok találati oldalán minél jobb pozíciót érjen el. A kulcsszó kiválasztása során azt is figyelembe vettem, hogy sokan a pontosabb találat érdekében ma már nem csak egy szót írnak a keresőbe. Ezért annak érdekében, hogy minél több látogatót tudjak a weboldalra irányítani, a következő variációkra optimalizáltam az oldalt: spiriTUSz csoport Eötvös 10 spiriTUSz alkotócsoport kiállítás alkotótábor

37 Mozgókép A spiriTUSz csoport Eötvös 10 év végi kiállításáról készítettem After Effects programmal egy rövid mozgóképet.

38 Köszönöm a figyelmet!