Strona główna » Projektowanie interakcji

Makiety: kolorowe czy w odcieniach szarości? cz.2

22 marca 2010 napisała Iga [ Brak odpowiedzi ] Drukuj wpis

Druga część artykułu. Zobacz pierwszą część artykułu, o makietach w odcieniach szarości i w kolorze.

Makiety z elementami projektu graficznego

Ostatnim przykładem użycia kolorów na makietach jest projekt silnie nawiązujący do ostatecznego wyglądu graficznego. Na makiecie widać więc zalążki elementów graficznych, dobraną kolorystykę projektu, elementy typografii, logotypy i zdjęcia. Granica między makietą a projektem graficznym jest w tym przypadku bardzo cienka. Szczególnie na tym przykładzie widać, jak trudno skupić się na funkcjonalności, kiedy tyle kolorów i wizerunków odwraca naszą uwagę.

Jednak w pewnych sytuacjach tak szczegółowe makiety sprawdzają się lepiej, niż jakiekolwiek inne – w testach z udziałem użytkowników na prototypie. Jest to ten szczególny przypadek, kiedy schematyczność monochromatycznych makiet tak bardzo utrudnia ich zrozumienie typowemu użytkownikowi, że komplikuje przeprowadzenie badań. Dla typowego użytkownika makiety są tak sztucznym tworem, że trudno im korzystać z prototypu w sposób naturalny. To z kolei może powodować zniekształcenia wyników testów. Łatwiej odnaleźć się użytkownikowi na makiecie z elementami ostatecznego projektu graficznego, dzięki czemu możemy być bardziej pewni odkrytych problemów.

Makieta z elementami projektu graficznego

Ikony – kolor czy szarości?

Ostatni element, który wymaga omówienia, to ikony. Czy nawet na makietach w odcieniach szarości można użyć kolorowych ikon? Jak widać na każdym z projektów zawarta jest klasyczna, pomarańczowa ikona RSS. Moim zdaniem w przypadku ikon o silnie utrwalonym wyglądzie (np. RSS, folder, gwiazdka dla ulubionych) możliwe jest stosowanie ich w kolorze. Jeśli jednak projekt nasz wymaga dużej ilości ikon, ich różnorodna kolorystyka może zbytnio odwracać uwagę od pozostałych elementów makiety. Wtedy warto rozważyć skonwertowanie ikon do odcieni szarości.

Do czego używać koloru?

W szczególnych sytuacjach można zastanowić się nad użyciem koloru do innych celów, niż podkreślenie aktywnych elementów. Czasami ważne jest, żeby na stronie zawierającej wiele nawołań do działania (CTA), wyróżnić jeden podstawowy, który ma skupiać uwagę użytkowników. Taki zabieg może przekazać ważną informację grafikowi odpowiedzialnemu za ostateczny wygląd projektu.

Kolejną sytuacją, kiedy można rozważyć użycie kolorów, jest wyeksponowanie elementów opcjonalnych, których obecność jest uwarunkowana przez inne elementy (np. prezentacja powiązanych artykułów dla wpisów, które nawiązują tematycznie do wcześniejszych wpisów, w przypadku braku powiązań funkcja ta nie jest widoczna).

Co w sytuacji kiedy mamy wiele ikon, wiele obszarów i treści klikanych, jedną główną akcję i elementy opcjonalne? Trzeba pamiętać, że zbyt wiele wyróżnień będzie ze sobą konkurować. Zamiast użytecznej i czytelnej makiety możemy więc uzyskać chaos w odcieniach tęczy ;) Zawsze więc warto się zastanowić, co jest głównym komunikatem oraz celem projektowanych makiet i dobrać do tego odpowiednie narzędzia.

Podsumowanie

Makiety a kolor - tabela z podsumowaniem

Niezależnie od wersji makiet, na którą się zdecydujemy, musimy przekazać do niej legendę osobom, z którymi współpracujemy. Jeśli zdecydowaliśmy się na określony kolor dla aktywnych treści, to trzeba wyjaśnić, jakie jest znaczenie tego koloru. Jeśli pracujemy zawsze z określonym zespołem projektowym, warto wypracować sobie jeden styl i trzymać się legendy dla każdego kolejnego projektu, co usprawnia wszystkim pracę.

Podsumowując – czy stosować kolory w makietach? Spotkałam się z różnymi opiniami, osobiście jednak jestem zdania, że barwy przeszkadzają w odbiorze i zrozumieniu makiet. Raczej stanowią szum informacyjny i odwracają uwagę od tego, co najważniejsze. Niosą ze sobą niebezpieczeństwo, że zamiast dyskusji o funkcjonalności i użyteczności, będziemy rozmawiać z klientem o doborze kolorystyki.

Warto za to zdecydować się na jeden kolor, który będzie podkreślał aktywne elementy na stronie. Usprawni to pracę z zespołem projektowym i komunikację z klientem. Barwa ta nie powinna zbytnio odwracać uwagi od pozostałych elementów nawigacyjnych.

Jednak najważniejszy wniosek z tego zestawienia mówi, że każdy z rodzajów makiet ma swoje plusy i może być przydatny w określonej sytuacji.

Warto przeczytać:

Turbek, S. (2006) Real Wireframes Get Real Results. Boxes and Arrows

Autorka

Iga Mościchowska

www: http://witflow.com
Managing Partner i UX Director w firmie WitFlow. Z zamiłowania projektant interakcji i badacz użyteczności, z wykształcenia socjolog. Szkoli, wykłada na AGH, występuje na konferencjach branżowych. Pracowała m.in. dla marek: Amica, Agora, eBay Classifieds, Egmont, Maspex Wadowice, MSZ, Polskapresse, PWN.pl, Vattenfall, a także dla licznych startupów. Czytaj więcej
Tagi: , ,