Visuelt hierarki i design af dashboards

Et dashboard med tyve tal kæmper om opmærksomheden. Visuelt hierarki leder øjet hen til det, der betyder mest først, så beslutninger tages på sekunder og ikke på minutter.

Kladde

Visuelt hierarki er en ordning af størrelse, farve, placering og kontrast, der fortæller seerne, hvad de skal læse først, næst og til sidst. På et dashboard adskiller hierarkiet signal fra pynt. Uden det råber alle diagrammer lige højt. Brugerne skimmer tilfældigt, overser vigtige ændringer og går med mindre tillid, end de kom med.

Godt hierarki handler ikke om at gøre dashboards smukke. Det handler om at mindske den mentale belastning, så den rigtige person lægger mærke til den rigtige afvigelse og handler. Valg i designet skal følge prioriteten af beslutningerne.

Start med ét hovedspørgsmål pr. dashboard

Før du placerer en eneste widget, så skriv det spørgsmål, dashboardet svarer på. Er vi på sporet mod omsætningen for kvartalet? Hvilken kanal klarede sig dårligt i denne uge? Bliver brugen af produktet bedre efter udgivelsen? Hovedspørgsmålet afgør, hvilket tal der får øverste plads og største størrelse.

De sekundære spørgsmål støtter hovedspørgsmålet. De hører til lavere eller mindre i layoutet. Tredje led med detaljer ligger bag drill-down eller koblede visninger til diagnose. Hvis alt svarer på det samme prioritetsniveau, falder hierarkiet sammen.

Brug placering og størrelse med omtanke

Seerne læser øverst til venstre først i layouts, der læses fra venstre mod højre. Sæt det ene vigtigste tal eller den vigtigste kurve dér. Nøgletal, der driver beslutninger hver uge, fortjener den største skrift og den mest synlige placering i kortene.

Gem den øverste række til tal, der skal overvåges hver dag. Sæt tal, der bevæger sig langsommere og giver sammenhæng, som sammenligninger fra år til år eller opdeling i segmenter, i den anden række. Støttende diagrammer fylder resten af pladsen uden at konkurrere om den første opmærksomhed.

Brug farver til at give mening og ikke til pynt

Farver skal vise status eller kategori og ikke æstetik. Neutrale toner til diagrammer til sammenligning. Én accentfarve til positiv udvikling. Én tydelig farve til advarsler eller negative afvigelser. Mere end tre farver med en funktion skaber forvirring.

Undgå regnbuefarver på ét diagram, medmindre hver farve svarer til en fast kategori, som brugerne allerede kender. Hvis farver tildeles tilfældigt, skal seerne læse forklaringen hver gang, og det gør det langsommere at forstå.

Statussignaler

Grøn, orange og rød virker, når de er knyttet til tydelige grænser, der står på dashboardet. Et tal bliver orange fem procent under målet og rødt ti procent under. Grænserne skal passe til definitionerne i din ordbog over tal, så man kan stole på farvernes signaler.

Tag fokus væk fra data, man ikke kan handle på

Baggrund, som den samlede mængde historiske data, bør bruge lysere streger og mindre tekster. Sammenligningen med den nuværende periode fortjener fed skrift. Hierarki handler lige så meget om, hvad du dæmper, som om, hvad du fremhæver.

Vælg diagramtyper, der passer til vigtigheden

Enkle former kommunikerer hurtigere end komplekse. Et stort nøgletal med en lille kurve for udviklingen slår et detaljeret diagram med flere serier, når direktionen skal bruge opmærksomheden. Gem diagrammer med stablede områder og to akser til dashboards til diagnose, hvor seerne forventer analytisk dybde.

Tabeller hører til nederst eller bag faner, medmindre detaljer på rækkeniveau er det vigtigste grundlag for beslutningen. Når tabeller er nødvendige, så fremhæv kun rækker, der overskrider grænser. Rækker uden fremhævning giver sammenhæng uden at stjæle fokus.

