Programowanie użyteczności – metody i narzędzia

Użyteczność przejawia się na każdym etapie tworzenia produktu, począwszy od projektowania, przez testowanie po finalne programowanie. Stanowi niezbędny element serwisów i sklepów internetowych, pozwalający na poprawę ergonomii i wygodę obsługi różnych narzędzi.

Użyteczność odnosi się zarówno do projektów internetowych, jak również mobilnych, warto jednak wspomnieć, że jest także istotną i nieodłączną częścią serwisów przeznaczonych dla osób słabowidzących, słabosłyszących czy niepełnosprawnych ruchowo. Wspomniane we wcześniejszych wpisach metody i badania projektowania użyteczności wskazywały na szereg zagadnień ważnych dla użytkowników bez ogólnych dysfunkcji, nie można jednak zapominać o tym, że osoby wykluczone lub posiadające różnego rodzaju niepełnosprawności korzystają z tych samych serwisów, ale rozumieją użyteczność w nieco inny sposób.

Projektanci i programiści często nie mają wiedzy i świadomości na temat potrzeb związanych z dostępnością serwisów internetowych dla wybranych grup społecznych, rzadko biorą też pod uwagę aspekt korzystania przez niewidomych z czytnika ekranu i syntezatora mowy, dzięki którym osoby te są zintegrowane cyfrowo oraz mają dostęp do wielu informacji i usług. Ujęcie w prototypie, chociażby możliwości odczytywania tekstu z obrazka przez syntezator może być bardziej użyteczne dla odbiorców, dodatkowym plusem tego działania jest również wsparcie pozycjonowania takiego serwisu.

Według danych statystycznych wynika, że w Polsce jest ponad 500 tysięcy osób, które w okularach nie mogą przeczytać gazety i nie dotyczy to tylko osób starszych, również długotrwała praca przy komputerze powoduje przemęczenie i osłabienie wzroku, a w następstwie skutkuje próbą automatycznego powiększania tekstu na stronach WWW. Innym przykładem jest problematyka rozróżnienia barw u osób posiadających schorzenia związane z zaburzeniami wzroku, należy zatem uwzględnić to, że jedynym przekazem informacyjnym w serwisie nie może być kolor. Osoby słabosłyszące mają ograniczone możliwości korzystania z multimediów zastosowanych w serwisach, dlatego właśnie istotna w projekcie jest implementacja treści. Użytkownicy niepełnosprawni ruchowo, to kolejna grupa, dla której użyteczność serwisu jest niezwykle ważna, biorąc pod uwagę korzystanie z różnych dodatkowych narzędzi, poza klawiaturą i myszką, obsługa serwisu nie powinna być dla nich kłopotliwa. Wskazane wybrane zagadnienia pokazują jak duża i różnorodna jest grupa użytkowników, dla której odbiór danych w Internecie powinien być prostszy i wygodniejszy, bez względu na to, kto i o jakiej porze korzysta z serwisów internetowych. Dostępność stron i sklepów powinna być zatem uniwersalna.

Zagadnieniem dotyczącym treści, które zbadał Jakob Nielsen, jest ich czytelność w Internecie. Nielsen dowiódł, że 79% odbiorców nie czyta treści a jedynie skanuje je wzrokiem. Informacje te mogą być jednymi z wytycznych, jak opracowywać informacje w serwisie podczas projektowania oraz prototypowania dla większości odbiorców sklepów internetowych. Uniwersalną zasadą jest zatem uwzględnienie konkretnych i szczegółowych informacji a nie wprowadzanie nic nieznaczących szerokich opisów. Treści nie są jedynym aspektem serwisów. Istotny z punktu widzenia dostępności i użyteczności jest również:

  • kontrast kolorystyczny zastosowanego fontu do tła strony, zbyt niski spowoduje trudności w odczytywaniu strony,
  • wielkość fontu, zbyt mały nie pozwoli odczytać zawartych treści, a zbyt duży nie będzie komfortowy w odczytywaniu treści,
  • stosowanie odnośników z prawidłowym opisem, bez wyrażeń „kliknij tutaj”,
  • wprowadzanie treści przy znacznikach „alt” w kodzie źródłowym, opisujących grafiki i zdjęcia, pozwalające na odczytanie zawartości w przypadku błędnie wyświetlonego obrazka lub jego braku.

Obsługa i korzystanie z serwisów internetowych to prawidłowo opracowana struktura oraz architektura informacji, należy tutaj również uwzględnić rozmieszczenie elementów oraz możliwość korzystania z nich nie tylko przy pomocy myszki, ale również klawiatury czy innych urządzeń. Doskonałym przykładem może być tutaj rozwijane menu, które w przypadku braku myszki powoduje dyskomfort korzystania z serwisu. Wspomniane informacje oraz wytyczne to zbiór aspektów, które dotyczą treści serwisu oraz jego technologii, w tym poza elementami struktury, również budowy kodu źródłowego. W wielu przypadkach niestety powyższe dane w ogóle nie są brane pod uwagę, najważniejsza dla projektantów bywa jakość i wydajność często ujmowana w ładne opakowanie. Niestety takie działanie jest również odzwierciedleniem wiedzy i świadomości klientów zlecających projekt, którzy bardzo często w ogóle nie zastanawiają się nad takimi aspektami, uwzględniając własne wytyczne oraz ewentualne trendy rynkowe. Warto również wziąć pod uwagę to, że późniejsze nanoszenie zmian i próba wdrożenia poprawek w serwisie może być dużo bardziej czasochłonne oraz droższe niż opracowanie ich na samym początku tworzenia projektu oraz prototypu. Użyteczność serwisu dla mniej doświadczonych odbiorców powinna być jednym z głównych założeń przy opracowywaniu prototypów.

