Projektowanie kokpitów najlepsze praktyki

Transkrypt

1 Projektowanie kokpitów najlepsze praktyki Witold Kilijański Partner Wykorzystano materiały TABLEAU SOFTWARE

2 Agenda Wprowadzenie Rodzaje Dashboardów Częste Błędy Zasady Percepcji Wizualnej Najlepsze Praktyki Projektowania Krytyka

3 Wprowadzenie Co to jest dashboard? Dashboard jest: wizualną prezentacją najważniejszych informacji potrzebnych do osiągnięcia jednego lub większej liczby celów; skonsolidowanych i umieszczonych na jednym ekranie tak, aby informacje mogły być monitorowane na pierwszy rzut oka.

4 Rodzaje dashboardów Strategiczny Zapewnia szybki przegląd sytuacji, potrzebny decydentom do monitorowania stanu zdrowia organizacji i szans rynkowych Koncentruje się na ogólnych wskaźnikach wydajności aby wskazać drogę w przyszłość (np. dobre i złe oceny wydajności) Raczej statyczny Operacyjny Używany głównie do monitorowania działań bieżących Prezentuje dynamiczne i aktualne dane Analityczny Wymaga dodatkowego kontekstu (porównania, historia, oceny) Bardzo interaktywny

5 Przykład dashboardu strategicznego Zawiera tylko najważniejsze informacje do monitorowania przez managera Wizualizacja: oszczędność kolorów, prime real estate użyto do najważniejszych danych. Dużo informacji w uporządkowanej formie, (oszczędność miejsca), jednolite tło wspomaga grupowanie danych (granice obszarów byłyby rozpraszające)

6 Przykład dashboardu operacyjnego Ten dashboard pokazuje dużo informacji (16 obiektów) a mimo tego nie przytłacza ich nadmiarem. Siatka kolumnowa jest używana w szczególności do dashboardów badawczych i prezentujących scorecardy, wyświetlających wiele miar i dających Użytkownikowi wiele opcji filtrowania. Aby zachować prostotę, użyto tylko jednego rodzaju czcionki (Arial), ograniczonej palety kolorów, nie ma etykiet danych ani mark shapes, a filtry zgrupowano jednej kolumnie. Informacje szczegółowe są dostępne dla Użytkownika w tool-tipach.

7 Przykład dashboardu analitycznego Ten przykład pokazuje w jaki sposób praca analityka może wesprzeć działania marketingowe w sieci hoteli. Analityk monitoruje trendy w rezerwacji pokojów aby zidentyfikować sezonowość i możliwości stworzenia oferty dla Klientów poza sezonem. Kolory używane oszczędnie, jasne obramowania, logiczne grupowania. Ten dashboard wykorzystuje możliwości naszego mimowolnego przetwarzania myśli - the heat map (mapa termowizyjna).

8 13 Częstych błędów 1. Przekroczenie rozmiarów pojedynczego ekranu 2. Niewystarczający kontekst danych 3. Wyświetlanie nadmiernych szczegółów 4. Wybieranie niewystarczających miar 5. Wybieranie nieodpowiednich sposobów prezentacji 6. Wprowadzenie nie mającej znaczenia różnorodności 7. Używanie źle zaprojektowanych sposobów wyświetlenia danych 8. Niedokładne zakodowanie danych ilościowych 9. Złe rozmieszczenie danych 10. Nieefektywne wyróżnienie ważnych danych lub jego brak 11. Zaśmiecanie prezentacji bezużyteczną dekoracją 12. Złe użycie lub nadużycie kolorów 13. Projektowanie nieatrakcyjnej prezentacji wizualnej

9 Percepcja wizualna Wzrok jest najsilniejszym zmysłem. Patrzenie i myślenie są ściśle powiązane. Aby zaprezentować dane efektywnie, musimy trochę dowiedzieć się o percepcji wizualnej, korzystając z dostępnych badań naukowych, których rezultaty mogą być zastosowane bezpośrednio w projektowaniu dashboardów co działa, co nie i dlaczego.

10 Percepcja wizualna Ograniczenia krótkotrwałej pamięci wzrokowej Jest tymczasowa Część jej jest dedykowana informacji wzrokowej Ma ograniczoną możliwość przechowywania informacji Dashboard powinien być zaprojektowany tak, aby dostosować się do naszej pamięci krótkotrwałej. Możemy to zrobić poprzez wizualne przedstawienie danych dla błyskawicznej percepcji!

11 Percepcja wizualna Spróbuj wskazać tak szybko jak potrafisz, ile razy liczba 5 pojawia się na poniższej liście:

12 Percepcja wizualna Spróbuj wskazać tak szybko jak potrafisz, ile razy liczba 5 pojawia się na poniższej liście: Zajęło to chwilę, ponieważ zaangażowaliśmy przetwarzanie uważne. Ciąg znaków nie zawierał żadnych mimowolnych atrybutów, których moglibyśmy użyć w celu odróżnienia piątek od innych cyfr. Podświadome przetwarzanie odbywa się niesamowicie szybko, co skutkuje natychmiastowym odróżnieniem elementów odstających i możliwością zgrupowania jednolitych grup obiektów wszystko bez udziału świadomego myślenia. Przetwarzanie uważne jest sekwencyjne i dlatego o wiele wolniejsze.

