Cześć wszystkim!

Jak obiecaliśmy we wprowadzeniu do FandomDesktop, kontynuujemy nasze podejście w stylu „im więcej, tym lepiej” do zapowiedzi zmian nadchodzących w Fandomie i Gamepedii dla użytkowników komputerów później tej wiosny i w lecie. Więcej przejrzystości, więcej myślenia projektowego, więcej głębszych spojrzeń na to, co się zmienia przed wdrożeniem. Dzisiaj spojrzymy na to, jak nawigacja ewoluuje z FandomDesktopem.

Społeczność na górze

Lokalne linki społeczności będą pierwszymi na górze ekranu. Jest to zmiana zarówno dla Fandomu, jak i Gamepedii, dzięki której społecznościom zostanie nadany najwyższy priorytet. Globalna nawigacja na obu witrynach przez lata znajdowała się na górze, pozbywamy się tego z powodów, o których powiemy później. W nagłówku społeczności, który jest teraz konfigurowalny, będziecie mieć swoje menu i podmenu dla linków treści społeczności.

Logged In - Wiki Nav.png

Dla użytkowników Gamepedii jest to spora zmiana względem posiadania paska po lewej na linki społeczności, praktyki zaadaptowanej z Wikipedii. To był istotny element nowego ujednoliconego doświadczenia, więc przeprowadziliśmy wiele badań nad zaletami lewego paska w porównaniu do nawigacji na górze i spojrzeliśmy na coś, co nazywa się kosztem interakcji, by podjąć decyzję dotyczącą designu.

Koszt interakcji jest to suma wysiłku – fizycznego i psychicznego – który użytkownicy muszą włożyć podczas interakcji z witryną, by osiągnąć swoje cele. Skanowanie, czytanie, przewijanie i klikanie są formami kosztu interakcji i gdy użytkownik trafia na stronę wiki, może obrać kilka potencjalnych ścieżek, więc od samego początku koszt interakcji zaczyna powoli rosnąć. Ostatecznie, im większy koszt pojedynczego doświadczenia, tym mniejsze prawdopodobieństwo, że użytkownik będzie miał zadowalające doświadczenie i powróci w przyszłości.

To jest bardzo techniczne podejście bazowane na badaniach. Jeśli chcecie szybkie podsumowanie, oto ono:

  • Dużo przewijania i przeglądania linków reprezentuje wysoki koszt interakcji,
  • Logiczne przepływy przez dobrze zorganizowane menu zmniejszają koszt interakcji i są bardziej przenośne,
  • Posiadanie interfejsu bazowanego na menu pozwala na więcej linków bez przewijania.

Z nawigacją będącą tak kluczową częścią doświadczenia wiki chcieliśmy się upewnić, że użytkownicy nie włożą więcej wysiłku, niż muszą. Jeśli spojrzycie na lewy pasek na większych wiki Gamepedii, przeglądanie pionowego bocznego paska i przewijanie, by dostać się na jego dół, powoduje zwiększenie kosztu interakcji od samego początku. Podczas gdy prezentacja wszystkich linków w bocznym pasku może pomóc odkryć wszystkie dostępne linki, zwiększa ona także drastyczne koszt przeszukiwania i przewijania do punktu, w którym odwraca uwagę od doświadczenia użytkownika. Tutaj przykład tego, co mamy na myśli:

TV Gamepedia Wiki Nav - Default.pngTV Gamepedia Wiki Nav - Scroll.pngTV Gamepedia Wiki Nav - Submenu.png

Przykład kosztu interakcji potrzebnego do użycia lewego paska bocznego dla linków społeczności. Możecie zobaczyć duży koszt poniesiony z góry przed przejściem do podmenu.

Najlepszym sposobem na zmniejszenie kosztu interakcji z nawigacją jest uproszczenie doświaczenia przez używanie logicznych przejść pomiędzy dobrze zdefiniowanymi menu, czyli praktyki znanej jako stopniowe ujawnianie, a także przez ułożenie ich w widoku poziomym, aby zapewnić bezproblemowe przeszukiwanie. Przykładem może być wiki o serialu ze zdefiniowanymi menu dla postaci, sezonów i obsady. Pod każdym menu znajdą się podmenu dla bohaterów/złoczyńców/itd., dla sezonu 1/2/itd., a także dla głównych ról/aktorów drugoplanowych/producentów. To podejście zapewnia użytkownikom szybki obraz tego, gdzie mogą nawigować, bez przeciążenia ich wszystkimi linkami naraz. Gdy użytkownik przygotowuje się do zrobienia kolejnego kroku, my następnie pokazujemy mu więcej opcji, by zanurzyć się głębiej. To stopniowe doświadczenie zapewnia, że użytkownik poświęca tylko tyle kosztu interakcji, ile wymaga wykonanie akcji. Oto przykład tego, co mamy na myśli:

