Grid: Boskie proporcje (teoria)

Oceń tę pracę

Siatki (ang. grids) to niezbyt popularny temat w krajowym środowisku projektowym, a który pojawia się czasem w dyskusjach, niekoniecznie oddając swój sens (zdarzyło mi się już kilkukrotnie słyszeć od klienta, bym mu poprawił siatki, mając na uwadze, że rozchodziło mu się o architekturę informacji).

Architekturę informacji – ale i layout – można opierać o siatki, ale nie jest to niezbędne dla czytelnej prezentacji danych (toczyłem zresztą w swoim czasie spór o to z jednym grafikiem). Podstawową przesłanką projektowania w oparciu o siatki jest teoria wywodząca się ze szkoły Pitagorejskiej (bliskiej mojej umysłowości), wg której u podstaw świata stały liczby i związki między nimi.

By pozwolić zrozumieć podstawy teorii siatki, spróbuję dokonać rekonstrukcji mojej wiedzy z zakresu studiów z filozofii 🙂

Elementy teorii piękna

Pitagorejczycy wierzyli, że najwyższym dobrem w świecie jest ład, który określali mianem harmonii (wcześniej ten termin nie istniał i to właśnie Pitagorejczycy nadali mu sens). Harmonia była wyrazem stosunków między poszczególnymi bytami, w tym stosunków w ramach elementów bytów. Teoria ta dotyczyła całej wiedzy na temat świata – zarówno spraw związanych z metafizyką jak i natury piękna, która jest przedmiotem estetyki. Wedle teorii tej by móc stwierdzić, czy dane dzieło jest piękne, należało zbadać stosunek poszczególnych części dzieła określanych mianem modułów. Dotyczyło to tak architektury, jak i sztuki sakralnej i użytkowej.

***

Na marginesie: na podstawie teorii piękna opartej o badanie stosunków modułów do siebie, powstał kanon (zapożyczony zresztą ze sztuki starożytnego Egiptu), w tym słynny kanon Leonarda da Vinci, zilustrowany jako mężczyzna z rozłożonymi ramionami, wpisany w kwadrat i koło.

***

Dążąc do określenia podziału idealnego, Pitagorejczycy odkryli liczbę φ (fi), wyznaczającą złote – czy też boskie – proporcje:

boska proporcja (łac. sectio aurea) – podział odcinka na dwie części tak, by stosunek długości dłuższej z nich do krótszej był taki sam, jak całego odcinka do części dłuższej (stosunek ten nazywa się złotą liczbą i oznacza grecką literą φ).”

Liczba ta odegrała kolosalne znaczenie w architekturze, wyznaczając m.in. ślimaczycę głowicy jońskiej (na rysunku poniżej).

Na jej bazie wzniesiono także m.in. Partenon (studium proporcji), wyrzeźbiono słynne posągi – Apolla Belwederskiego (studium proporcji) czy Afrodytę z Milo. Ma także ona znaczenie w ramach tego co wiemy z zakresu teorii widzenia: otóż oko ludzkie ulega wielu złudzeniom optycznym i tak na przykład, by uniknąć deformacji widzianej ludzkim okiem kolumny, leciutko pogrubia się ją w 1/3 wysokości.

Teoria siatki

W formie uproszczonej złote proporcje oddaje się w ramach trójpodziału, dzieląc płaszczyznę na trzy części, w celu wydzielenia ram dla kompozycji: 2/3 + 1/3 (poniżej).

Jak widać na powyższych rysunkach, stosując zasadę trójpodziału tworzymy coś w rodzaju siatki, na bazie której będziemy mogli zakomponować podstawowe bloki treści (zdjęcia, video, tekst), określić ich szerokości, odstępy między nimi, a czasem nawet i wysokości tak, że w ten sposób powstała kompozycja będzie spełniała warunki harmonii (w sensie teorii Pitagorejczyków rzecz jasna).

W malarstwie sztukę opartą o studium siatek rozpropagował holenderski malarz, Piet Mondrian.

Oczywiście nie wszystkie siatki zbudowane są o zasady złotego podziału. Czasem efektem końcowym ma być dynamiczna kompozycja, albo taka, która wywołuje w widzu rozdrażnienie, a nie poczucie harmonii.

Metoda kompozycji na bazie siatek przyjęła się także w ramach składu prasy, książek i drukowanych produktów reklamowych (rysunek poniżej). Jeśli zaś chodzi o WWW, to pierwszą bodajże stroną internetową zbudowaną w oparciu o siatkę była witryna New York Times. Ale o tym będzie już w osobnym wpisie, poświęconym praktyce stosowania siatek.

Polecam uwadze knigi:

  • L. Roberts, Grids: Creative Solutions for Graphic Design, Wiley, 2008.
  • G. Ambrose, P. Harris, Basics Design: Grids, AVA Publishing, 2008.
  • T. Samara, Making and Breaking the Grid: A Graphic Design Layout Workshop, Rockport Publishers, 2005.
  • K. Elam, Grid Systems: Principles of Organizing Type, Princeton Architectural Press, 2004.
  • B. Tondreau, Layout Essentials: 100 Design Principles for Using Grids, Rockport Publishers, 2009.

W języku polskim chociażby:

  • G. Ambrose, P. Harris, Twórcze projektowanie, PWN, 2007 (chociaż generalnie dość średnia to pozycja).
image_pdf

Clicktracking: coraz lepsze narzędzie

Oceń tę pracę

