Podcast o Základy informatiky, dizajnu a obchodného práva

Základy informatiky, dizajnu, práva: Maturita a prax

Podcast

Vektorová grafika a zlatý rez: Dizajn pre maturantov0:00 / 9:32
0:001:00 zostáva
JakubPoznáš to logo Nike? Alebo nahryznuté jablko od Apple? Premýšľal si niekedy, prečo ho môžeš zväčšiť na obrovský billboard a stále vyzerá dokonale ostro, bez jediného rozmazaného pixelu?
TerezaPresne! Za týmto kúzlom sa skrýva vektorová grafika. Nie sú to štvorčeky, ale čistá matematika.
Kapitoly

Vektorová grafika a zlatý rez: Dizajn pre maturantov

Délka: 9 minut

Kapitoly

Prečo logá nestrácajú kvalitu?

Stavebné kamene vektora

Zlatý rez a magické stredy

Jazyk tvarov a línií

Čo sú hypertextové odkazy?

Atribúty a cesty

Čo je to symbol?

Tri typy symbolov

Interaktívne tlačidlá

Zhrnutie a prechod

Čo je živnosť

Druhy živností

Zhrnutie a záver

Přepis

Jakub: Poznáš to logo Nike? Alebo nahryznuté jablko od Apple? Premýšľal si niekedy, prečo ho môžeš zväčšiť na obrovský billboard a stále vyzerá dokonale ostro, bez jediného rozmazaného pixelu?

Tereza: Presne! Za týmto kúzlom sa skrýva vektorová grafika. Nie sú to štvorčeky, ale čistá matematika.

Jakub: A presne o tom sa dnes budeme baviť. Počúvate Studyfi Podcast, kde vám pomáhame zvládnuť maturity. Takže Tereza, ideme na šiestu maturitnú otázku.

Tereza: Presne tak. Zabudnite na pixely, ktoré tvoria fotky. Vektorová grafika používa body, čiary a krivky definované matematickými rovnicami. Predstav si to ako recept pre počítač.

Jakub: Recept? Akože... vezmi jeden bod sem, druhý tam a spoj ich rovnou čiarou?

Tereza: V podstate áno! A keďže je to len matematický predpis, môžeš ten „koláč“ zväčšovať donekonečna a nikdy sa nerozpadne ani nerozmaže. Preto je to ideálne na logá, ilustrácie a typografiu.

Jakub: Dobre, takže základom sú body a čiary. Čo ešte tvorí taký vektorový obrázok?

Tereza: Základným prvkom je bod, definovaný súradnicami x a y. Spojením bodov vzniká línia alebo krivka. A keď tú líniu uzavrieš, dostaneš objekt, napríklad kruh alebo štvorec.

Jakub: A ten objekt potom môžem vyfarbiť?

Tereza: Presne. To, čím ho vyplníš, sa volá výplň, a čiara okolo neho je obrys. Obrysu môžeš meniť hrúbku, farbu, dokonca aj štýl, napríklad na prerušovanú čiaru.

Jakub: Super, to znie celkom logicky. Ale počul som aj o pojmoch ako zlatý rez. To už znie menej matematicky a viac... umelecky.

Tereza: Je to spojenie oboch. Zlatý rez je pomer, približne 1 ku 1,618, ktorý naše oko vníma ako extrémne príjemný a vyvážený. V prírode ho nájdeš všade, od mušlí až po usporiadanie listov na strome.

Jakub: Takže ak chcem peknú kompozíciu, mal by som sa držať tohto pomeru? A čo geometrický a optický stred?

Tereza: Áno. A tie stredy sú skvelý príklad. Geometrický stred je presný matematický stred plochy, tam kde sa krížia uhlopriečky. Ale naše oko vníma ako stred bod trošku vyššie – to je optický stred.

Jakub: Takže keď chcem, aby logo sedelo dokonale v strede, mal by som ho dať kúsok nad ten matematický stred? Moje oči zjavne nie sú kalkulačka.