TV Fandom Wiki Nav - Default.pngTV Fandom Wiki Nav - Submenu 1.pngTV Fandom Wiki Nav - Submenu 2.png

Przykład kosztu interakcji potrzebnego do użycia poziomego paska dla linków społeczności. Wstępny koszt jest mały i zwiększa się tylko, gdy użytkownik sygnalizuje, że chce więcej, zagłębiając się w nawigację.

Przesunięcie linków społeczności na górę i z dala od lewego paska także zwalnia więcej przestrzeni dla pola treści, przy jednoczesnym zwiększeniu „pojemności” dla lokalnych linków (łącznie ponad 200!). Z nowym, płynnym designem, dajemy użytkownikom kontrolę nad tym, jak szeroki jest obszar treści, ale to nie działałoby tak dobrze, gdybyśmy zachowali linki społeczności po lewej stronie, ponieważ zabierają bardzo dużo przestrzeni z szerokości strony. Więc w rezultacie, przez przesunięcie linków społeczności na górę i użycie wąskiego paska globalnej nawigacji po lewej, zalogowani użytkownicy na wiki pochodzących historycznie z Gamepedii mogą mieć większą szerokość treści niż kiedykolwiek, przy okazji posiadając mnóstwo linków i narzędzi do ich dyspozycji, nawet przy przewijaniu.

Nawigacja zawsze w zasięgu

Zarówno dla Fandomu, jak i Gamepedii, kolejną zmianą w lokalnej nawigacji jest to, że przewija się razem z wami, gdy idziecie w dół strony. Nagłówek społeczności zwija się w tematyczny, kompaktowy pasek i linki treści pozostają w zasięgu waszych rąk, nawet na naprawdę długich stronach. Więc na górze zamiast podążającej za wami globalnej nawigacji, będziecie mieli linki treści społeczności.

Logged In - Scroll.png

Przenośność nawigacji wzmacnia także tożsamość lokalnej społeczności poprzez zabieranie ze sobą loga w „przypiętej” nawigacji. W połączeniu z przenośnością przycisku spisu treści, co pokazaliśmy w blogu dotyczącym stron artykułów, uczyniliśmy lokalną nawigację tak przenośną, jak to możliwe.

Przybornik twórcy

Niektórzy z was z sokolim wzrokiem zauważyli w poprzednich blogach, że w designie FandomDesktop prawy moduł hostuje linki do niektórych narzędzi edytorskich. Dobre spostrzeżenie! Zgadza się, w prawym module pojawiają się niektóre linki skupione na potrzebach edytorów, dzięki czemu macie do nich lepszy dostęp podczas nawigowanie po wiki.

Logged In - Default.png

Punkty dostępowe do rzeczy takich jak linkujące, informacje o stronie czy zasady wiki będą znajdować się w prawym module, oddzielając narzędzia od linków treści. Standardowy punkt dostępu do zasad wiki był prośbą społeczności od wprowadzenia zasad blokowania na wiki, więc jest to świetny sposób na pokazanie tego w kontekście edycji.

To dopiero początek tego, co prawy moduł może zrobić dla nawigacji, zwłaszcza dla zalogowanych użytkowników. Jak wspomnieliśmy wcześniej, będziemy nieco eksperymentować z prawym modułem, by był dla was jeszcze bardziej wartościowy. Wkrótce opublikujemy także specjalnego bloga, który jest tylko o narzędziach twórcy, włączając w to część tego, czego możecie oczekiwać po wydaniu FandomDesktop.

Idąc globalnie

Jedną z największych rzeczy, które można zauważyć w FandomDesktop, jest to, że przenosimy globalną nawigację do wąskiego paska po lewej stronie, jest to ruch, który nas naprawdę ekscytuje i mamy nadzieję, że ma duży potencjał. Ale dlaczego go przenieśliśmy? We wcześniejszych badaniach designu spojrzeliśmy na mnóstwo opcji, które obejmowały globalną nawigację na górze, która w połączeniu z lokalną nawigacją i reklamami dodawała pionowej wagi i spychała treść w dół. Warstwa ta także odciągała od wciągającego doświadczenia społeczności, które było naszym celem. Na dodatek tego wszystkiego posiadanie globalnej nawigacji na górze nie pasowało do naszego pragnienia, by lokalna nawigacja przewijała się wraz z użytkownikiem.

ANON - Default.png

