Dijitalde marka

Kanca

Bir ülkenin vatandaşları, adaletten sağlığa, eğitimden ulaşıma kadar yüzlerce kurumun binlerce hizmetine tek bir internet kapısından ulaşıyor. Her kurumun kendi logosu, kendi rengi, kendi alışkanlıkları var. Ama kapının içinde bir vatandaş bir hizmetten ötekine geçtiğinde başka bir siteye girmiş gibi hissetmemeli.

Bunun için kapının bir kimlik kılavuzu var ve herkese açık. Her sayfanın üst kısmında da aynı birkaç seçenek duruyor: yalnız metinden oluşan bir görünüm, daha belirgin bir odaklama, klavye kısayolları.

Dijitalde bir marka, logosuyla değil, her ekranda aynı biçimde davranmasıyla tanınır.

Büyük fikir

Dijital yüzeylerde marka bir kez görülen bir afiş değil, her gün kullanılan bir araçtır. Bu yüzden dijitalde kimlik; renk ve harflerin yanında düğmelerin, formların, hata mesajlarının ve geçişlerin her ekranda aynı davranmasıyla kurulur. Tasarım sistemi bu tutarlılığı sağlayan ortak kütüphanedir.

Anlatım

Dijital yüzey neden farklıdır?

Basılı bir paket bir kez tasarlanır ve binlerce kez aynı biçimde basılır. Dijital bir yüzey ise sürekli değişir: yeni bir sayfa eklenir, bir form güncellenir, bir uygulama yeni bir özellik kazanır. Her değişikliği farklı bir kişi yapabilir ve her biri küçük bir karar verir: bu düğme hangi renkte, bu hata mesajı nasıl yazılacak, bu liste nasıl sıralanacak? Bu kararların her biri tek başına küçüktür; ama birikince markanın dijital yüzünü belirler.

Dijital yüzeyin ikinci farkı, kullanılmasıdır. Bir afiş bakılır; bir sipariş formu doldurulur. Kullanıcı bir şey yapmaya çalışırken marka ya ona yardım eder ya da yoluna çıkar. Bu yüzden dijitalde marka deneyimi, bir sayfanın güzelliğinden çok, bir işin ne kadar kolay bittiğiyle ölçülür.

İlk bakış

Bu bulgu dijital yüzeylerin ilk ekranının neden önemli olduğunu gösteriyor: insanlar bir sayfanın kendilerine çekici gelip gelmediğine çok hızlı karar verebiliyor. Ama ilk izlenim işin yalnız başıdır. Çekici bir ana sayfa, ardından gelen formun karmaşık olmasını telafi etmez. Dijitalde marka, ilk bakışla son tıklama arasındaki bütün yolda kurulur.

Tasarım sistemi

Bir tasarım sistemi üç katmandan oluşur. İlki stillerdir: renkler, yazı karakterleri, boşluk ölçüleri ve hareket kuralları. İkincisi bileşenlerdir: bir düğme, bir metin kutusu, bir uyarı kutusu, bir tarih seçici gibi her yerde aynı biçimde kullanılan yapı taşları. Üçüncüsü kalıplardır: bir adres sorma, bir hata gösterme ya da bir siparişi onaylama gibi sık karşılaşılan işler için denenmiş çözümler.

Tasarım sisteminin asıl değeri, her yeni ekranı hazırlayan kişinin aynı kararları yeniden vermemesidir. Bir hata mesajının nasıl görüneceği bir kez düşünülür, sınanır ve bileşene dönüşür; sonra her formda aynı biçimde kullanılır. Böylece marka hem tutarlı görünür hem de bir kez öğrenilen bir davranış her yerde aynı kalır.

Tasarım sistemi yaşar

Bir tasarım sistemi bir kez yazılıp rafa kaldırılmaz. Yeni ihtiyaçlar doğdukça yeni bileşenler eklenir; bazıları önce denenir, sonra kalıcı hâle gelir; eskiyenler emekliye ayrılır. Bu yüzden iyi bir tasarım sisteminin bir sürüm geçmişi ve bir sahibi vardır. Küçük bir marka için bu bir kütüphane değil, tek bir sayfa da olabilir; önemli olan, kararların bir yerde yazılı durması ve herkesin aynı yere bakmasıdır.

Vakalar

Örnek markada