Tereza: Presne tak! Pôsobí to prirodzenejšie. Na maturite stačí nakresliť obdĺžnik, uhlopriečkami nájsť geometrický stred a bodkou nad ním vyznačiť ten optický.

Jakub: A čo ďalšie kompozičné prvky? Ako napríklad obyčajná čiara?

Tereza: Každá línia má svoj význam a vyvoláva emóciu. Horizontálna línia pôsobí pokojne, ako horizont na mori. Vertikálna je pevná, silná, ako mrakodrap.

Jakub: A diagonálna? Tá asi nebude o pokoji, však?

Tereza: Vôbec nie! Diagonálna línia vytvára napätie, pohyb a dynamiku. Zlomená čiara je chaos a jemná krivka zase harmónia a elegancia.

Jakub: Paráda. Takže toto je taký malý vizuálny slovník. To sa určite zíde nielen na skúške.

Jakub: Okej, takže text už máme naformátovaný... ale webové stránky sú hlavne o prepájaní, však?

Tereza: Presne tak! A na to slúžia hypertextové odkazy, alebo linky. Je to základný prvok, ktorý robí z webu... no, web.

Jakub: A ako to funguje v kóde?

Tereza: Používame značku <a>. Najdôležitejší je atribút href, kam vložíš cieľovú adresu. Napríklad <a href="https://www.google.com">Hľadaj na Google</a>.

Jakub: A môžem ovplyvniť, ako sa ten odkaz otvorí? Nechcem, aby mi ľudia hneď odišli zo stránky.

Tereza: Jasné! Na to je atribút target. Hodnota _blank otvorí odkaz v novej karte prehliadača. To je najčastejšie využitie.

Jakub: Super, takže môžem užívateľov poslať na inú stránku bez toho, aby stratili tú moju. A čo odkazy v rámci môjho webu?

Tereza: Tam používame relatívne cesty. Ak máš v rovnakom priečinku súbor kontakt.html, odkaz bude jednoducho <a href="kontakt.html">Kontakt</a>. Je to oveľa praktickejšie.

Jakub: Rozumiem. Plná adresa pre externé weby, a len názov súboru pre tie moje vlastné. To dáva zmysel. Takže, stránky už vieme prepojiť... čo tak pridať nejaké obrázky?

Jakub: Takže, Tereza, zvládli sme základy kreslenia a časovú os. Ale počul som, že skutočná mágia v Animate sa deje až so symbolmi. Je to pravda?

Tereza: Presne tak, Jakub! Symboly sú absolútny základ. Bez nich by bola práca v Animate ako stavať dom tehlu po tehle bez toho, aby si si ich vopred pripravil.

Jakub: Okej, takže čo presne je ten symbol? Znie to trochu abstraktne.

Tereza: Vôbec to nie je zložité. Predstav si to ako takú digitálnu pečiatku alebo vykrajovačku na cesto. Vytvoríš si jeden objekt, napríklad hviezdu, a uložíš si ju do knižnice ako symbol.

Jakub: A túto hviezdu potom môžem použiť viackrát?

Tereza: Presne! Každé jej použitie na scéne sa volá inštancia. A teraz tá najlepšia časť... ak zmeníš farbu tej pôvodnej hviezdy v knižnici, zmenia sa farby všetkých jej inštancií v celom projekte. Automaticky!

Jakub: Wow, to znie ako obrovská úspora času. A asi aj miesta v súbore, však?

Tereza: Áno, presne. Znižuje to veľkosť súboru a neuveriteľne to zjednodušuje správu animácie. Je to jeden z kľúčových konceptov, prečo je Animate taký efektívny.

Jakub: Super, to dáva zmysel. Existuje len jeden druh symbolu, alebo je ich viac?

Tereza: Sú tri základné typy a každý sa hodí na niečo iné. Máme grafický symbol, filmový klip a tlačidlo.

Jakub: Poďme na to postupne. Čo je grafický symbol?

