W procesie tworzenia aplikacji na iPhone'a i Androida, wireframing jest niezwykle ważny. W pierwszym etapie, wstępny pomysł staje się szybkim szkicem do podzielenia się z kolegami z zespołu, podczas gdy później projektant UI/UX może użyć bardziej zaawansowanych narzędzi do stworzenia w pełni funkcjonalnego prototypu z przejściami, linkami i przepływami ekranu do modelowania doświadczenia użytkownika. Narzędzia do wireframingu są tym, co pozwala na przełożenie tego, co sobie wyobrażałeś, na coś bardziej realnego, coś, co może być widziane i rozumiane przez ludzi wokół, więc wybór odpowiedniego narzędzia jest kluczowy dla stworzenia płynnego przepływu pracy.

W ciągu ostatnich lat widzieliśmy setki, jeśli nie tysiące rozwiązań z zakresu wireframingu, od najprostszych do bardzo złożonych, od samodzielnych aplikacji po edytory internetowe, więc teraz trudno jest poruszać się po tym rynku bez przewodnika lub przynajmniej punktu wyjścia. Dlatego też wybraliśmy kilka z najbardziej użytecznych narzędzi do tworzenia prototypów, począwszy od aplikacji do rysowania szkiców, które nie wymagają specjalnych umiejętności, a skończywszy na bogatych w funkcje (choć często kosztownych) pakietach desktopowych z różnego rodzaju instrumentami, których może potrzebować w swojej pracy specjalista od UI/UX.

Sprawdź kilka najlepszych przykładów każdego typu narzędzi do tworzenia prototypów, a jeśli uważasz, że czegoś Ci brakuje, dodaj swoje ulubione rozwiązanie w sekcji komentarzy.

1. Axure RP.

Eleganckie i potężne narzędzie do wireframingu z aplikacjami desktopowymi dla komputerów Mac i PC, Axure jest tym, czego ludzie w Stanfy używają do tworzenia prototypów aplikacji mobilnych.

Axure RP pozwala użytkownikom na tworzenie interaktywnych prototypów HTML nie tylko dla każdego urządzenia mobilnego, ale także dla stron i aplikacji internetowych. Jest dość intuicyjny i wykorzystuje prosty interfejs "przeciągnij i upuść" oraz logikę warunkową do tworzenia scenariuszy użycia.

Cena: $289 do $589 za licencję, bezpłatna wersja próbna dostępna.

2. Proto.io.

To narzędzie internetowe jest w pełni funkcjonalna platforma dla wireframingu UI, jeden z najbardziej popularnych na rynku. Oprócz przyjaznego interfejsu użytkownika, Proto zawiera potężne narzędzie adnotacji, które może być używane przez klientów projektanta lub kolegów do przeglądu i dyskusji.

Kolejną wygodną funkcją jest możliwość testowania swoich mobilnych prototypów na prawdziwym urządzeniu z aplikacją Proto.io Player dostępną dla systemów iOS i Android.

Cennik: od 24 dolarów miesięcznie, dostępna jest bezpłatna wersja próbna.

3. Fluid UI.

Fluid to kolejne popularne internetowe narzędzie do prototypowania z ponad 200.000 użytkowników na całym świecie, wśród których znajdują się takie giganty jak Xerox, Motorola i eBay, według strony projektu. Posiada system wizualnych linków, który ułatwia tworzenie przepływów ekranowych, a także narzędzia do współpracy i makiety odtwarzaczy dla systemów iOS i Android.

Aplikacja internetowa posiada ponad 2000 gotowych widżetów UI do tworzenia prototypów dla systemów iOS, Android i Windows 8.

Cennik: od bezpłatnego do 49 dolarów miesięcznie.

4. Wireframe.cc.

To minimalistyczne narzędzie do tworzenia wireframe'ów jest idealne dla nowicjuszy w świecie designu UI/UX, jak również dla tych, którzy muszą tylko tworzyć proste prototypy w czystym i wolnym od bałaganu środowisku.

