Daha Az Düşün. Daha İyi Tasarla.

Yönetilebilir karar verme ve düşünce süreci ile UI tasarımında daha iyi iş akışını teşvik etmek.

İyi tasarlanmış bir kullanıcı arayüzü, yalnızca sezgisel bir deneyim sunmakla kalmayıp aynı zamanda bir kullanıcıyı estetik açıdan hoşlaştıran bir dizi önemli kararın sonucudur. Karar alma sürecini daha kolay hale getirerek, daha kolay bir iş akışı ve daha iyi sonuç üretme şansını sağlayabilir.

Tasarım sürecinde ne kadar fazla olanak mevcut olursa, yürütmek ve incelik kazanmak için o kadar çok düşünce gerekir.

Amerikalı psikolog Barry Schwartz, Paradox Of Choice'de seçimlerin ortadan kaldırılmasının endişeyi büyük ölçüde azaltabileceğini yazdı. Standartlarımıza ve kriterlere sahip olmamız gerektiğini, ancak daha iyi bir şey olabileceği ihtimalinden endişe etmiyordu. Tüketiciler bağlamındaydı, ancak tasarım kararları için de geçerli olduğuna inanıyorum.

En üst düzeye çıkarma stratejisi aslında bir mükemmeliyetçi olmamak, ancak toplu olarak en uygun deneyimi yaratacak en uygun kararları almaktır.

1. Değişkenleri Sınırlamak

Tüm potansiyel değişkenleri yüksek sadakat kavramı üretmek için göz önünde bulundurursak ve daha fazlası olabilirse, bunları önceden sınırlandırmamız ve tanımlamamız gerektiği açıktır. Mevcut seçeneklerin miktarını azaltmak, belirleyici olmayı kolaylaştıracak.

Tecrübeyle, belirli değişken gruplarının sınırlandırılmasının bir kompozisyon boyunca çarpma etkisinin nasıl olacağını tahmin etmek kolaylaşır.

Seçimleri azaltmak, orijinalliği azaltmayla ilişkili değildir. Bizim varsayımımız, önceden tanımlanmış kurallar etrafında kavramlar yaratmanın bir sınırlama olduğudur, ancak tasarımcılar olarak kendi kurallarımızı oluşturabilir ve bunları formüle etme konusunda tam kontrol sahibi olabiliriz.

Ölçek ve Boşluk

UI tasarımının her yönü, ritmi destekleyen ve bir proje büyüdükçe ölçek ve mekandaki tutarlılığı korumaya yardımcı olan bir sistemin etrafında dönmelidir. Kullanmayı sevdiğim böyle bir sistem, bir kompozisyondaki bir elementin veya negatif alanın boyutunu ölçmek veya ayarlamak için verilen herhangi bir orandan bir ölçeği kolaylaştırabilen modüler skaladır.

Bir oran seçtikten sonra, modüler ölçek, ölçek ve aralığın tanımlanmasını kolaylaştırabilir

Izgaralar, tipografi, dikey boşluklar ve mizanpajın genel boyutlarını yönetilebilir bir seviyeye kadar değişkenleri azaltabilmesine rağmen, aynı zamanda hoş estetik ve ritim de sağlar. UI tasarlamak çok kolaydır.

Izgaralar

Grid sistemleri, içeriğin yatay düzlemde nasıl organize edildiğini ve kullanıcı arayüzü söz konusu olduğunda hiç akıllıca olmayanları sınırlamak için mükemmeldir. Bununla birlikte, bir ızgara çoğu zaman tek bir bedene uyması için fazla düşünülmeden toplanır. Tasarımcıların çoğunun farkına varmadığı şey, içeriğin etrafında oluşturulan bir ızgara sistemi oluşturmanın daha iyi olduğu.

Bir ızgara sistemi, düzende değişkenleri azaltır

Bu, ideal olarak, içerik senaryolarını önceden net bir şekilde anlama ve böylece içeriğe belirli bir ızgaradan daha iyi nasıl hizmet edileceği ile ilgili bir resim çizecek anlamına gelir. Belirli boşluk kuralları ve gereksinimleri olan bir logo veya belki de belirli birimler içeren reklamlar gibi önceden var olan varlıklar ve marka kılavuzlarıyla iş kısıtlarını düşünün.

İçerik türü de bir faktördür. Bir mağaza için düzen oluşturma, haber yayını veya blog veya basit bir açılış sayfası arasında büyük fark var. Görüntü ağırlıklı ve sözcük ağırlıklı bir düzen. Göz tarama kalıplarını ve bunların görsel hiyerarşi üzerinde nasıl bir etkisi olduğunu anlamak yararlı olabilir.

