Kiosk ve HMI tasarımı: sahadaki ekranlar için kontrol listesi

Bir kiosk ya da bir makinenin ekranı, gövdesi olan bir yazılımdır. Yanında bir kart okuyucu, bir kablo, bazen bir yazıcı olur; camında güneş parlar, arkasında sıra bekleyenler vardır. İnsanlar onu ayakta, herkesin içinde ve çoğu zaman bir kez kullanır. Bu ekranları şarj ağları için tasarladık: Türkiye genelinde Zes, Avrupa'da Electrip. İspanya'da Revolut için bir self-servis bankacılık makinesi de tasarladık. Şarj istasyonu ekranları notumuz sürücünün yolculuğunu anlatıyor. Bu not ise her kiosk ve HMI için kullandığımız daha geniş kontrol listesi.

1. Ekrandan önce yere bakın

İlk taslaktan önce makinenin nerede duracağını öğrenin:

• Işık: doğrudan güneş, gece, kapalı bir otopark. Gün ışığı kontrastı soldurur; bu yüzden ana metinde WCAG'nin en üst seviyesi olan 7:1'in (AAA) epey üstünü hedefleyin. Zes ekranlarında 11:1 ile 14:1 arasında ölçtük.
• Yükseklik ve açı: Ekrana kim, nereden bakıyor; cam hangi açıda yansıtıyor?
• Eller: eldiven, ıslak parmaklar, diğer elde telefon ya da çanta. Büyük ve birbirinden ayrık dokunma alanları.
• Gürültü ve kalabalık: kalabalık bir istasyon mu, sessiz bir lobi mi; arkada bekleyen biri var mı?
• Erişim mesafesi: AB erişilebilirlik mevzuatının dayandığı EN 301 549 standardı, öne doğru uzanılan kontrolleri yerden 380 mm ile 1.220 mm arasına koyar. Böylece tekerlekli sandalye kullanan biri de ulaşabilir.

2. Donanım da arayüzün parçası

Makinedeki her cihazın ekranda bir anı vardır:

• Donanımı gösterin. "Kartınızı buraya okutun" ancak ekran kart okuyucunun gerçekten nerede olduğunu gösterdiğinde işe yarar. Okuyucunun ışığı da ekranla aynı şeyi söylemelidir.
• Tek bir dil kullanın. Makinenin üstündeki etiketlerdeki kelimelerle ekrandaki kelimeler aynı olsun.
• Her cihaz farklı bozulur. Okunmayan bir kart, kâğıdı biten bir yazıcı, zaman aşımına uğrayan bir tarayıcı, yerine oturmamış bir kablo: Her birine ayrı bir mesaj ve bir sonraki adım gerekir.

3. Bekleme ekranı, net bir başlangıç ve temiz bir bitiş

• Bekleme ekranı: Makinenin çalıştığını ve ne işe yaradığını gösterir. İnsanların bitmesini beklemek zorunda kaldığı bir slayt gösterisi değildir.
• Her adımda tek karar. İptal ve geri her zaman görünür olsun.
• Önce uyaran zaman aşımı. İsteyene ek süre verin.
• Her oturumdan sonra tam sıfırlama. Sıradaki kişi bir öncekinden hiçbir şey görmemeli: ne bir isim, ne bir tutar, ne de kart numarasının bir parçası.

4. Kötü bağlantıyı da tasarlayın

Makineler bağlantıyı telefonlardan daha sık kaybeder. Şunlara erkenden karar verin:

• çevrimdışıyken neyin çalışmaya devam edeceğine, neyin sırada bekleyeceğine ve neyin durması gerektiğine;
• bir ödemenin asla iki kez alınmamasını nasıl garanti edeceğinize;
• arka sisteme ulaşılamadığında ya da uzaktan güncelleme sürerken ekranın ne diyeceğine. Ekran hiçbir zaman öylece donmamalı.

5. Tek akış, filodaki her ekran

Filolarda farklı boyut ve yönde ekranlar bir arada bulunur. Zes'in 400 kW istasyonunda tam ekran var; 720 kW istasyonda ise reklam ekranının altında 1080×459'luk bir şerit. Aynı akışı her boyut için ayrı ayrı tasarladık. Bir yerleşimi küçültüp ötekine sığdırmak işe yaramıyor; şeridin kendi hiyerarşisi olmalı.

