Günümüzün en gelişmiş arabasının sahibi olduğunuzu ve bu arabanın teknolojinin sağlayabileceği tüm özelliklere ve sensörlere sahip olduğunu hayal edin…

Bu arabanın gösterge paneli nasıl görünürdü?

Açıktır ki, sürdüğümüz hız hakkında göstergeler alabiliriz ve tabii ki motor devri, yakıt seviyesi ve kat ettiğimiz mesafe hakkında göstergelerimiz olacaktır. Ancak bugün var olan en gelişmiş arabanın sahibi olduğumuzu unutmayalım, bu nedenle arabanın içindeki ve dışındaki sıcaklık, deniz seviyesinden yükseklik, rüzgar hızı, mil başına yakıt tüketimi, arabanın ağırlığı, yolcular ve bagaj, arabanın açısı ve konumu, herhangi bir kattaki hava basıncı, dönüşlerde hissettiğimiz G kuvvetleri ve sürüş atmosferine uygun müzik önerisi…

Tüm bu özelliklere sahip olmak güzel, ancak hangileri sürüşümüzü geliştirecek ve hangileri bizi hedefimizden (bir yerden bir yere güvenli bir şekilde sürmek) bozacak ve uzaklaştıracak?

Bu yazıda, SaaS ürünleri için gösterge paneli oluştururken ele alınması gereken bazı altın kuralları ve gizli sosumu paylaşacağım.

1. İçeriği sıralayın — her şey çok önemli değildir

Kullanıcılarınızı tanırken, her türlü veriyi belgelemek ve toplamak daha iyidir. Her görüşmede ve çalışma oturumunda, tartışmadan bazı parametreler veya ölçümler çıkarılabilir. Tüm bu bilgi parçalarını toplayın ve bunları bir duvara (veya en sevdiğiniz tuvale) yayın.

Kullanıcılarınız ve ihtiyaçları hakkında yeterli veri topladığınızda, gösterge panosunun ürünün kapısı olduğunu ancak ürünün kendisi olmadığını unutmamak önemlidir. Gösterge Tabloları, kullanıcılarının neyin yanlış olduğunu anlamalarına, çalışmalarına öncelik vermelerine ve kolay bir dikkat gerektiren alanlara gitmenin yolu.

Panonun tüm veri havuzunu sunması gerekmez, ancak panonun izlediği şeyle ilgili üst düzey bilgileri sunması gerekmez; üründeki her bilgi parçasının panoda sunulması veya açıklanması gerekmez.

Bu durumu hayal edin:

Şık bir ceket almanız gerekiyor ama en yakın mağazaya girdiğinizde mağazanın tüm eşyalarının kapının önündeki masalara yığılmış olduğunu görüyorsunuz.

Ne yapardınız?… muhtemelen dükkan çalışanlarından birinden yardım istersiniz. Neyse ki ticari mağazalarda yolunuzu bulmanız çok kolay, mağazaya girip 1. sağdan kadın/erkek reyonuna dönün ve bir bakışta ilgili reyonu göreceksiniz (en fazla 15 saniye).

Ürününüz aynı şekilde davranmalıdır, bu nedenle bazı bilgileri 'gizlemek' veya onu elde etmek için kullanıcının minimum etkileşimine güvenmek sorun değil — Kullanıcınızı sahip olduğunuz her şeyle bombardımana tutmaktan daha iyidir.

Uğraştığınız verileri 3 gruba ayırmaya çalışın:

1. çok önemli
2. Yüksek değer
3. Olması güzel

2. Tipiniz nedir — farklı amaçlar için farklı araçlar gerekir

Beş ana pano türü vardır; farklılıklar, kişilik becerilerinden, sunulan bilgilerin türünden (ve miktarından) ve kullanıcının gerçekleştirebileceği eylemlerden kaynaklanır. Kullanıcılarınızla yaptığınız görüşmeye dayanarak, kullanıcının ne tür araçlara ihtiyacı olduğunu, ne tür bilgiler sağlayabileceğini ve (varsa) kullanıcının onunla ne gibi etkileşimleri olduğunu anlamaya çalışın.