İş ve içerik kısıtlamaları ne kadar açık bir şekilde anlaşılırsa, bir ızgara sistemi seçip düzen kararları almak o kadar kolay olacaktır.

matbaacılık

Web tipinin% 95'ini oluşturabildiği ve iletişimin itici gücü olabileceği için, tipografinin UI tasarımının en önemli özelliği olduğunu savunuyorum.

Modüler ölçek gibi sistemler boyut ve öncü olarak uygulanabilirken, font aileleri ve stilleri de sınırlandırılabilir. Bir kullanıcı arabiriminin hiçbir zaman iki aileyi ve birkaç ağırlığı geçmemesi gerekir. Kurallar, gerekçelendirme ve unvanın nasıl ele alındığına da genişletilebilir.

Renk

Paletlerle aşırı titiz olmak kolaydır. Küçük bir ton aralığı yeterli ve tutarlı görseller üretmek için uzun bir yol kat edebilir. Genellikle bir başlangıç ​​noktası için tek ihtiyacımız olan beş renk örneği.

Adobe Color CC gibi araçlar bir paleti önceden tanımlamayı kolaylaştırır

Çoğu marka, iltifat için birincil veya vurgulu bir renk ve birkaç nötr veya kontrast ton içermelidir. Özellikle başlangıçta 15 tonluk bir tona ihtiyacımız yok. Küçükten başlamak ve daha sonra bir veya iki renk tonunu büyütmek daha iyidir.

Görüntüler

Görüntüleri kullanıcı arayüzüne nasıl dahil ettiğimiz, büyük oranda içeriğin içeriğine göre belirlenir. Bunun ne olduğuna dair kabaca bir fikrimiz varsa, resimlerimiz için oran, boyut, şekil ve işlem değişkenleri olan bir başlangıç ​​noktası oluşturabiliriz. Çok fazla ihtiyacımız olmadığını görebiliriz.

Resim değişkenlerimizi sınırlandırmak daha iyi tutarlılığı zorlar ve resim varlıklarının uzun vadede yönetilmesini kolaylaştırır. Aynı ikonografi için de geçerli.

Resimler için oran ve boyutta kaç varyasyona ihtiyacımız var?

2. Daha Önce Stil Kılavuzu Oluşturmak

Bir UI projesi kavramsal olarak büyüdükçe, bir stil rehberi veya desen kitaplığı oluşturmak ve sürdürmek giderek daha önemli hale gelir. Bu, ritmi ve tutarlılığı koruyarak, projenin ölçeğine yardımcı olacak tasarım ilkeleri belirleyecektir. Değişkenleri önceden tanımlıyorsak, bunları belgelemek için iyi bir yoldur. Gelecekteki karar verme tarzı rehberle hiç olmadığı kadar kolay olacak.

Projeye bağlı olarak, bir stil rehberi oluşturmak lüksdür ve sıklıkla ileride başvurmak üzere tasarlanmıştır. Bu nedenle çoğu stil rehberi son dakikada ya da proje tamamlandıktan sonra bir araya getirildi ve bu hala iyi bir uygulama. Ancak, ileriye dönük tasarım ve geliştirmeye yardımcı olacak bir stil rehberi için birçok rasyonalizasyon ve gerekçelendirme varken, aslında kavramsallaştırmanın ilk aşamalarında sadakat kazanmaya yardımcı olabilir.

Başlangıçta temel bir stil rehberi oluşturmak, yalnızca tasarım kararlarını azaltmak için erken prensipler oluşturmakla kalmayacak, aynı zamanda ilerleyen prensipleri geliştirmek ve geliştirmek için bir altyapı olarak da yardımcı olacaktır.

Başlangıçta bir tane yapmak, tamamlanmak zorunda olduğu anlamına gelmez - ondan uzak. Stiller zaten erken aşamalarda daha fazla gelişme eğilimindedir ve bir proje ne kadar büyürse, sınırlar da o kadar net ve sıkılaşır.

3. Modüler Tabanlı Öncelik ve Uyum

Brad Frost’un Atom Tasarımı gibi modüler tasarım sistemlerinde, belli başlı alanlardan bir düzen oluşturulabilir. Modüller çeşitli düzenler boyunca tekrar kullanılabilir hale gelir. Arayüzler, sayfalar halinde değil, sistemler olarak değerlendirilir, desen tabanlı tasarım ve geliştirme ile sürecin büyük bir bölümünü oluşturur.

