Miről szól ez a blog?

Posted weigel.szilviaPosted in információ

Ebben a blogban, weboldalam design és arculat tervezésének folyamata követhető végig. A logótervezés, a színrendszer és a tipográfia rendszer valamint a különböző kommunikációs felületek kialakításáról kaphat áttekintést. Amennyiben egy weblap készítés során az arculat tervezését is én végzem, a programozás mellett, az oldal kialakulásának folyamata hasonlóan történik, mint ahogy a saját weboldalam esetében zajlott.

Weboldalam a Budapesti Kommunikációs és Üzleti Főiskola új média grafikus képzésen szakdolgozatként is szolgált. A szakdolgozat kategóriába sorolt bejegyzések alkották a vizsgamunkát.

Munkanapló részlet

Posted weigel.szilviaPosted in munkanapló, szakdolgozat

2.1. Fejléc

Az oldal tetején látható a fejléc kép, mely tartalmazza a logót, és a hullám grafikai elemet.

A logó mögé mindenképp világos színre volt szükség, a hullámot viszont sötét háttérbe akartam elhelyezni, ezért színátmenettel oldottam meg azt a hatást, mintha a sötétből, a háttérből törne elő a hullámforma. A hullám úgy készült, hogy az Illustratorban 6 db téglalapot egymás mellé raktam, majd az Object/Envelope Distort/Make with mash funkciót kiválasztva kialakítottam a hullámformát. Az elkészült objektumot letükröztem a Reflect Tool segítségével. Az alulra került hullámforma áttetszőségét 30%-ra állítottam, hogy élethű legyen a tükröződés. Az alsó és felső hullámokat egy csoportba foglaltam, majd az effektek közül a 3D Extrude & Bevel funkcióval 3D formára alakítottam.

A logóra rákerült egy image map, az ingyenesen használható Handy Image Mapper nevű program segítségével. Ezzel a logóra kattintva mindig a kezdő oldalra juthatunk, ami jelenleg a Webfejlesztés menüpont.

Tipográfia

Posted weigel.szilviaPosted in szakdolgozat, tipográfia

Logó

A logó emblémában megjelenő W betűhöz nem találtam megfelelő, szép vonalú betűtípust, ezért én rajzoltam egy íves vonalat, melyet megdupláztam.

A logóban használt Liberation Serif betűtípus egy talpas betűtípus, melyet leginkább a Times New Roman betűtípushoz hasonlíthatunk. Átlós tengely, mérsékelten váltakozó vonalvastagság, ferde serif jellemzi.

Felhasználhatóságát tekintve a Public domain / GNU GPL licence csoportba tartozik, mely alapján ingyenesen felhasználható.

A font az internetről letölthető: https://fedorahosted.org/liberation-fonts/

Az Alte Haas Grotesk font egy ingyenes használható talp nélküli font, melyet Yann Le Coroller készített.

A font az internetről letölthető: http://www.dafont.com/Alte-Haas-Grotesk.Font

A logóban megvalósul a betűkeverés egyik alapelve, mégpedig az hogy eltérő betűtípusokat használjunk egymást mellett. A kontrasztot nem csak az eltérő betűtípusok, de az eltérő méretek is erősítik.

Weboldal és blog

A weboldalon mindenhol Verdana betűtípust használok, mely jól olvasható talp nélküli sans-serif betűtípus. Nagy középmagasság, széles méretek, laza betűtáv jellemzi. A Verdanát 1996-ban a Microsoft hozta létre, kifejezetten számítógépes használatra szánt betűkép.

Névjegykártya

Posted weigel.szilviaPosted in névjegykártya kommunikációs felület, szakdolgozat

Névjegy

A névjegykártyán használt betűtípus megegyezik a logóban használt egyik betűtípussal:

  • Alte Haas Grotesk

A névjegykártya mérete 90 × 50 mm. A feliratok a betűtípus normál és bold változatával készültek. A logó és a feliratok egy képzeletbeli vonalhoz igazodnak, az összetartozó információk csoportosítva szerepelnek. A lényegesebb információk vastagabb betűváltozattal illetve nagyobb betűmérettel is kiemelésre kerültek.

Színrendszer

Posted weigel.szilviaPosted in szakdolgozat, színrendszer

A legtöbbet használt színeket az alábbi táblázat mutatja be. A szürke és a halvány rózsaszín árnyalatai az oldalon használt színátmenetek miatt nincsenek külön felsorolva. A tervezés során RGB színeket használtam, a vállalkozás elsődleges felhasználási területét szem előtt tartva. A CMYK színek esetében néhol kerekítésre volt szükség, így az esetleges nyomdai munkálatok során minimális eltérés lehet a monitoron megjelenő színekhez képest.

Szín

RGB

CMYK

Web

Információ

 

245-241-241

3-4-3-0

#F5F1F1

alap tartalom háttér

 

244-240-240

3-4-3-0

#F4F0F0

logó alatti színátmenet egyikszíne

 

241-235-235

4-6-4-0

#F1EBEB

menüpont felső rész –színátmenet egyik vége

 

237-228-228

6-9-6-0

#EDE4E4

jobb oldali panel háttér

 

227-208-208

9-17-12-0

#E3D0D0

képkeret

 

255-34-39

0-96-89-0

#FF2227

hivatkozás

 

191-36-36

18-99-100-8

#BF2424

menüpont alja

 

195-9-9

16-100-100-7

#C30909

menüpont felső rész –színátmenet egyik vége

 

234-230-230

7-7-6-0

#EAE6E6

logó alatti színátmenet egyikszíne

 

214-210-210

15-13-13-0

#D6D2D2

menüpont felső rész –színátmenet 2. sarok

 

188-185-185

27-23-22-0

#BCB9B9

menüpont felső rész –színátmenet 1. sarok

 

132-132-132

51-42-42-6

#848484

lábléc cím

 

100-100-100

60-52-51-21

#646464

lábléc szöveg

 

119-119-119

55-46-46-11

#777777

blog dátum, kategória

 

41-41-41

71-65-64-67

#292929

oldal háttér

 

43-43-43

70-64-63-65

#2B2B2B

fejléc-lábléc háttér

 

0-0-0

75-68-67-90

#000000

szöveg

Bejegyzés típusok a blogban

Posted weigel.szilviaPosted in információ

8 féle bejegyzés típusnak kötelezően szerepelni kell a blogban. Minden bejegyzéstípusnak legalább egyszer meg kell jelenni. A 8 kötelező típuson kívül a szakdolgozat kategóriában szereplő bejegyzések adják a blog formában leadott szakdolgozatot.

A 8 kötelező bejegyzés típus:

  1. logó
  2. tipográfia
  3. színrendszer
  4. fénykép
  5. mozgó kép
  6. munkanapló részlet
  7. névjegykártya vagy más kommunikációs felület
  8. levélpapír vagy más kommunikációs felület

A kötelező post típuson kívül használom még a következőket:

  • szakdolgozat
  • információ