Brug de samme mønstre i layout på tværs af dashboards

Når dashboards til marketing og salg bruger det samme gitter, den samme skrift og de samme regler for farver, kan brugerne overføre det, de har lært, mellem visningerne. Ensartethed er limen i hierarkiet. Et rødt udsving betyder altid det samme. De vigtigste nøgletal sidder altid øverst til venstre.

Når antallet af dashboards vokser, så udgiv en skabelon til layout. Nye dashboards arver skabelonen i stedet for at opfinde opbygningen igen. Det kobler principperne for hierarki til din bredere strategi for at skalere dashboards.

Gør det mindre rodet uden at skjule nyttig dybde

Rod ødelægger hierarkiet. Fjern pynt i diagrammer: for mange hjælpelinjer, tredimensionelle effekter, overflødige tekster og dobbelte tal, der både vises som et tal og som et diagram. Hvert element skal fortjene sine pixels.

Brug gradvis afsløring. Vis et overordnet hierarki i hovedvisningen. Link til avanceret segmentering og kohorteanalyse til seere, der skal forstå, hvorfor et hovedtal ændrede sig. Hoveddashboardet er stadig hurtigt at skimme.

Test dashboards med rigtige seere

Bed en kollega, der ikke har bygget dashboardet, om at finde ud af, om omsætningen er på sporet, inden for fem sekunder. Hvis kollegaen ikke kan det, er hierarkiet slået fejl, uanset hvor poleret layoutet ser ud. Gentag testen efter hver større ændring af designet.

Følg brugen af selve dashboardene, hvis dit system kan det. Widgets, ingen åbner, bør flyttes ned eller fjernes. Hierarkiet bør udvikle sig mod det, seerne faktisk bruger, og ikke det, bygherrerne tror, de har brug for.

Ofte stillede spørgsmål

Hvor mange nøgletal skal være i den øverste række?

Tre til fem på det meste. Mere end fem giver lige stor visuel vægt og fjerner et tydeligt omdrejningspunkt. Hvis ledelsen har brug for flere tal, så del dem ud på dashboards til hver rolle i stedet for at fylde et enkelt overblik. Med WEMASY's hjemmesidebygger kan du få målene på din hjemmeside til at passe til de nøgletal, dine dashboards fremhæver.

Skal advarselsfarver stå på alle widgets?

Nej. Gem stærke farvesignaler til tal, der er knyttet til en handling med det samme. Hvis du bruger rød og grøn for meget, lærer seerne at ignorere advarsler. Neutral visning er fint til stabile tal inden for det forventede.

Hvad er den største fejl i hierarki på dashboards til ledelsen?

At sætte et dekorativt diagram over udviklingen, hvor det vigtigste nøgletal skulle sidde. Ledelsen har brug for overskriftstallet først og ikke en visning fuld af forklaringer, som kræver tredive sekunder at tolke.

Hvordan ændrer hierarkiet sig, når antallet af dashboards vokser?

Hvert dashboard indsnævres til ét hovedspørgsmål, mens fælles skabeloner holder reglerne for placering og farver ens. Se skalering af dashboards for, hvordan en opbygning i niveauer og hierarki virker sammen.

Hvor skal diagrammer med detaljeret segmentering ligge?

På visninger til diagnose, der er koblet fra hoveddashboardet, og ikke på den vej, øjet først følger. Seere, der har brug for dybde i kohorter eller segmenter, kan følge et link til avanceret segmentering og kohorteanalyse uden at rode layoutet til for ledelsen.

Hvor ofte skal vi gennemgå hierarkiet i dashboardet?

Gennemgå det hvert kvartal og efter alle større skift i forretningens prioriteter. Et tal, der var sekundært sidste kvartal, kan være primært i dette kvartal efter en lancering eller en ændring på markedet. Hierarkiet bør følge strategien og ikke låste skitser.

Brug det med det samme
på din egen hjemmeside.

Start gratis med WEMASY, og byg din side på få minutter.