Bu harika bir metodolojidir ve UI tasarımını daha yönetilebilir kılar, ancak daha etkili hale getirmek için kilit alanları öncelikli hale getirip etrafındaki her şeyi uyarlamamız gerekir. Bu da görsel tutarlılığın olmasını sağlayacaktır.

Anahtar Alanları Tanımla

Tasarımımız önemli parçalar etrafında dönmelidir. Her alanın önceliği, arayüz içindeki içeriği veya işlevselliği ile belirlenir ve esasen bulmacanın anahtarıdır.

Öncelikle önemli alanlara odaklanarak tasarım kararlarını azaltıyoruz, bundan sonra sonraki alanların yerleşik çevreye bükülüp adapte olması gerekiyor.

Anahtar Alanlara Odaklanın

Öncelikli alanlar belirlendikten sonra, kritik parçalara süper derecede odaklanmak ve onları tamamlamaya hazırlanmakla ilgilidir. Buradaki fikir, daha az önemli alanları uyarlamadan önce sezgisel olmalarını ve tüm gereksinimleri karşılamalarını sağlamaktır.

4. Herkes İçin Çalışmasını Sağlamak

Binlerce yıldır tasarımcılar tek bir şey yapmaya çalıştılar - etkili bir şekilde iletişim kurun. Bir kitleyle görsel ve işitsel bir şekilde daha iyi iletişim kurmanın yollarını sürekli olarak yeniden keşfediyor ve ince ayar yapıyoruz.

Mümkün olan en geniş kitleden gelen bilgilere sürekli artan erişim sayesinde, mümkün olduğunca çok sayıda insana ulaşılabilirliği en üst düzeye çıkarmak zorunlu hale geldi.

Erişilebilirlik Kılık değiştirmiş bir Nimettir

Daha geniş bir kitleye hitap etmek daha fazla iş gibi görünmektedir ve erişilebilirliği yeniliğin önündeki bir engel olarak görmek cazip gelebilir. Bununla birlikte, en son standartlara uymak, özellikle ikinci bir nitelik kazanırlarsa kılık değiştirmiş bir kutsama olabilir.

Tasarım terimlerinde buna örnek olarak, vücut kopyası için minimum bir yazı tipi boyutuna veya kopya ile arkaplan arasında önemli miktarda kontrast veya dokunmatik cihazlarda daha büyük bağlanabilir alanlara ihtiyaç duyulması gerekebilir.

Sadece Engelli Değil

Erişilebilirlik, sadece bazılarının ima edeceği gibi engellilere hizmet etmek değil, aynı zamanda en yeni özellikleri ve geliştirmeleri desteklemeyen eski cihazlara ve tarayıcılara sahip kullanıcılara da hitap etmektedir. Bu standartların bilincinde olmak ve bunları gözlemlemek doğal olarak tasarım kararlarını azaltacaktır.

5. Denenmiş ve Test Edilen Kalıpların Kullanılması

Gerçek şu ki, kullanıcılar, yıllarca süren uygulama ve anlatımlardan absorbe ettikleri yüzlerce ortak tasarım modeline uyduklarında arayüzleri sezgisel buluyorlar. Tipik kalıplardan ayrılmaya başladığımız ve yeni bir zemini tedavi etmeye başlar başlamaz, yeni bir kalıbın kitlelere tamamen sezgisel hale gelmesinin zaman alacağını görebiliriz.

Orijinal UI modellerini oluşturmak için bir zaman ve yer var, ancak ortak tekniklerden uzak durmamalıyız - bir sebepten dolayı başarılılar.

Gümüş astar, yeniden icat etme konusunda daha az endişelenmemiz ve estetiğe odaklanmamız için. Oluşturulan kalıplara dayanarak orijinal çalışmalar yapmak hala mümkündür.

Başarılı tasarım modellerini tanıdıkça ve entegre ettikçe, tasarımcılar olarak daha az seçmemiz gerekir. Neyin işe yarayacağını değil, neyin işe yarayacağını düşünmüyoruz.

Son not

Bu yaklaşımların bazıları bireysel olarak düşünme ve karar vermemizi büyük ölçüde azaltamayabilir veya tasarımlarımızı çok büyük bir oranda artırabilir. Bununla birlikte, bunları bir araya getirmek, yol boyunca iyi geri bildirim almakla birlikte, daha iyi UI tasarlamayı önemli ölçüde kolaylaştırabilir.

Twitter'da beni takip et