Tereza: Grafický symbol je taký... poslušný. Jeho animácia je pevne zviazaná s hlavnou časovou osou. Je super na veci ako žmurkajúce oči postavy alebo pohybujúce sa oblaky na pozadí. Proste jednoduché, opakujúce sa animácie.

Jakub: Chápem. A čo ten filmový klip? Ten znie dôležitejšie.

Tereza: To teda je! Filmový klip je hviezda Animate. Je to v podstate animácia v animácii. Má svoju vlastnú, nezávislú časovú os. Prehráva sa dookola bez ohľadu na to, čo sa deje na hlavnej scéne.

Jakub: Takže ak mám napríklad animáciu horiaceho plameňa, použijem filmový klip, aby horel neustále?

Tereza: Perfektný príklad! Presne na to sa používa. Alebo na interaktívne prvky v hrách, pretože naň môžeš viazať aj skripty.

Jakub: A ten tretí typ bolo tlačidlo, však? To je asi celkom jasné.

Tereza: Áno, tlačidlo je špeciálny symbol pre interaktivitu. Má štyri preddefinované stavy: ako vyzerá normálne, keď naň prejdeš myšou, keď ho stlačíš a potom má ešte takzvanú 'Hit' oblasť.

Jakub: Hit oblasť? To znie ako niečo z akčného filmu.

Tereza: Je to v podstate neviditeľná plocha, ktorá definuje, kde sa dá na tlačidlo kliknúť. Takže aj keď máš tlačidlo v tvare hviezdy, nemusíš sa presne trafiť na cíp, aby si ho aktivoval.

Jakub: Takže to tlačidlo má viac stavov ako ja počas skúškového obdobia.

Tereza: Dá sa to tak povedať. Ale vďaka nim je vytváranie navigácie v prezentáciách alebo banneroch hračka.

Jakub: Dobre, skúsme si to zhrnúť. Grafický symbol sa drží hlavnej animácie. Filmový klip si žije vlastným životom a je ideálny pre zložité veci. A tlačidlo... no, tlačidlo čaká na kliknutie.

Tereza: Povedal si to úplne dokonale. Keď si osvojíš tieto tri typy symbolov, otvorí sa ti celý svet možností v Animate.

Jakub: Super, symboly máme teda v malíčku. A to nás pekne privádza k ďalšej dôležitej téme... ako vlastne všetky tie naše nové symboly rozpohybujeme? Poďme sa pozrieť na základy samotnej animácie.

Jakub: Super, takže poďme na našu poslednú tému dnešného dňa – živnostenské podnikanie.

Tereza: Presne tak. Živnosť je asi najbežnejšia forma podnikania u nás. Je to sústavná činnosť, ktorú robíš samostatne, vo vlastnom mene a na vlastnú zodpovednosť s cieľom dosiahnuť zisk.

Jakub: Takže som sám sebe šéfom, ale aj sám za všetko ručím. To znie... dosť zodpovedne.

Tereza: Presne! A nie je živnosť ako živnosť. Máme tri hlavné druhy. Prvá je voľná živnosť, kde nepotrebuješ odbornú spôsobilosť, napríklad upratovacie služby.

Jakub: Okej, to dáva zmysel. A tie ďalšie?

Tereza: Potom je remeselná, kde už potrebuješ výučný list, napríklad ako elektrikár. A nakoniec viazaná, kde sú podmienky ešte prísnejšie, ako napríklad prevádzka autoškoly.

Jakub: Takže si nemôžem len tak otvoriť autoškolu, lebo ma baví šoférovať? Škoda.

Tereza: To veru nie. Inak živnosť vzniká veľmi jednoducho, dňom ohlásenia na živnostenskom úrade. A zaniká už... menej veselo, napríklad smrťou podnikateľa.

Jakub: Výborne. Takže, aby sme to zhrnuli. Dnes sme si prešli od základov podnikania, cez jeho právne formy až po živnosti. Dúfame, že vám to pomohlo.

Tereza: Určite áno. Ďakujeme vám za pozornosť.

Jakub: Majte sa krásne a dopočutia nabudúce pri Studyfi Podcaste!