Cvičenia
Rozvrh
Každý týždeň je nejaká téma, ktorá sa preberá na všetkých cvičeniach, takže na cvičenia môžete chodiť v ľubovoľný deň.
- utorok 9:50 v F1-248
- streda 11:30 v I-H3
- štvrtok 11:30 v F1-248
- piatok 8:10 v F1-248 - zrušené, ak vám nevyhovuje ani jeden z predošlých troch termínov a chcete prísť na cvičenia, tak nám napíšte mail.
1. týždeň 23.9. - 27.9.
Úvodné informácie o cvičeniach, zadaniach a bodovaní v pdf
2. týždeň 30.9. - 4.10. - Inkscape
prezentácia v pdf
- Ako urobiť jednoduché logo v Inkscape
- Text Along a Path, Text Bending/Twisting/Spacing
- Snowflakes and Other Symmetrical Shapes
- Trendy Logo Design in Inkscape - Tutorial
- Dripping Blood Text - Tutorial
Bonusová úloha za 0,5 boda: Urobte logo na jednu z nasledujúcich tém:
- Firma zaoberajúca sa tvorbou webov
- Reštaurácia
- Cirkus
Použite pri tom tieto techniky:
- Práca s objektmi a farbami
- Práca s vrcholmi
- Vektorizovanie bitmapy a úprava vrcholov
- Tieňovanie do priesvitna (odlesky alebo tiene) alebo medzi dvomi farbami
- Booleovske operácie
- Filtre alebo textúry
Odovzdávanie na cvičeniach alebo mailom na: uhlikova@sccg.sk do 11.10.2013. Mailom je nutné poslať logo aj v svg formáte.
Návody a tutoriály:
- Základná práca s Inkscapom
- Pokročilejšia práca s Inkscapom
- Tutoriály roztriedené podľa obtiažnosti
- Množstvo videotutoriálov ako urobiť konkrétne veci
- Inkscape Tutorials Blog
- Designing Websites With Inkscape
3. týždeň 7.10. - 11.10. - Gimp
prezentácia v pdf
- Úvodný videotutoriál - práca s vrstvami
- Krátky videotutoriál - orezávanie a zmenšovanie obrázkov
- Odstraňovanie červených očí
- Klonovanie a retušovanie
- How to Create an Animated GIF With GIMP
- Histogram, úrovne farieb
Bonusová úloha za 0,5 boda:
Zlepte tieto 2 fotky: kone.jpg a pozadie.jpg. Koníkom treba odstrániť pozadie a vložiť ich do druhej fotky (pozadie.jpg). Výsledok by mal vyzerať prirodzene. Pozadie treba preklopiť, aby sedeli tiene. Ďalej treba niečo vyretušovať, niečo rozmazať, doladiť farebnosť jednej a druhej fotky, úmerne zmeniť velkosti, ...
Odovzdávanie na cvičeniach alebo mailom na: uhlikova@sccg.sk do 18.10.2013.
Návody a tutoriály:
- Cut out an image with free select tool/lasso tool
- Scissors Select Tool
- Tutoriály pre úpravu fotografií
4. týždeň 14.10. - 18.10. - HTML
prezentácia v pdf
5. týždeň 21.10. - 25.10. - CSS
prezentácia v pdf
Bonusová úloha za 1.5 boda
- Vytvorte 3 úrovňové vysúvacie menu bez použitia Javascriptu, iba pomocou css (1 bod)
- Aplikujte na menu css animáciu (0.5 boda)
- HTML a CSS kód musí byť validný
- Menu sa musí zobraziť správne vo všetkých prehliadačoch a IE (9, 10)
- Na menu použite odrážkové zoznamy
- Dbajte na sémantiku dokumentu
- Deadline 30.11.2013, odovzdávajte mailom na martin.vesel@gmail.com, do predmetu dajte prosím prefix WEGA
6. tyzden 28.10.2013 - 1.11.2013 Javascript a jQuery
- Materialy z cviceni
- otazky, napady, navrhy, konzultacie: kamil@maraz.co
7. tyzden 4.11.2013 - 8.11.2013 Javascript a jQuery a HTML5 Canvas
- Materialy z cviceni (pribudol link na malovanie co sme kodili 5.11.)
- otazky, napady, navrhy, konzultacie: kamil@maraz.co
8. tyzden 11.11.2013 - 15.11.2013 Javascript a HTML5 Canvas
- Materialy z cviceni (pribudol link na malovanie ktoremu sme menili vzhladom pomocou Twitter Bootstrapu 12.11.)
- otazky, napady, navrhy, konzultacie: kamil@maraz.co
9. týždeň 18.11.2013 - 22.11.2013 - WebGL
3D na webe prezentácia v pdf
WebGL Example
Three.js White Square
Three.js Cube
10. týždeň 25.11. - 29.11. - Three.js
Knižnica Three.js
- cesta k addonu do Blendra pre export modelov vo formáte .js:
mrdoob-three.js-f396baf/utils/exporters/blender
stemkoski.github.io/Three.js - množstvo príkladov využitia knižnice Three.js
Načítanie modelu prostredníctvom Three.js
Model s animáciou
Bonusová úloha za 0,5 boda:
Vytvorte interaktívnu scénu podľa nasledujúcich inštrukcií:
- stiahnite si nejaký Blender model (najlepšie už aj s preddefinovanou animáciou - napr.: Monkey animation) alebo si vytvorte vlastný model s animáciou
- model z Blendra exportujte vo formáte .js (do Blendra treba pridať vyššie spomenutý addon) aj s "Morph animation"
- exportovaný model načítajte namiesto modelu v príklade z cvičení - animácia by mala fungovať
- pridajte zapínanie a vypínanie animácie reagujúce na klik myšou, ale iba pri kliknutí na objet (Simple Mouse Hovering, Mouse Click)
- do scény pridajte bodové svetlo, ktoré vrhá tiene: Spotlights and Shadow
- zmeňte okolie - použite "skybox" z tohto: príkladu, ale s vlastnou textúrou
Odovzdávanie na cvičeniach alebo mailom na: uhlikova@sccg.sk do 6.12.2013.
11. týždeň 2.12. - 6.12. - Konzultácie HTML, CSS
12. týždeň 9.12. - 13.12. - Konzultácie JavaScript, jQuery
13. týždeň 16.12. - 20.12. - Konzultácie WebGL
Ak chcete prísť konzultovať WebGL, tak mi najprv napíšte mail na uhlikova@sccg.sk s tým, čo chcete konzultovať a kedy chcete prísť.