Nechce sa vám učiť Photoshop/Illustrator, prípadne Sketch? Alebo v práci nestíhate sypať zo seba jeden web za druhým? Hľadáte niečo nové a rýchle, plne zamerané na dizajn webstránok a mobilných appiek? Niečo by sa našlo. Adobe totiž v októbri 2017 vypustil z beta verzie svoj nový počin, založený na vektorovom dizajne a wire- framingu, ktorý mnohým vyčaril spokojný úsmev na tvári. A stále ten úsmev trvá. Vývojári aktívne komunikujú s komunitou a každý mesiac vydávajú update so zaujímavými novinkami.

Oh a je free.

Program je vytvorený tak, aby ste mohli pracovať čo najrýchlejšie a nezdržiavali sa detailmi.

Pri spustení je možné si vybrať, pre akú platformu chcete robiť dizajn – mobil, tablet, desktop, alebo si zadáte vlastné rozmery.

V dokumente je samozrejmosťou možnosť mať viacero artboardov, na ktorých si vieme nastaviť layout grid podľa potreby.

Práca s rozložením objektov na stránke je naozaj jednoduchá. Okrem klasických možností zarovnania a rozmiestnenia tu nájdeme aj automatické zobrazenie rozostupov medzi jednotlivými objektmi a pri stlačení “alt” nám ukáže rozostupy okolo označeného objektu.

Paleta nástrojov vyzerá oproti iným Adobe programom prázdna, no po pár projektoch zistíte, že to nie je koniec sveta, plus, stále je šanca, že sa niečo pridá o mesiac. Okno, ktoré mi robí hádam najväčšiu radosť v XD, je asi okno „Assets“. Tlačidlá a ikony, ktoré sa nachádzajú na niekoľkých artboardoch sa teraz dajú upravovať spoločne, čo ušetrí kopu času.

Pracujete na foto galérii alebo kontaktoch, ktoré potrebujete multiplikovať?
Zabudnite na klávesu “alt” a ťahanie alebo na klasické “ctrl c+v/ctrl+d”. Stačí aktivovať “repeat grid” v pravom hornom rohu. Potrebujete zmeniť napríklad obrázky? Všetky si ich označte a hoďte do prvého objektu v “repeat grid”, program urobí mágiu za vás, aktualizuje ich naprieč celým “repeat grid”.

Zdroj: Adobe.com

Toľko v skratke k dizajn časti, Adobe XD tu ale nekončí. Vzhľad webu by sme mali a radi

by sme si pozreli ako približne by jednotlivé podstránky fungovali. Dámy a páni, preklikávame na okno s názvom „Prototype“.

Zdroj: Adobe.com

Prepájanie elementov funguje štýlom “drag-and-drop” = zvolíte si button a prepojíte ho na požadovaný cieľový artboard. Tiež si môžete vybrať medzi niekoľkými efektmi prechodu. Kedykoľvek je možné vrátiť sa k dizajnovaniu a akákoľvek zmena bude uložená a aktualizovaná aj v Prototype. Stále všetko v jednom programe.

Takto pripravený dokument je možné zavesiť na Creative Cloud, kde si ho môže pozrieť napríklad klient a rovno do neho vpisovať postrehy a komentáre.

Dúfam, že čoskoro pridajú viac možností k formátovaniu textu a rozšíria limity úprav objektov, ako aj možnosť nastavenia si vlastných klávesových skratiek a podobných detailov.

Okrem týchto chybičiek krásy mne osobne program sadol a práca v ňom je naozaj rýchla a pohodlná.

Čo si o ňom myslíte vy? Dáte mu šancu alebo už s ním máte skúsenosť?

P.S.: Na webe je možné nájsť už hotové wireframy, takže veci ako tlačidlá, ikony a rôzne elementy UI nemusíte robiť, stačí si ich stiahnuť a upraviť. Linky na tieto stránky má samotný program v menu.

Link: https://www.adobe.com/sk/products/xd.html