Przejdź do treści
AENEIA SIGNAL
Design / Signal

Pusty panel po pierwszym wejściu: pokaż, od czego można zacząć

Pusty panel powinien wyjaśniać przyczynę braku danych i drogę do pierwszego własnego wyniku. Oddziel przykład, dostęp, błąd odczytu i zapis.

Koncepcja świata Aeneia: rzemieślniczka prowadzi długi ciemny warkocz przez czerwony grzebień w jasnej pracowni.
W tym artykule

Panel obiecuje partnerowi „Twoje kolekcje”, po czym pokazuje ogromną białą przestrzeń i przycisk „Utwórz”. Co utworzyć, z czego i po co — na te pytania użytkownik ma najwyraźniej odpowiedzieć siłą wyobraźni. W centrum ekranu siedzi sympatyczna ilustracja pudełka. Pudełko przynajmniej wie, czym jest.

W wymyślonej bibliotece Rama nowy partner ma przygotować zestaw materiałów do kampanii. Pierwszym własnym rezultatem będzie zapisana kolekcja z jednym przesłanym plikiem, do której można później wrócić. To skromny cel, ale pozwala sprawdzić całą drogę: zrozumienie pustego panelu, rozpoczęcie pracy, zapis oraz odnalezienie wyniku. Samo zamknięcie powitalnego okienka jeszcze nim nie jest.

Najpierw ustal, co naprawdę jest puste

Zanim zaprojektujesz zachętę do działania, sprawdź z zespołem przyczynę braku zawartości. Nowy partner bez kolekcji, osoba bez uprawnień i użytkownik po nieudanej próbie wczytania mogą widzieć równie pusty prostokąt. Potrzebują jednak innych informacji. Ekran „Dodaj pierwszą kolekcję” wyświetlony po awarii może skłonić kogoś do odtwarzania istniejącej pracy, której system chwilowo nie pokazuje.

Carbon opisuje osobno brak danych, stan po działaniu użytkownika i problemy z wyświetleniem danych. To użyteczne rozróżnienie przy przygotowaniu widoków. Nie daje jednak aplikacji wiedzy o przyczynie pustki. Warunek pokazania każdego komunikatu trzeba uzgodnić z osobami odpowiedzialnymi za działanie konkretnego narzędzia.

W Ramie projektujemy cztery sytuacje. Każda powinna mieć osobny warunek i odpowiedź na pytanie użytkownika:

  • Nowe konto nie ma jeszcze własnych kolekcji. Wyjaśniamy, co tutaj powstanie, i pokazujemy początek tworzenia.
  • Kolekcje istnieją, lecz aktywny filtr ich nie obejmuje. Pokazujemy brak dopasowań oraz możliwość zmiany filtra, zachowując jego aktualną wartość.
  • Konto nie ma dostępu do wybranej przestrzeni. Wyjaśniamy ograniczenie i uzgodnioną drogę uzyskania dostępu, zamiast zachęcać do tworzenia kopii materiałów.
  • Nie udało się wczytać listy. Informujemy o nieudanym odczycie; proponowane ponowienie dotyczy pobrania listy, a nie powtórzenia wcześniejszego zapisu kolekcji.

Brak dopasowań łączy się z komunikacją filtrów i wyników: zero dopasowań nie oznacza zera zasobów. Warto sprawdzić również powrót z innego widoku, w którym zapamiętano filtr. Użytkownik może wejść pierwszy raz na dany ekran, chociaż konto zawiera już materiały. „Pierwsza wizyta” nie jest więc wystarczającym warunkiem komunikatu o braku kolekcji.

Pokaż również, do jakiej przestrzeni należy bieżący widok. Partner pracujący dla dwóch marek może wejść do nowej, pustej przestrzeni i uznać, że zniknęły materiały z poprzedniej. Nazwa organizacji lub kampanii pomaga zrozumieć zakres listy. W takim przypadku tworzenie kolejnej kolekcji na ślepo pogłębi problem: pierwszy plik trafi do niewłaściwego miejsca. W próbie sprawdź, czy partner rozpoznaje wybraną przestrzeń przed dodaniem materiału. Nie odkładaj tej kontroli do momentu udostępniania.

Oczekiwanie na odczyt także nie powinno udawać potwierdzonego braku danych. Jeżeli przez chwilę pokazujesz pusty stan, a następnie pojawia się lista, pierwsza instrukcja okazuje się fałszywym alarmem. Zaprojektuj przejście z wczytywania do wyniku albo błędu. Przy operacji trwającej dłużej przyda się model opisany w tekście o postępie, przerwaniu i powrocie do zadania.

Są też przestrzenie, w których użytkownik niczego sam nie doda. Partner może oczekiwać na materiały przygotowywane przez opiekuna. W takim wariancie przycisk „Utwórz” nie rozwiązuje sytuacji. Stack Overflow Design System rozróżnia pusty stan z dostępnym działaniem oraz sytuację wymagającą wyjaśnienia oczekiwań. Własny komunikat Ramy powinien wynikać z ustalonego procesu: kto dostarczy pliki i jak partner dowie się o ich gotowości. Nie dopisuj daty, której nikt nie potwierdził.