Wireframe posiada tylko trzy proste szablony prototypów aplikacji dla stron internetowych, tabletów i smartfonów (a raczej iPadów i iPhone'ów) oraz zestaw gotowych elementów. Jest też inteligentny silnik sugestii, który ma odczytywać twoje myśli i zgadywać, co próbujesz napisać.

Cennik: od darmowego do 99 dolarów miesięcznie (dla nieograniczonej liczby użytkowników i projektów).

5. Omnigraffle.

Choć nie jest to wyłącznie mobilne narzędzie do podsłuchiwania aplikacji, Omnigraffle jest szeroko stosowany przez projektantów UI/UX do tego celu. Ta potężna platforma do tworzenia diagramów, dostępna jako samodzielna aplikacja na Maca i iPada, wykorzystuje mechanikę warstwową znaną każdemu, kto pracował z tradycyjnymi pakietami graficznymi, takimi jak Photoshop.

Użytkownicy Omnigraffle mają również dostęp do ogromnej biblioteki gotowych szablonów, które zawierają wszystko, od ikon Google Material Design do szablonów Apple Watch.

Cena znacznika: od 99,99 dolarów do 199,99 dolarów dla komputerów Mac i 49,99 dolarów dla iPada, dostępna jest bezpłatna wersja próbna.

6. Balsamiq.

Kolejne proste rozwiązanie w zakresie wireframingu, Balsamiq jest doskonałym narzędziem do szybkiego prototypowania. Aplikacja została stworzona tak, aby była jak najłatwiejsza i jak najbardziej intuicyjna, i zeszła z drogi wyobraźni użytkownika.

Twórcy Balsamiqa przyznają, że celowo ograniczyli opcje interaktywności, aby umożliwić użytkownikom tworzenie makiet, tak jak robiliby to za pomocą pióra i papieru, więc musisz dowiedzieć się, czy podoba ci się ten styl wireframingu, otrzymując bezpłatną wersję próbną.

Price tag: 79 dolarów dla systemów Windows, Mac i Linux; 12 dolarów miesięcznie za subskrypcję aplikacji internetowej, bezpłatna wersja próbna.

7. Tylko w Mind.

Sprzedawany jako "jedno rozwiązanie do prototypowania aplikacji dla wszystkich ekranów", Just in Mind jest platformą wireframingową dla systemów Windows i Mac, która pozwala na tworzenie responsywnych stron internetowych i aplikacji dla telefonów i tabletów z łatwością i komfortem. Możesz definiować transakcje gestami dla aplikacji mobilnych i testować je na rzeczywistych urządzeniach z systemem Android i iOS.

Projektanci uzyskują dostęp do szerokiej gamy widgetów, które mogą grupować w bibliotekach i wykorzystywać w swoich mobilnych prototypach.

Cena: od darmowych do 19 lub 29 dolarów miesięcznie lub 495 dolarów za licencję wieczystą.

8. UXPin.

Narzędzie do projektowania UX-ów, zbudowane przez projektantów UX-ów", UXPin wygląda jak odpowiednio wyważone rozwiązanie gdzieś pomiędzy szybkim oprogramowaniem do prototypowania a ogromnymi, bogatymi w funkcje platformami, które często są trudne do zbadania i mają sens.

Dzięki UXPin można prototypować aplikacje na smartfony lub tablety, a także responsywną stronę internetową. Daje to również użytkownikom możliwość współpracy w czasie rzeczywistym i przekazywania informacji zwrotnych.

Tag cenowy: od 15 do 40 dolarów za użytkownika miesięcznie, dostępna jest bezpłatna wersja próbna.

9. Moqups.

To narzędzie do szkicowania w stylu webowym jest nieco podobne do Wireframe i Balsamiq w swojej prostocie, pozwalając użytkownikom na tworzenie prototypów z szybkością myślenia za pomocą wiązki gotowych szablonów i szablonów dla iPhone'a i iPada.

Edytor wektorowy Moqupsa pozwala na łączenie stron z linkami i hotspotami w celu tworzenia przepływów ekranowych, a także eksportowanie makiet jako dokumentów PDF.

Cennik: od bezpłatnego do 50 dolarów miesięcznie (dla nieograniczonej liczby użytkowników).

10. Marvel.

Wreszcie, Marvel jest usługą, która pozwala projektantom tworzyć prototypy aplikacji dla smartfonów, tabletów, stron internetowych, a nawet urządzeń do gier. Współpracuje z Dropboxem i obsługuje pliki PSD, więc nie ma potrzeby konwertowania ich na inne formaty.

Oprócz internetowej platformy do prototypowania, użytkownicy mają do dyspozycji aplikację na iPhone'a, która pozwala na "animowanie" szkiców rysowanych na papierze w interaktywne wireframey.

Cennik: już wkrótce darmowa, płatna wersja "Pro".

O to chodzi i mamy nadzieję, że każdy znalazł coś, co rezonuje z jego sposobem pracy, gdyż na koniec dnia jest to najważniejsza jakość każdego rozwiązania z zakresu wireframów. Prawdopodobnie więcej niż jedno z opisanych narzędzi może znaleźć swoje miejsce na komputerach różnych członków zespołu w firmie zajmującej się tworzeniem aplikacji mobilnych. A jeśli nadal uważasz, że najlepszymi narzędziami do narysowania wczesnego prototypu są ołówek i papier, to niech tak będzie - zwłaszcza, że istnieją narzędzia, które pozwalają na inteligentną digitalizację takich szkiców do dzielenia się z ludźmi wokół.

Szczęśliwego prototypowania!