Bir bakışta kontrol paneli

Hedef: Sistemin (farklı bölümlerinde) kuşbakışı görünümünü gerçek zamanlı olarak sunun

Ana karakter: Çeşitli

Özellikler: Bu tür gösterge panosunu bir kontrol merkezi olarak ilişkilendirebiliriz, bu nedenle, vasıfsız kullanıcılar için geçerli olduğundan ve bu nedenle kısa bir öğrenme eğrisine sahip olması gerektiğinden, birkaç parametre ve veri içerecektir.

Operasyonel kontrol paneli

Hedef: Süreçlerin performansını izlemek ve kullanıcılarının hızlı bir şekilde ele alınması gereken bir sorunu görsel ve etkileşimli olarak işaret etmesine izin vermek

Ana kişi: Bu gösterge panoları operasyonel prosedürleri izlemek için kullanıldığından, genellikle vasıflı orta düzey personel tarafından işletilir.

Özellikler: Kullanıcı, verileri farklı bağlamlarda dilimlemek ve seçilen bir zaman diliminde ölçmek gibi, pano ile farklı etkinlikleri filtreleyebilmeli ve gerçekleştirebilmelidir.

Yaygın hatalar: Operasyonel panolar, kullanıcılarının farklı süreçleri izlemesine ve analiz etmesine olanak tanır, böylece birçok bilgi oluşturur veya bunlarla ilgilenir. Bilgileri yerleştirdiğinizden ve kullanıcı akışlarına göre gruplandırdığınızdan emin olun; süper sezgisel olmalı ve kullanıcının ihtiyaç duyduğu verilere erişmesi kolay olmalıdır.

stratejik pano

Hedef: Stratejik bir pano, yönetim ekiplerine farklı zaman dilimlerindeki iş performansları (ve hedefleri) hakkında karşılaştırmalı görüşler sağlayan ve genellikle geleceğe yönelik tahminler sağlayan bir ölçüm aracıdır.

Ana kişi: Genellikle yönetim veya analistler

Özellikler: Stratejik gösterge panolarının çoğu, farklı gruplardan veya zaman dilimlerinden farklı varyantları karşılaştırmaya dayanır, etkileşimli olmaları ve ulaşılmaya çalışılan hedefi veya hedefi sunmaları gerekir.

Yaygın hatalar: Stratejik pano, yönetim ekiplerinin iş verimliliğini ve üretkenliğini artırmak için doğru kararlar vermesini sağlayabilir. Kullanıcınızın hedeflerini iyi tanımladığınızdan ve oraya ulaşmadaki ilerlemelerini vurguladığınızdan emin olun (yöneticiler, yönetim kurulu sunumlarında ilerlemelerini göstermeyi severler)

Analitik kontrol paneli

Hedef: Büyük miktarda veriye odaklanan ve kullanıcıya belirli ve tanımlanmış segment(ler)e dalıp onu farklı toplama ve görünümlerde keşfetme yeteneği sağlayan analitik pano

Ana karakter: Analistler

Özellikler: Gerçek zamanlıya odaklanan operasyonel panoların aksine, analitik panolar eğilimleri belirlemek, bunları çeşitli değişkenlerle karşılaştırmak ve tahminler oluşturmak için geçmiş verilere dayanır.

Yaygın hatalar: Analitik kontrol panelinin odak noktası belirli bir bilgi segmentindedir (belirli bir zamanda), kullanıcının işinin çoğu bu segmenti kesip dilimlemek ve diğer segmentlerle karşılaştırmak olacaktır — filtreleme mekanizmasının çalışmasının kolay olduğundan emin olun ile ve kullanıcıyı akışından geciktirmez .

taktik kontrol paneli

