Wytyczne dotyczące projektowania witryn do gromadzenia danych

Wstęp

Podstawowym zadaniem dla większości pracowników opieki zdrowotnej, którzy korzystają z mobilnych aplikacji dotyczących zdrowia, jest wypełnianie kwestionariuszy.

Wprowadzanie danych może być trudne i występować błędy. Celem korzystania z biblioteki przechwytywania uporządkowanych danych (SDC) i wskazówek dotyczących projektowania jest zapewnienie użytkownikom lepszych możliwości wprowadzania danych oraz poprawienie ich jakości.

Cztery tematy omawiane w tej sekcji to:

1. Układ i nawigacja
2. Pytania i instrukcje
3. Zbieranie danych
4. Sprawdzanie poprawności danych i komunikaty o błędach

Układ i nawigacja

Długie przewijanie i podział na strony

Układ z długim przewijaniem (w lewo) i podział na strony (po prawej).

Pakiet Android FHIR SDK ma 2 opcje układu do wyboru:

1. Długie przewijanie (domyślnie)
2. Z podziałem na strony

Kwestionariusz z długim przewijaniem wyświetla wszystkie pytania na jednej stronie, a użytkownicy przechodzą do każdego z nich, przewijając je.

Kwestionariusz podzielony na strony wyświetla treść na osobnych stronach. Powiązane pytania i pola do wprowadzania danych można zebrać na jednej stronie. Przyciski Wstecz i Dalej są zakotwiczone na dole strony i umożliwiają przechodzenie między stronami.

Dowiedz się, jak utworzyć kwestionariusz z podziałem na strony na GitHubie

Który układ wybierzesz?

Każda opcja układu ma swoje zalety i wady. Poniżej znajdziesz opis niektórych atrybutów każdego układu, które warto wziąć pod uwagę podczas wyboru układu.

	Długie przewijanie	Z podziałem na strony
Szybkość nawigacji	Szybsza nawigacja	Wolniejsza nawigacja
Dokładność nawigacji	Mniej precyzyjna nawigacja	Dokładniejsza nawigacja
Skup się na pytaniu po zmianie zadania	Trudno zmienić orientację po przerwie	Łatwiejsza zmiana orientacji po przerwie
Wypełnienie cyfrowego kwestionariusza po wizycie (kopia z papieru)	Łatwiejsze kopiowanie z papieru	Trudniejsze przy kopiowaniu z papieru
Małe ekrany	Gorzej na małych ekranach	Lepsze na małe ekrany
Ułatwienia dostępu	Gorsze ze względu na ułatwienia dostępu. Trudna nawigacja.	Lepsze ułatwienia dostępu. Wyjątkowe ekrany, które mogą być obsługiwane przez czytniki ekranu, zamianę tekstu na mowę i inne technologie.
Miejsce na instrukcje i objaśnienia	Gorzej, jeśli chodzi o wskazówki i instrukcje	Zawiera dokładniejsze wskazówki i instrukcje

Długie przewijanie

Tak – pytania liczbowe
Ponumeruj pytania, aby ułatwić poruszanie się w układzie pojedynczej strony.

Tak – zmień rozmiar czcionki
Zmniejsz rozmiar czcionki tytułów pytań podczas korzystania z długiego przewijania, aby na ekranie było widocznych więcej treści. Przykład: długie przewijanie ma 16 pikseli. Podział na strony ma 28 pikseli.

Podział na strony

Tak – po 1 pytaniu na stronę
Klawiatury, menu i inne komponenty zajmują miejsce na stronie, dlatego staraj się umieszczać 1 pytanie na stronie.

Nie – ukryj treści w części strony widocznej po przewinięciu
Treść powinna być widoczna w części strony widocznej na ekranie.

Tak – pogrupuj powiązane treści w jedno pytanie
Przykład: te 3 pola tekstowe są związane z alternatywnymi danymi osoby kontaktowej, więc są zgrupowane na jednej stronie.

Nie – grupuj niepowiązane treści
Unikaj grupowania niepowiązanych treści na jednej stronie, aby uniknąć nieporozumień.

Wskaźnik postępu

Wskaźnik postępu pokazuje postępy w kwestionariuszu.

Dołącz wskaźnik postępu w długich kwestionariuszach, aby ułatwić użytkownikom nawigację i obserwowanie postępów. Wskaźniki postępu pokazują lokalizację kwestionariusza i informację, ile zostało do końca.

Tak – układ z długim przewijaniem
Umieść element u góry nad pytaniem i kotwicą, aby był zawsze widoczny nawet podczas przewijania.

