Lekce 14 - Adobe XD - Rady a tipy co dál + klávesové zkratky

Ještě předtím, než se pustíme do klávesových zkratek v Adobe XD, řekneme si v pár větách, kde hledat inspiraci na Adobe XD, jak využít propojení programů od Adobe a kde najdeme moderní webové stránky, které mohou sloužit, jako naše šablona pro tvorbu. Často víme, jak určitý software používat, ale nemáme v ten moment nápad na tvorbu. Proto je třeba se inspirovat od těch nejlepších, případě od těch, kteří jsou hodnocení jako nejlepší.

Kde hledat rady a tipy pro Adobe XD

Jako první se budeme zabývat Adobe XD. Tento kurz Adobe XD nás měl provést od úplných základů, až po některé pokročilejší metody práce v Adobe XD. Ukázali jsme si např. jak si vytvořit funkční "carousel" z obrázků a prezentovat naše portfolio, jak vytvořit složitější prototyp typu překrytí textu, jak si vytvořit login stránky pomocí pluginu atd. Zkrátka bylo toho dost a mohlo by nám to v naší tvorbě stačit.

Základní informace najdeme na oficiálních stránkách Adobe XD, které nám pomůžou s prvotním nastavením Adobe XD, ale třeba i designem, tvorbou prototypů atd. Manuál je v angličtině, proto je potřeba umět jazyk nebo si jednotlivé tipy přeložit (případně i přeložit pomocí nástroje celou stránku).

Je potřeba neustále zmiňovat neuvěřitelné možnosti, které nám Adobe díky propojení všech programů nabízí. Co si vytvoříme v Ilustrátoru, Photoshopu, ale i InDesignu si můžeme lehce nakopírovat nebo otevřít v XD. Skvělá možnost je vytvářet si např. i animace v Adobe After Effects, případně Animate a přenést si je do Adobe XD. Pokud vlastníme více programů např. v rámci Adobe Creative Cloud, určitě je doporučuji využívat na maximum, protože takhle můžeme vytvořit opravdu poutavý web díky vlastní úpravě obrázků, ikon atd.

Proto doporučuji shlédnout další kurzy zaměřené na Adobe Photoshop, Adobe Illustrator nebo Adobe InDesign.

Pokud se v lekcích Adobe XD nebo na chystaných dalších Adobe kurzech na něčem zaseknete, napište mi zprávu a já vám rád ukážu tu správnou cestu, případně i poradím s něčím složitějším.

Kde hledat inspiraci na atraktivních webech

Dále je třeba se podívat, kde čerpat inspiraci. Ukážeme si stránky na moderní weby, které dnes fungují a jsou designově atraktivní. Ukážeme si pár odkazů a tipů, kde hledat vhodné stránky.

Úplně nejlepší je samozřejmě sledovat ty nejúspěšnější. Pokud jsme však začátečníci, bude nám nějakou dobu trvat, než se k podobnému designu webů alespoň přiblížíme. Můžeme však zde objevit něco, na co bychom normálně nepřišli. Nepředpokládám, že budeme vytvářet úplné kopie úspěšných webů, ale vezměme si z toho vždy to, co nás nejvíce zaujme a co bude pro náš jedinečný navržený web typické.

Já osobně rád čerpám ze stránky webtop100 a z kategorie firemních webů. Jsou zde opravdu špičkové weby, které soutěží v této prestižní soutěži. Například v roce 2021 vyhrály tuto soutěž www stránky Bernardu, ale i třeba taková Česká zbrojovka má velice povedený a mně osobně nejsympatičtější web. Záleží samozřejmě na vkusu. Držel bych se ovšem nejnovějších trendů ohledně tvorby webů.

Bernard web

Česká zbrojovka web

Pokud hledáme další inspiraci, já osobně mám rád blog od Miowebu, kde najdeme např. článek zaměřený na 8 trendů webdesignu, nebo se zde můžeme podívat na výběr některých šablon, které použili pro tvorbu webů.

Klávesové zkratky v Adobe XD

Podobně jako u jiných programů od Adobe i v XDčku si můžeme ulehčit práci na projektech pomocí velkého množství klávesových zkratek. Ty nám ulehčí a urychlí práci s programem, proto je doporučuji používat.

Při použití klávesových zkratek vše vypadá lehce a efektivně, i když se podíváme na jakákoliv instruktážní videa k programům.

Proto se je pojďme naučit. Můžeme je najít jak v této lekci, tak i v přiloženém souboru, kde jsme je nachystali samozřejmě v programu Adobe XD. Můžeme přiložený soubor zkratek použít i jako šablonu pro jinou tvorbu 🙂

Zkratky levý panel

Zkratky edit

Zkratky object

Zkratky view

Samozřejmě se nejedná o všechny klávesové zkratky, ale jen ty, co se mi nejvíce hodili při tvorbě a nejvíce jsem používal. Čím více projektů budeme v Adobe XD dělat, tím lépe nám jejich používání samozřejmě půjde. 😇

V následujícím cvičení, Řešené úlohy k 13.-14. lekci Adobe XD, si procvičíme nabyté zkušenosti z předchozích lekcí.

Měl jsi s čímkoli problém? Stáhni si vzorovou aplikaci níže a porovnej ji se svým projektem, chybu tak snadno najdeš.