Takvo'nun dijital yüzü üç ayrı parçadan oluşuyordu: Instagram hesabı, "Biz kimiz?" bölümünü taşıyan küçük bir internet sayfası ve kafelerin cuma siparişlerini çarşamba akşamına kadar bildirdiği basit bir form. Sayfayı bir arkadaş, formu başka biri hazırlamıştı. Sayfadaki düğmeler yuvarlak ve lacivertti; formdaki düğme köşeli ve yeşildi.

Hata köşesi

Kendi markanda

Özet

1. Dijitalde marka kullanılan bir araçtır; kimlik, düğmelerin, formların ve mesajların her ekranda aynı davranmasıyla kurulur.
2. İnsanlar bir sayfanın görsel çekiciliğine çok hızlı karar verir; ama ilk izlenim yolun yalnız başıdır.
3. Tasarım sistemi stilleri, bileşenleri ve kalıpları bir arada tutar; her ekranda aynı kararların yeniden verilmesini önler.
4. Bileşenin metni de bileşenin parçasıdır; böylece düzeltilmiş bir mesaj bir daha geri dönmez.
5. Tasarım sistemi yaşar: yeni bileşenler denenir, kalıcılaşır, eskiyenler emekliye ayrılır; küçük bir marka için tek bir sayfa yeter.

Kendini sına

1. GOV.UK Design System kendini hangi amaçla tanıtıyor: (a) her hizmetin kendi görünümünü yaratması için, (b) kamu hizmetlerini GOV.UK ile tutarlı kılmak ve başka ekiplerin deneyiminden öğrenmek için, (c) yalnız logo dosyalarını paylaşmak için?
2. Lindgaard ve arkadaşlarının çalışmasına göre bir internet sayfasının görsel çekiciliği ne kadar sürede değerlendirilebiliyordu: (a) on saniyede, (b) yaklaşık elli milisaniyede, (c) ancak sayfayı kullandıktan sonra?
3. e-Devlet Kapısı'nın her sayfasında hangi ortak seçenekler yer alıyor: (a) yalnız metin görünümü, daha belirgin odaklama ve klavye kısayolları, (b) her kurumun kendi renk teması, (c) dönen reklam görselleri?
4. Tolga sipariş formunda hangi iki sorunu yaşadı: (a) form çok uzundu ve pahalıydı, (b) form ayrı bir site gibi görünüyordu ve düzeltilmiş hata mesajı yerine eski "geçersiz işlem" metni geri gelmişti, (c) form İngilizceydi?
5. Takvo'nun ana sayfasının ilk ekranına ne kondu: (a) kendi kendine dönen büyük fotoğraflar, (b) bu haftanın partisinin çerçevesi, kavurma günü ve iki düğme, (c) yalnız logo?

Yanıtlar

Birinci soruda (b). Sistem, hizmet ekiplerine tutarlılık ve ortak deneyim sunuyor; aynı işi tekrar tekrar yapmamalarını öneriyor. Stiller, bileşenler ve kalıplar bu amacın araçları. Yeni bileşenlerin önce deneme durumunda eklenmesi de sistemin donmuş bir kurallar listesi değil, yaşayan bir kütüphane olduğunu gösteriyor.

İkinci soruda (b). Elli milisaniyelik ve yarım saniyelik koşullardaki puanlar yüksek düzeyde ilişkiliydi. Bulgu görsel çekiciliği ölçüyor; bir sayfanın kullanılabilirliği ayrıca sınanmalı.

Üçüncü soruda (a). Bu seçeneklerin her sayfada aynı yerde durması, yüzlerce kurumun hizmetini tek bir dijital yüzde birleştiren ortak davranışlardan biri. Kullanıcı hangi kurumun hizmetine girerse girsin, aradığı seçeneği aynı yerde bulur.

Dördüncü soruda (b). İki sorun da ortak bir sistemin yokluğundan doğuyordu. Hata mesajı bir bileşenin parçası olunca, düzeltilmiş metin bir daha kaybolmadı. Tek tip düğme de formu internet sayfasının bir parçası gibi gösterdi.

Beşinci soruda (b). Dönen fotoğraflar sayfanın ne sunduğunu gizliyordu. Yeni ilk ekran, birer saniyelik bakışta beş kişinin beşine de kahve dedirtti ve markanın vaadini, kavurma gününü, en öne koydu.

Sonraki derse köprü

Takvo'nun ekranları artık aynı dili konuşuyor. Ama markanın en çok elle tutulan yüzü hâlâ paketin kendisi: rafın önünde, birkaç saniye içinde seçilmesi gereken bir nesne. M13-D05 «Ambalaj tasarımı», rafta ve ürün listesinde saniyeler içinde seçilmeyi ele alıyor.