6. Erişilebilirlik en baştan kurulur, çünkü sonradan eklenemez

Kiosk kapalı bir sistemdir: Kullanıcı kendi ekran okuyucusunu getiremez, ayarlarını değiştiremez. Bu yüzden:

• ekranı göremeyenler için sesli yönlendirme, kişinin kendisi duyabilsin diye bir kulaklık girişiyle;
• dokunarak birbirinden ayırt edilebilen fiziksel tuşlar;
• asla yalnızca renk değil: Her durumun bir ikonu ve bir metni de olsun;
• birden fazla dil, her ekrandan değiştirilebilir. Zes ekranları 19 dilde.

Avrupa Erişilebilirlik Yasası (EAA), 28 Haziran 2025'ten beri self-servis terminalleri kapsıyor: ödeme terminalleri, ATM'ler, bilet ve check-in makineleri, Yasa'nın kapsadığı bir hizmet hakkında bilgi veren etkileşimli terminaller. Bu tarihten önce kullanılmaya başlanan terminaller ekonomik ömürlerinin sonuna kadar, en fazla 20 yıl, kullanılmaya devam edebilir. Gerisi EAA kontrol listemizde.

7. Sürüm çıkmadan değişebilen içerik

Fiyatlar, çalışma saatleri, duyurular, diller ve kampanyalar yazılımdan daha sık değişir. Bunları uzaktan yapılandırmayla ya da bir içerik sistemiyle yönetin; bir fiyat değişikliği her makineye yeni bir sürüm yüklemeyi gerektirmesin. Şarjda fiyat gösteriminin kendi kuralları var: AFIR ve EPDK ekranda notumuza bakın.

8. Kilitleyin

• İşletim sistemine çıkış yolu olmasın: sistem pencereleri, tarayıcı çubuğu ya da klavye kısayolları görünmesin.
• Teknisyenler için gizli ve PIN korumalı bir servis modu olsun.
• Bir çökmeden sonra makine kendini yeniden başlatıp bekleme ekranına dönsün.

9. Önce tarayıcıda prototip, sonra makinede test

Gerçek akışın tarayıcıda çalışan tıklanabilir bir prototipi; paydaşların, test katılımcılarının ve iş ortaklarının ekranları donanım gelmeden çok önce denemesini sağlar. Zes için bir tane yaptık; şimdi Zes HMI deneyimi sayfamızda yaşıyor.

Sonra prototipi gerçek makineye, gerçek yerine götürün. Zes'te 20 katılımcıyla, gerçek görevlerle, farklı ışık ve koşullarda test ettik; insanların vazgeçtiği adımda akışı sadeleştirdik. Masa başındaki bir inceleme parlamayı, eldiveni ya da sırayı gösteremez.

10. Sahada ölçün

Makinenin gördüğünü kaydedin: Oturumlar nerede yarım kalıyor, her adım ne kadar sürüyor, hangi cihazda hangi hata çıkıyor, zaman aşımı ne sıklıkta devreye giriyor? Bunu destek hattına gelen çağrılarla yan yana koyun. En çok çağrı alan adım, genellikle sıradaki yeniden tasarım işidir.

Kaçınacaklarımız

• Uygulamanın büyütülmüş hâli. Kiosk büyük bir telefon değildir: kayan akışlar, küçük ikonlar, keşfedilmesi gereken hareketler olmaz.
• Yalnızca her şeyin yolunda gittiği senaryoyu tasarlamak. Makine, bir şeylerin ters gittiği gün yargılanır.
• Figma'da onaylayıp geçmek. Son sözü, gerçek ışığındaki gerçek ekran söyler.

Biz nerede devreye giriyoruz

• Kiosk ve gömülü arayüzler: İlk saha ziyaretinden saha testine ve filonun güncellemelerine kadar kiosk ve HMI arayüzlerinin tasarımı ve geliştirilmesi.
• Erişilebilirlik ve EAA: Kullanıcının kendisi ayarlayamadığı ekranlar için WCAG 2.1 ve EN 301 549'a göre değerlendirme.

Sahada kullanılan ekranları tasarlıyor ve geliştiriyoruz. Bir kiosk planlıyorsanız ya da bir filonun HMI'ını yeniliyorsanız, birlikte bakmaktan memnuniyet duyarız.