Wymienione zagadnienia oraz krótka charakterystyka różnorodnych grup odbiorców wskazuje jak ważna jest użyteczność i dostępność serwisów, z czym związana jest szeroka i multidyscyplinarna wiedza z różnych dziedzin, świadomość istnienia problemów, w tym spotykania się odbiorców z dyskomfortem w użytkowaniu serwisu czy z drugiej strony potrzeba estetyki i przyjemności korzystania ze stron internetowych. Połączenie tych wszystkich elementów pokazuje ogromne znaczenie jakim jest projektowanie prototypów, ale przeniesienie wszystkich danych do oprogramowania i wykorzystanie tej wiedzy w makietowaniu serwisów dopiero pozwala zrozumieć pełną funkcjonalność produktu. Wydawałoby się jednak, że tak szczegółowe informacje nie są potrzebne na etapie projektowania ani programowania, że ujęcie ich na etapie pisania kodu źródłowego jest wystarczające. Niestety nie jest to prawdą, pominięcie wspomnianych aspektów już na początku prac nad projektem wymusza na projektancie i programiście zastosowania późniejszych zmian, kiedy prototyp jest już w kolejnej fazie testów, niejednokrotnie wiąże się to z rozpoczynaniem projektu od nowa, a tym samym stratą czasu i generowaniem kosztów.

Tworzenie makiet serwisów, bez względu na ich wielkość, jest pracą czasochłonną a przede wszystkim wymagającą uwzględnienia wielu szczegółów, w tym różnych wymagań, przedsiębiorstwa, jak również potrzeb samych użytkowników, dlatego narzędzia wykorzystywane do prototypowania powinny charakteryzować się prostotą w użytkowaniu, łatwością w nauce, elastycznością w nanoszeniu zmian czy użytecznością pracy nad poszczególnymi komponentami. Na rynku jest już dostępnych wiele specjalistycznych narzędzi, pozwalających wesprzeć pracę nad prototypem serwisu, poniżej wymienione zostały trzy najbardziej polecane przez projektantów.

Axure to jeden z zaawansowanych programów do makietowania serwisów. Najczęściej wykorzystywany przez projektantów, jest aplikacją dosyć rozbudowaną, pozwalającą na opracowywanie założeń interfejsów, a także tworzenie poszczególnych elementów serwisu, jak choćby rozmieszczenia kategorii, zaprojektowania przycisków oraz interaktywnych elementów struktury serwisu.

Axure jest oprogramowaniem płatnym, ale weryfikacja jego zalet jest możliwa przez trzydzieści testowych dni, podczas których w prosty sposób można przekonać się o funkcjach oprogramowania, do których między innymi należy stworzenie prostej wizualizacji serwisu przez użytkownika, który nie jest programistą. Axure z powodzeniem pozwala na tworzenie makiet funkcjonalnych, diagramów przejść i scenariuszy użycia. Jest również doskonałym narzędziem do pracy nad projektem, do którego wgląd posiada kilka osób, jak choćby graficy, projektanci czy programiści, pozwala również na wyeksportowanie makiety na serwer, w celu przeprowadzania testów.

Oprogramowanie stało się niejako standardem na rynku i najczęściej mówi się o nim w aspekcie wyboru głównego narzędzia do projektowania, przede wszystkim dlatego, że ma wiele zalet. Do jednej z nich należy dziedziczenie zachowań, co pozwala na wprowadzenie zmian na głównej stronie projektowanego serwisu i automatyczne powielenie ich przez podstrony. Kolejną cechą jest dostępność wielu gotowych elementów i składowych, dzięki którym projektant może tworzyć biblioteki danych na swoje potrzeby oraz optymalizować czas pracy, zwłaszcza przy rozbudowanych makietach. Ostatnim podkreślanym przez projektantów elementem jest dynamiczność oraz interakcja zaprojektowanego prototypu. Axure pozwala na przetestowanie elementów projektu w bardzo zbliżony sposób do oryginalnego korzystania z serwisu, między innymi dzięki możliwości weryfikacji wprowadzania danych do formularzy, czy autouzupełniania danych. Niestety dla użytkowników początkujących nie jest to prosty program.

Axure. Źródło: oprogramowanie Axure