Jak pisałem wcześniej o clicktrackingu, to omawiałem dostępne systemy, z których można skorzystać, a dzięki którym możemy badać skuteczność naszej strony WWW – w przełożeniu na oddane kliknięcia – i poprawiać zauważone mankamenty. Ale, jak się okazuje, clicktracking jest w stanie dostarczyć nam wiedzy również odnośnie tego, w CO ludzie klikają, gdy klikają na elementy graficzne; które fragmenty grafik pobudzają ich do oddania kliknięcia w to, a nie inne miejsce. Te badania dostarczają nam z jednej strony wiedzy na temat podnoszenia skuteczności reklam (w przeliczeniu na kliki) nie posilając się przy tym „metodami szemranymi”, w ramach których okłamuje się użytkowników umieszczając na grafikach elementy przypominające interfejsy (takie jak chociażby niby-radiobutton), z drugiej strony mówią nam coś na temat tego jak informacje pobierane przez percepcję wzrokową przekładane są na nasze decyzje i odnotowywane w formie kliknięć… co do piksela. Jak wcześniej palec wskazujący był przedłużeniem naszego wzroku, tak teraz jego przedłużeniem jest kursor myszy na ekranie.

Niedawno trafiłem na wyniki interesującego badania. Respondentów na stronie głównej Digg poproszono, by poświęcili chwilę czasu na oddanie kliknięć w elementy graficzne, które wcześniej zostały przygotowane.

Badanie rozpoczynało się od wyświetlonego szarego prostokąta (dalej: z czarnym kółkiem, napisem „click here”, uśmiechniętą buźką przypominającą emotikon i przecinającymi się liniami), a kończyło na wizualizacji wyników wszystkich oddanych kliknięć przez uczestniczących w badaniu respondentów, w tym wskazaniu na wyniki osoby, która wzięła udział w teście. Razem w badaniu uczestniczyło ponad 40 tys. osób, a przebieg samego badania można prześledzić chociażby na tej stronie.

Wszystkie wyniki kliknięć zagregowano później w celu analizy i wyodrębnienia stref, które w badaniu były najbardziej gorące (najczęściej klikane przez użytkowników).

Gdy nałożono na siebie wszystkie cieplne mapy okazało się, że użytkownicy najczęściej klikali w centralne elementy obrazków oraz na ich rogach.

Gdy przyglądnąć się samym obrazkom i wynikom kliknięć stwierdzimy, że centralne rejony były najczęściej klikane gdyż elementy, które oddziałują na osoby oglądające obrazki i klikające na nie, zostały umieszczone w centralnych częściach grafik. Widzimy w ten sposób jak ekspozycja wpływa na nasze wydawałoby się nic nie znaczące decyzje o kliknięciach.

Interesujące jest także to, że spora część kliknięć została oddana w rogi przygotowanych grafik, z przewagą po prawej stronie.

Badanie ewidentnie pokazuje, że kursor myszy nie jest tylko przedłużeniem naszej ręki, ale – co ważne – także czymś w rodzaju przedłużenia naszego wzroku.

Dodatkowym wnioskiem, jaki można wyciągnąć z wyżej opisanego badania, to możliwość wykorzystania systemu clicktrackingowego jako nowej metody badawczej w psychologii (a nie tylko w usability). Badanie, w które elementy widzianych obrazków klikamy, wydaje się być także przyszłym orężem w rękach specjalistów od reklamy internetowej, którzy będą mogli badać interakcje w coraz bardziej skomplikowanych grafikach w tym zdjęciach, jak na przykład to, zaprezentowane poniżej, i wyciągać wnioski dla swoich kampanii.

image_pdf

Projektowanie: myślenie o konsekwencjach

Oceń tę pracę

Dawno nie pisałem… na blogu. Co zrobić, gdy chwilę czasu ma się tylko przy okazji choroby. Jako że morzy mnie gorączka, nadarza się okazja by spisać kilka przemyśleń.

***

1. Projektowanie to przede wszystkim myślenie – definiowanie problemów projektowych i ich rozwiązywanie. Rysowanie makiet i AI to sprawa wtórna w stosunku do „zobaczenia” (zdefiniowania) problemu i jego rozwiązania (koncepcji). Poza tym, czasem dany problem miewa kilka rozwiązań – jedne są lepsze, drugie gorsze. W dodatku bywa też i tak, że jedne rozwiązania są lepsze dla użytkowników, inne są lepsze dla wydawcy serwisu. Ostateczne rozwiązanie może okazać się nie trywialne.

2. Weźmy dla przykładu taką funkcję: „Wyrażanie opinii”.

Funkcja wyrażania opinii jest funkcją ogólną, tj. podpadają pod nią różne funkcje szczegółowe jak chociażby:

  • dodawanie komentarzy,
  • gwiazdkowanie,
  • system 'łapkowy’ – jak sam go określam, bazujący na dłoni z kciukiem wystawionym do góry, symbolizującym, że moja opinia jest na Tak, i z kciukiem zwróconym ku dołowi, symbolizującym, że jestem na Nie,
  • i inne systemy opiniowania.

3. Każdy z tych systemów opiniowania ma swoje konsekwencje – zarówno dla łatwości wykonywania czynności wyrażania opinii przez użytkowników (czyli tego, co określam mianem używalności), jak i dla wydawcy serwisu.

4. Każdy z nich to konkretna decyzja projektowa. Niby wszystkie z powyższych systemów opiniowania służą temu samemu – wyrażaniu opinii – jednak jedne rozwiązują pewne klasy problemów projektowych, inne nie.

5. Weźmy dla przykładu system wyrażania opinii przez komentarze.

System ten jest najlepszy z powyższych, gdy celem, który przed nami stoi, jest zbieranie wartościowego contentu, bądź gdy potrzebujemy informacji od użytkowników natury jakościowej.

Przeciwieństwem do niego będzie ilościowy system 'łapkowy’. Prosty w użyciu, lecz nie dający wiedzy merytorycznej, czasem niezbędnej innym użytkownikom.

