Cieľom školy je naučiť ťa navrhnúť si vlastnú webstránku a následne ju vlastnosručne naprogramovať a spojazdniť. Prejdeme si základnú prácu vo voľne dostupných grafických softvéroch (InkScape, GIMP), vytvoríme si ukážkový príklad návrhu webu a následne ho naprogramujeme v jazykoch HTML 5 a CSS 3. Počas kurzu pochytíš aj základy teórie z grafického dizajnu / webdizajnu.

Prvý deň začneme kurzom základných zručností v grafických softvéroch, ktoré sú užitočné a nevyhnutné pre tvorbu návrhov a podkladov k webom. Ukážeme si ako upravovať fotografie - ako ich orezávať, ako meniť kontrast, svetlo, farebné hodnoty a nastavenia. Ako retušovať a vyhladzovať. Ako robiť koláž a kombinovať obrázky. Na toto nám poslúži voľne dostupný softvér GIMP.

Kombinovanie dvoch obrázkov v GIMPe

Druhá časť prvého dňa bude venovaná úvodu do grafického softvéru InkScape (opäť voľne dostupný). Budeme sa venovať základným tvarom. Ako ich posúvať, prevracať, meniť ich veľkosť, otáčať ich a zarovnávať. Ako zvoliť farby. Ako vkladať obrázky. Ako pracovať s textom.

V utorok zúžitkujeme poznatky z pondelka a použijeme ich na niečo praktické. Najprv si ukážeme rôzne prístupy, ako tvoriť logo a potom ich niekoľko cvične vytvoríme. Neskôr prejdeme k ukážkovému návrhu webstránky aj s jej mobilnou verziou. Stiahneme si aj vlastné fonty, naučíme sa v nich vyhľadávať, používať Google Fonts a povieme si, kde sťahovať pozadia.

Od layoutu k návrhu webu v InkScape

V stredu sa pustíme do samotného programovania v HTML a CSS. Zoberieme návrh z utorka a postupne ho 1:1 naprogramujeme, aby zodpovedal čo najvernejšie predlohe. Počas programovania tohto konkrétneho webu si prejdeme všetky podstatné prvky obsahu: odkazy, odstavce, nadpisy, obrázky, tabuľky. Následne tento obsah naformátujeme pomocou CSS, vytvoríme rozvrhnutie (layout) tak, aby sa správal podľa možnosti responzívne (vhodne pre rôzne zariadenia). Budeme vždy dbať nato, aby bol web valídny.

Vo štvrtok ostáva priestor dobehnúť, čo prípadne nestihneme v stredu. Čím viac času nám potom ostane, tým viac špeciálnych tém sa stihne prebrať. Medzi špeciálne témy zaraďujeme primárne:

• Špecifiká responzívneho dizajnu: prejdeme si ako sa web zobrazuje na smartfónoch a skúsime ho čo najviac doladiť.
• Ako pridať na webstránku hudbu (mp3) alebo video (mp4, youtube).
• Ako prepojiť webstránku so sociálnymi sieťami (facebook, instagram, youtube).

V piatok uzatvárame letnú školu dvomi prednáškami k téme, konkrétne:

• Základy grafického dizajnu (Marcel Makovník):
  • Forma, kompozícia, tvar
  • Farby, význam farieb, farebné schémy / palety
  • Fonty, texty a obrazy
  • Rozvrhnutie (Layout)
• Praktické rady k webdizajnu (Samuel Struss):
  • Úvod do marketingu: typy cieľových skupín a ich identifikácia.
  • Reklamná stránka vs. informačná stránka
  • Budovanie vizuálnej hierarchie a User Experience
  • Použiteľnosť a štandardy
  • Vyhľadávače a Search Engine Optimization
  • Čo ďalej po tomto kurze?

Fotografie z posledného dňa - prednášky a odovzdávanie diplomov.

Kedy: 9.-13.7.2018, vždy v dopoludňajších hodinách (cca. 8:30 - 12:00)
Kde: Gymnázium Bilíkova 24, Bratislava

Sme traja doktorandi z Katedry algebry, geometrie a didaktiky matematiky FMFI UK. Každého nás baví niečo iné, ale máme jedno spoločné. V nejakej forme učíme verziu tohto kurzu na matfyze vrámci predmetov Webovská grafika (matematici a aplikovaní informatici) a Počítačová Grafika 1 (manažérski matematici).

V prípade akýchkoľvek otázok nás neváhajte kontaktovať: samuelstruss@gmail.com

Adriana
Bosáková

Marcel
Makovník

Samuel
Struss

Mestská časť
Bratislava-Dúbravka

Gymnázium
Bilíkova 24

Fakulta matematiky,
fyziky a informatiky UK