Jak powinna być zorganizowana treść interaktywna na ekranie dotykowym?
Klient detaliczny podchodzi do wyświetlacza dotykowego i już wie, jaki produkt chce sprawdzić. Następna osoba, która pięć minut później dotknie tego samego ekranu, chce tylko ceny lub wskazówek dojazdu do przymierzalni. Trzecia osoba jest tam, bo się nudzi, czekając na kogoś, i myśli, że będzie węszyć. Jeśli wszyscy trzej muszą klikać to samo czteropoziomowe menu, aby gdziekolwiek dotrzeć, ekran zawiódł już dwóch z nich, zanim znaleźli to, po co przyszli — i szczerze mówiąc, trzeci prawdopodobnie też odejdzie.
Odbyliśmy więcej niż kilka rozmów poinstalacyjnych, podczas których pierwszym pytaniem klienta było pytanie „dlaczego nikt z tego nie korzysta?” W dziewięciu przypadkach na dziesięć sprzęt jest w porządku. Ekran jest wystarczająco jasny, reakcja na dotyk jest wystarczająco szybka, wysokość montażu jest prawidłowa. Problem jest prawie zawsze ten sam: menu zostało zbudowane wokół tego, jak ktoś w biurze myśli o katalogu produktów, a nie wokół tego, jak naprawdę myśli osoba stojąca w holu lub salonie.
Na tym właśnie polega główny problem interaktywnych treści wyświetlanych na ściennych ekranach dotykowych — nie to, czy ekran jest wystarczająco duży i wystarczająco drogi, ale czy zawarte na nim menu odpowiada temu, co ludzie pokazali.
Zacznij od zadania, a nie od menu
Oto wzór, z którym stale się spotykamy. Klient przesyła strukturę swoich produktów do nowego interaktywnego kiosku, która jest zorganizowana dokładnie tak, jak w ich wewnętrznym systemie ERP — według prefiksu SKU, według kodu dostawcy lub według tego, który dział jest wewnętrznie właścicielem danej linii produktów. Ma to całkowity sens dla osoby, która go zbudowała. Nie znaczy to absolutnie nic dla nieznajomego stojącego w salonie z pięcioma minutami wolnego czasu.
Odwiedzający nie myślą kodami SKU. Myślą: „Szukam małego, niebieskiego” lub „Gdzie jest ta rzecz, która była w promocji” lub „czy na tym piętrze jest łazienka”. Jeśli po pierwszym dotknięciu ekranu nie zostanie wyświetlony ten język, ludzie albo natychmiast się poddadzą, albo zaczną stukać losowo, co – jeśli ma to jakiekolwiek znaczenie – zwykle wygląda na uszkodzony ekran, nawet jeśli tak nie jest.
Zanim więc ktokolwiek rozłoży pojedynczy ekran, warto po prostu usiąść i napisać prostym językiem dwie lub trzy rzeczy, które ludzie tak naprawdę mają do zrobienia. Nie to, co firma chce przekazać. Co gość chce osiągnąć. Ekspozycja produktu w salonie sprowadza się zazwyczaj do trzech realnych zadań: przeglądania według kategorii, wyszukiwania po nazwie lub sprawdzania aktualnych promocji. Katalog w holu zwykle sprowadza się do znalezienia firmy, działu lub znalezienia numeru pokoju, który ktoś już zapisał na karteczce samoprzylepnej w kieszeni. Kiedy już te zadania zostaną faktycznie spisane i uzgodnione, wszystko inne – specyfikacje, formularze kontaktowe, historia firmy, wiadomość powitalna od założyciela – może zniknąć z pierwszego ekranu i przestać konkurować o uwagę.
Ma to większe znaczenie na wyświetlaczu publicznym niż na wewnętrznym panelu kontrolnym, z którego Twoi pracownicy korzystają czterdzieści razy dziennie i ostatecznie zapamiętują bez zastanowienia. Nikt nie będzie krzyczał na pracownika i pytał, jak korzystać z ekranu dotykowego przykręconego do ściany holu. Jeśli pierwsze dotknięcie nie przybliży kogoś do odpowiedzi, po prostu odejdzie, a klient w końcu zadaje pytanie, dlaczego nikt nie korzysta z bardzo drogiego ekranu, za który właśnie zapłacił.

