1. diel - Adobe XD - Úvod

Vitajte u prvej lekcie z online kurzu Adobe XD, ktorý je určený predovšetkým pre úplných začiatočníkov. Okrem základov sa však v priebehu kurzu budeme učiť využívať mnoho pokročilých funkcií, a tak tento kurz, najmä jeho druhá polovica, môže byť prínosný aj pre stredne pokročilých používateľov. V dnešnej lekcii si Adobe XD najprv predstavíme, ďalej vykonáme inštaláciu aplikácie a v poslednej časti lekcie sa pozrieme na jeho alternatívy.

Motivácia

Po absolvovaní celého kurzu budete schopní navrhovať a prototypové webové či mobilné aplikácie a mnohé ďalšie produkty.

O Adobe XD

Adobe XD (Experience Design) je multiplatformový vektorový editor určený UX / UI dizajnérom k navrhovaniu a prototypovania webových stránok, mobilných aplikácií a mnohých ďalších produktov. Aplikácia je veľmi jednoduchá na ovládanie a zároveň ponúka veľké množstvo užitočných funkcií, ktoré umožňujú vytvárať profesionálne návrhy veľmi rýchlo a efektívne. Adobe XD bol vyvinutý spoločnosťou Adobe Inc. ako odpoveď na veľmi podobnú aplikáciu Sketch, ktorá je dostupná len pre operačný systém MacOS.

Ďalšie produkty od Adobe

Okrem aplikácie Adobe XD ponúka Adobe ešte niekoľko ďalších súvisiacich produktov.

Adobe Photoshop

Pravdepodobne najznámejším produktom je Adobe Photoshop. Jedná sa o grafický editor, ktorý je už dlhé roky vyvíjaný a publikovaný už spomínanú americkou spoločnosťou. Adobe Photoshop sa stal svetovým štandardom v oblasti spracovania digitálnej grafiky, ktorý ponúka svojim užívateľom neobmedzené možnosti vďaka množstvu nástrojov a stiahnuteľných pluginov. Na tento program z balíčka Adobe na webe takisto existuje online kurz a nájdete ho pod nasledujúcim odkazom.

Adobe Illustrator

Ďalším veľmi dôležitým produktom, a to predovšetkým pre prácu s vektorovou grafikou, je Adobe Illustrator. Ten obsahuje veľmi prepracované kresliace nástroje, vďaka ktorým ste schopní vytvárať nádherné vektorové kresby. Adobe Illustrator je tak skvelým pomocníkom pri vytváraní knižných ilustrácií, firemných log, obalov produktov, bannerov či návrhu webových stránok. Základný kurz pre Illustrator je potom k dispozícii tu.

Získanie a inštalácia Adobe XD

Oproti iným produktom od Adobe je Adobe XD dostupný zadarmo, a to v rámci plánu Starter. Bohužiaľ sme tu limitovaní iba na jeden aktívny zdieľaný návrh a jeden zdieľaný prototyp. Pre tento kurz nám však tento bezplatný plán bude stačiť. Ak by sme ale nechceli byť limitovaní, môžeme prejsť na plán Single App, ktorý nás bude stáť približne 300 Sk mesačne, a okrem neobmedzeného prístupu získame tiež 100 GB cloudového úložiska pre naše projekty. Ďalšou možnosťou, ako získať neobmedzený prístup ku všetkým funkciám, je členstvo v službe Creative Cloud, ktoré je už o niečo drahšie, ale mimo Adobe XD získame prístup aj k ďalším 20 aplikáciám od Adobe, ako napríklad Photoshop, Illustrator a tak ďalej.

Systémové požiadavky

Pre bezproblémový beh aplikácie Adobe XD musíte spĺňať aspoň nasledujúce minimálne systémové požiadavky:

• Viacjadrový procesor Intel alebo AMD s rýchlosťou 2 GHz alebo vyššou
• Microsoft Windows 10 s aktualizáciou Fall Creators Update (64 bit)
• 4 GB pamäte RAM alebo viac
• 2 GB voľného miesta na pevnom disku
• Displej s minimálnym rozlíšením 1280 x 800
• Podpora Direct 3 DDI 11 alebo 12

Inštalácia

Na oficiálnych stránkach produktu Adobe XD si vyberieme plán Starter a následne prevedieme stiahnutie aplikácie. Po spustení inštalátora sa vedľa inštalácie aplikácie Adobe XD vykoná aj inštalácia aplikácie Creative Cloud, do ktorej sa po slez prihlásime. Ak svoj Adobe účet ešte nemáte vytvorený, môžete tak v tejto aplikácie bezplatne urobiť.

Alternatívy Adobe XD

Tento kurz je písaný pre Adobe XD, však môžete použiť jednu z alternatív uvedených nižšie a mali by ste ho byť schopní bez väčších ťažkostí absolvovať úplne rovnako.

Figma

Jednou z alternatív Adobe XD môže byť napríklad Figma. Ide o primárne webový, vektorový editor a prototypovací nástroj veľmi podobný Adobe XD. Figma sa však zameriava najmä na spoluprácu v reálnom čase v cloude, čím nám odpadá nutnosť komplikovane zdieľať jednotlivé súbory projektu medzi členmi tímu. K dispozícii na stiahnutie je aj aplikácia pre Windows a MacOS, ktorá obsahuje mnoho funkcií z webovej verzie a umožňuje tak na projektoch pracovať aj bez pripojenia k internetu. Figma v súčasnosti tiež ponúka plán Starter, ktorý má isté obmedzenia, ale je úplne zadarmo. Podobne ako u Adobe XD si potom môžeme zakúpiť plán Proffesional za 300 Sk mesačne, ktorý nás nebude nijako limitovať.

Sketch

Ďalšou alternatívou je vektorový grafický editor Sketch, ktorý je však dostupný len pre zariadenia s operačným systémom MacOS. Sketch má veľmi intuitívne rozhranie a taktiež nám ponúka mnoho funkcií pre navrhovanie, prototypovania a spoluprácu na projektoch. Doživotná licencie tejto aplikácie stojí bezmála 2 400 Sk. Možnosť ukladať projekty do cloudu a získavať aktualizácie máme však len po dobu jedného roka od zakúpenia. Potom si musíme licenciu za 1 900 Sk obnoviť na ďalší rok, pretože v opačnom prípade o tieto funkcie prídeme.

Prvé spustenie a domovská obrazovka

Pri spustení aplikácie sa ocitneme na domovskej obrazovke. Tá nám ponúkne informácie o nových funkciách, tipy a triky, výukový program či zoznam dostupných pluginov a UI kitov, ktoré si môžeme stiahnuť a nainštalovať. Ďalej tu nájdeme dokumenty uložené v cloude, dokumenty zdieľané inými užívateľmi s nami a v neposlednom rade tiež zoznam našich nedávnych dokumentov. Uprostred domovskej obrazovky si môžeme vybrať veľkosť našej artboard, ktorá predstavuje webovú stránku alebo obrazovku aplikácie, ktorú chceme navrhovať. Domovská obrazovka sa nám zobrazí vždy pri vytváraní nového dokumentu alebo pri kliknutí na tlačidlo, ktoré sa nachádza v ľavom hornom rohu okna aplikácie.

To je pre dnešné lekciu všetko. V budúcej lekcii, Adobe XD - Rozhranie aplikácie , sa zoznámime s pracovnou plochou, režimy aplikácie, panelom nástrojov a panelom vlastností.