Hedef: Karar vermeyi hızlandırın ve dikkat edilmesi gereken alanları vurgulayın

Ana karakter: Genellikle orta düzey yönetim tarafından kullanılır.

Özellikler: Taktik gösterge panoları, tüm işi kendi belirli bölümleri/bölümleri/grupları üzerinde sunmalı ve kullanıcıyı sorunlu alanlara odaklamalıdır. Bir grup içindeki öğeleri gösteren ısı haritaları, topoloji haritaları, kabarcık çizelgeleri ve diğer BI bileşenleri genellikle bu tür panolarda uygulanır.

Kullanıcılarınızın neye ihtiyacı olduğunu anladığınızda, sonunda verilerini sunmak için doğru çerçeveyi ve pano türünü seçebilirsiniz.

1. Bir bakışta: belirli bir zaman diliminde özetlenmiş önemli metrikler
2. Operasyonel: performansı farklı süreç ölçümleriyle gösterin
3. Stratejik: başarmak/geliştirmek için gereken uzun vadeli stratejilere ve ölçütlere odaklanır
4. Analitik: farklı görünümlerden kesilip sunulabilen çok miktarda veri içerir
5. Taktik: karar vermeyi hızlandırmak ve dikkat edilmesi gereken alanları vurgulamak için işin derinlemesine bir analizini sunun

“Beş saniye kuralına” aşina mısınız? (Yerden yemek yemekle ilgili olan değil)

Bu, ihtiyacınız olanı ekranda 5 saniye içinde bulabilmeyle ilgili kuraldır ve tamamen hiyerarşi ile ilgilidir.

Kural basittir: bilgi ne kadar önemliyse o kadar belirgin olmalıdır.

Hangi bilgilerin nereye gitmesi gerektiğine karar verirken, kararlarınızı insanların bilgileri okuma biçimine ve bu bilgilerin ne kadar önemli olduğuna dayandırmanız gerekir. Bilgileri farklı hiyerarşi ve konumlarda ekranlara yerleştirerek, kullanıcının dikkatini doğru yerde ve doğru sırada çekmesini sağlayarak ekranda kullanıcı yolculuğunu oluşturabilirsiniz. KPI'lar genellikle başlamak için iyi bir yerdir çünkü bu, panoya dalmaya başlamak için en ilginç alandır — bu, zor konulara dalmadan önce bağlamı elde ettiğiniz özettir.

Pek çok hiyerarşi türü ve bunları uygulamanın birçok farklı yolu vardır, yaygın türleri örneklerle özetlemeye çalışacağım:

Boyut hiyerarşisi

Tüm veri metrikleri eşit değildir ve bazılarına akışta daha önce ihtiyaç duyulabilir — Öğe ne kadar büyükse o kadar fark edilir. Kullanıcı doğası gereği daha büyük bileşenlerden başlayarak küçük parçalara doğru ilerleyecektir.

Konumsal hiyerarşi

Ekranın sol üst köşesi doğal olarak daha fazla dikkat çekecektir, bu nedenle önemli bilgileri yukarıdan aşağıya ve soldan sağa konumlandırmaya çalışın. Bileşenleri bu sırada düzenlemek, kullanıcının akışı istediğiniz yerden başlatmasını sağlar.

Beyaz boşluk hiyerarşisi

Bir parametrenin dikkat çekmesini istiyorsanız, onu izole edin ve diğer öğelerin yakınında (veya arasında) değil, beyaz boşlukla çevreleyin.

Renk hiyerarşisi

Belirgin renk, öğeleri izole edebilir ve kalınlaştırabilir veya farklı bağlamsal gruplarda düzenleyebilir

Tüm bileşenler aynı hiyerarşide olduğunda, kullanıcıların dikkatini ilgili alana odaklamak daha zordur.

Ekran çok yoğun olduğunda, dikkat doğal olarak daha az kalabalık olan yerlere (daha fazla beyaz ve daha az bileşen içeren) gidecektir.