System bazujący na komentarzach ma jednak pewne swoje daleko idące konsekwencje. Projektant musi zdecydować o tym czy:

  • użytkownicy mają mieć możliwość wyrażania swoich opinii anonimowo czy tylko przez osoby w jakiś sposób zweryfikowane przez system (np. tylko zalogowane, a więc i zarejestrowane);
  • konsekwencją powyższego jest także ustalenie czy – jeśli przyjąć, że także użytkownicy nie posiadający konta w danym systemie (nie zarejestrowani) będą mogli wyrażać swoje opinie przez komentarze, to powinien być jakiś inny system ich weryfikacji, np. podanie adresu e-mail. Jeśli tak, to po co? (Może po to, by w przyszłości powiadomić przy pomocy tego adresu osobę, że ktoś dodał także komentarz);
  • inną konsekwencją jest także przykładowy, a następujący fakt: w przypadku gdy damy możliwość dodawania opinii przez komentarze tylko osobom zarejestrowanym, współczynnik przyrostu komentarzy będzie dużo wolniejszy, niż w przypadku umożliwienia wyrażania takich opinii przez osoby nie zarejestrowane. Jednak to znowu może rodzić konsekwencje mniejszej ilości osób rejestrujących się, jeśli zaniedbamy kwestię uwypuklenia innych opcji, które dla użytkownika zarejestrowanego będą stanowiły (przynajmniej potencjalnie) wartość;
  • powstaje pytanie czy komentarze można komentować? Co powoduje powstanie struktury drzewiastej komentarzy, a przez to i – nierzadko – mniej czytelnej;
  • a może komentarze można oceniać? Jeśli tak, to czy tylko w ramach przyznawania plusików, czy także minusów? Czy wpływa to na sposób wyświetlania komentarzy – domyślnie będą wyświetlane najnowsze, czy też te z najwyższą ilością plusów?;
  • Itd.

6. Odmiennym, od powyższych systemów komentowania i 'łapkowania’, jest system gwiazdkowy, umożliwiający oddawanie głosów w ramach pewnej przyjętej wcześniej skali – powiedzmy od jeden do pięciu.

W sensie wizualnym (a więc i na AI) może to być klasycznych system gwiazdek, bądź slider, czyli interfejs analogowy z suwakiem przypominającym te z equalizera.

Ale… przyjęcie dwu różnych form wizualizacji wyników ma także swoje konsekwencje.

  • Możemy wyświetlać wyniki jako średnią ocenę zebraną przez głosowanie wraz z informacją ile głosów zostało oddanych. (I znowu – czy tylko zalogowani mogą głosować, czy niezalogowani też?).
  • Oraz możemy wyświetlać bardziej szczegółowo informacje – ile głosów na 5 gwiazdek zostało oddanych, ile na 4, na 3 itp.

Użytkownik odczytujący opinie w przypadku wizualizacji gwiazdek sposobem drugim ma więcej informacji nt. faktycznej wartości produktu ocenianego, niż w przypadku pierwszym. Gdyż może się zdarzyć, że średnia 3 bierze się raz z faktu, że wiele głosów na 5 zostało raz zaniżonych prze ocenę na 1, a innym razem, że produkt jest po prostu przez większość oceniany na 3, z małymi odchyleniami między 2 i 4.

Informacyjnie to dwa różne przypadki.

7. Wybór czasem też nie jest prosty. Musi godzić interesy użytkowników (w tym kwestie prostoty wykorzystania) z interesami wydawcy.

W sensie prostoty (tak ostatnimi czasy przecenianej przez osoby związane z tworzeniem aplikacji WWW i nadużywanej) najlepszym wyborem zapewne byłby system 'łapkowy’. Ale znowuż powstaje problem, gdyż w ramach interesów wydawcy może być gromadzenie unikalnych treści – wówczas lepszą odpowiedzią na zapotrzebowanie klienta będzie system dodawania komentarzy.

8. Dla komplikacji zadania, zawsze można jeszcze stworzyć systemy hybrydowe. Czyli takie, na które składają się elementy bądź nawet połączenia różnych rozwiązań.

Reasumując: definiuj problemy projektowe i – przywołując Einsteina – „Twórz rozwiązania tak proste jak to możliwe, ale nie prostsze.” I myśl… o konsekwencjach swoich projektów.

I rzecz na koniec, gdyż przeraża mnie już trochę narzędziowe podejście do projektowania: w projektowaniu to nie rysowanie jest najważniejsze. Jak mawia moja żona: dwie osoby o różnym poziomie talentu, wyposażone w płótno i farby (więc te same narzędzia), stworzą obrazy o zupełnie różnej wartości artystycznej. Chociaż ważne jest jak to, co zaprojektujesz, ostatecznie dla użytkownika będzie wyglądało, to definiowanie i rozwiązywanie problemów projektowych jest kwintesencją projektowania jako takiego. Jak, na przykład, kwestii stworzenia mechanizmów zwiększających ilość odsłon w serwisie Twojego klienta (problem projektowy) i to tak, by użytkownicy czuli się usatysfakcjonowani wprowadzonymi rozwiązaniami (jedna z wytycznych).

 

Social Web: projektowanie społecznościowe

Właśnie jestem w trakcie lektury „Serwisy społecznościowe. Projektowanie” autorstwa Portera; niedawno też przerobiłem „Neuro Web Design” Susan Weinschenk (o tej książce pisał też ostatnio Maciej). Ani jedna, ani druga lektura nie zrobiły (robią, gdyż Serwisy społecznościowe jeszcze czytam) większego wrażenia. Powody są dwa: 1) na studiach wpajano mi podstawy socjotechniki, w tym badania Stanleya Milgrama oraz 2) lektura książki Cialdiniego „Wywieranie wpływu na ludzi” była podstawowym podręcznikiem do tych zajęć, a w obu książkach – i Portera i Weinschenk – sporo odwołań do Cialdiniego. (Na marginesie: ostatnio uzupełniam listę książek z zakresu UCD, które posiadam, więc zainteresowanych odsyłam do mojej kolekcji).

