Co oprócz kartki i ołówka? Te narzędzia są niezbędne w pracy UX Designera

Wybiera i opisuje Bartosz Sułkowski, Head of UX w Syzygy Warsaw.

Bartosz Sułkowski, Head of UX w Syzygy Warsaw specjalnie dla Interaktywnie.com wybiera i opisuje narzędzia, które dla dzisiejszego UX designera są podstawą. Myślisz o profesjonalnym projektowaniu stron i aplikacji? Te narzędzia nie mogą mieć przed Tobą tajemnic.

W codziennej pracy w SYZYGY wykorzystujemy potencjał każdego narzędzia, które pozwala na szybkie prototypowanie i grupową pracę każdej osoby z zespołu nad projektem (włączając w to zawsze klienta). Klienci chcą dzisiaj jak najszybciej zobaczyć prototyp rozwiązania, nad którym dla nich pracujemy i rozpocząć testowanie z użytkownikami.

W związku z tym nie zamykamy się na nowości, które pojawiają się na rynku i nie przywiązujemy się też do konkretnych narzędzi. Staramy się je dobierać do projektu i czasu jaki mamy na jego zaprojektowanie. Często zdarza się też, że do rozmowy z klientem w pierwszej fazie wystarczy kartka papieru. Czasami też szybciej możemy coś zakodować i pokazać gotowy proof of concept. 

Wybrałem więc pięć narzędzi i usług, które pozostały z nami na dłużej.

1. Sketch

Jest to zdecydowanie ulubiona aplikacja do projektowania. Prosty interfejs, szybkość działania i możliwość rozszerzania funkcjonalności poprzez wtyczki to główne zalety tego oprogramowania. Sketch to aplikacja bazująca na wektorach, która bardzo przyśpiesza pracę nad interfejsami.  Ogromnie cieszy mnie, że na polskim rynku staje się to produkt coraz bardziej popularny i wypiera starsze, a czasami nawet archaiczne, rozwiązania.

Sketch pozwala na komfortowe projektowanie makiet jak i finalnych interfejsów dzięki czemu w jednym środowisku może pracować osoba odpowiedzialna za architekturę informacji jak i grafik. W połączeniu z dodatkowymi usługami jak Craft od InVision (https://www.invisionapp.com/craft) umożliwia też szybkie prototypowanie prostych interakcji.

Świetnym rozwiązaniem jest też integracja z usługą Plant (http://plantapp.io) lub Abstract (https://www.goabstract.com), które przynoszą do tradycyjnego projektowania rozwiązania znane programistom z popularnego Git'a dzięki czemu cały zespół może pracować na jednym aktualnym pliku.

Zespół Sketch'a cały czas czuje jednak oddech Adobe, które stara się ponownie odbić rynek przy użyciu Adobe XD (który mimo wszystko jeszcze potrzebuje czasu na rozwój). Konkurencja jest zdrowa więc zyskujemy na tym my jako użytkownicy.

Sketch:

• cena: 99$ za rok

• link: http://sketchapp.com

Craft:

• cena: darmowy

• link: https://www.invisionapp.com/craft

Plant:

• cena: darmowy (przy jednym projekcie) lub 12$ za miesiąc

• link: http://plantapp.io

Abstract:

• cena: od 9$ za miesiąc

• link: https://www.goabstract.com

2. Principle

Gdy w projektach pojawia się konieczność dokładnego pokazania animacji elementów interfejsu i zachodzących interakcji idealnym rozwiązaniem problemu jest Principle, które pozwala pokazanie takich zachowań. Przy pomocy tego oprogramowania można dowolnie animować każdy element interfejsu.

Odpowiednio przygotowane animacje można prezentować w formie klikalnego prototypu w podglądzie aplikacji lub jako zapisane nagranie wideo. 

Principle:

• cena: 129$

• link: http://principleformac.com

3. InVision

Aktualnie jedna z najlepszych usług SaaS, w której istnieje możliwość tworzenia interaktywnych prototypów. InVision na przestrzeni ostatniego roku zrobiło niesamowity postęp i widać, że za produktem stoją osoby, które na codzień projektują i mierzą się z problemami typowymi dla osób związanych z projektowaniem. 

W SYZYGY mocno wykorzystujemy możliwości nie tylko części związanej z prototypami, ale też zbierania feedbacku od klienta i bieżąca dyskusja nad projektem w ramach jednego narzędzia. W fazie researchu bardzo przydatne są dodatkowe typy projektów, które można tworzyć na platformie (np. “Boards” lub “Freehand”), które w czasie rzeczywistym pozwalają na pracę całego zespołu.

Z niecierpliwością czekamy na dostęp do nowej usługi InVision Studio. Jeżeli filmy promocyjne się sprawdzą to właściciele Sketch’a i Adobe XD mają się czego bać, bo może się okazać, że na wreszcie powstanie jedno narzędzie, które będzie wystarczające do projektowania.

InVision:

• cena: darmowy (przy jednym prototypie) lub od 15$ za miesiąc

• link: http://invisionapp.com

4. Zeplin

Drugi po InVision produkt SaaS, który idealnie uzupełnia działanie Sketch’a. Dzięki tej usłudze istnieje możliwość przyspieszenie pracy zespołów deweloperskich. Zeplin pozwala na wyeksportowanie zawartości plików sketch i wygenerowanie wszystkich elementów niezbędnych do prac frontendowych (można pobrać z niego wszystkie pliki graficzne, kawałki kodu CSS czy sprawdzić odległości między elementami). 

Po stronie zespołu graficznego pozwala też na automatyczne generowanie style guide’a, który można udostępnić klientom.

Zeplin:

• cena: darmowy (przy jednym projekcie) lub od 17$ za miesiąc

• link: http://zeplin.io

5. HotJar

Narzędzie on-line pozwalające na śledzenie użytkowników i nagrywanie ich działań na stronach WWW. Doskonale nadaje się do uzupełnienia wiedzy o użytkownikach z Google Analytics lub innych systemów analitycznych. Pozwala zobaczyć w jaki sposób nasi użytkownicy korzystają z serwisów. 

Wraz z zespołem projektowym zawsze proponujemy klientom zakupienie usługi i dołączenie jej do cyklicznej analizy, gdyż dane które można tam zwizualizować nie raz zmieniły sposób w jaki patrzymy na produkt. Jest to też dobre uzupełnienie tradycyjnych badań z użytkownikami.

Dodatkowo przy cenie 29 euro HotJar oferuje heatmapy, analitykę formularzy czy ankiety, czyli kolejne sposoby na pozyskanie dodatkowej wiedzy o produkcie.

HotJar:

• cena: darmowy (przy 2000 odsłon dziennie) lub od 29$ za miesiąc

• link: https://hotjar.com

 

Bartosz Sułkowski, Head of UX w SYZYGY Warsaw, związany z projektowaniem od 2008 roku. Specjalizuje się w user experience, budowie interfejsów, koncepcyjnym i strategicznym rozwoju produktów. W SYZYGY nadzoruje działania związane z użytecznością, optymalizacją i analityką. Wspiera też zespół IT w obszarze Technology Innovation. Prywatnie współtworzy projekt DriveSurfing.com, międzynarodowy startup car sharingowy.

Pobierz ebook "Ebook z raportem: Jak wybrać software house dla działań marketingowych i e-commerce"