Mystery Meat Navigation

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.

You May Also Like
Read More

Ikony w interfejsie (UI)

Trochę było ostatnio lajfstajlowych materiałów, to czas wrócić do projektowania. Pogadajmy o ikonach, piktogramach w interfejsie (UI). I nie tylko, bo część z zagadnień będzie pokrywać…
rysunki dłoni w różnym ułożeniu palców
Read More

Palec to nie kursor – wielkość ma znaczenie

Mimo to, że prawie nie rozstajemy się z naszymi smartfonami, dość często spotykam się z jednym błędem, który jest bardzo irytujący na mobilnych stronach. A mianowicie…