Projektowanie dotyku Metro 3/3

Windows 8 jest systemem który będzie również dostępny na tabletach. Tymi urządzeniami sterujemy przy pomocy dotyku dlatego projektując aplikację metro trzeba wziąć pod uwagę iż nie zawsze będzie obsługiwana przy pomocy myszki a za pomocą dotyku.

System Windows 8 posiada zwiększony zestaw interakcji dotykowych, który jest używany w całym systemie. stosując ten zestaw w swoich aplikacjach sprawimy że stanie się znajoma dla użytkownika.

Przy projektowaniu interfejsu użytkownika trzeba wsiąść pod uwagę zasady:

1. Używaj palców do tego w czym są dobre – myszka i pióro są dokładne natomiast palce nie. Projektując interfejs musimy stosować duże elementy które wspierają bezpośrednią manipulację oraz dostarczają bogaty zestaw interakcji dotykowych.
   
2. Przeglądaj zawartość za pomocą dotyku – stosuj zoom semantyczny i panoramę które dobrze radzą sobie z prezentowaniem dużych treści, zamiast wielu kart i stron.
   
3. Pokaż reakcję – Zwiększaj zaufanie użytkownika poprzez zapewnienie natychmiastowej informacji, gdy ekran jest dotykany. Możesz tego dokonać stosując zmianę koloru, rozmiaru lub przesuwać element.
4. Zawartość podążająca za palcem – elementy które można przesuwać powinny krążyć za palcem. Natomiast elementy które nie poruszają się powinny powrócić do stany domyślnego po opuszczeniu palca z ich obrębu.
   
5. Zachowuj interakcje odwracalne – Interakcje dotykowe powinny być odwracalne, zapewniając wizualną reakcję na to, co się stanie, gdy użytkownik podniesie palec. Spowoduje to, że Twoja aplikacja będzie korzystała bezpiecznie z dotyku.
6. Zezwalaj na dowolną liczbę palców – Ludzie korzystają często z więcej niż jednego palca, nie zdając sobie z tego sprawy. Dlatego interakcje dotykowe nie powinny się zmieniać radykalnie, w zależności od liczby palców dotykających ekran.
7. Nie ograniczaj czasowo interakcji – Interakcje, które wymagają złożonych gestów, takich jak podwójne stuknięcie lub naciśnięcie i przytrzymanie, musza być wykonane w określonym czasie. Należy unikać interakcji czasowych, ponieważ są trudne i często wyzwalane przypadkowo.
   

Dostępne interakcje w Windows 8.

• wciśnij i przytrzymaj
  

• stuknij
  

• przesuń
  

• swipe do zaznaczenia, wydania polecenia i przesunięcia

• ściągnij i rozciągnij, aby zmienić rozmiar

• obróć
  

• swipe od krawędzi – pasek aplikacji
  

• swipe od krawędzi – pasek poleceń systemowych
  

Zakres dotyku

Tablety w przeciwieństwie do monitorów użytkownik nie będzie widział dobrze całego ekranu ponieważ część ekranu odejdzie na trzymanie tableta. Spróbuj zoptymalizować aplikację dla różnych rodzajów chwytów, ale jeśli interakcja naturalnie nadaje się do konkretnego chwytu, zoptymalizuj ją pod tym kątem.

Obszary interakcji: Ponieważ tablety najczęściej trzymane są za boki rogu, więc boki są idealną lokalizacją elementów interaktywnych.

Obszary czytania:Zawartość w górnej połowie ekranu jest łatwiejsza do zobaczenia niż w dolnej, która często blokowana jest przez ręce lub ignorowana.

Cztery najczęstsze chwyty.

• jedna ręka trzyma tablet, druga prowadzi interakcję
  
  • prawa lub dolna krawędź zapewnia szybką interakcję.
  • prawy dolny róg może zostać zablokowany przez nadgarstek
  • dotykanie jest bardziej dokładne.
  • czytanie, wyszukiwanie, pisanie.

• dwie ręce trzymają tablet, kciuki prowadzą interakcję.
  • lewy i prawy dolny narożnik zapewniają szybką interakcję.
  • umiejscowione kciuki zwiększają dokładność dotyku.
  • element znajdujący się na środku jest trudny do osiągnięcia.
  • dotknięcie środka ekranu wymaga zmiany postawy.
  • czytanie, przeglądanie, lekkie pisanie, granie.

• urządzenie leży na kolanach lub stole, obie ręce są w stanie prowadzić interakcję.
  
  • dół ekranu zapewnia szybką interakcję.
  • dolne narożniki mogą być blokowane przez nadgarstki.
  • dotyk jest bardzo dokładny.
  • czytanie, przeglądanie, pisanie długich tekstów.

• urządzenie stoi, możliwa jest interakcja lub jej brak.
  • dolna część ekranu zapewnia szybką interakcję.
  • dotknięcie górnej części ekranu pochłania zawartość.
  • dotknięcie górnej części ekranu może wytrącić urządzenie z równowagi.
  • interakcja w odległości zmniejsza czytelność i dokładność.
  • należy zwiększyć rozmiar elementu docelowego, aby poprawić czytelność i precyzję.
  • oglądanie filmu, słuchanie muzyki.

Celność dotyku

Rozmiar elementu ma durzy wpływ na jego celność. Nie ma konkretnych zasad w tej kwestii. Choć elementy z poważnymi akcjami (usuwanie, zamykanie, dodawanie) powinny być duże natomiast elementy z rzadziej stosowanymi akcjami mogą być mniejsze.

Ludzie często obwiniają się za to, że mają „tłuste palce”, ale nawet palce niemowląt są szersze niż większość celów dotykowych.

Obraz pokazuje szerokość palca przeciętnej dorosłej osoby, wynoszącą około 11 mm szerokości, choć niektórzy koszykarze mają palce szersze niż 19 mm, podczas gdy dziecko ma 8 mm.

Oto kilka informacji, jakiej wielkości powinny być cele dotykowe. Wytyczne rozmiarów celów.

• Zalecany minimalny rozmiar – 7×7 mm
  7×7 mm – jeśli błędny dotyk może zostać skorygowany w jednym lub dwóch gestach, lub w ciągu pięciu sekund to jest to dobra, minimalna wielkość. Odległość pomiędzy celami jest tak samo ważna, jak docelowa wielkość.
  

• Gdy ważna jest dokładność
  Zamykanie, usuwanie i inne działania z poważnymi konsekwencjami nie mogą pozwolić sobie na przypadkowe stuknięcia. Użyj wielkości 9×9 mm – jeśli dotyk złego elementu wymaga więcej niż dwóch gestów, jest dłuższy niż pięć sekund lub wymaga zmiany dużej części zawartości.
• Gdy, to po prostu się nie zmieści
  Możesz użyć wielkości 5×5 mm, jeśli akcje można skorygować za pomocą jednego gestu, w tym przypadku bardzo ważny jest 2 mm odstęp.

Single Post Navigation

← Older Entry

Newer Entry →