Tak – tylko układ z podziałem na strony
Zamiast tego można umieścić go u dołu, nad przyciskami Wstecz i Dalej. W tym układzie możesz też wyświetlać stronę, na której znajduje się użytkownik.

Przyciski nawigacyjne

Przyciski nawigacyjne (Wstecz, Dalej) są zakotwiczone na dole kwestionariusza. W przewijaniu nieskończonym lub na ostatniej stronie kwestionariusza podzielonego na strony przycisk Dalej jest oznaczony etykietą Prześlij.

Przyciski należy umieścić w jednym miejscu i zawsze używać aktywnych przycisków oznaczonych etykietami z opisem ich działania, np. Wstecz i Dalej.

Tak – Aktywne przyciski
Zawsze wyświetlaj aktywne przyciski, nawet jeśli formularze są niekompletne. Po kliknięciu Dalej pokaż wyskakujące okienko z instrukcjami dotyczącymi uzupełniania brakujących pól lub błędów weryfikacji.

Nie – nieaktywne przyciski
Nieaktywne przyciski utrudniają użytkownikom znalezienie rozwiązania problemu.

Nie – przyciski zawierające tylko ikonę
Unikaj przycisków, które zawierają tylko ikonę. Przyciski zawsze należy oznaczać opisami.

Pytania i instrukcje

Omówienie 9 komponentów omówionych w tej sekcji oraz sposobu ich łączenia w kwestionariuszu podzielonym na strony.

1. Tytuł kwestionariusza.
2. Wskaźnik postępu.
3. Nagłówek grupy.
4. Tytuł pytania.
5. Instrukcje
6. Pole do wprowadzania danych.
7. Format wpisu.
8. Pola wymagane.
9. Pomoc.

Nagłówek grupy

Nagłówek grupy to nagłówek tekstowy wyświetlany nad tytułami pytań.

Użyj nagłówka grupy, aby pogrupować podobne pytania. Używaj nagłówka grupy tylko wtedy, gdy zawiera przydatne informacje.

Tak – krótkie tytuły
Do grupowania podobnych pytań używaj krótkiego tytułu. Przykład: wszystkie pytania związane z historią pacjenta są pogrupowane.

Nie należy robić – długie tytuły
Unikaj skomplikowanych tytułów lub długich tytułów, które przekraczają 1 wiersz.

Tytuł pytania

Tytuł pytania zwięźle opisuje, jakich informacji dotyczy prośba. Tytuły pytań mają największy rozmiar czcionki na stronie, aby przyciągnąć uwagę użytkownika.

Każda strona i każda strona powinny mieć tytuł pytania. Tytuły pytań powinny być krótkie lub sformułowane w formie pytania.

Tak – krótki tytuł pytania
Krótkie tytuły ułatwiają czytelnikom czytanie.

Nie – długi tytuł pytania
Unikaj bardzo długich pytań i zagnieżdżania 2 pytań razem.

Nie – brak tytułu pytania
Zawsze podawaj tytuł pytania, aby użytkownicy wiedzieli, jakie informacje muszą wpisać.

Instrukcje

Instrukcje to opcjonalne pole tekstowe widoczne pod tytułem pytania.

W polu instructions wyjaśnij odpowiednie instrukcje, np. czy pytanie jest wymagane, ile opcji można wybrać (jeden lub wiele) oraz co użytkownicy powinni zrobić, jeśli nie mogą podać wszystkich informacji lub odpowiedzieć na pytanie.

Tak – wyjaśnij, co jest wymagane
Użyj pola instrukcji, aby poinformować, czy pytanie jest wymagane i ile można wybrać opcji.

Zalecane działanie – wyjaśnij, co zrobić w przypadku przypadków skrajnych
Użyj instrukcji, aby poinformować użytkowników, co mają zrobić w sytuacji, gdy nie uda im się wypełnić wszystkich pól.

Tak – objaśnij kontekst lub definicje
Użyj instrukcji, aby podać dodatkowy kontekst lub definicje terminów użytych w tytule pytania.

Tekst etykiety

Tekst etykiety informuje użytkowników o tym, jakie informacje są wymagane w polu tekstowym lub menu. Gdy pole jest zaznaczone, tekst etykiety przenosi się ze środka pola tekstowego do góry.

Każde pole tekstowe i pole menu powinny mieć etykietę. Tekst etykiety powinien być krótki, czytelny i w pełni widoczny.