ALE… projektowanie na potrzeby Internetu wymaga by pamiętać o podstawowym czynniku komunikacji: Człowiek to nie tylko zwierzę (ze swoim bagażem psychofizjologicznym), ale i zwierzę społeczne! Co z tego wynika dla Weba? Zobaczmy.

„Tylu tu ich jest – musi być fajnie”

Taki efekt mają przynieść wlepki na blogi, na których widnieją portrety osób, które bądź to mają założone konto w danym serwisie, bądź też – jak w przypadku My BlogLog – odwiedzają jeden z blogów, którego autor zrzeszony jest w tym samym systemie agregacji informacji, co i jego czytelnicy.

Przypomina mi się tutaj jedna z rozmów, tocząca się bodajże na Flakerze, gdy ktoś komentujący Świstak.pl zarzucił Rafałowi Agnieszczakowi, że na stronie głównej widnieje boks „Zobacz kto do nas ostatnio dołączył” ze zdjęciami świeżo upieczonych użytkowników. Rafał – komentując po swojemu – słusznie zauważył, że statystyki Z boksem i BEZ boksu mówią same za siebie, czy boks jest wart cennej przestrzeni strony głównej.

Jak to działa? Ano trochę tak, jak w jednym z eksperymentów Milgrama (na spółę z Bickmanem i Berkowitzem) w ramach którego grupa osób stojących na ulicy wpatrywała się w okna szóstego piętra budynku, przy którym stali. Zauważano, że przechodnie przechodzący obok „gapiów”, w ramach społecznego bodźca także zaczęli spoglądać w owe wypatrywane miejsce, w oczekiwaniu, że dojrzą tam coś interesującego – coś, w co wpatrują się INNI. Przy czym – i to jest interesujące – czym owych INNYCH wpatrujących się było więcej, tym – stwierdzono – bodziec pobudzał większą część przypadkowych przechodniów.

Jaki z tego wniosek? Ano chociażby taki, że pokazywanie w serwisach INNYCH – na fotkach, w blokach „Ostatnio tu byli”, „Ostatnio zalogowani”, „Nowi zarejestrowani…” etc. – sprzyja procesowi rejestracji, włączenia się do społeczności.

I to jest patent numer 1.

„Skoro ON tego używa, to musi być fajne”

Patent numer dwa w pewnym sensie związany jest z pierwszym, acz bazuje na sile autorytetu, a nie na sile ilości (masy). Zobaczmy jak to działa.

Case polskich mikroblogów: „bitwa” systemów mikroblogingowych odbywa się przy pomocy celebrites. Kominek dołączając do Blipa przyprowadził ze sobą rzeszę swoich wiernych. Grzesiek pisząc na swoim AntyWebie achy i ochy pod adresem Flakera – a miało to miejsce jeszcze w pierwszych m-cach funkcjonowania serwisu – przyczynił się z pewnością do zwiększenia w tym czasie ilości nowych użytkowników, w tym rejestracji. Adam wręcz otwarcie mówi, że bitwę wygra ten, kto posiądzie Dodę (nie w dosłownym znaczeniu :). Stąd zresztą chwilę później Blip zaczął się chwalić pozyskaną Frytką.

Case Adtaily: przebiegał trochę inaczej, acz ważną rolę odegrał tu Maciej Budzich, na którego blogu chyba jako pierwszym zaczęły pojawiać się reklamy z systemu AdTaily oraz informacje 'z czym to się je’.

Społeczna siła autorytetu (również anty-autorytetu czy po prostu oszołomstwa) istotna jest z punktu widzenia projektowania do Internetu. Łącząc patent nr 1 z patentem nr 2 otrzymujemy mieszankę wybuchową, gdyż nagle się okazuje, że czytelnikami bloga X są same znane osobistości. Przekaz tego komunikatu dla osób postronnych jest tak silny, że – chcąc nie chcąc – blog taki szybko ląduje w zaskrybowanych kanałach RSS. Pisze też o tym Porter podając przykład używania internetowej aplikacji przez Setha Godin, autora m.in. znanej u nas „Fioletowej krowy” i skrzętnego wykorzystania tego faktu przez ludzi z marketingu w celu zwiększenia ilości rejestracji przez odwołanie się do faktu posiadania tak zacnego użytkownika.

Podsumowania czas

Istnieją pewne wariacje, a czasem i zagrożenia w stosowaniu powyższych technik. Na przykład:

  • Opcja „Tylu ich tu jest” to także miecz obosieczny. Gdy liczba aktywności w Twoim serwisie nie jest zbyt duża, a w dodatku liczba zarejestrowanych użytkowników jest raczej licha, pokazując jak mało się u Ciebie dzieje, strzelasz sobie gola. Dla tego problemu zdaje się być dobra ilustracją Szufler. Serwis z opiniami nt. gier, książek, muzyki i filmów, w ramach którego główną szpaltę na stronie głównej poświęcono listowaniu tego, co w danym momencie robią użytkownicy serwisu. Nie ma tego zbyt wiele, co INNYCH nie zachęca raczej do rejestracji.
  • Opcja „Jesteśmy hermetyczni” jest bardzo ciekawa. W naszej sieci wspierały się nią grono.net w początkach swojego istnienia, gdzie konto w serwisie można było założyć tylko i wyłącznie na zaproszenie, nie było możliwości zobaczenia podstron bez zalogowania, a strona główna nie wyjaśniała czym w istocie serwis jest. Podobna strategia została obrana przy prowadzeniu zamkniętego outlettu internetowego Bao.pl.
  • Opcja „Niech Twoi użytkownicy mówią za Ciebie” w kilku miejscach widoczna chociażby w GoldenLine: na stronie „O nas”, gdzie użytkownicy serwisu chwalą czym dla nich jest GL, czy stronie dodawania oferty pracy, gdzie zebrano wypowiedzi osób, które skorzystały z oferty.

***

