Webdesigner tanfolyam

Képek, grafikák online. A 21. században az online világ nélkülözhetetlen elemei a különböző design elemek, amik színesítik és könnyebben befogadhatóvá teszik az adott információkat.

Ezen a képzésünkön azt a tudást kapod, amivel képes leszel egyedi és lenyűgöző grafikákat készíteni a weboldalak bármelyikére, mindezt önállóan és precízen.

A képzést az alapoktól kezdjük. A színelmélettől kezdve a különböző koncepcionáláson át egészen a webergonómiáig megismertetünk mindennel, hogy teljes képet kapj erről a rendkívül kreatív és dinamikus szakmáról.

Ha saját vállalkozás indításán töröd a fejed, vagy grafikusként bővíteni szeretnéd a tudásod, vagy egyszerűen csak érdekel hogyan tudsz te is lenyűgöző web grafikákat készíteni, akkor ez a képzés tökéletesen rád van szabva.

Jelentkezz és mi megmutatjuk hogyan tudsz trendi designokat készíteni!

A tanfolyam megkezdésének feltételei:

• hogyan lehet önálló döntéseket hozni a weboldal megjelenésével kapcsolatban;
• hogy a saját magad által megtervezett grafikai és szerkezeti elemeket hogyan tudod beépíteni a weboldalba;
• hogy a tartalmi elemeket hogyan lehet a megfelelő módon elhelyezni a weboldalon;
• hogyan lehet a kialakított designnal érzelmeket kiváltani a böngészőkből.

01 Tipográfia

• Betűtípusok, betűcsaládok
• Betűalak, betűkép
• Mértékrendszer
• Elemek és fogalmak
• Mikrotipográfia
• Betűtulajdonságok
• Bekezdéstulajdonságok
• Szövegegységek
• Nyugodt vs. dinamikus layout

Gyakorlat: egyszerű betűeffektek Photoshopban
retrókontúr / 3D + tükröződés / fába gravírozott betűk / csillámbetűk / graffiti / lángoló betűk / aranybetűk / break-effekt

02 Színek

• Színterek: RGB, HSB, CMYK
• A digitális színkör
• Szomszédos színek, monokrómia
• Színkontrasztok (komplementer-, hideg-meleg, minőségi, sötét-világos és színes-színtelen kontraszt)
• Színpaletták (nyugodt, dinamikus, stb.)
• Hasznos eszközök
• Színek és szöveg
• Színpszichológia és kultúrafüggő konnotációk

Feladat: színpaletta és változatok létrehozása adott design-vezérelvhez

03 Layout

• Szerkesztési elvek (háttér-előtér, térköz és hasonlóság, zártság, a ’közös sors’, a ’jó folytatás’, hangsúly)
• Kontrasztok: kicsi/nagy, könnyű/nehéz
• Ritmus és ismétlés
• Struktúra és permutáció
• Térbeli elrendezés
• Aranymetszés
• Hagyományos weboldalszerkezetek

• Az oszlopszám, a betű- és a kijelzőméret összefüggései
• Fixed
• Liquid (fluid)
• Hybrid
• Elastic

Feladat: statikus layout Photoshopban megadott tartalomhoz

04 Koncepcionálás

• Ki vagy és mid van?
• Kinek kell?
• De mi kell neki igazán?
• Hogy lehet neki eladni?
• Tartalmi strukturálás és design-elvek

Feladat: brief kitöltése és prezentálása

Feladat: Vázolás papíron

05 Photoshop

• Kijelölések (geometrikus, színalapú, csatornával)
• Korrekciók (színek, tónus, geometriai)
• Retusálás
• Montírozás
• Grafika (ecsetszerű eszközök, vektoreszközök, szűrők)
• Weboldal-elemek
• Guideguide
• Workshop: Banner készítése (slicing)
• Workshop: Weboldal készítése (Layer comps-paletta)
• Automatizálás

Feladat: felvázolt oldal elkészítése PS-ban

06 Illustrator

• Pixel- vs. vektorgrafika
• Vektorok
• Kijelölés
• Műveletek formákkal
• Szerkesztés
• Effektek
• Körvonalak
• „Szabadkézi” eszközök
• Transzformációk
• Színek
• Áttetszőség és maszkok
• Szöveg
• Pixelgrafikák és textúrák
• Szimbólumok
• Workshop: Logó készítése és exportja
• Workshop: Weboldal készítése
  • színkezelés
  • weblap felépítése
  • mockup / wireframe
  • szeletelés
  • mentés webre
  • méretoptimalizálás
• CSS-export
• SVG-export
• HTML5-canvas export

Feladat: banner készítése

07 Webergonómia

• „Ne törd a fejem!”
• Az elképzelt és a valóságos weboldalhasználat
• A hirdetőtáblák kiskátéja
• Szövegek redukálása
• A navigáció
• A kezdőlap
• Használhatósági teszt
• Akadálymentesítés
• Oldaltervezés
• Tartalomtervezés
• Laptervezés

08 Responsive oldalszerkezetek

• Reflowing Layouts
• Equal Width
• Off Canvas
• Source-Order Shift
• Lists
• Grid Block

09 A responsive webdesign egyéb problémái

• Tipográfia
• Médiumok (képek, videó, térkép)
• Megoldások navigációra
• Megoldások táblázatokra
• Űrlapok
• Nagyfelbontású kijelzők
• Modulok (körhinta, tabek, harmonika, üzenet a weblapról, lightbox)
• Feltételes betöltés
• Bootstrap
• Modernizr E

10 Webtechnológiák

• Domain-név és tárhely
• Szolgáltatók és csomagjaik
• Statikus és dinamikus oldalak
• Fogalmak
• A webböngésző
• Áttekintés: kijelölőnyelvek (HTML, XML, CSS)

11 Dreamweaver

• Dokumentum-kezelés
• Site-kezelés
• Elemek beillesztése (képek, médiumok, táblázatok, űrlapok)
• CSS-szerkesztő
• JavaScript-keretrendszerek: Behaviors, Spries, Snippets
• Tesztelés és közzététel