Bez przesady można powiedzieć, że dla każdej aplikacji mobilnej, jaka funkcjonuje w sieci, można znaleźć odpowiednik. Konkurencja między aplikacjami na smartfony jest na tyle duża, że o popularności decyduje nie tylko funkcjonalność i niezawodność, ale również wygoda obsługi i przyjazny design.
Wygląd aplikacji, typografia, rozmieszczenie przycisków to coś więcej niż tylko kwestie estetyki, które mają mniejsze znaczenie. Przy tak dużej konkurencji to właśnie te elementy, które wpływają na UI, mogą przekonać użytkownika do wybrania innego produktu.
Tymczasem dobre UI działa, zanim jeszcze użytkownik pozna wszystkie funkcje aplikacji. Przejrzystość, spójność, intuicyjne rozmieszczenie przycisków, drobne ułatwienia wysyłają ważny komunikat: ta aplikacja jest profesjonalna, dopracowana w szczegółach i warta twojego czasu.
8 szczegółów, które tworzą perfekcyjne UI aplikacji mobilnej
1. Pozbądź się niepotrzebnych funkcji
Zasada Pareto jest uniwersalna i ma zastosowanie również wśród aplikacji mobilnych. W praktyce oznacza, że 80% użytkowników będzie wykorzystywało 20% funkcjonalności, jakie oferuje twoja aplikacja.
Oczywiście programistyczna zasada numer 1 mówi, że w każdej aplikacji kryje się większa i bardziej wszechstronna, która tylko czeka na swoją okazję, ale nie daj się złapać na ten haczyk.
Im więcej opcji, możliwości, funkcjonalności i dodatków, tym bardziej ryzykujesz przeładowane, chaotyczne UI. Kiedy projektujesz aplikację, ułóż funkcje według priorytetów i zastanów się, których z najniższą wagą możesz się pozbyć. Jeśli uważasz, że ustalenie takiej listy bez praktyki jest niemożliwe, poczekaj do etapu prototypów i testów.
W tworzeniu hierarchii pomoże ci monitorowanie danych i sprawdzanie, jak często użytkownicy korzystają z danej funkcji.
2. Pilnuj spójności
Ekran domowy, ustawienia i rejestracja – to najbardziej podstawowe screeny, jakie będzie zawierała twoja aplikacja. Ich funkcje i wygląd na pewno będą się różnić, jednak ważne, aby w projekcie każdego zachować spójność designu.
Użytkownicy to docenią: przyciski tych samych funkcji zawsze w tych samych miejscach, paleta kolorów ograniczona do nie więcej niż trzech, typografia ułatwiają bezproblemowe korzystanie z aplikacji. Powtarzalność i spójność sprawiają, że nie musisz zastanawiać się nad każdym ekranem, szukać potrzebnych przycisków i rozgryzać, jak to działa.
3. Pielęgnuj dobre nawyki
Gdzie musisz dotknąć ekranu w większości aplikacji, aby wrócić do przedniego kroku? Jak wycofać wprowadzone dane? Pewne czynności wykonujemy na smartfonach prawie automatycznie – znamy je tak dobrze, że stają się intuicyjne.
Nawet jeśli uważasz, że świat potrzebuje rewolucji w rozmieszczeniu przycisków lub zupełnie nowych, autorskich gestów, rozważ ten pomysł bardzo dokładnie. Trudno jest walczyć z nawykami wielu użytkowników i wymagać ich ciągłej uwagi. Nawigacja powinna być znajoma już na pierwszy rzut oka, a podczas korzystania z aplikacji w zasadzie przezroczysta – przynajmniej w najbardziej podstawowych czynnościach (powrót do poprzedniego ekranu, rejestracja, logowanie).
4. Najważniejsze w zasięgu ręki
Słyszałeś o zasadzie lub obszarze kciuka? To przestrzeń, którą na ekranie smarftona masz w zasięgu ruchu tego palca. Większość użytkowników obsługuje telefon trzymając go w jednej ręce i używając właśnie kciuka.
Wykorzystaj tę wiedzę i podsuń użytkownikowi pod rękę to, czego będzie potrzebował najbardziej.
5. Wielkość ma znaczenie
Za małe przyciski i za małe formularze, których obsługa wymaga co najmniej igły to zmora niejednej aplikacji. Optymalna wielkość przycisków waha się między 7 a 10 milimetrów (przyciski na klawiaturze mają średnio 15 mm szerokości).
Co może być bardziej denerwującego niż przycisk za mały, żeby można go tapnąć? Drugi przycisk tak blisko, że musisz pilnować, aby nie tapnąć go przypadkiem. Odległości również tu mają znaczenie, zwłaszcza w przyciskach tak/nie, zapisz/cofnij.
Trudno tu jednak mówić o jednej regule odległości, dlatego najbardziej efektywne będzie stworzenie prototypu i przeprowadzenie testu.
6. Nieczytelny tekst
Projektanci UI dążą do tego, aby aplikacje były coraz bardziej intuicyjne i proste w obsłudze, jednak jeszcze przez jakiś czas nie unikniemy tekstów. Dobrzy projektanci wiedzą też, jaką siłę ma dobra typografia.
Znaczenie ma wybrany font, jego kolor, położenie, ale przede wszystkim wielkość. Twoim celem jest stworzenie takich napisów, aby można je było przeczytać po pierwszym spojrzeniu, bez zastanawiania się, czy ta litera to „l” czy „i”, w którym kropka zlewa się z kreską.
Wybierz font, który dobrze się skaluje w różnych odmianach (pogrubiona, półgruba, kursywa, ekstra cienka, skondensowana itp.). Standardem dla aplikacji na Androida są np. Roboto i Noto, z kolei Apple jako domyślnego fontu stosuje rodzinę krojów San Francisco.
Jakiej wielkości powinien być tekst? Minimum to 11 punktów, ale Apple w swoich wskazówkach dotyczących projektowania interfejsów zaleca nawet 17 punktów – pozwoli ona przeczytanie treści bez powiększania nawet z odległości wyciągniętego ramienia.
7. Czy to działa?
Co pomyślisz, jeśli tapniesz przycisk i nic się nie stanie? Poza tym, że z pewnością tapniesz jeszcze kilka razy, najpewniej uznasz, że aplikacja nie działa. Twoi użytkownicy pomyślą to samo, dlatego informuj ich, co robi aplikacja, kiedy może się wydawać, że nie robi nic.
Jeśli tapnięcie przycisku powoduje przetwarzanie danych lub załadowanie treści, znacznik ładowania jest informacją, że aplikacja działa bez zarzutu. Podobnie zadziała podświetlenie tapniętego przycisku lub animowane elementy ilustrujące postęp pracy.
8. Wsparcie techniczne i reakcja na błędy
Zło się stało i w twojej aplikacji są błędy? Spokojnie. Niezależnie od tego, ile czasu i energii kosztowało stworzenie produktu, wpadki zdarzają się nawet najlepszym. Twoje wiadomości o błędzie powinny być krótkie, zwięzłe i precyzyjne – komunikat „Ups, coś poszło nie tak” nie jest zbyt krzepiący.
Koniecznie poinformuj użytkownika, jak może rozwiązać problem (zrestartuj aplikację, ściągnij aktualizację).
Skuteczne UI w aplikacjach mobilnych
Wszyscy wiemy, jak wyglądają i jak działają wygodne, intuicyjne aplikacje. Ty jako projektant lub programista musisz wiedzieć coś jeszcze: jakie elementy sprawiają, że korzystanie z aplikacji jest tak łatwe jak oddychanie?
Na jakości twojego projektu zaważą szczegóły: schematy kolorów, czytelność tekstu, wielkości i rozmieszczenie przycisków, czy utrzymywanie kontaktu z użytkownikiem. Im mniej musisz zastanawiać się, co zrobić, dlaczego nic się nie dzieje albo dlaczego dzieje się to, czego się nie spodziewasz, tym lepsze będzie UI.
Dlatego właśnie nie zostawiaj tej części projektu na koniec. Nawet jeśli myślisz, że backend to podstawa, a wygląd jest najmniej ważny, niedopracowany layout i nieprzyjazne UI może przekreślić twoją ciężką pracę.