Tak – zachowaj zwięzłość
Tekst etykiety powinien być krótki, jasny i w pełni widoczny.

Unikaj tekstu – stosuj rozwagę
Tekst etykiety nie może być zbyt długi, przycięty ani zajmować wielu wierszy.

Nie – brak etykiety
Zawsze dodawaj etykiety do pola tekstowego, aby użytkownicy wiedzieli, jakie informacje mają podać.

Format wpisu

Pod polem tekstowym wyświetla się EntryFormat, który informuje użytkowników o tym, w jakim formacie należy wpisać dane. Komunikaty o błędach będą wyświetlane w polu EntryFormat i zastąpią istniejące instrukcje EntryFormat.

Stosuj format EntryFormat dla dat, numerów telefonów, jednostek i liczb całkowitych.

Tak – użyj formatu EntryFormat
Wyświetlaj format daty poniżej pola i dodaj wyrażenie opisowe.

Nie – brak elementu EntryFormat
Brak formatów danych może spowodować, że dane zostaną wpisane nieprawidłowo.

Tak – pokaż normalny zakres
Wpisując zakresy medyczne, podaj przykłady normalnego zakresu. Może to pomóc użytkownikom wychwycić błędy lub liczby, które są poza zakresem.

Pola wymagane

Pola wymagane wskazują, że użytkownik musi wypełnić pole, a do czasu jego wypełnienia nie może on przejść dalej.

Aby wskazać, że pole jest wymagane, umieść na końcu tytułu pytania gwiazdkę (*). W polu instrukcji wpisz „wymagane pytanie”, ponieważ nie jest to oczywiste, co oznacza gwiazdka (*). Jeśli nie ma tytułu pytania, w tekście na etykiecie umieść gwiazdkę (*).

Tak – pisemne wyjaśnienie
Pokaż pole jest wymagane gwiazdką (*) i załącz pisemne instrukcje, które wskazują „wymagane pytanie”. Wiele osób nie wie, co oznacza gwiazdka(*), więc może skorzystać z wyjaśnienia.

Nie – brak wyjaśnienia
Nie pokazuj tylko gwiazdki (*) bez dodatkowego opisu.

Tak – lokalizuj terminologię
Używaj terminów, które najlepiej znają Twoi użytkownicy. Przykład: „Wymagane” może być lepiej znane i używane w niektórych krajach zamiast słowa „Wymagane”.

Tak – zamiast tego podaj pytania opcjonalne
Jeśli wymagane jest większość pytań, wskaż, które z nich są opcjonalne.

Tak – zamiast tego pokaż gwiazdkę w tekście etykiety
Jeśli nie ma tytułu pytania, w tekście etykiety pojawi się gwiazdka.

Pomoc

Obok tytułu pytania wyświetli się ikona pomocy. Po jej kliknięciu wyświetli się pole z dodatkowymi informacjami. Ponowne kliknięcie ikony zamyka okno z informacjami o pomocy.

Jest to składnik opcjonalny. Używaj tylko wtedy, gdy przydatne jest wyświetlanie dodatkowych informacji, które nie muszą być zawsze widoczne.

Tak – w polu pomocy pokazuj opcjonalne informacje
Korzystaj z pomocy w przypadku informacji, które użytkownicy mogą zobaczyć tylko raz lub zawierają dodatkowe informacje.

Nie należy robić tego – ukryj instrukcje w polu pomocy
Staraj się nie ukrywać instrukcji w polu pomocy, które powinny być widoczne dla wszystkich.

Przechwytywanie danych

8 podstawowych komponentów zbierania danych w pakiecie Android FHIR SDK.

Kiedy używać którego komponentu?

Typ wprowadzania danych	Wybór wartości logicznej	Pojedynczy wybór	Jednokrotny wybór	Otwórz wybór	Menu	Selektor daty	Pole tekstowe	Suwak	Autouzupełnianie
Wybierz „Tak” lub „Nie”
Wybierz jedną opcję									Ostrzeżenie:
Wybierz kilka opcji									Ostrzeżenie:
Tekst
Daty
Numbers								Ostrzeżenie:

Pola tekstowe

Pola tekstowe wskazują, że użytkownicy mogą wpisywać informacje.

Korzystaj z pól tekstowych, gdy ktoś chce wpisać w kwestionariuszu tekst, np. imię i nazwisko, numer telefonu czy adres. Ogranicz wprowadzanie danych, które wymagają podania tekstu (klawiatury), gdy zamiast tego można użyć wstępnie wypełnionego pola wyboru (wielokrotnego wyboru lub jednokrotnego wyboru).

