Ahoj všichni, jmenuji se Roma, v designu už více než 5 let, dnes pracuji jako UI/UX Designer a také učím na počítačová škola Hillel.
Představte si, že chcete nakreslit malý obrázek, řekněme ostrov, na něm vyroste palma a někde bude slunce. Zatím je vše ve vašich představách. Dále hledáte materiály pro kreslení, před vámi bude krabička tužek, fixek a barev.
Teoreticky můžete nakreslit obrázek libovolným z těchto tří objektů, ale každý má své vlastní výhody a nevýhody – tužky se snadno kombinují, neúspěšný výsledek lze odstranit gumou; fixy dávají bohatou barvu, ale při míchání hlavních tahů lze získat nežádoucí místa a samozřejmě nemůžete nic opravit gumou; barvy vyžadují hodně přípravy, je zapotřebí šálek vody, je lepší zafixovat papír páskou, aby při sušení nenapuchl, v arzenálu jsou žádoucí štětce různých tloušťek, musíte zajistit pravidelné oplachování štětec a vyměňte vodu, ale můžete namíchat barvy, abyste získali vhodnější odstín.
To vše jsem chtěl porovnat výše uvedenou sadu nástrojů s našimi grafickými editory. Každý editor bude mít své vlastní výhody a nevýhody. Na pořadu jednání budu zvažovat tři známé grafické editory – Adobe Photoshop, Adobe Illustrator a Figma.
Adobe Photoshop
Adobe je společnost založená v roce 1982. Poskytla nám spoustu grafických editorů a užitečných služeb. Jedním z nejznámějších je samozřejmě Photoshop.
Původně byl vytvořen k úpravám fotografií – odstranění nedokonalostí fotografií, obnovení starých obrázků, přidání umělého osvětlení atd. S aktualizacemi byly přidány nové nástroje, díky nimž již bylo možné sbírat kompozici od nuly. Designér musel shromáždit co nejvíce různých kousků z různých fotografií a dát je dohromady, aby vytvořil celkový obrázek.
Myslím, že tento příklad dobře ukazuje, jak můžete sbírat různé kousky z velké sady fotografií a obrázků, a je velmi zajímavé je shromáždit.
Photoshop není jen o shromažďování a vylepšování fotografií. Program má výkonné funkce pro simulaci skutečných štětců, pomocí kterých můžete kreslit krásné obrázky a ilustrace.
Podělím se o další zajímavý řešení, které nám Photoshop poskytl.
Ve Photoshopu můžete vytvořit maketu – použití designu na stávající médium. Toto je jen ukázka toho, jak bude vaše práce vypadat ve víceméně reálných podmínkách. Například jste vytvořili skvělý design pro balení ovocných šťáv a chcete vidět, jak to bude vypadat na samotném obalu. Stáhněte si požadovaný soubor a použijte náš design, výsledkem je:
Za zmínku také stojí, že najednou Photoshop byly nakresleny návrhy budoucích webů. A bylo to vyčerpávající. Na některých místech je webový design velmi vybíravý, pokud jde o velikosti a okraje, a bylo zapotřebí hodně vrtat, než se změnily některé podrobnosti v rozvržení.
Naštěstí doba již naštěstí uplynula a nyní existují vhodnější nástroje k tomu)
NEVÝHODY
Skoro jsem na ně zapomněl)
Program je poměrně náročný, často se změnami v rozložení můžete mírně zpomalit výkon. Rozhraní nevypadá moc přátelsky, je tu spousta panelů, každý z nich má o milion dalších nastavení, a pokud se něco pokazí, můžete si představit tuto rostoucí hrůzu a nervy)
V našem kurzu Základy designu se podrobně podíváme na to, jak pracovat ve Photoshopu, podíváme se na několik technik retušování fotografií, zvážíme několik efektů a samozřejmě začneme uvolňovat svůj tvůrčí potenciál v nezávislých projektech.
BOTTOM LINE
Photoshop je vhodný pro lidi s kreativním přístupem, kteří chtějí zlepšit kvalitu fotografií, vytvářet skvělé kompozice a kreslit ilustrace.
Adobe Illustrator
Illustrator, nebo jak se říká v této oblasti, lustr, určený pro kreslení vektorových ilustrací, vektorových objektů, log, přípravu předtiskové verze, technických diagramů a dalších zdrojů.
Pro pochopení pojďme zjistit, co je vektorová grafika.
Existují 2 typy grafiky – vektorová a rastrová. Rastrová grafika jsou všechny druhy fotografií a obrázků stažených z Internetu, rastrová grafika je obvykle ve formátu .png a .jpeg. Rastrová grafika je tvořena čtverci a tyto čtverce jsou vyplněny určitou barvou. Proto pokud zvětšíme bitmapovou fotografii, zjistíme, že se na fotografii objevují nežádoucí kroky.
Uveďme si příklad – máte fotoaparát s rozlišením 800×600 pixelů, pořídíte fotografii, na které si každý z pixelů zachovává určitou barvu. Pokud matematicky, 800krát 600 = 480 000. To znamená, že v našem rámci je 480 000 čtverců, z nichž každý má svou vlastní barvu.
Nyní o vektorové grafice. Vektorový obrázek se skládá z kotevních bodů a spojovacích čar mezi nimi, které jsou fixovány matematickým modelem. Díky tomuto přístupu můžeme logo zvětšit z 2×2 cm na velikost fotbalového hřiště bez ztráty kvality.
Podívejme se na příklad, aby bylo jasnější:
Na první pohled není mezi obrázky žádný rozdíl, ale je to až do chvíle, než zvýšíme rozlišení:
Po Photoshopu je rozhraní Illustratoru intuitivní, dodržuje obecnou logiku, ale vzhledem k tomu, že budeme kreslit vektorovou grafiku, zde funguje technika provádění a všechny různé efekty trochu jinak.
Co potěší mě místní funkce, existuje výkonná sada nástrojů s nepředvídatelnými výsledky. Výsledkem je často dělo, rasa, karton!
Podívejme se, jaké zajímavé věci dokážeme v Illustratoru nakreslit:
NEVÝHODY
Program je stále náročný a rozhraní je stále nepřátelské. Tento program je zahrnut v placeném předplatném od společnosti Adobe.
BOTTOM LINE
Illustrator je vhodný také pro kreativní lidi, kteří chtějí uplatnit své odvážné nápady. V tomto programu je vhodné kreslit technické diagramy a všechny druhy plánů, opět kvůli konstrukci objektů – jsou zde vektorové, pamatujete?)
Figma
A celý tento kruh uzavírá Figmu. Jeho vydání proběhlo v září 2016, ale během své existence společnost Figma obrátila veškerou práci v grafických editorech a nabídla pohodlnější způsoby implementace.
Figma není jen grafický editor, ale také prototypový program. Nebojte se tohoto slova, protože si zachovalo společný základ s Photoshopem nebo Illustratorem. Figma je navržena tak, aby usnadnila práci webovým a front-endovým návrhářům. Jeho hlavní výhodou je, že je založen na cloudu – stačí otevřít prohlížeč, přihlásit se ke svému účtu a to je vše, už jste v samotném editoru, cloudové úložiště načte všechny vaše soubory a Figma je také zdarma a podporuje multitasking, což znamená, že v jednom projektu může pracovat více než 10 lidí současně a je to šíleně zábavné)
Ale jaký je to prototyp?
Prototypování je speciální prostředí, ve kterém můžeme dynamicky prezentovat svou práci. Představme si, že máme mobilní aplikaci. Nakreslili jsme obrovskou škálu stránek, abychom ukázali, kde se nachází domovská stránka, kategorie produktů, produktová karta, nákupní košík atd.
Prohlížení více než 30 obrázků není příliš zábavné, je mnohem zábavnější nastavte nezbytné odkazy mezi těmito stránkami, aby tlačítko Koupit položku odeslalo položku do košíku. Po navázání těchto spojení sestavíme prototyp a podíváme se na naši aplikaci, jako by již fungovala.
Zde je odkaz na hotový prototyp, abychom zjistili, jak to funguje: Radar pro iOS.
Obrázky je těžké sdělit, co lze udělat zde:
NEVÝHODY
Ale oni Zdá se, že není)) No, vážně)
Pokud jde o Photoshop nebo Illustrator, Figma ztrácí pouze v sadě funkcí, bohužel Figma nemá žádnou jedinečnou mechaniku.
CELKEM
Figma je perfektní každý designér, ať už je to začínající student nebo ctihodný stoupenec.
Figma je velmi přátelský vzhled, všechna tlačítka jsou vhodně umístěna, můžete vidět, že byla vyvinuta s duše.