13 Zasady percepcji wizualnej Teraz spróbuj ponownie: Łatwo odróżniliśmy piątki od innych cyfr, gdyż zostały wyróżnione kolorem. Dlaczego w pierwszym ćwiczeniu nie moglismy ich łatwo odróżnić bazując tylko na ich unikalnym kształcie? Dlatego, że skomplikowane kształty cyfr nie są atrybutami, które postrzegamy podświadomie. Kształty takie jak kółka, trójkąty i prosokąty mogą być łatwo postrzegane podświadomie, ale cyfry są zbyt skomplikowane.

14 Inaczej mówiąc

15 Inaczej mówiąc

16 Inaczej mówiąc

17 Zasady percepcji wizualnej 4 kategorie Atrybutów Podświadomych Kolor Forma Pozycja Ruch

18 Zasady percepcji wizualnej Kolor Odcień Nasycenie

19 Zasady percepcji wizualnej Forma Orientacja Szerokość Linii Długość Linii Rozmiar Kształt Obramowanie

20 Zasady percepcji wizualnej Pozycja Lokalizacja 2-D

21 Zasady percepcji wizualnej Ruch Migotanie Wizualny atrybut obiektu, takie jak kolor, stałe zmiany tła pomiędzy dwoma wartościami, lub wielokrotne pojawianie się i znikanie całego obiektu.

22 Najlepsze praktyki projektowania Dobrze zaprojektowane dashboardy dostarczają informację, która jest: Wyjątkowo dobrze zorganizowana Skondensowana, przede wszystkim w formie podsumowań i wyjątków Specyficzna i dostosowana do użytkowników danego dashoardu i ich celów Wyświetlana przy użyciu zwięzłych i często małych obiektów, które komunikują dane i ich przekaz w najwyraźniejszy i najbardziej bezpośredni sposób opowiada bardzo jasną historię!

23 Najlepsze praktyki projektowania Istotne Istotne lub mniej Istotne lub mniej Istotne Mniej istotne

24 Najlepsze praktyki projektowania Color Jaskrawe kolory mogą spowodować przeciążenie zmysłów. Powinny być zarezerwowane dla danych które odstają od reszty. Nasze mózgi podświadomie grupują przedmioty według kolorów Nie grupuj i nie przypisuj znaczenia danym używając koloru czerwonego, żółtego lub zielonego. W ten sposób wykluczasz 1% kobiet i 10% mężczyzn, będących daltonistami Kolory które są powszechne w naturze działają bardzo dobrze jako paleta kolorów w dashboardach

25 Najlepsze praktyki projektowania Rozmyślnie stosuj kolory do wykresów słupkowych

26 Najlepsze praktyki projektowania Wykresy kołowe vs Słupkowe Warto użyć wykresu słupkowego aby wyraźniej pokazać ten sam udział w całości danych - co jest powszechnie prezentowane na wykresie kołowym. Zauważ, o ile łatwiej pokazać ranking poszczególnych części na słupkach

27 Najlepsze praktyki projektowania Tekst i tabele tekstowe są świetnym medium do prezentacji szczegółowych informacji.

28 Najlepsze praktyki projektowania Wykresy liniowe są świetne do wyświetlania trendów, wzorców i odstających

29 Najlepsze praktyki projektowania Wykresy lufowe zastępują busole, które są powszechnie używane dziś w dashboardach

30 Najlepsze praktyki projektowania Użyj wykresów liniowych do pokazania trendów w czasie

31 Najlepsze praktyki projektowania Małe multiwykresy ułatwiają porównania

32 Najlepsze praktyki projektowania

33 Unikaj: Co tu jest nie tak? Bezsensowna różnorodność Słaba organizacja Słaby dobór kolorów Inne: Ciężkie obramowania rozpraszające uwagę

34 Unikaj: Co tu jest nie tak? Słabe rozplanowanie danych Najważniejsza przestrzeń (górny-lewy) jest użyta do prezentacji logo dostawcy systemu i kontrolek nawigacyjnych Patrząc w dół, następną informacją, którą widzimy, jest przeciętna wielkość zamówienia. Czy to jest najważniejszy wskaźnik do pokazania? Wykres pokazujący Computers Returns Across Models zajmuje dużo miejsca i używa większych czcionek aby przyciągnąć uwagę do danych które zdają się być ważniejsze od pozostalych Brak wizualnej kolejności Jasnoczerwone nagłówki zbyt przyciągają wzrok Wykresy wielkości zamówienia i trendu zysku line są rozdzielone na dwa obiekty. Porównanie byłoby łatwiejsze na jednym Inne Czerwone/ Zielone

35 Unikaj: Co tu jest nie tak? Wszystko jest wizualnie wyróżnione Nic się nie wyróżnia Logo i kontrolki nawigacyjne są umieszczone w najważniejszym miejscu ekranu Ciężkie obramowania Dane są równomiernie wytłuszczone i kolorowe co powoduje identyczność i brak centralnego punktu Inne Czerwone/ Zielone

36 Unikaj: Co tu jest nie tak? Nieatrakcyjny design Rozciągnięcie wykresów aby wypełnić miejsce Ciężkie obramowania Tło Inne Czerwone/ Zielone/ Żółte

37 Unikaj: Co tu jest nie tak? Wykresy 3D Ciężkie obramowania Tło Gradient kolorów w tle wykresów rozprasza uwagę

38 TABLEAU in memory lub live EURECA - wykorzystuje najlepsze elementy tej platformy: MS SQL, AS, RS, Excel hurtownia danych Nowe narzędzie: RAPORTY EXCEL

39 Raporty/pulpity Tableau