Więcej informacji o polach tekstowych na stronie material.io

Tak – używaj pól tekstowych do wprowadzania unikalnych danych
Używaj pól tekstowych do wpisywania danych, które wymagają wpisywania unikalnych słów lub cyfr.

Nie rób tego – ogranicz korzystanie z swobodnych odpowiedzi tekstowych
Unikaj tworzenia dowolnych odpowiedzi tekstowych, gdy może to być wielokrotny wybór, menu lub jednokrotny wybór.

Jednokrotny wybór i wartość logiczna

Pojedynczy wybór i wartość logiczna to elementy sterujące, które pojawiają się jako przyciski wyboru, gdy użytkownik zostanie poproszony o wybranie jednej opcji.

Gdy występuje wartość binarna „Tak” lub „Nie”, użyj wartości boolean choice. W przeciwnym razie użyj komponentu pojedynczego wyboru. Jeśli na liście jest więcej niż 10 opcji, użyj menu zamiast jednego wyboru. Menu jest bardziej gęste i łatwiejsze w obsłudze, gdy dostępnych jest wiele opcji.

Tak – opcja logiczna
Jeśli dostępne opcje to „yes” (tak) i „no” (nie), użyj wartości logicznej.

Tak – pojedyncza opcja
Używaj pojedynczego wyboru, gdy użytkownicy mogą wybrać jedną opcję z listy.

Nie należy robić tego – bardzo długie listy
Unikaj jednego wyboru w przypadku bardzo długich list (ponad 10). Zamiast tego użyj menu.

Selektor daty

Selektor daty umożliwia użytkownikom wpisywanie dat zarówno za pomocą selektora daty w kalendarzu, jak i klawiatury. Selektor daty w kalendarzu jest aktywowany po kliknięciu ikony kalendarza.

Używaj selektora daty kalendarzowej tylko w przypadku dat, które są bliskie dzisiejszej daty, np. ostatniej miesiączki lub kolejnej wizyty. W przeciwnym razie ustawiaj priorytety wpisywania z klawiatury dat takich jak data urodzenia.

Tak – obie opcje wprowadzania danych
W przypadku wpisywania dat włącz funkcję wpisywania dat za pomocą klawiatury (klikając pole tekstowe) i selektor daty w kalendarzu (klikając ikonę).

Nie działaj – unikaj tylko kalendarza
Nie włączaj selektora dat kalendarza jako jedynej metody wprowadzania dat urodzenia. Przechodzenie do miesiąca i roku jest trudne.

Menu

W menu użytkownicy mogą wybierać spośród wielu opcji. Gdy użytkownik zacznie pisać, opcje zostaną odfiltrowane na podstawie wpisanego tekstu. Dzięki temu użytkownicy mogą szybko znaleźć odpowiednią opcję z dużej listy.

Menu to świetna alternatywa dla pojedynczego wyboru, jeśli lista opcji jest bardzo długa (ponad 10 opcji), ponieważ zajmuje mniej miejsca.

Tak – używaj w przypadku długich list
Użyj menu, gdy wybierasz jedną opcję z bardzo długiej listy, np. stanu lub miasta.

Nie działaj – pisanie jest proste
Unikaj używania menu w sytuacjach, gdy łatwiej będzie wpisać treść, zamiast przewijania wszystkich opcji (np. wieku).

Jednokrotny wybór

Wielokrotny wybór to element sterujący, który wyświetla się jako pola wyboru, gdy użytkownicy mogą tworzyć wiele sekcji z listy opcji.

Używaj opcji wielokrotnego wyboru, jeśli użytkownicy mogą wybrać tylko coś z wcześniej ustalonej listy. Jeśli użytkownicy mogą też dodawać własne bezpłatne odpowiedzi, zamiast tego użyj komponentu otwarty wybór. W polu instructions wpisz „Zaznacz wszystkie pasujące odpowiedzi”, aby użytkownicy wiedzieli, że mogą wybrać wiele opcji.

Tak – 1 zaznaczenie w wierszu
Domyślnym wyglądem jest kontener wokół pól wyboru, aby klikalny obszar był oczywisty.

Nie – wiele opcji w wierszu
Unikaj wyświetlania wielu opcji w jednym wierszu. Różni się rozmiar ekranu telefonu i rozmiar tekstu mogą spowodować przycięcie tekstu.

Otwórz wybór

