Dzisiaj dla odmiany narzędzie dobrze mi znane, dostępne na różne platformy – Axure proszę państwa, to program, który znacie na pewno choćby ze słyszenia. A jak nie ze słyszenia, to z widzenia, bo to jeden z najczęściej pojawiających się programów na moim Instagramie.
To taki klasyk dedykowany osobom, które muszą zamakietować stronę lub aplikację, więc możecie spotkać się z wymaganiem jego znajomości na niektórych stanowiskach (zwłaszcza tych z UX w nazwie). I o ile zawsze mówię, że nauka nowych programów jest dość intuicyjna i szybka, tak w przypadku Axure możecie potrzebować chwili czasu na zaznajomienie się z niektórymi elementami.
Axure to program przede wszystkim do makietowania, prototypowania, mający jednak na tyle rozbudowane opcje związane z grafiką, że można w nim stworzyć prosty interfejs graficzny. No ale zaczynajmy.
Pierwsze wrażenie
Odpalając Axure możemy odnieść wrażenie takiego… oldskólowego programu (a przeszedł niedawno odświeżenie). Konstrukcja interfejsu jest jednak dość standardowa. Na górze mamy pasek często używanych opcji (który możemy sobie dostosować). Po lewej kartę stron, bibliotekę elementów (kształty, ikony i widgety) i mastery (ale o nich później). Po prawej natomiast okno właściwości, notatek, interakcji oraz listę warstw aktualnie otwartej strony.
Na środku mamy nasz obszar roboczy, czyli stronę, na której z reguły umieszcza się jeden ekran. Co ciekawe – na obszar roboczy przeciągamy elementy i je edytujemy, a nie „rysujemy” – chwilę więc zajmuje zanim się przyzwyczaimy do takiej metody pracy.
Architektura, flow, makieta
Axure jest super narzędziem na etap „po szkicowaniu”. Jeżeli mamy już opracowane koncepcje architektury informacji i user flows i musimy przygotować to do dokumentacji (czyli często przenieść szkice i pomysły na czytelniejszą formę), ten program świetnie się do tego nadaje. Przygotowując diagramy przypadków użycia możemy wykorzystać gotowe elementy z biblioteki, a także opisać je wykorzystując tzw. Notes. Notes to miejsce, w którym… tak, możemy dodawać notatki i kolejne, własne pola – na przykład opisy scenariuszy użycia. Makietując ekrany zlinkujecie je bez problemu z architekturą i flowami, dzięki czemu duża część dokumentacji może być zawsze pod ręką.
Co więcej, w Axure mamy możliwość wygenerowania dokumentacji w Wordzie. Wystarczy wybrać, które elementy chcemy przenieść do dokumentu (na przykład zawartości stron i notatek). Na tej podstawie otrzymujemy szablon gotowy do edycji, z wgraną zawartością. Z reguły nie korzystam z tej funkcji, bo rzadko potrzebuję tak sformalizowanej dokumentacji, ale zdarzało mi się pracować właśnie z taką axurową dokumentacją nie raz.
Obszerna biblioteka elementów
W związku z tym, że flow pracy polega na przeciąganiu elementów i ich stylowaniu, biblioteka dostępnych elementów jest całkiem rozbudowana. W najczęściej używanych elementach znajdziemy przyciski, prostokąty, koła, placeholdery, nagłówki, bloki tekstów, linie, hot spoty czy panele dynamiczne. Do tego dochodzą elementy przydatne do opisu makiet jak sticky notes, strzałki, markery, screeny ekranów i obszerny zbiór ikon. Do tego oczywiście możemy dorzucać swoje grafiki importując je do programu. Taki zapas materiałów wystarcza do codziennej pracy nad makietami.
Mastery i panele dynamiczne
Dwie rzeczy, które wyróżniają Axure spośród narzędzi, które recenzowałam do tej pory to panele dynamiczne i mastery. Zacznijmy od paneli. To takie obiekty, które mogą składać się z wielu elementów w ramach, których podpiąć możemy interakcje. Brzmi strasznie?
W pracy z panelami dynamicznymi opieramy się na stanach – to takie warstwy – ale jednocześnie możemy widzieć tylko jeden stan panelu. Ma to zastosowanie wszędzie tam, gdzie do czynienia będziemy mieć z elementami o dynamicznej zawartości – listy produktów, listy wpisów blogowych, galerie zdjęć, slidery – bo tę zawartość możemy właśnie zmieniać stanami.
Wyobraźcie sobie slider, który ma kilka zdjęć, teksty i strzałki do poruszania się między slajdami. Te slajdy rozłożymy właśnie na stanach, a do strzałek podepniemy interakcję, która będzie przepinać nas między slajdami. Taki panel dynamiczny możemy umieścić w kilku miejscach na stronie i w razie potrzeby zmian, dokonujemy ich tylko w jednym miejscu – inne użyte panele od razu je dziedziczą.
Druga sprawa to mastery. To grupy widgetów, którymi zarządzamy na jednej stronie, a potem dopinamy je do wybranych miejsc. Prostym przykładem użycia masterów są belki nawigacyjne, headery, sidebary czy stopki. W masterach możemy tworzyć kolejne mastery i tworzyć interakcje zależne od strony, na której się wyświetlają.
Interakcje, interakcje
To, co jest przepotężną zaletą Axure to rozbudowane interakcje. Nie wiem właściwie czy jest drugi taki program, który pozwoli zaprototypować złożony projekt bez znajomości ani kawałka kodu. Interakcje możemy tworzyć w ramach obiektów (efekty po najechaniu, kliknięciu, wciśnięciu przycisku na klawiaturze, zaznaczeniu, podwójnym kliknięciu i tak dalej), tworzyć zależności między obiektami (kiedy kliknę w ten obiekt, pojawi się animacja drugiego, a jeszcze inny zniknie) i interakcje między stronami. Po kliknięciu przycisku na jednej stronie, pojawia się druga strona i scrolluje automatycznie do jakiegoś punktu.
Co jest ważne, to to, że interakcje między stronami mogą różnić się w zależności od interakcji z obiektem, czyli mamy już całkiem sporo możliwości. Jest to jednak trochę zgubne. Z jednej strony ogrom opcji jest fantastyczny, z drugiej zarządzanie nimi, a jeszcze gorzej, przejęcie projektu innej osoby, bywa dość męczące.
Druga sprawa to fakt, że rozbudowane interakcje wcale nie łączą się z mnogością opcji animacji. Nie liczcie więc na efekty rodem z Principle. Jak wspomniałam, to program do tworzenia prototypów, nie super efektów na interfejsach.
Publikacje i Axure Share
W omawianych wcześniej narzędziach, aby wyświetlić podgląd projektu można było użyć aplikacji (w większości przypadkach mobilnej) i obejrzeć projekt za jej pośrednictwem. W przypadku Axure mamy możliwość po prostu opublikowania projektu w formie strony .html – tę obejrzymy w przeglądarce na komputerze lub po wrzuceniu na serwer – również na telefonie czy tablecie (można też pliki trzymać lokalnie w folderze i omijamy potrzebę przerzucania na serwer).
Jeżeli nie dysponujemy własnym hostingiem, czy miejscem, gdzie takie pliki można przechować, do wyboru mamy jeszcze Axure Share. Czyli miejsce w axurowej chmurze na nasze projekty. Wtedy tylko szerujemy projekt, nadajemy mu nazwę i pod wygenerowanym linkiem mamy dostęp do podglądu makiet. Ten link możecie wysłać koledze, szefowi czy klientowi. Co więcej, inni mogą dodawać komentarze do projektu przez wbudowany panel lub zaznaczając określony obszar, który chcą skomentować.
Społeczność i wsparcie
Axure funkcjonuje na rynku już kupę lat, nic więc dziwnego, że dorobił się sporej, aktywnej społeczności. Startując z Axure możemy skorzystać z tutoriali wprowadzających, gotowych bibliotek, kursów czy for internetowych. Nie ma więc ryzyka, że utkniecie z problemem w miejscu, bo prawdopodobnie gdzieś został już opisany. Przy tak rozbudowanym narzędziu to skarb.
Podsumowując
Axure jest świetnym narzędziem do makietowania rozbudowanych projektów. Jeżeli z reguły robicie proste prototypy, nie wymagające skomplikowanej logiki (np. jedynie przejścia między ekranami), może okazać się, że Axure będzie dla Was przerostem formy nad treścią. Ma mnóstwo opcji, nie jest tak intuicyjny jak wspomniane wcześniej aplikacje i ma swoją cenę. Więc warto zrobić sobie podsumowanie naszych potrzeb względem narzędzia i dobrze zastanowić się, na czym nam najbardziej zależy.