Riske atamayacağınız önemli bir parametreniz varsa, gözden kaçan bazı hiyerarşi kuralları kısaca şunlardır:

• Ekranın sol üst köşesi doğal olarak daha fazla dikkat çekecektir, bu nedenle önemli bilgileri yukarıdan aşağıya ve soldan sağa konumlandırmaya çalışın.
• Bir parametrenin dikkat çekmesini istiyorsanız, diğer öğelerin yakınında veya arasında değil, onu izole edin ve beyaz boşlukla çevreleyin.
• Öğe ne kadar büyük olursa, o kadar belirgin olur.
• Benzersiz renk, bir öğeyi izole edebilir ve onu kalınlaştırabilir

Veri görselleştirmesini "okurken", hedef kitlenizin soruna ayıracak sınırlı miktarda beyin gücü vardır. Bu beyin gücünün bir kısmı görselleştirmenin kodunu çözmeye ayrılacak; kalan herhangi bir beyin gücü daha sonra mesajı anlamak için kullanılabilir.

Gösterge tablosunun amacı, karmaşık bilgileri erişilebilir ve anlaşılması kolay hale getirmektir. Bu nedenle, verileri sunan arayüz, kullanıcıların bilişsel yükünü ve orada ne olduğunu anlamak için harcadıkları zamanı en aza indirmek için temiz ve anlaşılır olmalıdır.

Her kelime, resim ve grafik, arayüze belirli bir işlev veya fayda sağlamalıdır. Basit bir düzen oluşturmak için gereksiz metin veya grafikleri kaldırın. İyi gösterge panoları, kullanıcılarına anında içgörü sağlar ve onları görevlerine minimum sürtünme ile gönderir.

Aşağıdaki her iki örnek de aynı kavrayışları paylaşmaktadır; üstteki örnek her şeyi her yere yayarken, alttaki örnek önemli içgörüleri vurgular ve talep üzerine ikincil bilgileri sunar.

Çok fazla bilgi yerleştirirken, kullanıcılar onu görmezden gelme eğilimindedir (Yapısını anlamak çok fazla iş gibi görünüyor) ve muhtemelen başka bir yere gitmeyi tercih edeceklerdir.

Kullanıcıya basit sorulara basit yanıtlar bulmanın basit bir yolunu sağlayın.

5. İlişkileri bulun ve içgörü sağlayın (kullanıcının fazla düşünmesine izin vermeyin)

İş sadece metrikleri ve hiyerarşilerini tespit etmek ve anlamakla bitmiyor, aralarındaki ilişkileri de anlamamız gerekiyor. Çoğu parametre tek başına değil, birbirinin türevidir ve bunların arkasındaki ilişkileri anlamak ve bunları kullanıcıların doğru kararları ve eylemleri almalarını kolaylaştıracak şekilde sunmak önemlidir.

Bu biraz karışık bir konu o yüzden kısa bir örnekle açıklamaya çalışacağım:

Bir perakende ağ yöneticisi bize, onlar için en önemli parametrenin işinin 'kârı ' olduğunu söyleyecektir . Ona kârlarını artırmak için ne yapması gerektiğini sorduğumuzda, daha önce bahsetmediği farklı parametreler kullandığını fark edeceğiz - 'Gelirler' ve ' maliyetler ' gibi parametreler.

Bu parametreler (gelir ve maliyet) olmadan kar parametresinin bir anlamı yoktur.

Gelir — maliyet = Kâr

Farklı parametreler arasındaki ilişkileri tanımladıktan sonra, her biri için önemlerine ve eylemler sırasındaki yerlerine göre uygun görselleştirme sağlayabiliriz. Yol boyunca minimum müdahale ile küçük içgörüler eklemek, kullanıcının akışa odaklanmasına yardımcı olur ve ona ekstra ayrıntılar sağlar.

