Exempel på dashboarddesign: 14 layouter och vad som gör dem bra

Bra dashboarddesign börjar med en fråga, inte med ett diagram: vem tittar, vad behöver de besluta och hur ofta? De bästa dashboards placerar några huvudsiffror med sammanhang överst, förklarar förändringar med diagram nedanför, gör filter tydliga och låter människor agera på det de ser. De flesta riktiga dashboards ligger bakom en inloggning, så nedan följer tre offentliga exempel som vi kontrollerade i oktober 2026, sedan elva vanliga layouter beskrivna utan att nämna någon produkt. Därefter: en designcheklista, misstag att undvika och hur du bygger din egen.

De 14 exemplen i korthet

Offentliga dashboardexempel

Dessa beskrivs så som de såg ut i oktober 2026.

1. Plausibles live-demo

Plausible, ett integritetsfokuserat verktyg för webbanalys, publicerar en live-demo av analysen för sin egen webbplats som vem som helst kan utforska. Dokumentationen beskriver rapporter som Top Pages, med sidvisningar, avvisningsfrekvens, tid på sidan och scrolldjup, samt ingångs- och utgångssidor. En filterknapp låter dig segmentera per sida med reglerna "är", "är inte" och "innehåller", och dokumentationen förklarar hur du jämför statistik över tid.

Lär av det: en publik demo med riktig data låter människor bedöma dashboarden innan de registrerar sig, och ett litet antal enkla rapporter med ett enda filtersystem är lätta att förstå utan utbildning. Öppna demon själv och notera hur rapporterna är uppbyggda.

2. Stripe Dashboard

Stripes dokumentation beskriver en startsida med analys och diagram om affärens resultat, som också lyfter fram viktiga notiser, till exempel olösta tvister. Du väljer vilka widgetar som visas i översikten. Sidomenyn leder till listor du agerar på (saldon, transaktioner, kunder, produktkatalog), var och en med filter och export. Om du trycker på "?" visas kortkommandon, sandlådor låter dig testa utan att röra livedata, och det finns en mobilapp för iOS och Android.

Lär av det: kombinera vyn "hur går det?" med larm om "vad behöver min uppmärksamhet?", och låt varje person anpassa översikten.

3. Grafana

Grafanas dokumentation beskriver dashboards byggda av paneler, där varje panel kör en fråga mot en datakälla och organiseras i rader eller flikar. Variabler låter en och samma dashboard växla mellan till exempel servrar eller miljöer.

Lär av det: variabler hindrar dig från att bygga tio kopior av samma dashboard. Att gruppera paneler i hopfällbara rader gör upptagna dashboards lättlästa.

Dashboardlayouter du kan kopiera

4. SaaS-mätvärdesdashboard

Översta raden: månatligt återkommande intäkter, nya kunder, churnade kunder och aktiva användare, var och en med förändringen sedan förra månaden. Nedanför: en trendlinje för MRR, en uppdelning per plan och en lista över nya registreringar. Vår guide om SaaS-mätvärden förklarar varje siffra.

5. Säljpipeline-dashboard

En tratt- eller stapelgraf över affärer per steg, pipelinevärde per ägare, affärer som avslutas denna månad och en lista över affärer utan aktivitet på en vecka. Om du klickar på en affär öppnas den, så dashboarden fungerar också som en att-göra-lista.

6. Admin för e-handel

Dagens ordrar, intäkter och genomsnittligt ordervärde överst; en lista över "ej levererade ordrar" som huvudsektion; lågt lagersaldo och senaste recensioner i sidospalten. Den vanligaste åtgärden, att markera en order som skickad, ska kunna göras med ett klick.

7. Supportdashboard

Öppna ärenden, ärenden som väntar på ditt team, median för första svarstid och ärenden per tagg. En live-kö nedanför, sorterad efter ålder. Markera allt som överskrider ett svarsmål.

8. Lagerdashboard

Artiklar under beställningsnivån först, med en åtgärd för "beställ". Sedan lagervärde per kategori, senaste rörelser och artiklar utan försäljning under en angiven period. Se hur du bygger en app för lagerhantering.

9. Projektdashboard