Moqups to kolejny program do opracowywania makiet i prototypów w Internecie. W przeciwieństwie do oprogramowania Axure, jest bezpłatny w wersji podstawowej oraz płatny w wersji rozszerzonej. Nie jest to również program, który wymaga instalacji na komputerze, projektant obsługuje go w trybie online. Intuicyjny i przejrzysty, pozwala tworzyć interfejsy laikom programistycznym.

Czynnikiem wyróżniającym Moqups od innych aplikacji jest posiadanie wielu gotowych szablonów, do wykorzystania. Przykładowe szablony oraz dostępne elementy do tworzenia projektów widoczne są już po uruchomieniu aplikacji. Umiejętności programistyczne są zbędne, ponieważ praca z programem polega na przenoszeniu elementów z bocznego paska interfejsu na obszar roboczy, czyli tak zwana metoda drag and drop. Plusem aplikacji jest również możliwość zapisania projektu w trybie offline lub w chmurze i udostępnienia go innym współpracownikom, poprzez wysłanie im wygenerowanego linku do projektu.

Moqups w wersji rozszerzonej – płatnej, pozwala na pracę nad większą liczbą projektów z innymi projektantami w czasie rzeczywistym oraz bieżącą ocenę postępu prac przez użytkownika czy klienta. Oprogramowanie jest przeznaczone dla tworzenia makiet dedykowanych aplikacjom mobilnym.

www.moqups.com

Polski program pozwalający na pracę kilku osób w trybie online. Prosty i intuicyjny w obsłudze, zawiera elementy programu Axure oraz Moqups, dzięki czemu jest przyjazny w użytkowaniu, mimo zawartych wielu zaawansowanych opcji. Program przed zakupem można przetestować bezpłatnie. Do zalet aplikacji UXPin należy zaliczyć możliwość pracy oraz przedstawienie wyników w trybie online, jak również zaproszenie kilku osób do realizacji projektu. Zawiera dużą bibliotekę elementów UI dla różnych urządzeń, szybkie i intuicyjne dodawanie elementów poprzez stosowanie techniki przeciągania i upuszczania elementów, a także współpracuje z plikami programu Adobe Photoshop. Do znikomych wad zalicza się sporadyczne problemy z brakiem kompatybilności niektórych elementów czy ograniczone opcje interaktywności.

UXPin oceniany jako jeden z najbardziej interesujących projektów polskiego rynku, pozwala w wersji płatnej na opracowywanie zaawansowanych makiet i prototypów, ale również udostępnia możliwość przeprowadzania testów użyteczności czy importowania plików do oprogramowania graficznego firmy Adobe. Twórcy aplikacji zadbali także o stałą aktualizację narzędzi, możliwość edytowania elementów makiety oraz możliwość testowania poprzez nagranie ścieżki ruchu myszki wykonywanej przez użytkownika. Ciekawostką jest również możliwość przedłużenia korzystania z bezpłatnego okresu testowego, poprzez wsparcie twórców w mediach społecznościowych.

www.uxpin.com

Wymienione narzędzia są tylko znikomą propozycją z całej gamy programów do tworzenia makiet i prototypów. Na rynku dostępnych jest jeszcze wiele podobnych narzędzi, warto wspomnieć między innymi o aplikacjach HotGloo, Balsamiq czy Pidoco. Wybór najlepszego oprogramowania do pracy powinno poprzedzić określenie specyfiki projektu, co z kolei pozwoli na zdiagnozowanie potrzeb oraz kryteriów a w dalszym etapie wpłynie na decyzję dotyczącą rozwiązań technologicznych i zapobiegnie ewentualnym ograniczeniom w projektowaniu. Warto ująć takie zagadnienia jak finalne urządzenie, na którym będzie działać serwis czy będzie to komputer, czy telefon, czy istotna jest responsywność czy interakcja, ile osób pracuje nad prototypem i czy każdy ma mieć do niego dostęp. Czy oprogramowanie powinno funkcjonować w ramach przeglądarki, czy ma być zainstalowaną aplikacją, jaką ceną należy się sugerować oraz czy przetestowanie prototypu będzie wymagało uczestniczenia innych użytkowników. W przypadku testów istotne jest oprogramowanie, które pozwala na wprowadzenie interaktywnych elementów oraz animacji.

Wielu projektantów często pracuje na dwóch, sporadycznie trzech narzędziach, które wzajemnie się uzupełniają. Wybór uzależniony jest od wielkości i zaawansowania projektów, niemniej jednak warto korzystać z dostępnych aplikacji zarówno przy opracowywaniu prostych, jak również zaawansowanych serwisów, w celu wypracowania jak najlepszej ich użyteczności. Zwłaszcza jest to istotne w projektowaniu serwisów mobilnych, które to z racji różnych funkcjonalności bywają o wiele bardziej wymagające w projektowaniu niż serwisy desktopowe, aczkolwiek w ich przypadku, również powiela się wiele błędów.


Źródła: How Users Read on the Web, www.nngroup.com/articles/how-users-read-on-the-web.

Dodaj komentarz

Twój adres e-mail nie zostanie opublikowany. Wymagane pola są oznaczone *