Pytanie otwarte działa podobnie do wielokrotnego wyboru, ale dodatkowo umożliwia użytkownikowi wybranie opcji Inne i wpisanie dowolnego tekstu.

Używaj otwartej opcji, jeśli istnieje wstępnie skonfigurowana lista opcji, ale użytkownicy mogą też dodawać dodatkowe opcje. Użyj opcji open source, jeśli jest znana większość opcji, ale prawdopodobnie niektórzy użytkownicy wybiorą opcję Inne, bo żadna z dostępnych opcji nie ma zastosowania.

Tak – użyj, aby zbierać dokładniejsze dane
Używaj, gdy ważne jest, aby gromadzić dokładne dane i nie możesz zastosować żadnej ze wstępnie zdefiniowanych opcji. Przykład: zawód.

Nie – jeśli wszystkie odpowiedzi będą inne
Unikaj używania tego typu opcji, jeśli większość odpowiedzi wymagałaby wyboru Inne. W takim przypadku użyj pola tekstowego lub akapitu.

Suwak

Suwaki umożliwiają użytkownikom wybieranie wartości z zakresu. Suwak w pakiecie SDK FHIR Androida to oddzielny suwak. Suwak dyskretny pozwala użytkownikom wybrać konkretną wartość z gotowego zakresu. Za pomocą znaczników możesz oznaczać dostępne wartości. Unikaj używania suwaka do wprowadzania danych liczbowych. Zamiast tego użyj pola tekstowego lub menu.

Więcej informacji o suwakach na stronie material.io

Nie – użyj suwaka w przypadku określonych liczb
Jeśli zakres jest duży, nie używaj suwaka w przypadku konkretnych wartości. Zamiast tego użyj pól tekstowych przy użyciu klawiatury.

Sprawdzanie poprawności danych i błędy

Walidacja danych

Weryfikacja danych ogranicza typ danych lub wartości, które można wpisać w polu tekstowym. Sprawdzanie poprawności danych może poprawić jakość zbieranych danych.

Użyj pola EntryFormat, aby wyświetlić ograniczenia dotyczące formatu lub wartości. Wyświetlaj istotne komunikaty o błędach weryfikacji danych w tekście i natychmiast, aby użytkownicy mogli go naprawić.

Tak – pokaż ograniczenia weryfikacji
Z góry zaprezentuj ograniczenia weryfikacji danych, aby użytkownicy wiedzieli, jak wpisać dane.

Niezalecane – ukryj ograniczenia weryfikacji
Jeśli nie podasz liczby cyfr, jaką powinien mieć numer telefonu, użytkownicy prawdopodobnie napotkają błąd, a jego przeprowadzenie zajmie więcej czasu.

Tak – od razu pokaż błędy weryfikacji
Pokazuj istotne błędy weryfikacji danych natychmiast po uzupełnieniu pola. Komunikaty o błędach zastępują dotychczasowy format wpisu.

Nie – poczekaj do momentu przesłania prośby
Nie czekaj, aż użytkownik po raz pierwszy kliknie „Prześlij”, aby wyświetlić błędy weryfikacji.

Błędy

Komunikaty o błędach informują użytkowników, że coś pójdzie nie tak, oraz informują, jak rozwiązać problem.

Informuj o błędach za pomocą kolorów, ikon i tekstu.

Więcej informacji o komunikatach o błędach na stronie material.io

Tak – jasno opisz, jak naprawić błąd
Wyjaśnij, dlaczego wystąpił błąd (pytanie wymagane) i co można zrobić, żeby to zmienić (wybierz jedno).

Nie – wpisz tylko „błąd”
Komunikat o błędzie, który brzmi tylko „błąd”, nie informuje użytkowników, jak naprawić błąd.

Tak – wyjaśnij, jak naprawić błąd bez podania przyczyny
Przykład: „Nieprawidłowy format daty. Użyj formatu dd/mm/rrrr”.

Nie – obwiniaj użytkownika
Nie obwiniaj użytkownika komunikatami o błędach zawierającymi słowa „Ty”, np. „Podano nieprawidłowy format daty”.

Tak – wiele wskazówek
Użyj koloru, ikon i tekstu, aby poinformować użytkowników, że popełniono błąd.

Nie — polegaj tylko na kolorze
Aby pomóc z częstymi wadami wzroku takimi jak daltonizm na czerwono-zielone, unikaj informowania o błędzie wyłącznie na podstawie koloru.

Nie – nadużywanie ikon
Często wystarczy 1 ikona. Nie przesadzaj z wykorzystywaniem ikon do informowania o błędzie.