Era społecznego zaangażowania moim zdaniem dopiero się rozpoczyna. I nie mówię tu o serwisach społecznościowych, a o projektowaniu społecznościowym. Mechanizmy, które mamy – opisane powyżej, ale także te z e-commerce: „klienci, którzy kupili, kupili także”, „ten produkt ma tyle i tyle opinii pozytywnych” – to dopiero początek wykorzystania społecznego zaangażowania. Stosowanie wlepek z Facebook w sklepach, pokazujących ile mamy fanów, które wśród odwiedzających zwiększają poziom zaufania do oferty. Funkcjonalności w stylu FlakTesty, które realnie podwyższają sprzedaż. To kolejne kroki. W dobie aplikacji społecznych nawet blogi tracą już swój pierwotny sens – w aktualnej formule nie są w stanie agregować wszystkich moich aktywności sieciowych. A w przeważającej części – IMHO – ludzie nie czytają blogów – czytają INNYCH.

Warto przeczytać także: Maciej Lipiec, Większość nie może się mylić.

I zupełnie na koniec – osobiście uważam, że aktualnie najlepsze patenty społecznościowe funkcjonujące w obrębie polskiego internetu ma (i te trzy kropki będą z pewnością najlepiej klikalnym linkiem tego wpisu :). Chociaż – dodam łyżkę dziekgciu – system ten jest za trudny w użyciu dla przeciętnego użytkownika, co dobrze by było, by jego Autorzy zdali sobie jak najszybciej z tego sprawę.

Extreme usability: użyteczność ekstremalna

1. Nie cierpię tzw. audytów użyteczności i raportów, które w wyniku nich powstają. Takich klasycznych mówiących, że logo ma być u góry po lewej, musi być tagline, bo inaczej -5 do końcowej oceny, a stopka krótka (kto to wymyślił? Znam przynajmniej kilka powodów dla których warto rozbudować stopkę). Są przeważnie długie – autor piszący raport chce w ten sposób wykazać, ile pracy włożył i za co ostatecznie bierze wynagrodzenie – nudne i w przeważającej części oderwane od faktycznych problemów z serwisem.

Miałem okazję już trochę czytać raportów powstałych tu i ówdzie, biorących pod uwagę tzw. heurystyki Nielsena, które są albo przestarzałe, albo bez znaczenia dla użytkowników i ich scenariuszy użycia różnych stron; nie wspominając, że nie rzadko nie mają wiele wspólnego z celami biznesowymi klienta oraz strategią.

2. Odświeżyłem sobie niedawno lekturę „Szybcy i mądrzy” Marka Breiera i chociaż spora część książki wywołuje już uśmiech na twarzy (’managerowie, używajcie poczty e-mail, to oręż, dzięki któremu wygracie nie jeden bój’ :), to w swym przesłaniu, sposobie działania, który wniósł Jeff Bezos, książka jest wybitnie aktualna. Bądź szybki! Reaguj i wprowadzaj innowacje szybciej, niż Twoja konkurencja – inaczej przegrasz.

3. Miałem okazję uczestniczyć w ostatnim 1,5 m-ca czasu w licznych spotkaniach – zarówno jako prelegent (ClearWeb, w Realu, @rewolucja biznesu, warsztaty z usability dla Informedia), jak i słuchacz (Aula Polska). Wspominam o tym nie bez kozery, gdyż główne dwie myśli, które przy okazji spotkań starałem się przekazać, to ROZWIĄZUJCIE FAKTYCZNE PROBLEMY oraz TESTUJCIE (Always be Testing)… na żywym organizmie.

Świetnie w tą ideę wpisywało się wystąpienie Witolda Ferenc z frisco.pl na Auli, który na spotkaniu opowiadał o spontanicznym (chociaż przemyślanym) wprowadzaniu do sklepu funkcjonalności i innowacji.

Szybcy i Mądrzy!

4. Użyteczność ekstremalna, to szybkie rozwiązywanie problemów natury funkcjonalnej. Definiowanie problemów i szukanie rozwiązań – najlepsze rozwiązania powstają na styku użytkowania, w wyniku wdrożenia i interakcji z użytkownikami.

Użyteczność ekstremalna (podobnie jak programowanie ekstremalne) to wyznaczanie sobie celów, definiowanie podzadań i ich rozwiązywanie. Myślenie w ramach definiowania problemów i szukania dla nich rozwiązań. Zero heurystyk Nielsena. Zero nastawienia na gotowe rozwiązania (NIE – chcę sklep internetowy, tylko – chcę sprzedawać w Internecie; NIE – chcę badanie eyetrackingowe, tylko szukam odpowiedzi, czy slogan reklamowy zostanie zauważony, jakiego rodzaju badanie możecie zaproponować?; w końcu NIE – robimy redesign strony, może byś nam pomógł, ALE – mamy sygnały od użytkowników, że jest taki problem na stronie, poza tym chcemy wstawić tam nową ofertę i dział – uważamy, że w aktualnej wersji strony to będzie trudne, co radzicie?).

Jak przekonywałem na prezentacjach – w wielu przypadkach to nie redesing jest potrzebny serwisom, tylko przemyślane funkcjonalności. Rozwiązania potrafią być gdzie indziej, niż wzrok osób prowadzących projekt.

5. W użyteczności ekstremalnej, gdy liczy się czas i gdy testuje się na żywym organizmie, trzeba niekiedy przerzucić kwestię badań PRZED, na badania PO wdrożeniu. W tej wersji liczą się obserwacje i szybka reakcja zespołu tworzącego.

Użyteczność ekstremalna świetnie nadaje się przy tworzeniu serwisów wymagających krótkiego czasu realizacji od załogi i szybkiego wdrożenia. Nadaje się też tam, gdzie liczba zmian jest duża i przez to odczuwalna dla użytkownika (case strony głównej Allegro, zresztą – na pohybel krytykom – świetnie zrealizowany przez zespół projektowy tej firmy).

