馃帹 uxowy.dev #34
5 min czytania

馃帹 uxowy.dev #34

Wyjazd na nadchodz膮ce upalne dni zaplanowany? 馃
A mo偶e jeste艣 w艂a艣nie na wakacjach? 馃彇 (je艣li tak, to zazdro!)

Ja ju偶 nie mog臋 si臋 doczeka膰 poprawy pogody, wyjazd贸w ...i dzisiejszego wydania newslettera uxowy.dev 馃槢

A dzisiaj b臋dzie o:

  1. Redesign Airbnb - ogarnij, co si臋 sta艂o i co to zmienia...
  2. #PrzemoPatterns: Dashboard
  3. Zaprezentuj swoj膮 appk臋 like a boss
  4. Inspiracja: lista "Totally rocking websites"

Zaczynamy!


Redesign Airbnb - ogarnij, co si臋 sta艂o i聽co to zmienia...

Co si臋 zmieni艂o?
G艂贸wnie - zorganizowano ca艂y content aplikacji wok贸艂 kategorii.

Airbnb przed i po redesignie - 2022 Summer Release. 殴r贸d艂o: Airbnb
Zamiast okre艣la膰 miejsce wyjazdu, okre艣lamy, 聽 聽 czego chcemy do艣wiadczy膰 na tym wyje藕dzie.

To du偶a zmiana we flow wyszukiwania miejsca, do kt贸rego chcemy jecha膰:

殴r贸d艂o

Zmian臋 t臋 mo偶emy bardzo dobrze zauwa偶y膰, por贸wnuj膮c ze sob膮 strony g艂贸wne konkuruj膮cych ze sob膮 serwis贸w - Airbnb z np. Booking.com:

Booking.com zaprojektowany jest pod klasyczne flow "szukam miejsca na mazurach".

Na Airbnb okre艣lamy "cel" wyjazdu, kt贸ry nie jest lokalizacj膮, a kategori膮 do艣wiadcze艅. Definiujemy na co mamy ochot臋 i rezerwujemy wybrane miejsce.

Dopiero na ko艅cu martwimy si臋, jak tam dojecha膰... 馃槀

No i co...? (biznesowy aspekt zmiany)

Miejsca, kt贸re nie by艂y wcze艣niej cz臋sto odwiedzane z powodu ich lokalizacji, teraz s膮 na r贸wni z tymi typowo "turystycznymi" wypchanymi lud藕mi po dekiel.

Po tej zmianie powinien nast膮pi膰 wzrost wyboru tych mniej ucz臋szczanych miast (i聽wsi 馃槀), kt贸rych jest znacznie wi臋cej ni偶 tych typowo turystycznych. Pi臋knie prezentuje to wykres:

Ma艂e i 艣rednie miasta powinny zauwa偶y膰 wzrost booking贸w. 殴r贸d艂o

Z drugiej strony, powsta艂y zarzuty, 偶e Airbnb faworyzuje te bardziej "instagramowe" miejsca. Jest to zabieg zgodny z now膮 strategi膮 Airbnb. Ma on na celu r贸wnie偶 zmotywowa膰 w艂a艣cicieli lokali do podnoszenia ich atrakcyjno艣ci.

Id膮c dalej - je艣li mo偶esz znale藕膰 fajne miejsce, kt贸re dostarczy Ci po偶膮danych do艣wiadcze艅 w pobli偶u i nie musisz p艂aci膰 du偶o $$$ za dojazd / transpoprt, to ceny tego miejsca mog膮 by膰 wy偶sze. Czyli jako艣膰 mo偶e i艣膰 do g贸ry, bo b臋dzie na to kasa...

Jedna decyzja, kt贸ra poci膮ga za sob膮 multum konsekwencji.

A to tylko jedna ze zmian z ostatniej akcji Airbnb...

Wi臋cej informacji o Airbnb 2022 Summer Release znajdziesz tutaj:

The Airbnb 2022 Summer Release: Introducing a new Airbnb for a new world of travel
We鈥檙e launching the biggest change to Airbnb in a decade, with a new way to search, an innovative Split Stays feature and AirCover for guests.

#PrzemoPatterns: Dashboard

馃 Co to jest?

Dashboard (po polsku pulpit/kokpit) zapewnia u偶ytkownikowi globalny przegl膮d najwa偶niejszych danych, funkcji i element贸w nawigacyjnych.

Bardzo cz臋sto pe艂ni rol臋 strony g艂贸wnej, np. w zaawansowanych aplikacjach analitycznych.

Podobnie jak w聽samochodzie, dashboard ma na celu ukazanie nam krytycznych i聽istotnych na pierwszy rzut oka danych.

殴r贸d艂o: justinmind.com

Istniej膮 3 g艂贸wne typy dashboard贸w:

  • operacyjne 鈥 pozwalaj膮 zobaczy膰, co si臋 dzieje w danej chwili
  • analityczne 鈥 daj膮 u偶ytkownikowi jasny wgl膮d w trendy wydajno艣ciowe i聽potencjalne problemy
  • strategiczne 鈥 艣ledz膮 g艂贸wne cele strategiczne, np. za pomoc膮 wska藕nik贸w KPI

O czym warto pami臋ta膰 przy projektowaniu dashboard贸w?

