Pano Tasarımı - Hususlar ve En İyi Uygulamalar

Bu makalenin sesli sürümünü dinleyin

Gösterge tabloları, ilgili, eyleme geçirilebilir verileri ve ayrıca izleme istatistiklerini ve temel performans göstergelerini (KPI'ler) görüntüleyen veri görselleştirme tekniklerini kullanarak veri tabanlı zekayı sunmanın benzersiz ve güçlü bir yoludur. Gösterge tabloları, bu verileri bir bakışta anlaşılabilir en alakalı bilgilerle birlikte hızlı, taraması kolay bir biçimde sunmalıdır.

Terim, geleneksel otomobil gösterge panosundan doğdu ve dijital dünyada aynı işlevi yerine getirmek için gelişti. Stephen Few, kitabında bunu en iyi şekilde ortaya koydu:

Pano, bir veya daha fazla hedefe ulaşmak için gereken en önemli bilgilerin görsel bir gösterimidir; bilgilerin bir bakışta izlenebilmesi için birleştirilmiş ve tek bir ekranda düzenlenmiştir.

Bu makalede, türü ne olursa olsun, her başarılı pano tasarımının kalbinde yer alan temel ilkelerin yanı sıra stratejik, analitik, operasyonel ve bilgilendirici örnekleri de özetliyoruz.

Veri görselleştirmeye doğru yaklaşıma sahip olmak, başarılı bir gösterge panosunun temellerini atmada önemli bir özelliktir. Veri görselleştirme, verilerin grafikler ve resimler aracılığıyla sunulmasıdır; birincil amacı, karar vericilerin metin tabanlı uygulamalarda algılanamayan kalıpları belirlemelerine veya zor kavramları anlamalarına yardımcı olmaktır.

Noah Iliinsky ve Julie Steele, Data Visualization adlı kitaplarında şunları belirtiyorlar:

Tasarımcının bir veri görselleştirmesi tasarlamadaki amacı, okuyucu tarafından iyi karşılanacak ve kolayca anlaşılacak bir çıktı yaratmaktır. Tüm tasarım seçimleri ve özel uygulamalar bu amaca hizmet etmelidir.

Harika Gösterge Tablolarının Temel Özellikleri

Etkili bir gösterge panosu, bir bakışta eyleme geçirilebilir ve faydalı bilgiler gösterir. Karmaşık verilerin görsel temsilini basitleştirir ve paydaşların temel bilgileri anlamasına, analiz etmesine ve sunmasına yardımcı olur.

Harika panolar net, sezgisel ve özelleştirilebilir.

• Bilgileri hızlı bir şekilde iletirler.
• Bilgileri açık ve verimli bir şekilde görüntülerler.
• Zaman içinde verilerdeki eğilimleri ve değişiklikleri gösterirler.
• Kolayca özelleştirilebilirler.
• En önemli widget'lar ve veri bileşenleri, sınırlı bir alanda etkin bir şekilde sunulur.

Görsel verilerin ve bilgilerin temel kullanıcı gereksinimlerine göre ilk kez özelleştirilmesi, kullanılabilirliği artırmaya ve farklı kullanıcı karakterlerine olan ihtiyacı ortadan kaldırmaya yardımcı olacaktır.

Harika panolar, her şeyi tek bir tıklamayla sağlar.

• Tüm gerekli bilgilere anında erişilebilir.
• Verilere öncelik verilir.
• Bilgiler, tek bir ekranda görsel bir hiyerarşi içinde net bir şekilde görüntülenir.
• Tasarım, daha fazla detaya inmek için ek fırsatlarla birlikte seyrek, net ilk verileri içeren tutarlı bir genel bakış sağlar.
• Öğeler (grafik, tablo, form), kalıcı bir pencerede daha fazla ayrıntı getirme veya daha ayrıntılı bir sayfaya gitme yeteneği ile simge durumuna küçültülmüş bir görünümde görüntülenir.
• Tasarım, kullanıcıların verilerin nasıl görüntüleneceğini özelleştirmesine ve etiketleri, kategorileri ve KPI'ları kullanarak içeriği filtrelemesine olanak tanıyan filtrelerle kullanılabilirliği artırır.

Azaltılmış Karmaşıklık Netlik Sağlar

Verilerle boğulmuş bir dünyada, net bilgi sağlamak, başarılması en zor şeylerden biridir. Gösterge tablolarında yalnızca en alakalı verileri sunmak çok önemlidir; ne kadar fazla bilgi görüntülersek, kullanıcıların ihtiyaç duyduklarını bulması o kadar zor olur.

Seçilebilecek çok fazla veriyle karşı karşıya kaldıklarında, tasarımcılar yalnızca en alakalı alt kümeyi göstermelidir. Yanıltıcı ve net olmayan metriklere öncelik vermeli ve dikkatli bir şekilde kaldırmalıyız.

Etkili pano tasarımı kararları aşağıdakiler tarafından yönlendirilmelidir:

• proje hedefleri
• verilerin doğası
• kullanıcıların ihtiyaçları

Bir görselleştirmeyi (veya başka bir tür iletişimi) okurken, okuyucunuzun soruna adanması için sınırlı miktarda beyin gücü vardır. Bu beyin gücünün bir kısmı görselleştirmenin kodunu çözmeye ayrılacaktır; kalan herhangi bir beyin gücü daha sonra mesajı anlamak için kullanılabilir (okuyucu henüz hayal kırıklığı içinde pes etmediyse). Noah Iliinsky ve Julie Steele (Veri Görselleştirme)

Bir gösterge panosunun temel amacı, karmaşık bilgileri erişilebilir ve sindirimi kolay hale getirmektir. Bu nedenle, kullanıcıların bilişsel yükünü ve arama için harcanan zamanı en aza indirmek için verileri sunan arayüz temiz ve anlaşılır olmalıdır.

Bilgi mimarisi, destekleyici veya ikincil ölçütlere erişime izin verirken, önce temel verileri sunmalıdır. Genel bir genel bakışla başlayan ve ardından daha fazla ayrıntıya inen aşamalı bir detaya inme sistemi tasarlanmalıdır; bu, verilerin önceliklendirilmesini kolaylaştırır ve netlik yaratır.

Pano Hedeflerini Belirleme ve Uygun Verileri Görüntüleme

Panoları tasarlarken, başarılı pano tasarımcıları, çözülecek soruna ve insanların verilerden alması gereken, eyleme geçirilebilir içgörülere odaklanan iyi tanımlanmış bir dizi hedefle başlar.

İyi tasarım hedefleri, verimli ve kesin uygulamayı teşvik eder. Hedef belirleme için SMART çerçevesini kullanmak, belirli , ölçülebilir , eyleme geçirilebilir , gerçekçi ve zamana dayalı hedeflere odaklanır.

Pano tasarım hedeflerini belirlerken sorulacak birkaç önemli soru:

• Kullanıcıların belirli bir hedefe ulaşmak için kaç adım atması gerekiyor?
• Arayüz, kullanıcının kendi hedeflerine ulaşması için yeterince sezgisel mi?
• Kullanıcının amacına başarılı bir şekilde ulaşması için hangi bilgilere ihtiyacı var?

Belirli bir pano tasarımının amacının ne olabileceğini belirlemek için, "Bu tasarım kullanıcı için hangi özel sorunu çözecek?" sorusunu sorarak tanımlayın. Cevap, hangi metriklerin, özelliklerin, değerlerin, görsellerin ve verilerin önemli olduğuna dair içgörü sağlayacaktır.

Hedef odaklı tasarım, gerçek sorunlara çözümlere odaklanır ve tüm harika pano tasarımlarının temelidir. İş hedeflerini net bir şekilde anlayarak başlayın, kullanıcı hedeflerini göz önünde bulundurun ve ardından iletilmesi gereken temel bilgileri iletin.

Pano Tasarımında Bağlam

Pano tasarımının en büyük zorluklarından biri birden fazla kişiye hizmet etmektir. Her kullanıcı rolü tanımlandıktan sonra, ihtiyaçlarının nerede örtüştüğünü ve nerede ayrıldığını anlamak kritik hale gelir.

Etkili iletişim, her başarılı pano tasarımının altında yatan ilkedir. Kullanıcıların kendilerini içinde bulabilecekleri olası senaryoları öngörmek, kullanıcının koşullarının daha iyi anlaşılmasına katkıda bulunacaktır.

Tasarım yaparken her zaman kullanıcıların bağlamını göz önünde bulundurun; teknik bilgilerini, sisteme genel olarak aşinalıklarını, hedeflerini vb. tanımlayın.

Kullanıcı davranışını ve bağlamı belirlemeye çalışırken aşağıdaki soruları sorduğunuzdan emin olun:

• Tasarım, ziyaretçinin okumaya alıştığı yönü dikkate alıyor mu?
• Pano ile etkileşim teknik bilgi gerektiriyor mu?
• Kullanıcılar, eylemlerin çoğunu yalnızca birkaç tıklamayla gerçekleştirmeyi başarabilecek mi?
• Tasarım, detaya inen menüler oluşturarak kullanıcı bağlamıyla uyumlu mu? müstehcen ikonografi ve renk paletleri kullanıyor mu?

Bir gösterge panosunun tasarımında kullanılan renk paleti de bir bağlam olarak düşünülmelidir. Birçok işletmeden işletmeye SaaS ürün panoları, birkaç saat boyunca kullanılmadıkları için koyu temalı bir kullanıcı arayüzünde tasarlanmıştır.

Koyu temalı UI'ler, göz yorgunluğunu azaltmaya yardımcı olabilir ve arayüz içinde görsel netliği destekleyebilir. Bununla birlikte, bu yaklaşımı benimsemek, tasarım yönünün dikkatli bir şekilde değerlendirilmesini gerektirir - önceki bir tasarım blogu makalesinde özetlendiği gibi avantajlar, dezavantajlar ve potansiyel tuzaklar: Dark UI Dos and Don'ts.

Kullanıcı Araştırması ile Daha İyi Pano Tasarımı

Kullanıcı araştırması, kullanıcılara ilgili, açık ve özlü verilerin sunulduğu bir ortam oluşturmaya yardımcı olur. Bu, nasıl kullanacakları ve erişecekleri yerine, aradıkları içerik ve veriler hakkında düşünmelerine yardımcı olur.

Bazı panoların çalışması veya aynı temel panoya bakan farklı rollerdeki kullanıcılar için zahmetsizce özelleştirilebilir olması gerekir. Kullanıcı araştırması önemlidir çünkü kullanıcının hedeflerini, zihinsel modellerini, çevresel bağlamını ve acı noktalarını belirlemeye yardımcı olur. Bunlar, son gösterge panosu tasarımını büyük ölçüde etkileyen faktörlerdir.

Kullanıcı deneyimi tasarımcısı, araştırmacı ve yazar Mike Kuniavsky, bunun “tasarımın bir izleyici üzerindeki etkisini anlama süreci” olduğunu belirtiyor.

Bir tasarımcı, farklı kullanıcı türlerini tanımlamalı ve hedeflerinin nerede aynı ve nerede farklı olduğunu anlamalıdır. Bir kullanıcı türüne karşı diğerine en çok hangi bilgiler uygulanabilir? Bir kullanıcı türünden diğerine farklı bir düzen olması gerekip gerekmediğini veya daha genel bir kullanım durumu için bir çözüm olup olmadığını düşünmelidirler.

Bunu akılda tutarak, ilkel tel çerçevelerle başlamak ve bir kullanıcı araştırması aşamasında gerçek kullanıcılarla test edilebilecek prototiplere geçmek iyi bir fikirdir. Yalnızca beş kullanıcıyla kısa bir kullanıcı araştırma aşamasından gerçekten değerli bilgiler elde edilebilir ve bu, hat boyunca çok büyük bir zaman tasarrufu sağlayacaktır.

Pano Tasarımında Aşamalı Açıklama

Aşamalı açıklama, dağınıklığı azaltarak kullanıcının dikkatini korumak için kullanılan bir tekniktir. Aşamalı bir ifşa sistemi oluşturmak, kullanıcının dikkatini önceliklendirmeye, hatalardan kaçınmaya ve zamandan tasarruf etmeye yardımcı olan kullanıcı merkezli bir ortam oluşturmaya yardımcı olur. Ayrıca, kullanıcıların kendileri için önemli olan temel özelliklere odaklanmasına ve ihtiyaç duymadıkları veya ilgilenmedikleri özellikler de dahil olmak üzere tüm özelliklerden geçmek zorunda kalmamalarına olanak tanır.

Aşamalı açıklama, hata oranlarını da önemli ölçüde azaltacak bir pano tasarımı en iyi uygulamasıdır; Bir sistem özellik önceliklendirmesine dayalı olduğunda verimliliği artıracak ve kullanıcıların gösterge tablolarını anlamalarını geliştirmelerine yardımcı olacaktır.

Aşamalı açıklama, gelişmiş veya nadiren kullanılan özellikleri ikinci bir ekrana erteleyerek uygulamaların daha kolay öğrenilmesini ve daha az hataya açık olmasını sağlar. -Jakob Nielsen

Animasyon, birden çok işlevi yerine getirirken çeşitli kullanıcı ihtiyaçlarını karşılamanın harika bir yoludur. Veriler ve görseller yüklenirken kullanmak için harika bir seçenek ve gelişmiş bir aşamalı açıklama çözümüdür.

Animasyon, hareket yanılsaması yaratma sürecidir; ilerleme ve sürekli geri bildirim duygusu yaratan, böylece kullanıcı belirsizliğini azaltan ve algılanan performansı artıran bir dinamiktir.

Panolarda aşamalı açıklama kullanmanın avantajları:

• Kullanıcı belirsizliğini ve endişesini azaltmak (ilerleme belirtileri göstererek, kullanıcılara her şeyin istendiği gibi çalıştığından emin olunur)
• Kullanıcıları bekletmek yerine bakabilecekleri bir şey (verilerin kısmi gösterimi) sağlamak
• Kullanıcılara atılacak adımlara ilişkin net bir beklenti sağlamak ve bilgilerin hiyerarşik olarak sunulma şeklinin anlaşılmasını sağlamak

Aşamalı açıklamalar ve verilerin yüklenmesiyle ilgili olası sorunlar şunları içerir:

• Göstergeleri ve açıklamaları uygunsuz bir şekilde kullanmak. Kısa yükleme süreleri ve işe yaramaz adımlar, dikkatin dağılmasına neden olacak ve kullanılabilirlik ilkelerine aykırı olacaktır.
• Açık bir ilerleme göstergesi olmadan verilerin alınmasındaki gecikme, kullanıcı belirsizliğine ve daha yüksek hemen çıkma oranlarına yol açabilir.
• Statik ilerleme göstergelerini kullanmak, çok az anlamı olan bir çözümdür ve ilerleme hakkında yeterli bilgi sunmaz, bu da kullanıcı belirsizliğine ve daha yüksek hemen çıkma oranlarına yol açabilir.

Özet

Panolar, özellikle pano tasarımı en iyi uygulamalarını ve uygun veri görselleştirmesini izleyen kullanıcı merkezli, hedef merkezli bir tasarımla, verileri ve diğer bilgileri iletmenin güçlü bir yoludur. Her gösterge panosu farklı olmasına ve kendi hedefleri, gereksinimleri ve sınırlamaları olmasına rağmen, bu temel ilkeleri takip etmek, özelliklerden bağımsız olarak olağanüstü tasarımlar oluşturmaya yardımcı olacaktır:

• Her şeyden önce, kullanıcı türlerinizle empati kurun ve amaçlarını anlayın.
• Müstehcen görseller, etiketler, aşamalı açıklama teknikleri ve animasyondan yararlanarak kullanıcılara net bir hikaye iletin.
• Kullanıcı araştırma tekniklerini uygulayarak karmaşık işleri kolaylaştırın.
• Bir detaya inme sisteminde verileri ve bilgileri uygun zamanda ortaya çıkarın.
• Bilgileri anlamlı bir şekilde ifade etmek için veri görselleştirmeyi kullanın.

• • •

Toptal Tasarım Blogunda daha fazla okuma:

• eCommerce UX – En İyi Uygulamalara Genel Bir Bakış (Infografik ile)
• Ürün Tasarımında İnsan Merkezli Tasarımın Önemi
• En İyi UX Tasarımcı Portföyleri – İlham Veren Vaka Çalışmaları ve Örnekler
• Mobil Arayüzler için Sezgisel İlkeler
• Öngörülü Tasarım: Büyülü Kullanıcı Deneyimleri Nasıl Yaratılır