Nasze badanie pokazało, że doświadczenie przy przewijaniu jest równie ważne, co doświadczenie na szczycie strony i jeśli globalna nawigacja pozostałaby na górze, mielibyśmy właściwie dwie opcje, jak rzeczy mogłyby wyglądać przy przewijaniu. Jedna z nich to ta, gdzie dwie nawigacje znajdują się jedna na drugiej, co nie było dobrym podejściem, zarówno ze strony estetycznej, jak i funkcjonalnej. Druga z nich jest podejściem podobnym do FandomMobile, gdzie dwie nawigacje łączą się w jedną przy przewijaniu, z logiem Fandomu po lewej i nazwą wiki oraz nawigacją po prawej. Podczas gdy to podejście jest obiecujące – było właściwie całkiem ciekawym sposobem na połączenie globalnej marki i tożsamości lokalnej wiki – wadą jest utrata widoczności linków dla całej witryny. Ostatecznie najlepszym rozwiązaniem pozwalającym na posiadanie przewijających się lokalnych linków i ograniczenie pionowego zapełnienia było przesunięcie globalnej nawigacji do paska skupionego na ikonach, który redukuje ogólną przestrzeń elementu dla większości wyświetleń, ale także sprawia, że jest bardziej widoczny i zachowuje funkcjonalność przy przewijaniu.

Co z wyszukiwaniem, profilem i powiadomieniami?

Pozwólcie nam wykorzystać tę okazję do podziękowania wam wszystkim za niesamowity feedback, który nam daliście od Community Connecta i pierwszej publicznie dostępnej zapowiedzi FandomDesktop. To było bardzo pomocne, a do tego w wyniku tego w końcu byliśmy w stanie dopracować różne części designu, przykładowo przełącznik prawego modułu dla zalogowanych użytkowników. Wyszukiwanie, profil i powiadomienia to trzy rzeczy związane z globalną nawigacją po lewej, na temat których otrzymaliśmy najwięcej konstruktywnego feedbacku.

Profil jest w nowym miejscu dla wszystkich na dole lewego paska. Uważamy, że jest to zmiana, która w abstrakcji jest pozornie drażniąca, jednak stanie się bardziej komfortowa wraz z doświadczeniem. Jest to pozycjonowanie podobne do analogicznych funkcji na innych platformach, jak potwierdziliśmy w naszej analizie konkurencji, ale jesteśmy chętni do wysłuchania waszych myśli na ten temat, gdy będziecie kontynuować korzystanie z nowego doświadczenia w okresie, gdy wybór FandomDesktop będzie dobrowolny. I zachowując motyw „zawsze w zasięgu ręki”, ta pozycja w pasku zapewnia, że będziecie zawsze mieli tam szybki dostęp.

Logged In - Profile.png

Wyszukiwanie posiada teraz ujednolicone punkty dostępu na górze paska globalnej nawigacji, a także w nagłówku społeczności (miejscu, które dodaliśmy do FandomDesktop jako rezultat feedbacku społeczności!). Na Fandomie było ono w globalnej nawigacji. Na Gamepedii było na górze lokalnej strony. Teraz każdy ma stały punkt dostępu do wyszukiwania zawsze dostępny na ekranie, który zabiera was do skupionego doświadczenia. Mamy więcej pracy nad wyszukiwaniem do zrobienia i dedykowany zespół, który nie może się doczekać rozpoczęcia tej pracy później tego roku, więc czekajcie na więcej informacji na ten temat.

Logged In - Search.png

Powiadomienia są również w pasku globalnej nawigacji, ale trzeba wykonać więcej pracy, by ujednolicić systemy powiadomień pomiędzy wiki Fandomu i Gamepedii. Nauczyliśmy się wiele z systemu powiadomień Reverb na Gamepedii i później tego roku rozpoczniemy specjalny projekt dotyczący ujednolicenia systemów powiadomień. Jednak wszystkie powiadomienia będą w tym samym miejscu w FandomDesktop.

Logged In - Notifications.png

Zmiana daje wzrost możliwości

„Im więcej, tym lepiej” nie jest tylko sloganem opisującym, co robimy. Mówi także o tym, w jaki sposób działamy. Więcej zmian oznacza więcej okazji, ale także więcej odpowiedzialności. To są niektóre z największych zmian, których dokonujemy, nieważne, z której platformy przyszliście. Fakt, że w czasie zeszłego roku na platformie zaszło tak wiele zmian, jest powodem, dla którego ważniejsze niż kiedykolwiek jest upewnienie się, że wcielamy w życie wasz feedback, tak jak w przypadku zwijanego prawego modułu, opcji szerokości treści dla użytkowników i, w przypadku nawigacji, dodania nowego punktu wyszukiwania do nagłówka społeczności.

Kiedy później tej wiosny nadejdzie czas, doświadczcie nowego designu na własnej skórze i powiedzcie nam, co myślicie. Będziemy kontynuować pracę z wami, by uczynić doświadczenie jeszcze lepszym.

Jak zawsze, z przyjemnością odpowiemy na wasze pytania.

Treści społeczności są dostępne na podstawie licencji CC-BY-SA, o ile nie zaznaczono inaczej.