Jeden ekran, różne ścieżki użytkownika
Ten sam fizyczny wyświetlacz często musi obsługiwać więcej niż jeden rodzaj wizyt, czasami w ciągu tych samych pięciu minut. Zamiast wciskać każdą możliwą ścieżkę na jeden zatłoczony ekran główny, co jest odruchem niemal każdego klienta, gdy po raz pierwszy widzi puste płótno, znacznie lepiej jest dać każdemu przypadkowi użycia własną, krótką, przewidywalną trasę i pozwolić ludziom spokojnie wybrać tę, która faktycznie im odpowiada.
Wyświetlacze detaliczne
W przypadku salonu detalicznego ścieżka, która zwykle się sprawdza, zaczyna się od kategorii produktu, przechodzi do konkretnego modelu, następnie do specyfikacji, a dopiero potem oferuje oddzielny krok w postaci zapytania lub prośby o kontakt. To, co ludzie mylą, zwykle nie dotyczy liczby kategorii na ekranie głównym. Zbyt wczesne łączenie przeglądania i zadawania pytań. Jeśli ktoś będzie musiał wypełnić formularz kontaktowy, aby zobaczyć specyfikację, niemal natychmiast odrzuci tę wiadomość. Jeśli przycisk do przesłania zapytania wygląda identycznie jak przycisk umożliwiający wyświetlenie dodatkowych szczegółów produktu, rezultatem jest zwykle sterta przypadkowych potencjalnych klientów, którzy prowadzą donikąd, a zespół sprzedaży jest zirytowany kontaktowaniem się z osobami, z którymi nigdy nie chciał się kontaktować. Utrzymanie tych dwóch celów – patrzenia i zadawania pytań – strukturalnie oddzielonych od siebie rozwiązuje oba problemy na raz i powoduje nieproporcjonalnie dużą różnicę w działaniu wyświetlacza po wyjęciu z pola.
Katalogi budynków i gości
Katalogi mają zazwyczaj dość przewidywalny kształt i zwykle prowadzą z budynku na piętro, następnie do działu, a następnie do określonej lokalizacji, chyba że pole wyszukiwania pozwala komuś przejść od razu do ostatniego kroku. W przypadku katalogów twierdzilibyśmy, że zwykłe pole wyszukiwania na ekranie głównym, w którym ktoś wpisuje nazwę i otrzymuje wynik, niemal za każdym razem przewyższa nawet pięknie zorganizowane drzewo kategorii. Większość odwiedzających już dokładnie wie, kogo lub czego szuka. Aby je znaleźć, nie trzeba ich uczyć schematu organizacyjnego budynku. Najpierw daj ludziom pole wyszukiwania i pozwól, aby katalog z możliwością przeglądania istniał jako kopia zapasowa dla mniejszej grupy, która tak naprawdę nie wie jeszcze, dokąd zmierza.
Ekrany edukacji i szkoleń
Prezentacje w klasach i salach szkoleniowych zazwyczaj przedstawiają najpierw wybrany kurs, następnie lekcję w jego ramach, następnie fragment materiału multimedialnego, taki jak wideo lub diagram, a na końcu interaktywne ćwiczenie powiązane z tą lekcją. Tutaj priorytet faktycznie się odwraca w porównaniu do sprzedaży detalicznej lub katalogu. Tu naprawdę nie chodzi o prędkość. Nauczyciel nie ściga się z nieznajomym poprzez menu. Starają się, aby sala pełna uczniów była zaangażowana, nie zakłócając spokoju w połowie lekcji. To zmienia wygląd dobrego projektu: większe cele, mniej niespodzianek i nic, co wymagałoby drugiego zdezorientowanego spojrzenia na ekran, aby potwierdzić to, co się właśnie wydarzyło, ponieważ to drugie spojrzenie to pokój pełen dwunastolatków, którzy tracą całą uwagę, jaką im pozostawiono.
Trzy typy wyświetlaczy, trzy różne głębokości menu, trzy zupełnie różne zestawy priorytetów, mimo że technicznie wszystkie trzy mieszczą się w tej samej szerokiej etykiecie ekranu dotykowego z menu. Traktowanie ich tak samo tylko dlatego, że działają na podobnym sprzęcie, jest jednym z najczęstszych błędów, jakie widzimy, a którego łatwo jest uniknąć, jeśli faktycznie oddzielisz w głowie przypadki użycia, zanim zaczniesz cokolwiek projektować.
Szybki sposób na wyjaśnienie tych różnic przed przeglądem projektu:
Typ wyświetlacza | Typowa ścieżka | Główny priorytet |
Salon sprzedaży detalicznej | Kategoria → model → specyfikacje → zapytanie | Kontynuuj przeglądanie i „skontaktuj się z nami” wyraźnie oddzielone |
Katalog budynków | Budynek → piętro → wydział → lokalizacja | Najpierw pole wyszukiwania, drzewo kategorii jako kopia zapasowa |
Edukacja / szkolenie | Kurs → lekcja → media → ćwiczenie | Duże cele, żadnych dwuznacznych potwierdzeń |
Ta tabela nie ma być zbiorem zasad. To raczej sprawdzenie zdrowego rozsądku — jeśli menu projektu nie pasuje mniej więcej do jego wiersza, zazwyczaj warto przyjrzeć się temu jeszcze raz, zanim układ zostanie sfinalizowany.
Kiedy układy podzielonego ekranu rzeczywiście pomagają
Podzielony ekran jest wymagany znacznie częściej, niż jest właściwie używany. I rozumiemy dlaczego — na papierze więcej paneli oznacza większą wartość: więcej treści widocznych na raz, większy zwrot z budżetu sprzętu, więcej powodów, dla których warto uzasadnić rozmiar ekranu każdemu, kto podpisze projekt.
Jest to naprawdę przydatne w wąskiej grupie sytuacji, takich jak film demonstracyjny produktu wyświetlany na jednej połowie ekranu, podczas gdy specyfikacje statyczne znajdują się na drugiej, lub mapa budynku połączona z przewijaną listą wydarzeń danego dnia. W obu przypadkach oba panele wykonują wyraźnie odmienne zadania i żaden z nich nie wymaga pełnej uwagi odwiedzającego dokładnie w tym samym momencie.
Przestaje działać w momencie, gdy ktoś próbuje wcisnąć przeglądanie produktów, zapętlone wideo, kod QR i promocje na żywo na cztery panele jednocześnie, o co, dla jasności, byliśmy proszeni o wykonanie więcej niż raz, zwykle przez kogoś, kto naprawdę próbował wydobyć z ekranu więcej wartości, a nie mniej. W tym momencie nic na układzie nie ma wystarczająco dużo miejsca, aby faktycznie czytać z normalnej odległości, a konfiguracja podzielonego ekranu daje efekt odwrotny do zamierzonego. Ludzie patrzą na to, nie są w stanie przeanalizować tego wystarczająco szybko i idą dalej, nie absorbując żadnego z nich.
Przyzwoita zasada, do której wracamy przy prawdziwych projektach: jeśli część ekranu tak naprawdę nie potrzebuje chwili uwagi, oddzielonej od wszystkiego innego, to prawdopodobnie nie zasługuje na własny panel.
Gdzie plany dotyczące treści zwykle się nie sprawdzają
Kilka wzorców pojawia się na tyle często, że warto je bezpośrednio nazwać, ponieważ można ich uniknąć, a i tak mają miejsce.
· Przeciążanie ekranu początkowego w celu uzasadnienia budżetu. Ktoś wydał na sprzęt prawdziwe pieniądze, a słabo wyglądający ekran główny może sprawiać wrażenie zmarnowanego potencjału. W praktyce trzy oczywiste, dobrze rozmieszczone wybory niemal za każdym razem biją na głowę dwanaście przycisków z drobnym drukiem pod każdym z nich. Zajęty ekran nie jest tak wartościowy – czyta się go jak pracę domową.
· Projektowanie na laptopie i nigdy nie testowanie na prawdziwym panelu. Coś, co wygląda dobrze na dystansie ramienia na piętnastocalowym monitorze, może okazać się ciasne lub trudne w obsłudze, gdy zostanie rozciągnięte na pięćdziesięciopięciocalowym ekranie zamontowanym na ścianie. Obserwowaliśmy, jak zespoły odkrywały to na miejscu, na oczach klienta, co jest chyba najgorszym możliwym momentem, aby to odkryć.
· Pozwalanie ikonom przemieszczać się pomiędzy stronami. Strzałka wstecz, która na stronie produktu oznacza jedno, a na stronie katalogu coś nieco innego, wydaje się być małą niespójnością. To nie jest. Uczy ludzi nieufności do interfejsu, a kiedy to zaufanie zniknie, zaczynają na chybił trafił, próbując znaleźć drogę powrotną — co jest dokładnie tym, z czym wcześniej borykał się problem „wygląda na zepsuty”.
Żaden z tych trzech problemów nie jest problemem sprzętowym i żaden z nich nie jest kosztowny w naprawie, jeśli zostanie złapany przed dniem instalacji. Łatwo je przeoczyć, gdy projekt przebiega szybko i wszyscy skupiają się na częściach, które trudniej później zmienić, takich jak rozmiar ekranu czy pozycja montażu.
Co pojawia się na pierwszym ekranie, a co nie
Nie wszystko należy do ekranu początkowego i nie wszystko, co się tam znajduje, ma taką samą wagę wizualną.
Przyciski kategorii, funkcja wyszukiwania i dowolne dwie lub trzy akcje, które są najczęściej używane, zasługują na największe i najbardziej oczywiste umiejscowienie na stronie, czyli takie, które chciałbyś, aby ktoś zauważył, nawet jeśli przechodząc obok niego patrzył na ekran tylko przez dwie sekundy. Szczegóły produktu, filtry i opcje dodatkowe można wygodnie zanurzyć w jedno kliknięcie głębiej, nie kosztując nikogo znaczącego czasu, ponieważ jedno dodatkowe dotknięcie rzadko powoduje utratę kogoś, kto był już naprawdę zainteresowany. Specyfikacje, tekst prawny, instrukcje instalacji i wszystko, co jest na tyle niszowe, że ma znaczenie tylko dla niewielkiej części odwiedzających, może poczekać, aż ktoś aktywnie zacznie tego szukać, ponieważ prawie nikt nie chce stać w holu i czytać drobnym drukiem akapit ze ściany.
Błąd, który warto tu jeszcze raz wskazać, polega na tym, że czegoś nie pominięto. To odwrotny instynkt, strach przed pominięciem czegoś, zwykle tworzy najgorsze układy, jakie widzimy. Ekran, który stara się odpowiedzieć na każde możliwe pytanie w momencie, gdy ktoś go dotknie, nie odpowiada szczególnie dobrze na żadne z tych pytań. Pewność siebie w kwestii tego, co wyciąć, jest tak samo ważna, jak dbałość o to, co zachować.
Cele dotykowe potrzebują miejsca do oddychania
Układ, który podczas przeglądu projektu na czyimś laptopie wygląda zupełnie dobrze, nie zawsze wytrzyma kontakt z prawdziwym ludzkim palcem na panelu ściennym. Przyciski o rozmiarze wygodnym dla kursora myszy są często za małe lub umieszczone zbyt blisko siebie, gdy prosisz kogoś o dotknięcie ich koniuszkiem palca, szczególnie w ruchliwych sklepach lub w holu, gdzie ludzie stoją pod dziwnymi kątami, czasem trzymają kawę, czasem z dzieckiem ciągnącym ich za rękaw.
Dwie rzeczy mają tu większe znaczenie, niż zwykle się im przypisuje na etapie projektowania. Pierwszą z nich jest zachowanie stałych odstępów wokół wszystkiego, czego można dotknąć, ponieważ ciasne przyciski powodują przypadkowe dotknięcia, a przypadkowe dotknięcia powodują rodzaj frustracji, która szybko nasila się na ekranie publicznym, za który nikt nie płaci za cierpliwość. Drugim jest spójne znaczenie powtarzających się symboli na każdym ekranie interfejsu. Jeśli strzałka wstecz odsyła kogoś do ekranu głównego na jednej stronie i do poprzedniej kategorii na innej, ta niespójność nie jest rejestrowana jako drobny błąd, który warto zignorować. Zauważa się, że cały interfejs jest zawodny i ludzie szybko uogólniają to wrażenie.
Warto też pamiętać, że często na ekran patrzy często więcej niż jedna osoba na raz, nawet jeśli tylko jedna z nich go dotyka – kolega stojący za kimś sprawdzającym książkę telefoniczną, drugi kupujący oglądający się przez ramię, rodzic obserwujący z odległości kilku metrów dziecko przeglądające ekran edukacyjny. Układ musi pozostać czytelny również dla drugiej, niezaangażowanej osoby, co w praktyce zwykle oznacza po prostu nieco większą czcionkę i silniejszą separację wizualną, niż byłoby to kiedykolwiek potrzebne w interfejsie pojedynczego użytkownika.
Rozmiar ekranu zmienia możliwości treści
Planowanie treści działa najlepiej, gdy ma miejsce przed ustaleniem rozmiaru wyświetlacza, a nie później, gdy zamówienie na sprzęt jest już złożone i ktoś po cichu próbuje dopasować treść do tego, co pojawiło się w ciężarówce. Panel czterdziestotrzycalowy i panel sześćdziesięciopięciocalowy to nie jest po prostu ten sam interfejs powiększony jak ustawienie kserokopiarki. Naprawdę obsługują różną ilość szczegółów, zanim układ zacznie sprawiać wrażenie zatłoczonego lub dziwnie pustego.
FVASEE produkuje montowane na ścianie ekrany dotykowe w rozmiarach 42 i 43 cali, 49 i 50 cali, 55 cali i 65 cali, z dostępnymi konfiguracjami zarówno z systemem Android, jak i Windows, w zależności od potrzeb projektu. Mniejsze panele zwykle zarabiają na siebie dzięki skupionemu, jednościeżkowemu interfejsowi zbudowanemu wokół jednej linii produktów, jednego katalogu lub jednego jasnego zadania, bez niczego innego, co konkurowałoby o przestrzeń. Większe panele mają fizyczną przestrzeń do oglądania w grupach lub szerszego zestawu kategorii, bez poczucia, że wszystko jest zapełnione, chociaż tę dodatkową przestrzeń łatwo zmarnować, jeśli plan treści nigdy nie był zaprojektowany tak, aby jej faktycznie potrzebował.
Praktycznym posunięciem, do którego wciąż wracamy w przypadku prawdziwych projektów, jest załadowanie rzeczywistych stron treści do rzeczywistego rozmiaru panelu, zanim cokolwiek zostanie sfinalizowane po którejkolwiek stronie. Tekst, który dobrze czyta się na makiecie na czyimś laptopie, może okazać się niewygodnie mały po zamontowaniu na wysokości oczu na czterdziestotrzycalowym ekranie w holu. Układ zaprojektowany z myślą o sześćdziesięciopięciocalowym płótnie może wyglądać dziwnie skąpo, gdy zostanie wciśnięty na czterdziestodziewięciocalowy panel. Testowanie prawdziwych stron na prawdziwym sprzęcie na etapie próbnym pozwala wykryć większość tych problemów, choć ich naprawa jest nadal tania, co jest lepsze od wykrycia ich po zamontowaniu paneli na ścianie w cudzym budynku.
Przejście od pierwszej wersji roboczej do działającego interfejsu
Nic z tego nie składa się na jeden uniwersalny, poprawny układ, który można zastosować wszędzie i szczerze bylibyśmy trochę podejrzliwi, gdyby ktoś twierdził, że taki istnieje. Salon wystawowy, katalog w holu hotelu i wystawa w klasie będą miały różną głębokość menu, różną ilość tekstu na ekranie i różne powody używania lub celowego pomijania układu podzielonego ekranu. To, co je łączy, nie jest wspólnym szablonem. Jest to wspólny punkt wyjścia: ustalenie, co właściwie zrobiła osoba stojąca przed ekranem, i zbudowanie struktury menu wokół tej rzeczywistości, a nie wokół niej, jednak treść jest już zorganizowana gdzieś w arkuszu kalkulacyjnym w biurze.
Sam ekran zapewnia przestrzeń, jasność i reakcję na dotyk. To, czy ktoś faktycznie będzie z niego korzystał po instalacji, zależy od tego, co się na nim znajduje i czy treść dociera do ludzi tam, gdzie już się znajdują, a nie tam, gdzie schemat organizacyjny lub baza danych produktów po cichu zakładała, że się znajdą.