Od „Utwórz” do pierwszego pliku

Dla konta, które może samodzielnie pracować, zaczynamy od krótkiego wyjaśnienia: „Zbieraj materiały kampanii w kolekcjach. Utwórz pierwszą kolekcję i dodaj do niej plik”. Przycisk nazywamy „Utwórz kolekcję”. Informacja odpowiada na pytania, co będzie w tym miejscu i co zrobić teraz. Nie musi od razu opisywać wszystkich metod zarządzania biblioteką.

Następny ekran powinien podtrzymać tę samą czynność. Jeśli przycisk prowadzi do formularza nazwanego „Nowy zasób”, użytkownik musi odgadnąć, czy trafił we właściwe miejsce. Ujednolić trzeba również nazwy po zapisie: kolekcja nie powinna nagle stać się projektem albo folderem bez wyjaśnienia różnicy. To zadanie dla projektu treści i modelu pojęć, nie dla dłuższej instrukcji na pustym ekranie.

Przejdź przez formularz z danymi, które nowy partner rzeczywiście ma. Nazwę kampanii może znać, ale numer wewnętrznego zlecenia bywa dostępny dopiero później. Jeżeli pole jest obowiązkowe z powodu procesu firmy, pokaż, skąd uzyskać wartość. Jeśli nie jest potrzebne do pierwszego zapisu, rozważ odłożenie go na później. Nie nazywaj kroku prostym, zanim sprawdzisz jego wymagania.

Po zapisaniu kolekcji pusty stan zmienia zakres. Nie brakuje już kolekcji; brakuje plików w konkretnej kolekcji. Można pokazać jej nazwę i działanie „Dodaj plik”. Powtarzanie ogólnego powitania sprawia wrażenie, że poprzedni krok nie został zachowany. Tak samo niepokojący będzie przycisk „Zacznij”, który po wykonaniu pracy nadal prowadzi od początku tej samej ścieżki.

Plik potrzebny do próby przygotuj z wyprzedzeniem. W sesji badawczej partner nie powinien szukać prywatnego materiału tylko po to, aby wypełnić pusty widok. W rzeczywistym narzędziu informacja przy dodawaniu powinna wyjaśniać obsługiwane formaty i ograniczenia. Gdy przesyłanie się nie powiedzie, kolekcja może już istnieć. Wskaż więc błąd pliku we właściwym miejscu, zamiast cofać całe doświadczenie do hasła „Nie masz jeszcze kolekcji”.

Dojrzała badaczka testuje czerwony elastyczny materiał rękawicą z porcelanowymi końcówkami.
Fotografia koncepcyjna AeneiaMateriał, który pamięta użycie

Po przesłaniu pliku użytkownik powinien rozpoznać rezultat. Pokaż zapisany plik w utworzonej kolekcji i informację odpowiadającą rzeczywistemu stanowi. Sam komunikat „Gotowe” nie wyjaśnia, czy plik jest zapisany, nadal przetwarzany, czy dostępny tylko w bieżącym podglądzie. Sprawdź przejście do listy i ponowne otwarcie kolekcji. Dopiero wtedy wiadomo, czy rezultat przeżył opuszczenie ekranu.

Zapisany plik nie musi być jeszcze udostępniony odbiorcom. Jeżeli biblioteka rozdziela te czynności, pierwsza ścieżka powinna zachować tę granicę. Pokaż aktualny zakres widoczności w miejscu, w którym użytkownik podejmuje decyzję. Nie sugeruj, że testowy materiał trafił już do wszystkich partnerów, jeśli pozostaje w prywatnej kolekcji. I odwrotnie: jeśli pierwszy zapis od razu udostępnia plik zespołowi, wyjaśnij ten skutek przed przesłaniem.

Porównaj tę drogę z wycieczką po przyciskach. Można pokazać pięć dymków i nie doprowadzić do żadnego własnego pliku. Można też wyjaśnić jedną czynność we właściwej chwili i pozwolić partnerowi skończyć zadanie. Liczba zamkniętych podpowiedzi opisuje korzystanie z podpowiedzi; nie zastępuje sprawdzenia, czy powstał zaplanowany rezultat.

Próbka ma pokazywać możliwość, a nie udawać pracę partnera

Czasem pojęcie kolekcji łatwiej wyjaśnić na przykładzie. Możesz rozważyć widok przykładowego zestawu, jeżeli mieści się on w uzgodnionych funkcjach narzędzia. Nazwij go wyraźnie: „Przykład kolekcji”. Osoba powinna rozumieć, że pokazane pliki nie zostały dodane przez jej firmę. Ładna miniatura z nazwą prawdziwego klienta może sugerować relację, która w ogóle nie istnieje.

Oddziel oglądanie przykładu od tworzenia własnej kolekcji. Jeśli kliknięcie kopiuje próbkę, wyjaśnij, co znajdzie się na koncie po tej operacji. Jeśli to tylko obraz, nie stylizuj znajdujących się na nim przycisków tak, aby wyglądały na działające. Zasady interaktywnego demo pomagają rozpoznać tę granicę, ale demonstracja sama nie potwierdza, że partner umie dodać własny materiał.

