Słyszeliście kiedyś o pojęciu Mystery Meat Navigation? A może widzieliście poniższego mema stworzonego przez Luka Wroblewskiego kilka lat temu?
Nawet jeśli nie znacie, to z pewnością nie raz trafiliście na stronę lub appkę, w której z tak zwanym Mystery Meat Navigation się spotkaliście. Dzisiaj o tym, dlaczego warto na to zjawisko uważać!
Czym jest Mystery Meat Navigation?
Pojęcie, o którym wspominam nawiązuje do mięsa niewiadomego pochodzenia – wiecie, te wszystkie produkty z przemielonymi dzióbkami i chrząstkami. Kiedy patrzymy na produkt i nie wiemy co w nim jest, możemy robić różne założenia. Kiedy chodzimy po sklepie, chwytamy jakiś produkt, możemy zerknąć na opakowanie, nazwę, dopiski i oczywiście skład. Natomiast jeśli popatrzymy na interfejsy graficzne zdarza się, że poza obrazkiem (np. ikonką), nie ma nic więcej. I wtedy możemy domyślać się, co się znajdzie po interakcji z nim, zakładając, że rozpoznamy go w ogóle jako element interaktywny.
I o tym jest właśnie Mystery Meat Navigation. To takie zjawisko, w którym patrzymy na elementy nawigacyjne i nie wiemy czego możemy się spodziwać. Co istotne – pojęcie tyczy się zarówno ikonek stosowanych w menu, jak i tekstów. Tak, tak, teksty też możemy źle zaprojektować!
Przykład ze strony muzeum – czym są ikonki obok hamburger menu?
Jak to naprawić?
Dlatego stosowanie samych ikon w projektach graficznych bywa zdradliwe. Z jednej strony, pozwalają nam zaoszczędzić dużo miejsca, niosą jakiś charakter marki, mają swój styl, mogą być po prostu dekoracją. Niestety problem zaczyna się, gdy osoby korzystające z interfejsu muszą zrozumieć do czego te ikony służą? Dobrą praktyką jest stosowanie ikon czytelnych, zrozumiałych i w miarę możliwości jednoznacznych. Idealnie, jeśli mają pod sobą podpisy, żeby uniknąć nieporozumień.
Jeśli będziemy stosować ikony, które mogą mieć różne znaczenie, jest szansa, że nasi użytkownicy w ogóle nie będą z nich korzystać, bo założą błędnie, że znajdą tam informacje im do niczego niepotrzebne.
To samo tyczy się tekstów (warto przy okazji przypomnieć sobie o UX Writingu, odsyłam do świetnej rozmowy o słowach w interfejsach właśnie). Jeśli tworzymy nawigację dla bloga, sklepu internetowego czy serwisu informacyjnego, powinniśmy upewnić się, że etykiety tekstowe informują nas o treściach, które znajdziemy w środku. Które bez klikania lub rozwijania powiedzą nam możliwie najszybciej, czego możemy się spodziewać.
Testy nawigacji
Kiedy na Instagramie opowiadałam o tym zjawisku, padło bardzo dobre pytanie:
To co z wszystkimi burger menu i dwoma lub trzema kropkami opcji jak np. w WhatsApp czy IG? Kiedy jest to uzasadnione a kiedy nie?
Hamburger menu ma już za sobą sporą historię i w rozwiązaniach mobilnych dość często się z nim spotykamy. Nie oznacza to wcale, że każda osoba korzystająca z naszego interfejsu, zinterpretuje ten element jako rozwinięcie nawigacji. To samo będzie tyczyło się wszystkich innych elementów na ekranie. Nie wiemy przecież, jak dużą skuteczność mają ikony w innych produktach (które prawdopodobnie testują jednocześnie kilka wariantów na ogromnych grupach odbiorców).
Możemy przyjąć założenie, że popularność stosowanego hamburger menu lub ikony trzech/dwóch kropek, może wpływać na większą rozpoznawalność tych ikon. Ale nie będziemy mieć tej pewności, dopóki po prostu tego nie sprawdzimy z naszymi użytkownikami. W tym celu, najprostszym rozwiązaniem będzie po prostu przeprowadzenie szybkich testów użyteczności. Dzięki nim odkryjemy wszystkie przypadki zastosowania tytułowego Mystery Meat Navigation.