6 funkcji Adobe XD, które znacznie przyspieszają prototypowanie

Mimo rosnącej konkurencyjności na rynku środowisk do prototypowania produktów cyfrowych, w Webalize, niezmiennie od samego początku korzystamy z pakietu Adobe XD. Przez ten czas XD doczekało się wielu aktualizacji i optymalizacji, a my zdążyliśmy poznać je od podszewki. Dziś chcemy Wam przedstawić szereg przydatnych funkcji i skrótów klawiszowych, które na co dzień ułatwiają nam pracę nad prototypami w XD.

1. Komponenty

Podstawowym ułatwieniem, które znacznie przyspiesza pracę jest możliwość tworzenia komponentów z powtarzających się elementów interfejsu. Komponent składa się z komponentu głównego (master component) i nieograniczonej liczby instancji. Każda zmiana master component’u jest natychmiast widoczna we wszystkich instancjach. Tym sposobem znacznie ograniczamy czas potrzebny na aktualizację globalnych elementów projektowanej strony czy aplikacji, takich jak choćby nawigacja czy ikony. Co więcej, ta funkcjonalność działa również pomiędzy plikami - wystarczy podlinkować assety z pliku, w którym znajduje się master component, a po chwili będziemy mogli tworzyć z niego instancje w lokalnym dokumencie. Dzięki temu możemy tworzyć biblioteki z komponentami na przykład z Design Systemu.

2. Możliwość kopiowania ścieżek bezpośrednio z Adobe Illustrator

O ile XD nie dysponuje rozbudowanymi narzędziami do tworzenia ścieżek - jakie znamy chociażby z Illustratora - o tyle nie jest to problematyczne dzięki dobrej integracji obu programów. Jeśli chcemy przenieść ilustrację wektorową czy ikonę wykonaną z pliku .ai wystarczy ją zgrupować (Ctrl + G), skopiować w illustratorze (Ctrl + C) i wkleić do pliku XD (Ctrl + V). Łatwo, szybko i bez dodatkowych okien dialogowych!

3. Szybkie przełączanie między trybami pracy

Podczas rozbudowywania prototypu zdarza się, że chcemy zweryfikować czy dwa określone ekrany lub elementy są już podpięte do reszty makiety. Do niedawna mogliśmy to zrobić jedynie przełączając się myszą pomiędzy trybami (Design/Develop/Share) w lewym górnym rogu ekranu, co bywało niewygodne i nieergonomiczne. Od sierpniowej aktualizacji możemy przełączać tryb pracy również przy pomocy skrótu klawiszowego. Alt + 1 odpowiada za tryb Design, Alt + 2 za Prototype, a Alt + 3 za tryb Share. Zmiana pozornie niewielka, ale znacznie poprawia wydajność pracy.

4. Łatwe wyrównanie obiektów

To za co naprawdę lubię Adobe XD to jego proste i przyjemne w obsłudze narzędzie do wyrównywania i rozmieszczania obiektów. Chcesz wyrównać nagłówek do środka obszaru roboczego? Zaznaczasz nagłówek, Shift + C, Shift + M i po sprawie. Podobnie proste jest rozmieszczanie obiektów horyzontalnie czy wertykalnie, co znacznie ułatwia porządkowanie list, footerów czy headerów.

5. Dopasowanie wielkości pola tekstowego

Pracując z tekstami akaptiowymi w Illustratorze czy Indesignie często łapiemy się na manualnym dopasowywaniu pola tekstowego do zmiennej długości tekstu. Adobe XD wyszło naprzeciw temu zwyczajowi użytkowników - wystarczy dwukrotnie kliknąć dolny uchwyt pola tekstowego, a jego wielkość automatycznie dopasuje się do zawieranego tekstu. Nigdy więcej uciętych tekstów akapitowych!

6. Szeroki wybór pluginów

Dzięki zaangażowanej społeczności (oraz inwestycji Adobe), w XD mamy do dyspozycji wiele wtyczek poszerzających możliwości środowiska. Zastosowanie wewnętrznej biblioteki sprawiło, że ich instalacja zajmuje nie więcej niż kilkadziesiąt sekund, a późniejsza aktualizacja jest równie bezbolesna. Chcąc przyspieszyć tworzenie prototypów w XD, szczególnie warto zwrócić uwagę na wtyczki takie jak “Icons 4 Design”, “PhotoSplash 2” czy “UI Faces”. Korzystanie z wymienionych ułatwień i skrótów w XD, pozwala nam znacznie przyspieszyć prototypowanie, a to przekłada się na szybsze wdrożenia i efektywniejszy rozwój produktu. Zastanawiasz się nad korzystaniem z Adobe XD? Chcesz dowiedzieć się jak usprawnić prototypowanie w Twojej firmie? Napisz do nas na hello@webalize.me, lub skontaktuj się wypełniając formularz - bardzo chętnie podzielimy się swoją wiedzą i podyskutujemy o wytwarzaniu produktów cyfrowych :)