鈩癸笍 Wskaz贸wki

  1. Dowiedz si臋, czego potrzebuj膮 Twoi u偶ytkownicy.
    Pierwszym krokiem jest poznanie swoich odbiorc贸w. Po zapoznaniu si臋 z聽personami u偶ytkownik贸w. Poznasz odpowied藕 na kluczowe pytanie: czego moi u偶ytkownicy b臋d膮 oczekiwa膰 od dashboardu? Pomy艣l np. o 5 obszarach, kt贸re Twoi u偶ytkownicy chcieliby zobaczy膰 na pulpicie.
  2. Responsywno艣膰 i customizacja.
    Je艣li jeste艣 w stanie, pozw贸l u偶ytkownikowi filtrowa膰 wyniki, wybra膰 jakie dane chcia艂by zobaczy膰 na kokpicie lub u艂o偶y膰 ich kolejno艣膰. Takie posuni臋cie spowoduje wi臋ksze zaanga偶owanie u偶ytkownik贸w, poczucie mocy sprawczej oraz opcj臋 dostosowania wygl膮du interfejsu pod ich potrzeby.
  3. Czytelnie prezentuj dane.
    Puste przestrzenie, du偶e i widoczne cyfry - nasz wzrok lubi w ten spos贸b odczytywa膰 istotne dane. Zamiast pr贸by upchni臋cia jak najwi臋kszej ilo艣ci informacji 鈥 postaw na czytelno艣膰. Pami臋taj r贸wnie偶 o odpowiednim doborze wykres贸w pod dane (wi臋cej o wykresach).
  4. Zadbaj o architektur臋 informacji.
    Wszystkie elementy s膮 wa偶ne, ale niekt贸re karty s膮 wa偶niejsze ni偶 inne. Nawi膮zuj膮c do punktu 1, zbadaj potrzeby u偶ytkownik贸w i wyeksponuj to, co jest dla nich najbardziej istotne. W tym celu mo偶esz zastosowa膰 wzorzec czytania strony F lub Z (wi臋cej o architekturze informacji, a tutaj wi臋cej o wizualnej hierarchii).
  5. Trzymaj si臋 zasady pi臋ciu sekund.
    Odnalezienie najwa偶niejszych informacji na pulpicie nie powinno zaj膮膰 u偶ytkownikowi wi臋cej ni偶 pi臋膰 sekund (test 5 sekund w UX). W przypadku d艂u偶szego przegl膮dania danych oznacza to, 偶e szata graficzna wymaga pewnych poprawek. U偶ytkownik chce otrzyma膰 odpowiedzi na wszystkie pytania tak szybko, jak to mo偶liwe.
Dashboard z mo偶liwo艣ci膮 dostosowania szeroko艣ci sekcji g艂贸wnej / bocznej (kliknij, aby zobaczy膰 animacj臋). 殴r贸d艂o

Warto te偶 rzuci膰 okiem na to, co by艂o o dashboardzie w #10 wydaniu newslettera聽馃槈


Zaprezentuj swoj膮 appk臋 like a boss

Resources | 藕r贸d艂o
shotsnapp. 殴r贸d艂o

Zaprojektowa艂e艣, albo masz ju偶 jak膮艣 appk臋 i chcesz w fajny spos贸b pokaza膰 jej ekrany?

No to podrzucam Ci narz臋dzie, dzi臋ki kt贸remu zrobisz to fajnie i szybko:
shotsnapp.com

  • nie trzeba zak艂ada膰 konta
  • s膮 darmowe i p艂atne templatki
  • wybieramy templatk臋 i uploadujemy screen appki
  • pobieramy plik na dysk
shotsnapp - Create beautiful mockup presentation
A simple tool to quickly create beautiful mockup presentation for your digital app and website design

Inspiracja: lista "Totally rocking websites"

Resources | 藕r贸d艂o
Strona g艂贸wna httpster

Warto wrzuci膰 do swojej g艂owy ciekawe i niekonwencjonalne rozwi膮zania.
Kto wie, czym to zaowocuje w przysz艂o艣ci? 馃

Strona, o kt贸rej mowa: httpster.net


To wszystko na dzi艣 馃嵒

Na zako艅czenie - b臋dzie praktycznie...
101 alternatyw, jak powiedzie膰 komu艣 "nie dzia艂a" 馃槀

Zassane z kana艂u #memy-it spo艂eczno艣ci Zaprogramuj 呕ycie 鉂わ笍

Pom贸偶 innym wiedzie膰 wi臋cej

Znasz kogo艣, kto powinien do艂膮czy膰 do naszej spo艂eczno艣ci? Je艣li tak, to聽wy艣lij do tej osoby link do skr贸tu z ostatnich wysy艂ek: uxowy.dev/lista. I niech do艂膮czy do naszej spo艂eczno艣ci programist贸w, kt贸rzy chc膮 robi膰 aplikacje z lepszym UI/UX! 馃殌

Pozdrawiam i do nast臋pnego! 馃憢
...w przysz艂y pi膮tek 馃槈

Miko艂aj Wa艣kowski

Je艣li jeszcze nie ma Ci臋 na li艣cie 馃

Wysy艂amy jeden email tygodniowo, w ka偶dy pi膮tek, o godz. 12:00.
Warto艣ciowa wiedza o UI/UX dla developera mo偶e wyl膮dowa膰 do Twojej skrzynki.