İzole edilmiş bir sayı, çok az bağlam ve değer verir ve kişinin çok fazla düşünmesine neden olur - belirli bir metriğe, onun karşılaştırılan geçmiş verilerine veya en uygun değere eklemek daha iyidir.

6. Önceden renk kararları — (doğru mesajın nasıl sağlanacağı)

Gösterge tablosu söz konusu olduğunda renk seçimleri inanılmaz derecede önemlidir. Doğru rengi seçmek, kullanıcının iş akışını büyük ölçüde kolaylaştırabilir ve daha çekici bir UI oluşturabilir, ancak yanlış renkleri seçmek bazen genel UX'inize daha fazla zarar verebilir.

Kullanıcı arayüzüne renkleri uygulamadan ÖNCE dikkate alınması gereken bazı temel unsurlar şunlardır:

Marka

Pano tasarımı ve veri görselleştirme için marka renklerinizin ideal seçim olduğunu varsaymak kolaydır, ancak durum her zaman böyle değildir. Markanızın ürününüze nasıl ve nerede yansıdığını düşünün, ancak bunu stil rehberinize zorlamayın. Her an yansıtılacak marka renginiz için belirlenmiş bir yer seçmek ve geri kalan bileşenleri mesajını sunan renklerle tasarlamak daha iyidir.

Durum

Durumlar genellikle bir trafik ışığı rengi (kırmızı, turuncu, sarı) olarak sunulacak veya renk veya renk eksikliği ile sunulacaktır. kullanıcının durumu bir bakışta kavraması gerekir — anlamak için çok çalışmak zorunda kalmamaları daha iyidir.

• şiddet seviyesi
• Etkinleştirme / Devre dışı
• açık kapalı
• bağlan/bağlantıyı kes

Amaçları kullanıcının dikkatini çekmek ve iş akışını durdurmak olduğundan, genellikle kırmızı veya başka bir belirgin renkle renklendirilir.

• Uyarılar
• Artış azalış
• Mesajlar
• Bildirimler

Renklerin genel olarak bilinen anlamı vardır, kullanıcıyı gösterebilir veya dikkat edilmesi gereken yerlere yönlendirebilirler — gereksiz renklerle kullanıcılarınızın kafasını karıştırmayın veya dikkatlerini dağıtmayın. Renklerle anında içgörü sağlamak için arayüzü minimum parazitle temiz tutmak daha iyidir.

Sarmalamak

Panolar genellikle pazarlama departmanına da girer. İşlem ekranlarından veya excel tablolarından çok daha fotojenik ve çekicidirler. Doğru yerlerde biraz renkle, kullanıcıların dikkatini işlem gerektiren yerlere odaklamak (ve bilgi sağlamak) mümkündür. Tanıdık kurallar (yeşil — her şey yolunda, kırmızı — her şey berbat) her zaman kullanıcıların dikkatini odaklamaya çalışır, ancak boyut ve konum aynı zamanda verilerin hiyerarşisini de belirler.

Daha önce bahsedildiği gibi gösterge tablosu ürünün kapısıdır ancak ürünün kendisi değildir. Ürünün farklı yönlerinin alt satırlarını ve durumlarını yansıtmalıdır, ancak yalnızca gereken minimum olanı yansıtmalıdır.

Kullanıcı ihtiyaçlarını anlamak ve kontrol panelini oluşturmak, hem karmaşıklık hem de yaratıcı özgürlük nedeniyle herhangi bir sistem veya platform oluşturmanın en keyifli ve zorlu adımlarıdır. Bu sayfa, kuruluştaki hemen hemen tüm kullanıcıların çalışacağı bir ekran olduğundan ve herkesin ihtiyaçlarını karşılaması amaçlandığından, yeterince zaman ayırmanız ve bu sayfayı tekrarlamanız önerilir. Pano, platformu temsil eden ekranlardan biridir, bu nedenle ona yatırım yapmaya ve temel işlevlerinin ötesinde pazarlama değeri de sağlayacak benzersiz ve orijinal bir araç oluşturmaya değer.