Aplikacje mobilne
iOS i Android. Krótkie chwile między innymi sprawami, kciuk zamiast myszy i powiadomienia, które pomagają, zamiast irytować.
Realizacja:WellysaWróć na stronę główną
Produkty cyfrowe
Projektuję aplikacje mobilne, webowe i panele, z których ludzie korzystają bez instrukcji. Prowadzę produkt od pierwszej rozmowy o pomyśle, przez badania i prototyp, po ekrany gotowe do wdrożenia.
- UX/UI
- Wireframing
- Prototypowanie
- Interaction Design
- Testy użyteczności
Prototyp
O
Dzień dobry, Ola
Masz jedno zalecenie na ten miesiąc
Zalecane
Wizyta kontrolna
Ostatnia była 11 miesięcy temu
Nadchodzące
- Konsultacja onlinept, 16 października, 18:00
- Badanie krwipon, 2 listopada, 7:30
StartWizytyWynikiProfil
Wybierz termin
Wizyta kontrolna, 30 minPrzychodnia Prosta 12 · 1,2 km
pon5wt6śr7czw8pt9
Więcej terminów
Przypomnimy Ci dzień wcześniej
Gotowe, do zobaczenia!
Wtorek, 6 października, 10:00
Wizyta kontrolna, 30 minPrzychodnia Prosta 12Przypomnimy Ci dzień wcześniej
Dodaj do kalendarzaCo projektuję
Produkt cyfrowy to aplikacja, panel albo usługa online, z której Twoi klienci korzystają co dzień. Każdy ekran albo przybliża ich do celu, albo każe zgadywać. Moja praca to usuwać zgadywanie.
Aplikacje webowe i SaaS
Narzędzia pracy w przeglądarce: konta, uprawnienia, ustawienia i dziesiątki ekranów, które muszą działać jak jedna całość.
Panele i dashboardy
Dużo danych na małej przestrzeni. Hierarchia, filtry i tabele, w których od razu widać to, co wymaga reakcji.
Produkty z AI
Czaty, asystenci i wyszukiwarki wiedzy. Projektuję zaufanie: skąd pochodzi odpowiedź, czego AI nie wie i jak ją poprawić.
Realizacja:SesameUżyteczność
Każdy zbędny krok to klient, który rezygnuje
Ten sam cel: umówić wizytę. Najpierw ścieżka, jaką często zastaję w produktach przed projektem. Przełącz i zobacz, co z niej zostaje, kiedy każdy ekran musi uzasadnić, po co istnieje.
- Ekrany
- 1010
- Dotknięcia
- 1616
- Pola do wpisania
- 77
- 1Ekran powitalny przy każdym uruchomieniu.
- 2Logowanie e-mailem i hasłem przy każdej wizycie.
- 3Trzy ekrany szukania: menu, lista usług i mapa placówek.
- 4Formularz z danymi, które aplikacja już zna.
- 5Dzień i godzina wybierane na dwóch osobnych ekranach.
- 6Podsumowanie, które powtarza to, co już wybrano.
W Wellysie od zalecenia do zarezerwowanego terminu są dwa dotknięcia.Zobacz, jak to zrobiłem
Proces
Od pomysłu do produktu, który działa
Siedem kroków, w których jeden ekran przechodzi drogę od notatki z rozmowy do specyfikacji dla programistów. Po każdym widzisz postęp i podejmujesz decyzje, zanim cokolwiek trafi do kodu.
- Etap 1 · Odkrycie
Rozmowa i cele
Zaczynam od Twojego biznesu, nie od ekranów. Ustalamy, dla kogo jest produkt, co ma się zmienić po jego wdrożeniu i po czym poznamy, że się udało.
Co robimy
- Warsztat z Tobą i zespołem
- Cele biznesowe i ograniczenia
- Miara sukcesu
Co dostajesz
- Brief produktu
- Zakres pierwszej wersji
Twoja decyzja: Zatwierdzasz cele i zakres.
- Etap 1 · Odkrycie
Badania
Rozmawiam z ludźmi, którzy będą korzystać z produktu, i sprawdzam, jak radzą sobie dziś bez niego. Często dopiero tu widać, że prawdziwy problem leży gdzie indziej, niż zakładaliśmy.
Co robimy
- Wywiady z użytkownikami
- Przegląd konkurencji
- Analiza danych, jeśli produkt już działa
Co dostajesz
- Persony
- Mapa doświadczeń
- Lista wniosków
Twoja decyzja: Pomagasz dotrzeć do klientów.
- Etap 2 · Projektowanie
Architektura i przepływy
Układam produkt jak mapę: jakie są ekrany, jak się łączą i którędy użytkownik dojdzie do celu. To najtańszy moment na zmiany, bo przestawiamy strzałki, a nie kod.
Co robimy
- Mapa ekranów
- Ścieżki użytkownika
- Sytuacje brzegowe
Co dostajesz
- Architektura informacji
- Przepływy użytkownika
Twoja decyzja: Akceptujesz ścieżki i kolejność prac.
- Etap 2 · Projektowanie
Makiety
Szkicuję kluczowe ekrany w szarościach, bez kolorów i zdjęć. Rozmawiamy o tym, co jest na ekranie i w jakiej kolejności, a nie o odcieniu przycisku.
Co robimy
- Szkice kluczowych ekranów
- Hierarchia treści
- Pierwsze wersje tekstów
Co dostajesz
- Makiety kluczowych ekranów
Twoja decyzja: Wybierasz kierunek.
- Etap 2 · Projektowanie
Projekt interfejsu
Makiety dostają markę: typografię, kolory, ikony i ruch. Projektuję wszystkie stany ekranów i składam je z komponentów, z których zespół zbuduje kolejne funkcje.
Co robimy
- Kierunek wizualny
- Wszystkie ekrany i ich stany
- Komponenty i tokeny
Twoja decyzja: Akceptujesz wygląd.
- Etap 3 · Prototyp i testy
Prototyp i testy
Łączę ekrany w klikalny prototyp, który działa jak aplikacja. Daję go do ręki kilku osobom z grupy docelowej i patrzę, gdzie się zatrzymują. Poprawki kosztują tu godziny, a nie tygodnie programowania.
Co robimy
- Klikalny prototyp
- Testy z użytkownikami
- Poprawki po testach
Co dostajesz
- Prototyp do pokazania inwestorom i zespołowi
- Raport z testów
Twoja decyzja: Decydujesz, które poprawki wchodzą.
- Etap 4 · Wdrożenie i wsparcie
Przekazanie i wdrożenie
Programiści dostają projekt z wymiarami, stanami i zasadami zachowania. Zostaję w projekcie: odpowiadam na pytania i sprawdzam wdrożone ekrany, zanim trafią do użytkowników.
Co robimy
- Specyfikacja dla programistów
- Przegląd wdrożonych ekranów
- Wsparcie po starcie
Co dostajesz
- Pliki gotowe do wdrożenia
- Lista poprawek z przeglądu
Twoja decyzja: Wypuszczasz produkt.
Detale
Użyteczność to suma drobnych decyzji
Nikt nie chwali aplikacji za dobry komunikat błędu, ale każdy pamięta tę, przez którą stracił wpisane dane. Takich decyzji jest w produkcie setki. Przełącz i zobacz sześć z nich.
- Błąd 422: nieprawidłowe dane wejściowe.E-mailLiterówka? Chodziło o gmail.com
Komunikat błędu
Mówi, co poszło nie tak i jak to naprawić, tuż przy polu, którego dotyczy.
- Wizyta kontrolnawt, 6 października, 10:00Konsultacja onlinept, 16 października, 18:00
Czy na pewno?
Tej operacji nie można cofnąć.
NieTakUsunięto wizytęCofnij zamiast pytać
Akcja dzieje się od razu, a przez kilka sekund można ją cofnąć. Bez okienek „Czy na pewno?”.
- Wizyta kontrolna20 × 20 ptZamknij
Pole dotyku
Przycisk ma co najmniej 44 punkty, nawet gdy ikona jest mniejsza. Kciuk to nie kursor.
Wizyta kontrolna
wtorek, 10:00
#B4B4AE2,1 : 1 · AACzytelność
Kontrast tekstu zgodny z WCAG. Aplikację da się przeczytać w słońcu i bez okularów.
Informacja zwrotna
Po dotknięciu od razu widać, że coś się dzieje, a chwilę później, że się udało.
Wystąpił błąd
Operacja nie powiodła się (kod 0x80070005).
OKJęzyk interfejsu
Przyciski mówią, co zrobią, a komunikaty brzmią jak człowiek, a nie jak serwer.
Stany ekranu
Jeden ekran, pięć wersji
Makieta zwykle pokazuje ekran w idealnym dniu: dane są, internet działa, użytkownik wie, czego szuka. Projektuję też pozostałe wersje, bo to w nich ludzie najczęściej rezygnują.
Stany ekranu1/5
1Pierwsze wejście
Pusta lista to zaproszenie do pierwszego kroku, a nie ślepa uliczka.
Realizacje
Dwa produkty zaprojektowane od zera
Aplikacja mobilna dla zdrowia i narzędzie AI dla firm. Różne branże, ten sam proces.
Aplikacja mobilna, zdrowie
Wellysa
Osobisty asystent zdrowia, który zamienia wyniki badań w jeden konkretny następny krok i prowadzi od ankiety do zarezerwowanego terminu.
Co zaprojektowałem- Architektura informacji i przepływy
- Ankieta zdrowotna krok po kroku
- Rezerwacja badania w punkcie pobrań
- Wellysa Club, czyli warstwa społeczna
- Źródła profilu
- 3
- Od rekomendacji do terminu
- 2 dotknięcia
- Zakres
- Aplikacja 0→1
Aplikacja webowa, AI dla firm
Sesame
Bezpieczny workspace z czatem AI, który daje firmie dostęp do całej wewnętrznej wiedzy bez utraty kontroli nad danymi.
Co zaprojektowałem- Nowa architektura informacji
- Przepływy czatu i zarządzania plikami
- Uprawnienia i przestrzenie robocze
- Trzy koncepcje interfejsu
- Mapy przepływów
- 120
- Koncepcje UI
- 3
- Zakres
- 0→1
PlaceholderMiejsce na kolejny produktTrzecia realizacja: kadr z ekranami, rodzaj produktu i dwa, trzy zdania o problemie, który rozwiązał projekt.
PlaceholderMiejsce na opinię klientaKrótki cytat od zespołu Wellysy albo contexxt.ai o tym, co zmienił projekt. Imię, rola i firma.
Współpraca
Z czym możesz przyjść
Mam pomysł na aplikację
Nowy produkt od zera
Od warsztatu i badań po przetestowany prototyp i ekrany gotowe do wdrożenia. Pomagam ustalić, co musi być w pierwszej wersji, a co może poczekać.
Pierwszy krokWarsztat o celach i zakresie
Mamy produkt, ale ludzie się w nim gubią
Audyt UX i przeprojektowanie
Sprawdzam produkt oczami użytkownika, rozmawiam z klientami i patrzę w dane. Dostajesz listę problemów ułożoną według wpływu na biznes i projekt poprawek.
Pierwszy krokPrzegląd produktu i danych
Mamy zespół, brakuje nam projektanta
Projektant w Twoim zespole
Dołączam do zespołu produktowego: pracuję w Waszych sprintach, z product managerem i programistami, i odpowiadam za doświadczenie użytkownika.
Pierwszy krokRozmowa o planach produktu
Pracujesz bezpośrednio ze mną
Od pierwszej rozmowy do przeglądu wdrożenia. Bez pośredników i bez przekazywania projektu kolejnym osobom.
FAQ
Zanim zaczniemy, pewnie zapytasz o to
Od rozmowy. Wystarczy kilka zdań o tym, dla kogo ma być produkt i co ma zmienić. Brief, zakres pierwszej wersji i plan prac ustalamy razem na pierwszym etapie.
Zależy od zakresu. Pojedynczy przepływ w aplikacji to zwykle dwa do czterech tygodni, a produkt budowany od zera liczy się w miesiącach. Po pierwszej rozmowie podaję konkretny termin i się go trzymam.
Każdy projekt wyceniam indywidualnie, w zależności od zakresu i złożoności. Po krótkiej rozmowie przygotuję ofertę dopasowaną do Twoich potrzeb.
Przy produktach cyfrowych skupiam się na UX/UI, a wdrożenie oddaję zespołowi deweloperskiemu: ściśle z nim współpracuję i mogę polecić sprawdzone osoby. Po przekazaniu projektu zostaję pod ręką i sprawdzam wdrożone ekrany.
Nie zawsze. Przy nowym produkcie albo dużym ryzyku kilka rozmów i test prototypu szybko się zwracają. Przy mniejszych zmianach wystarczy przegląd ekspercki i dane, które już masz.
Projekt wszystkich ekranów i ich stanów w Figmie, bibliotekę komponentów, klikalny prototyp i specyfikację dla programistów. Zakres ustalamy na starcie, więc wiesz, co dostaniesz, zanim zaczniemy.
Każdy etap kończy się spotkaniem, na którym pokazuję postęp i zbieram uwagi. Idziemy dalej dopiero, gdy zaakceptujesz kierunek, więc nic nie zaskoczy Cię na końcu.