Użyteczność ekstremalna to także najlepsza metoda dla firm, które tworzą swoje wewnętrzne działy od użyteczności – dodatkowo walczą z konkurencją, bądź w szybkim czasie chcą pozyskać część rynku. Muszą być szybcy. Muszą umieć ryzykować. Trudno sobie wtedy pozwolić na długie iteracje w fazie tylko projektowej.

6. Mój ogląd z zakresu projektowania nie rzadko różni się od tych powszechnie spotykanych. Większość tego co wiem, to nie książki (chociaż przeczytałem ich trochę, a sama część mojej biblioteczki z HCI to blisko 0,5 tys. tytułów), tylko testy i badania. Większość badań i testów, które przeprowadziłem, to te na żywym organizmie.

Nie słuchaj co użytkownicy mówią (a przynajmniej nie zawsze) – patrz co robią! Wprowadzaj poprawki, uaktualnienia, czasem coś „zepsuj” – i obserwuj co robią użytkownicy, a uzyskasz wiedzę czy faktycznie zepsułeś. Ale przede wszystkim myśl problemami, a nie gotowymi przepisami. Szybko i mądrze.

image_pdf

e-book: Czas na czytnik

Oceń tę pracę

E-book: Czas na czytnik to temat, który porusza korzyści i zalety związane z przejściem na cyfrową formę książek, czyli e-booków, oraz używaniem dedykowanych urządzeń do ich czytania — czytników e-booków. Zmieniający się sposób konsumpcji literatury, mediów i innych materiałów edukacyjnych sprawił, że e-booki stały się popularnym wyborem zarówno wśród zapalonych czytelników, jak i osób szukających alternatywy dla tradycyjnych książek papierowych.

1. Co to jest e-book?
E-book to książka w formacie cyfrowym, która jest zapisana na urządzeniach komputerowych, smartfonach, tabletach lub dedykowanych czytnikach e-booków. E-booki można pobrać z Internetu, przechowywać w chmurze, a także łatwo przesyłać i synchronizować pomiędzy urządzeniami. W porównaniu do książek papierowych, e-booki oferują wiele dodatkowych funkcji, takich jak możliwość zmiany czcionki, dostosowania jasności ekranu, a także wyszukiwania treści czy dodawania zakładek.

2. Czytniki e-booków – co to takiego?
Czytniki e-booków to urządzenia zaprojektowane specjalnie do odczytywania książek cyfrowych. W przeciwieństwie do smartfonów czy tabletów, które wykorzystują ekrany LCD, czytniki e-booków mają wyświetlacze wykonane w technologii e-ink (elektroniczny papier), co zapewnia wygodę długotrwałego czytania, przypominając tradycyjny papier. Ekrany te charakteryzują się niskim zużyciem energii, doskonałą czytelnością w pełnym świetle oraz brakiem odblasków, co czyni je bardziej komfortowymi w porównaniu do innych urządzeń.

3. Zalety e-booków i czytników e-booków:
E-booki i czytniki e-booków oferują wiele korzyści, które przyciągają współczesnych czytelników. Jedną z głównych zalet jest ich mobilność. E-booki zajmują minimalną ilość miejsca na urządzeniu, pozwalając użytkownikowi na przechowywanie setek książek na jednym czytniku. Dzięki temu, można zabrać ze sobą całą bibliotekę, nie obciążając bagażu. Kolejną zaletą jest możliwość dostosowania ustawień – zmiana wielkości czcionki, jasności ekranu, czy tła, co czyni czytanie bardziej dostosowanym do indywidualnych potrzeb.

4. Ekologiczne aspekty e-booków:
E-booki są również bardziej ekologiczne, ponieważ nie wymagają papieru ani farb do produkcji, co w dłuższej perspektywie zmniejsza ślad węglowy związany z drukowaniem książek. Ponadto, brak potrzeby transportu książek fizycznych również przyczynia się do mniejszego zużycia zasobów naturalnych.

5. Wady e-booków i czytników e-booków:
Pomimo licznych zalet, e-booki i czytniki mają także swoje wady. Niektórzy czytelnicy wciąż preferują fizyczny kontakt z książką – zapach papieru, dźwięk przewracanych stron i wizualną przyjemność z posiadania książki na półce. Ekrany czytników, choć wyjątkowo przyjazne dla oczu, nie zapewniają tej samej atmosfery, co papier. Dodatkowo, e-booki nie mogą być dzielone z innymi w tradycyjny sposób, co w przypadku książek papierowych jest łatwiejsze. Chociaż istnieją również pirackie wersje e-booków, legalność ich pozyskiwania wciąż bywa problematyczna.

E-booki oraz czytniki e-booków to ważny element współczesnej literatury cyfrowej, który zmienia sposób, w jaki konsumujemy treści. Dzięki nim, książki stały się bardziej dostępne, wygodne i ekologiczne. Choć nie są w stanie całkowicie zastąpić książek papierowych, stanowią doskonałą alternatywę, szczególnie w kontekście mobilności i dostępu do ogromnych zasobów literatury na wyciągnięcie ręki.

A takie były początki

W ciągu ostatniego tygodnia miałem okazję zapoznać się z kilkoma wersjami czytników do ebooków, więc stwierdziłem, że swoimi obserwacjami się podzielę. Tym bardziej, iż wiele wskazuje, że w najbliższym czasie w tym sektorze dużo się będzie działo (również interfejsowo, bo – jak będzie można wywnioskować po lekturze tego wpisu – jesteśmy jeszcze na początku drogi). Wystarczy, że dodam, iż na 13-stych Targach Książki, na których w sobotę byliśmy z żoną, znajdowały się 4 stoiska, na których prezentowano produkty bądź usługi związane z tym sektorem. Ale do rzeczy…

