Veebilehe disain: UI/UX ja front-end arendus

Veebilehtede kujundamise teadus minemas üha tähtsamaks - kas nupp peaks olema vasakul või paremal, ümmargune või kandiline. Millised värvid sobivad kokku, kuidas kasutaja veebilehti näeb, mis on ilus ja kasutajasõbralik erinevates meediaruumides.

Käesolevas koolituses käsitleme kujunduse aluseid võttes arvesse ka kasutaja perspektiivi. Ilu on vaataja silmades, maitsed on erinevad, kuid koolituse lõpetanud on olemas kõik teadmised, kuidas kujundada täpselt omale visuaalselt sobivaid veebilehti.

Koolituse maht: 200 akadeemilist tundi — 70 t kontaktõpet, 50 t iseseisvaid harjutusi, 40 t õppevideoid ja 40 t lõpuprojekti.

Õppevorm: reaalajas veebis (Google Meet / Zoom) või soovi korral kohapeal (Roosikrantsi 8b, Tallinn).

Koolitus on sobilik neile, kes soovivad omandada praktilisi teadmisi veebidisainist. Koolituse lõppedes on omandatud veebilehtede kujundamiseks vajalikud teadmised ning front-end arenduse teadmised.

UI/UX huvilised. Front-end programmeerimise huvilised. Spetsialistid, kes soovivad IT-disaini alaseid lisateadmisi hankida.

Õppegrupi suurus: 2–3 inimest ühes grupis — suure grupiga võrreldes muudab see õppe eriliselt personaalseks ja põhjalikuks.

Kursuse alustamiseks on vajalik esmane arvuti kasutamise oskus.

• Veebidisain, UI/UX (44 ak. tundi + 34 ak. tundi iseseisvalt)

  • Sissejuhatus veebidisaini (10 ak. tundi + 4 ak. tundi iseseisvalt)

    • Mis on UI? Väike teooria. Näited ja arutelu kuidas UI-d mõista. Erinevad etappid UI/UX protsessis.
    • Kasutaja stsenaariumid.
    • Erinevad prototüüpimise tehnikad ja nende kasutamise eesmärgid.

  • Veebidisaini baasteadmised (8 ak. tundi + 4 ak. tundi iseseisvalt)

    • Veebilehe teekonna kaardistamine
    • Wireframe'de tegemine.

  • Prototüübi loomine Figma keskkonnas (14 ak. tundi + 16 ak. tundi iseseisvalt)

    • Stiililehe loomine (värvide, kirjastiilide, ikoonide ja nuppude loomine).
    • Prototüübi nullist loomine.
    • Piltide lisamine prototüübile Photoshopist.
    • A/B prototüüpide tegemine.
    • Erinevate disainiteooriate katsetamine prototüübis (nt näitame konkreetselt, kuidas pildid haaravad rohkem tähelepanu kui tekst).
    • Erinevad joondused ja automaatne joondus.
    • Erinevad pluginad.
    • Gridi paigutus (grid layout).
    • Komponentide kasutamine.

  • Prototüübi interaktiivseks tegemine (12 ak. tundi + 14 ak. tundi iseseisvalt)

    • Erinevate ekraanide (frame) ühendamine veebilehe kaardistamise abil, ühendamise tehnikad ja meetodid.
    • Komponentide kasutamine.
    • Mustritega tutvumine.
    • Klikitavus.
    • Prototüübi väljastamine lõppfaasis.
    • Prototüübi edasi andmine.

• Front-end arendus (26 ak. tundi + 16 ak. tundi iseseisvalt)

  • HTML (12 ak. tundi + 6 ak. tundi iseseisvalt)

    • elemendid
    • atribuudid
    • pealkirjad
    • id'd
    • klassid
    • lingid
    • pildid
    • Youtube aknad

  • CSS (14 ak. tundi + 10 ak. tundi iseseisvalt)

    • värvid
    • tekstisuurused
    • tekstikujundus
    • piirjooned
    • kaugused
    • paiknemised

Koolituse lõppedes koolitatav:

• teab front-endi põhiteadmisi;
• oskab disainida ilusaid veebilehti;
• oskab kasutada HTMLi koodi kuvamise jaoks ja CSS koodi kujundamise jaoks;
• oskab kasutada Figma platvormi veebilehtede kujundamise jaoks;
• teab piisavalt front-end arendusest ja veebilehtede disainimisest loomaks väljundit iseseisvale jätkuõppele ning on võimeline seeläbi saama läbi koolituse endale IT alane töökoht.

Koolituse lõpus valmistab koolitatav koolitaja juhendamisel lõpp-projekti. Funktsionaalse ja töötava lõpp-projekti valmimisel ja koolitaja hinnangu edukal sooritamisel väljastatakse kursuse lõpetanule tunnistus.

Tõend väljastatakse õppijale kui õpitulemusi ei saavutatud, kuid õppija võttis osa õppetööst. Tõend väljastatakse vastavalt osaletud kontakttundide arvule.

Õppemeetodid: interaktiivsed loengud, praktilised ja iseseisvad tööd ning õppevideod.

NB! Kõigile registreerunutele saadetakse tasuta monitor, et koolitust saaks jälgida ühelt ja kaasa kirjutada teiselt ekraanilt.