En rad per projekt med status, ägare, förfallodatum och procent klart, plus en lista över försenade uppgifter i alla projekt. Färglägg bara undantagen (försenade, blockerade) så att de sticker ut.

10. Marknadsdashboard

Besökare, registreringar och konverteringsgrad per kanal över valt datumintervall; ett diagram över registreringar över tid med markerade kampanjstarter; främsta målsidor.

11. Ekonomidashboard

Kassasaldo, fakturor som ska betalas och förfallna fakturor, utgifter denna månad jämfört med förra månaden, och kommande räkningar. Behåll redovisningsdetaljer i rapporter; dashboarden är till för översikten.

12. Klinik- eller bokningsdashboard

Dagens bokningar på en tidslinje, avbokningar och uteblivna besök, lediga tider och nya bokningar. Stora nog att läsa av på en gång från receptionens skärm.

13. Personlig uppföljningsdashboard

Nuvarande streak, framsteg mot några mål och en kalenderheatmap över aktivitet. Mer motiverande än analytisk, så håll den på en skärm.

14. Kundvänd dashboard

Varje kund loggar in och ser bara sina egna projekt, rapporter eller resultat. Tydliga etiketter, ingen intern jargong och en exportknapp för deras egna uppgifter. Detta kräver riktig inloggning och behörigheter; se rollbaserad åtkomstkontroll.

Vad de bästa dashboards har gemensamt

• En namngiven målgrupp och ett syfte. "För supportchefen, kontrolleras varje morgon."
• Huvudsiffror överst, var och en med sammanhang: en jämförelse, ett mål eller en trend.
• Diagram som matchar frågan. Linjer för trender över tid, staplar för att jämföra kategorier, tabeller för exakta värden.
• Tydliga filter, särskilt datumintervall, som tillämpas på allt på sidan.
• Undantag sticker ut. Använd färg för det som behöver uppmärksamhet, inte som dekoration.
• En väg till handling. Klicka på en siffra för att se raderna bakom den, och agera sedan på dem.
• Konsekventa definitioner. "Aktiv användare" betyder samma sak överallt, och definitionen är nedskriven.
• Snabbt. Långsamma dashboards slutar öppnas.

Vanliga misstag

• Att visa allt man kan mäta. Fler diagram gör att varje diagram uppmärksammas mindre.
• Siffror utan sammanhang. "1 240" säger lite utan föregående period eller ett mål.
• Cirkeldiagram med många skivor. Svåra att jämföra; ett sorterat stapeldiagram är oftast tydligare.
• För många färger. Reservera starka färger för larm och en markerad serie.
• Inaktuell data utan tidsstämpel. Visa alltid när datan senast uppdaterades.
• Ingen mobilvy för dashboards som folk kontrollerar på språng.
• Blandade målgrupper. En styrelserapport och en daglig driftvy hör sällan hemma på samma sida.

Så bygger du din egen dashboard

1. Skriv ner frågorna som dashboarden måste besvara, och vem som ställer dem.
2. Lista datakällorna: din apps databas, ett kalkylblad eller ett annat verktygs API.
3. Skissa layouten: huvudsiffror, två till fyra diagram och en åtgärdslista.
4. Bygg den. Med Mythex beskriver du dashboarden i en chatt och ser den fungera i en live-förhandsvisning. Den kan skapa databasen, inloggningen och rollerna som dashboarden behöver, och du publicerar den till en URL med ett klick. Bläddra bland mallar för en utgångspunkt. Om din data redan finns i ett datalager och du behöver ad hoc-analys kan ett BI-verktyg passa bättre; om den finns i ett kalkylblad, se hur du kopplar Google Sheets till din app.
5. Testa med den verkliga användaren. Se dem använda den i en vecka och ta bort det de ignorerar.

För en fullständig genomgång, läs hur du bygger en dashboard.

Så valde vi exemplen

De flesta dashboards är privata, så vi nämnde bara produkter vars dashboards är offentliga eller dokumenterade på deras egna sidor, och vi beskriver vad dessa sidor visade i oktober 2026. De övriga layouterna är vanliga mönster som beskrivs i allmänna termer, inte kopior av någon specifik produkt.

Frågor