Próbne dane wymagają również przemyślenia dalszej drogi. Czy kolekcja przykładowa pojawi się w eksporcie albo w miejscu przeznaczonym do udostępniania? Czy usunięcie przykładu będzie jednoznaczne? Czy po usunięciu nadal wiadomo, jak zacząć własną pracę? Nie wypełniaj pustej przestrzeni atrapą tylko po to, aby panel wyglądał dojrzale na prezentacji. Odbiorca korzysta później z całego zachowania, razem z jego konsekwencjami.

Jeżeli przewodnik można zamknąć, sprawdź działanie panelu także po jego pominięciu. Przyciski i wyjaśnienia potrzebne do pierwszego zapisu nadal muszą być dostępne. Ustal, czy późniejszy powrót do pomocy rozpoczyna ją od nowa i czy nie zasłania rozpoczętego formularza. Osoba może zamknąć okno, aby obejrzeć panel, a nie dlatego, że zna już wszystkie pojęcia i nie potrzebuje żadnej wskazówki.

Dobierz pomoc do rzeczywistej przeszkody. Gdy użytkownik nie rozumie kolekcji, przyda się krótki przykład. Gdy rozumie, lecz nie ma jeszcze pliku, może potrzebować możliwości powrotu albo informacji, jak przygotować materiał. Gdy czeka na dostęp, samouczek o przesyłaniu będzie dodatkowym objazdem. Te trzy osoby nie powinny dostawać identycznej serii ekranów tylko dlatego, że żadna nie dodała pliku.

Część wiedzy może należeć do szerszego wdrożenia w wiedzę firmy, na przykład zasad nazewnictwa kampanii. W panelu pokaż tyle, ile potrzeba przy bieżącej decyzji, oraz trafny odsyłacz do pełnej instrukcji. Odesłanie do całego firmowego archiwum bez wskazania właściwego miejsca nie odpowiada na pytanie, co wpisać w obowiązkowym polu.

Sprawdź także mniejszy ekran i kolejność przechodzenia po elementach interfejsu. Jeśli ilustracja zajmuje całą pierwszą wysokość telefonu, najważniejsze wyjaśnienie może znaleźć się poza widocznym obszarem. Gdy partner korzysta z czytnika ekranu, powinien trafić na informację i dostępne działanie bez odczytywania serii bezużytecznych nagłówków pustej tabeli. Ostateczne zachowanie oceń w działającym widoku; sam obraz projektu nie potwierdzi kolejności odczytu.

Sprawdź pierwszą drogę, a później jej powtórzenie

Przed badaniem z partnerami wykonaj przejście poznawcze pierwszego użycia. Dla każdego kroku zapisz, jaką wiedzę ma nowy użytkownik i co pokazuje ekran. Jeżeli poprawna droga wymaga znajomości wewnętrznej nazwy przycisku, projekt ukrywa część instrukcji. Zespół może tego nie zauważyć, bo używa tej nazwy od miesięcy.

W próbie daj osobie cel związany z kampanią, bez dyktowania kolejnych kliknięć. Obserwuj, czy odróżnia przykład od własnych materiałów, rozumie wymagane dane i rozpoznaje zapisany rezultat. Zapisz także używaną pomoc. Jeżeli prowadzący wyjaśni pojęcie kolekcji, dalszy sukces dotyczy już drogi po tej podpowiedzi. To cenna obserwacja, ale inna niż samodzielne pierwsze użycie.

Sprawdź też wejście z zaproszenia lub zapisanego odsyłacza. Jeżeli prowadzi ono do konkretnej kolekcji, brak tego zasobu wymaga innej odpowiedzi niż pusta lista nowego konta. Strona 404 pomagająca odzyskać kontekst pomaga przemyśleć dalszą drogę. Przekierowanie każdego takiego wejścia do tworzenia nowej kolekcji może ukryć fakt, że użytkownik szukał już wskazanego materiału.

Na koniec wróć do panelu z tym samym kontem. Powinien pokazać istniejącą kolekcję w przewidzianym miejscu. Sprawdź również usunięcie ostatniego pliku z kolekcji oraz usunięcie ostatniej kolekcji. W obu przypadkach użytkownik zna już narzędzie, lecz pustka dotyczy innego poziomu. Treść nadal ma pomagać, bez twierdzenia, że właśnie założył konto. Takie rozróżnienia można uwzględnić w projekcie strony lub narzędzia w ramach Aeneia Design. W Ramie o powodzeniu świadczy kolekcja, do której partner umie wrócić — pudełko może wtedy spokojnie ustąpić miejsca materiałom.

Aeneia / Redakcja Aeneia

Tekst redakcyjny. Linki do źródeł znajdziesz w treści.

Źródła sprawdzone: .

O Aeneia
Aeneia / Initium

Od wiedzy do decyzji

Opowiedz nam, co chcesz uporządkować. Ustalimy, od czego zacząć.

Przejdź do kontaktu