Testowałem:

  • iRex iLiad – to chyba największy czytnik, który miałem okazję używać (wyświetlacz 8,1 cala, rozdzielczość 768×1024 pikseli), 160 DPI i 16 odcieni szarości dają dobrą jakość obrazu;
  • dwa czytniki firmy Bookeen: CybookOpus (mały, z ekranem 5-calowym) z ciekawym softem (np. bardzo przyjemnie dla oka zrobiona jest lista książek, które mamy w bibliotece) oraz Cybook Gen3 (nieco większa odmiana od swojego poprzednika);
  • Cool-ER, reprezentowany przez całą serię czytników dostępnych w różnych kolorach (ja klikałem akurat niebieski), miły dla oka i nieco podobny układem przycisków do rodzimego eClicto firmy Kolporter S.A.;
  • no i w końcu wspomniany eClicto, o którym poniżej.

Ogólne obserwacje jakie mam to:

  • Są proste w obsłudze. Klasa tych urządzeń jest raczej prosta w obsłudze – już po naprawdę niewielkiej ilości czas umiesz obsługiwać poszczególne modele. Nie potrzeba żadnych instrukcji i samouczków. Po kilku minutach zabawy w zasadzie już wiesz co możesz robić, i gdzie szukać danej opcji, by to zrobić. To wielka zaleta tych urządzeń i potencjalnie wróży to im sukces.
  • Różnie bywa z używalnością. Nauczyć się obsługiwać urządzenie to jedno, obsługiwać je na co dzień to drugie. Nie rozumiem dlaczego wszystkich tych urządzeń nie można obsługiwać jedną ręką – w niektórych modelach są potrzebne dwie i to do wykonywania w miarę częstych operacji – np. flow: wejdź do danej książki (piętro niżej), wyjdź do spisu książek (piętro wyżej). Dziwne bądź mało ergonomiczne rozwiązania z „przerzucaniem kartek” (w plikach EPUB nie ma podziału na strony, co nie znaczy, że przewijać nie trzeba). Myślę, że generalnie usability tych urządzeń (zarówno na poziomie ergonomii fizycznego urządzenia – rozkład przycisków, ich wielkość, przypisana funkcjonalność) jak i na poziomie oprogramowania zaszytego w czytniki, jest raczej średnie.
  • Oprogramowanie / funkcjonalności. Powyższe modele różnią się dość znacznie oferowanymi funkcjonalnościami: jedne mogą się łączyć z internetem w celu pobierania treści, inne nie; niektóre mają przeglądarkę do stron internetowych, możliwość odsłuchiwania muzyki/audiobooków, możliwość obsługi rysikiem, funkcje wprowadzania notatek (w jednych tylko z klawiatury, w innych rysikiem, z możliwością pisania odręcznego), etc.
  • Kontrast, to chyba najważniejsza własność dobrego czytnika. Musi mieć po prostu dobry kontrast między jasnym tłem i fontem. Niby oczywiste, ale jedne modele są lepsze, a inne… takie sobie.
  • Zdjęcia. Oglądanie zdjęć na czytnikach jest możliwe, a owszem, w 8 bądź 16 odcieniach szarości. Ale ma to taki sam sens, jak nauka malarstwa z książek wydawanych w czasach PRL-u, gdzie oglądało się czarnobiałe reprodukcje światowej sztuki (to była zgroza!). Poza tym wielkość zdjęcia bywa przytososywana do parametrów wyświetlacza, co niesie za sobą fakt, że niektóre zdjęcia po prostu rozciągane są na wyświetlaczu, by dostosować ich prezentację.
  • Pamięć i liczba książek. Informacje marketingowe głoszą, że w czytnikach można pomieścić setki, jeśli nie tysiące książek. Ale to nie do końca prawda. Owszem, książek można i dużo zmieścić, ale pod warunkiem, że są one w formacie EPUB (np. „Dracula” Stokera waży wtedy jakieś 138KB). Ale już gdy chcemy czytać plik w formacie .pdf to książek wejdzie znacznie, ale to znacznie mniej (np. „Web Form Design” Luke’a Wroblewskiego to 16,77MB). Poza tym przy dużych plikach spada komfort pracy z czytnikiem, związany z wydłużaniem się czasu przewijania strony (myśli i myśli, i myśli… Nawet darmowy rozdział mojej „Projektowanie stron WWW” o wielkości 1,81MB potrafiło zawiesić urządzenie).
  • PDF nie na czytniki. No właśnie. Po pierwsze, za ciężkie – o czym było wyżej. Po drugie, to się nie chce skalować! Czytanie nawet powiększonego (w ramach opcji powiększania czcionki) pliku .pdf powoduje, że układ tekstu nie chce się dopasowywać do parametrów urządzenia. Co oznacza w praktyce, że jeśli do tej pory kupowałeś książki elektroniczne w wersji .pdf, to jak przesiądziesz się na czytniki, będziesz musiał je kupić jeszcze raz – w wersji EPUB.

eClicto

eClicto to platforma oferująca e-booki i cyfrowe zasoby edukacyjne. Jest jednym z narzędzi, które umożliwia tworzenie, udostępnianie i zarządzanie cyfrowymi książkami oraz materiałami edukacyjnymi w formacie e-booków. Użytkownicy mogą korzystać z eClicto do zakupu, pobierania i czytania e-booków na różnych urządzeniach, takich jak komputery, tablety i smartfony.

Platforma eClicto wyróżnia się bogatą ofertą książek elektronicznych, które obejmują różne gatunki literackie, a także materiały edukacyjne. Jest to popularne narzędzie zarówno wśród osób prywatnych, jak i w środowiskach edukacyjnych, gdzie e-booki stanowią alternatywę dla tradycyjnych książek papierowych. Dodatkowo, eClicto umożliwia integrację z różnymi formatami plików, co sprawia, że jest kompatybilna z wieloma urządzeniami i aplikacjami.

