Kreslicí plochy v Adobe XD: Vytváření a přizpůsobení

Vytvoření artboardu v Adobe XD je prvním krokem v rozvoji tvých návrhů. Ať už se jedná o responzivní webové stránky, aplikace nebo prototypy – chytré uspořádání artboardů je rozhodující pro pracovní postup. V této příručce se dozvíš, jak vytvářet a optimalizovat artboardy pro různé rozlišení a zařízení. Tak si udržíš přehled o svých projektech.

Nejdůležitější poznatky

• Nakresli artboardy pro různá zařízení a rozlišení.
• Pečlivě pojmenuj své artboardy a objekty, abys udržel přehled.
• Zohledni hustotu pixelů pro Retina displeje, aby byla maximální kvalita obrazu.
• Využívej klávesové zkratky pro rychlejší a produktivnější práci.

Návod krok za krokem

Začátek: Vytvoření vlastního artboardu

Aby ses mohl pustit do práce v Adobe XD, musíš vytvořit svůj první artboard. Najdeš panel artboardů, ke kterému se dostaneš přes malou ikonu v dolním panelu. Zde můžeš spravovat všechny artboardy, které máš ve svém projektu. Nyní použij dvojitý klik pro přejmenování svého prvního artboardu, např. na „Domov“. To ti pomůže udržet si přehled.

Nové vytváření artboardu

Chceš přidat nový artboard? Použij klávesovou zkratku „A“ pro nástroj artboardu. Kliknutím na něj se vytvoří nový artboard. Opětovným kliknutím na artboard ho můžeš také přejmenovat, například na „Funkce“. Dbej na to, aby sis používal různé velikosti pro své artboardy, abys dosáhl flexibility ve svém designu.

Přizpůsobení artboardu

Artboardy nabízejí mnoho možností přizpůsobení. Klikni na příslušný artboard a přepni v panelu na nastavení. Můžeš snadno změnit orientaci z horizontální na vertikální. To ti umožní rychle simulovat, jak bude tvůj design vypadat na různých zařízeních, jako jsou tablety nebo smartphony. Zejména u webdesignu je důležité vytvářet responzivní designy.

Zvětšení a úprava velikosti

Nyní můžeš změnit velikost svého artboardu. Stačí jednoduše táhnout úchyt dolů a hned uvidíš novou oblast, která se odpovídajícím způsobem změní. Přes tečkovanou čáru můžeš přečíst, které části tvé stránky jsou viditelné v aktuálním viewportu. Části, které překračují tento rámec, je potřeba posunout.

Přizpůsobení barev a mřížky

Přejdi nyní k nastavení barev a definuj barvy, které potřebuješ. Můžeš zadat hexadecimální kódy nebo pracovat se šoupátkem. Dále je také možnost aktivovat mřížku pro tvé rozvržení, což ti pomůže přesně umístit prvky. Tyto nástroje jsou nesmírně užitečné pro strukturování tvých designů a jejich estetické zpracování.

Nastavení pro různá zařízení

Vytvoř alespoň tři různé artboardy pro běžné obrazové formáty: desktop, tablet a smartphone. Měl bys mít na paměti, že tvé designy by měly na všech zařízeních dobře fungovat. Nejčastější rozlišení pro desktop je 1366 pixelů, ale můžeš také použít 1920 pixelů (Full HD). Pro tablet můžeš použít jako šablonu iPadu nebo Surface a poté přejít na rozměr pro smartphone, jako je iPhone 10.

Zohlednění hustoty pixelů

Jedním z detailů, které je při navrhování třeba zvážit, jsou displeje s vysokým rozlišením, které se používají v mnoha moderních zařízeních. Tyto displeje mají vysokou hustotu pixelů, což znamená, že kvalita obrazu je velmi důležitá. Když tedy vložíš grafiky nebo obrázky z Photoshopu do svého projektu, dbej na to, jaké rozlišení tyto obrázky mají. Pro Retina displeje musíš minimálně zdvojnásobit velikost obrázku, abys dosáhl ideální kvality.

Uspořádání artboardů

S Adobe XD máš možnost snadno přeuspořádat své artboardy. To je užitečné, když chceš získat lepší přehled. Pomocí klávesy zpět nebo odstraňování můžeš smazat nežádoucí artboardy. Alternativně můžeš pomocí klávesové zkratky „Command + D“ vytvořit duplicitu artboardu, na jejímž základě pak můžeš vyvíjet nové návrhy.

Optimalizace pracovního prostoru

Použij klávesu mezerník, aby ses aktivoval nástroj pro ruční ovládání a mohl se volně pohybovat ve svém pracovním prostoru. To je obzvlášť užitečné, pokud máš na svém artboardu více prvků. Dvojitým kliknutím na objekty se dostaneš do jejich podrobného zobrazení a můžeš je dále upravit. Dbej na to, aby byly všechny tvé objekty jasně pojmenovány a pečlivě umístěny uvnitř artboardů, abys mohl v budoucnu snadněji pracovat.

Souhrn – Artboardy v Adobe XD: Krok za krokem k efektivnímu designu

V této příručce jsi se naučil, jak vytvářet a přizpůsobovat artboardy v Adobe XD. Víš, jak důležité je je správně pojmenovávat a upravovat, abys udržel přehled o svém projektu.