Wykorzystanie eClicto w edukacji pozwala nauczycielom i uczniom na dostęp do zasobów, które są łatwe w użyciu i przechowywaniu. Dzięki szerokiej gamie dostępnych funkcji, takich jak możliwość tworzenia notatek, zakładek, czy podkreśleń, eClicto staje się przydatnym narzędziem do nauki, a także dla pasjonatów literatury, którzy szukają wygodnego sposobu na dostęp do książek cyfrowych.

image_pdf

Interface Designer: na potrzeby gier

Oceń tę pracę

Interface Designer na potrzeby gier to specjalista odpowiedzialny za projektowanie interfejsów użytkownika (UI) w grach komputerowych. Interfejs użytkownika w grach jest kluczowym elementem, który pozwala graczom wchodzić w interakcje z grą, a jego jakość ma bezpośredni wpływ na doświadczenie gracza (UX). Projektowanie interfejsu w kontekście gier wymaga specyficznych umiejętności, które uwzględniają zarówno estetykę, jak i funkcjonalność, a także wplecenie elementów interaktywnych w sposób, który nie zaburza immersji w grze.

Projektowanie interfejsu w grach obejmuje szereg aspektów, od układu ekranów, przez ikonografię, kolory, czcionki, aż po dynamikę i interakcje. Wszystkie te elementy muszą być zaprojektowane w sposób, który wspiera narrację gry, styl wizualny oraz cel gry, jednocześnie pozostając intuicyjnymi i dostępnymi dla gracza. Na przykład, w grze akcji, interfejs może wymagać prostoty, z minimalną ilością informacji, by nie rozpraszać gracza, podczas gdy w grach RPG lub symulacyjnych interfejs może być bardziej rozbudowany, oferując więcej opcji i informacji o stanie gry.

Interfejs użytkownika w grach zawiera wiele elementów, które muszą być starannie zaprojektowane. Należy do nich pasek zdrowia, pasek many, inventarze, mapy, opcje dialogowe, powiadomienia o stanie gry czy interaktywne przyciski. Wszystkie te komponenty muszą być nie tylko estetyczne, ale także funkcjonalne i zrozumiałe, umożliwiając graczowi szybki dostęp do niezbędnych informacji i opcji, bez zbędnych zakłóceń w rozgrywce. Ważnym aspektem jest również responsywność interfejsu, który musi działać płynnie w różnych warunkach – zarówno na różnych urządzeniach, jak i w różnych trybach gry.

Narzedzia do projektowania UI w grach obejmują programy takie jak Adobe XD, Figma, Sketch, ale także specjalistyczne oprogramowanie związane z tworzeniem gier, takie jak Unity czy Unreal Engine, które posiadają wbudowane systemy projektowania UI. Te narzędzia pozwalają na prototypowanie i testowanie interfejsów, umożliwiając projektantom szybkie iteracje i poprawki. Ponadto, projektowanie UI w grach jest silnie związane z tworzeniem animacji i efektów wizualnych, które dodają interfejsowi życia i pomagają w przekazywaniu informacji o stanie gry w sposób atrakcyjny, ale również funkcjonalny.

Ergonomia i dostępność to również ważne aspekty, które muszą być uwzględnione przez Interface Designera. W grach często występują różne typy graczy – od casualowych po hardcore’owych, więc interfejs musi być dostosowany do ich potrzeb. Projektanci muszą zwrócić uwagę na to, aby interfejs był intuicyjny i łatwy do opanowania, a jednocześnie nie pozbawiał bardziej zaawansowanych graczy potrzebnych opcji i informacji. Dodatkowo, ważne jest uwzględnienie potrzeb osób z niepełnosprawnościami, oferując opcje takie jak zmiana rozmiaru czcionek, dostosowanie kontrastu czy możliwość sterowania grą za pomocą różnych urządzeń wejściowych.

Styl i estetyka interfejsu są także kluczowe dla tworzenia unikalnego doświadczenia gry. Projektant interfejsu musi uwzględnić ogólny styl wizualny gry – od oprawy graficznej po atmosferę, jaką twórcy chcą wywołać w graczach. Interfejs nie może kontrastować z resztą świata gry, ale raczej musi z nim współpracować, tworząc spójną całość. Na przykład, w grach fantasy interfejsy często są ozdobione elementami przypominającymi starożytne manuskrypty czy magiczne artefakty, podczas gdy w grach sci-fi mogą dominować chłodne kolory, nowoczesne cyfrowe fonty i minimalistyczne ikony.

Rola Interface Designera w kontekście gier to nie tylko projektowanie ładnych, ale i funkcjonalnych interfejsów, które służą graczowi w sposób intuicyjny i efektywny. Ważne jest, aby projektowanie UI było ściśle powiązane z mechaniką gry, stylem artystycznym i celami projektowymi, co zapewni doskonałe doświadczenie użytkownika w trakcie rozgrywki.

Jak już człowiek wyjdzie ciut z poza klasyczne WWW i ma okazję trochę podłubać przy interfejsach aplikacji, to mu apetyt zaczyna wzrastać… Gry komputerowe (i te instalowane, i te przez WWW) to już od dłuższego czasu obszar moich zainteresowań. Czekać tylko, aż będę miał okazję popraktykować 🙂

A jakby ktoś chciał startować do Blizzardu, to kilka ofert na stanowiska: User Interface Designer (przy produkcie WoW), User Experience Director (przy Battle.net), Applications User Interface Designer, Web Layout/UI Designer.

Polecam też uwadze knigi:

  • R. Rouse, Game Design: Theory and Practice, Wordware Publishing, 2001.
  • T. Fullerton, Ch. Swain, S. Hoffman, Game Design Workshop: Designing, Prototyping, and Playtesting Games, CMP Books, 2004.
  • K. Saunders, J. Novak, Game Development Essentials: Game Interface Design, Delmar Cengage Learning, 2006, wydana w skądinąd ciekawej serii Game Development Essentials.
image_pdf