Tasarım Modellerini Kullanarak Web İçin Tasarım Yapma

Tasarım kalıpları, iyi bir web sitesi kullanılabilirliğinin temelidir ve web sitelerinin üzerine inşa edildiği parçalardır. Bunlar, bir web tasarımcısının iyi bir kullanıcı deneyimi sağlamak için verdiği stratejik bir tasarım kararıdır. Bir tasarımcının işi, yaygın kullanılabilirlik sorunlarını çözmek ve en sezgisel kullanıcı çözümünü yaratmaktır ve modeller öngörülebilir, sezgisel ve optimize edilmiş bir kullanıcı deneyimi yaratır. İster tasarım konusunda yeni olun ister deneyimli bir profesyonel olun, ortak kullanıcı arabirimi tasarım kalıplarının farkında olmalı ve kalıplar geliştikçe ayak uydurmalısınız.

Tasarım Desenlerine Örnekler

Muhtemelen bileşenleri duymuşsunuzdur; düğmeler, form alanları, arama çubukları vb. şeyler bunlara örnektir. Bunları kullanmak için, tasarımınızda desenler oluşturarak bunları iyi bir şekilde kullanabilirsiniz.

Dikkat edilmesi gereken bir şey var: bazen "bileşenler" ve "tasarım modelleri" terimleri birbirinin yerine kullanılabilir. Bu makalenin amaçları doğrultusunda, bileşenler bir web sitesinin yapı taşlarıdır ve kalıplar, kullanıcıların görevleri yerine getirmek için kullandıkları yerleşik yöntemlerdir.

Göreceğiniz gibi, bir desen tek bir bileşenden "daha büyüktür". Kalıplar, bireysel bileşenlerle yapılanları nasıl optimize ettiğinizdir. Aşağıdakiler gibi birçok geleneksel tasarım modeli vardır:

• Bir web sitesi başlığında ana sayfaya bağlanan bir logo
• Mobil web sitelerinde hamburger navigasyonu
• "Parolayı sıfırla" bağlantısıyla oturum açma formları
• Kullanıcıların bir sitedeki konumlarını takip etmelerini sağlayan içerik haritaları
• Üzerinde ürün sayaçları bulunan sepetler

Tasarımcılar Neden Tasarım Modellerine Odaklanmalı?

Tasarım kalıplarını kullanmanın birçok avantajı vardır. Yalnızca bir tasarımcı olarak çalışmanızı daha verimli hale getirmekle kalmaz, daha da önemlisi, desenler kullanıcılarınız için deneyimi kolaylaştırır.

Tasarım Modelleri Güven Oluşturur

Kullanıcılar sitenize geldikleri anda hızlı varsayımlarda bulunurlar. Bir saniyede, içerikle etkileşime girmeye değip değmeyeceğine veya başka bir seçenek bulmaları gerekip gerekmediğine karar verirler.

Sitenizde gezinmek kolay mı? Kullanıcılarınızın aradığı bilgileri bulmak kolay mı? Tıklayıp sorun gidermek için sabırları olmayacak. İyi bir ilk izlenim bırakmak ve kullanıcılarınızla güven oluşturmak kesinlikle çok önemlidir.

Web'in tarihi haline gelen süreçte, belirli kalıplar sıradan hale geldi. Tasarımcılar, web siteleri tasarlamak için bu yerleşik kullanıcı arayüzü öğelerine güvendiler ve kullanıcılar bu tasarım modellerini görmeye alıştı. Siteler arasındaki ortak noktaları tanırlar ve tanıdık olana güvenirler.

Bir e-ticaret sitesinde yerleşik bir tasarım modeli örneğini ele alalım. Kullanıcılar, küçük ürün önizlemelerini bir ızgarada görmeye ve ardından tek tek öğe hakkında daha fazla bilgi edinmek için tıklamaya alışkındır. Tasarımınızda yerleşmiş kalıpları kullanarak ve kullanımı kolay bir deneyim yaratarak, kullanıcılarınızın güvenini kazanırsınız, ayrıca tekrar gelmeleri daha olasıdır.

Tasarım Modelleri Sezgiseldir

Kullanıcılar sitenizle etkileşime girdikçe, öngörülebilirlik faktörü çok önemli hale gelir. [twitter_link]Tahmin edilebilir kalıplar, en sezgisel deneyime olanak tanır.[/twitter_link] Tanıdık kalıplara sahip olmak çok önemlidir, ancak bu kalıpların tutarlı bir şekilde kullanıldığından emin olmak da önemlidir.

Formlarda yaygın, öngörülebilir bir model örneği bulunur. Özellikle tüm formların doğrulama ve hata mesajları sağlaması. Sitenizdeki tüm formlar bunu tutarlı bir şekilde yapıyor mu? Tüm mesajlar aynı yerde mi? Gönder düğmesine ne dersiniz? Formun gönderildiğine dair bir mesaj var mı?

Tasarım açısından, kullanıcılar bu kalıplarla daha önce birçok kez karşılaştı. Yararlı mesajlarla form doğrulaması sağlamak, kullanıcıya sorunların nerede olduğunu gösterir ve formun gönderildiğini belirten bir mesaja sahip olmak, bir eylemin gerçekleştiğine dair yararlı bir göstergedir.

İyi bir kullanıcı deneyimi için kalıpların ve öngörülebilirliğin gerekli olduğunu duyduğunuzda sağduyu gibi görünebilir. Bununla birlikte, ortak kalıpları bozan, hayal kırıklığına veya kafa karışıklığına neden olabilecek sitelerle karşılaşmak çok da zor değil. Bunu göz önünde bulundurarak, yararlı kullanıcı arabirimi kalıplarıyla tasarlamaya devam edin. Kullanıcılar onlara ne kadar aşina olursa, hangi davranışı bekleyeceklerini o kadar iyi bilirler. Kalıplar ve gelenekler, kullanıcıların kafasının karışmasını önler ve kalıplara bağlı kalmak öngörülebilir bir deneyim yaratır.

Tasarım Kalıpları, Tasarımcılar Arasında Ortak Bir Dil Sağlar

[twitter_link]Harika deneyimler etkili tasarımla başlar.[/twitter_link]

Çoğu durumda, tasarımcılar bir ekip üzerinde çalışıyor. Yerleşik tasarım modelleri olduğunda ekibin daha verimli çalışmasına yardımcı olur. Sorun zaten çözülmüşse, tekerleği yeniden icat etmeye gerek yoktur.

Tüm kalıpları tek bir merkezi ön uç stil kılavuzunda tutmak, envanter tutmak için harika bir yerdir. Küresel bir kaynak olarak, tüm ekip üyelerinin her kalıbın kullanım durumunu anlaması için hızlı bir kılavuzdur. Yalnız çalışıyor olsanız bile, kullandığınız tasarım kalıplarını takip etmek, daha verimli çalışmanıza ve gelecekte onlara bakmanıza olanak tanır.

Planlama Aşaması

Tasarım kalıplarının neden kullanılması gerektiği oldukça açık, ancak web tasarımcıları web için tasarım yaparken bunları gerçekten nasıl yerine koyuyor? İşte tasarım sürecini kolaylaştırmaya yardımcı olacak birkaç ipucu.

Başlamak için Zaten Bildiklerinizi Kullanın

Tam bir yeniden tasarım veya bir site "genişletmesi" tasarlıyorsanız, envanter almak ve zaten bildiklerinize bakmak yararlı olacaktır. İyi bir başlangıç ​​noktası elde etmek anahtardır. Tamamen yeni bir projeyse, bunları düşünmek ve ilk başta bazı soruların bilinmemesini beklemek önemlidir. Bu durumda, başlamak için geçmiş tasarım deneyimlerini kullanmak iyi bir ilk adımdır. Bu, diğer projeler üzerinde çalıştıkları için ilk kararları bildirir.

Başlangıç ​​Araştırması

Araştırma, güçlü bir proje temelinin anahtarıdır. Bildiğiniz gibi, kullanıcılar her zaman bir web sitesinde belirli bir işlemi gerçekleştirmenin en kolay yolunu arayacaklardır. Eldeki sorunları ve görevleri anlamak, doğru şeyi tasarlamanızı sağlayacaktır. Başlamak için şu öğeleri düşünün:

• Mevcut kullanıcılar kimlerdir? (Hedefleri, demografisi vb.)
• Bu kullanıcılar hakkında başka ne öğrenmek istiyorsunuz?
• En çok hangi kalıplarla etkileşime giriyorlar?
• Bu kullanıcıların sorun yaşadığı herhangi bir model var mı?
• Hangi iyileştirmeler yapılabilir?
• Hangi yeni özellikler tasarlanıyor?
• Halihazırda kurulmuş herhangi bir model çalışabilir mi?

Araştırma aşaması, kullanıcılarınızın web sitenizle etkileşime girerken neyi başarması gerektiğini belirleme zamanıdır. Örnekler, içerik arama, haber bültenine kaydolma, satın alma vb. şeyler olabilir. Tanıdık öğelerle karşı karşıya kalan kullanıcıların düşünmek için daha az zamana ihtiyacı olacak ve dönüştürmek için daha fazla nedenleri olacaktır. Tasarımı, web'de deneyimledikleri mevcut bilgilerine dayanarak kullanıcılarınıza tanıdık gelecek şekilde kalıplar oluşturmaya odaklayın.

Tasarım problemlerini çözerken, zaman ve bütçe her zaman bir faktördür, ancak elinizden geldiğince çok araştırma yapın. Kullanıcılarınızın ana sorunlu noktalarını ortaya çıkarma ve mevcut tasarım modellerini inceleme zamanınız geldi. Web'de yaygın olan nedir? Geçmişte hangi kalıpları başarıyla kullandınız? Çözmeniz gereken sorunları tanımladıktan sonra, aynı kullanıcı hedeflerini hedefleyen kalıplara sahip siteleri keşfedin. Bu, proje için iyi bir ilham kaynağı olacaktır. Onları "kopyalamak" gerekli değildir, ancak orada ne olduğunu not etmek yararlıdır.

Bu noktaya kadar, tutarlı ve öngörülebilir kalmanızı tavsiye ettim. Mevcut kalıpların değiştirilebileceğini ve yeni bir şeyler yapmak için durumlar olabileceğini belirtmekte fayda var. Yeni bir kalıp tanıtıyorsanız, bunun kullanıcı verileriyle doğrulandığından ve iyi bir şekilde test edildiğinden emin olun.

Tasarım Desenleriyle Web İçin Tasarım Yapma

Prototip ve Test

Araştırma aşamasından sonra, öğrendiklerinizi iyi bir şekilde kullanmaya başlamanın zamanı geldi. Tasarımın prototipleme ile hayat bulduğu yer burasıdır. Prosesinize bağlı olarak, prototipler basit düşük kaliteli tel çerçeveler veya daha karmaşık yüksek kaliteli tasarımlar olabilir.

Temel olarak araştırmanızdaki mevcut kalıplarla başlayın. Süreç boyunca ilerlerken, prototipin ihtiyacınız olan tüm özellikleri kapsadığından ve tüm kullanıcı hedeflerini hesaba kattığından emin olun. İyi bir başlangıç ​​noktasına ulaşmak için biraz gözden geçirme ve ince ayar yapmanız gerekebilir.

Tüm gereksinimlerin prototipe dahil edildiğinden emin olduktan sonra, tasarımın kullanılabilirliği hakkında bilgi edinmek için bazı testler yapma zamanı. Burası, genel işlevsellik ile birlikte tasarım modellerinin etkinliğini doğrulayacağınız yerdir.

Prototip aşamasında testin bu kadar önemli olmasının nedeni, bazı durumlarda danışanların düşüncelerini ve ihtiyaçlarını ifade edememesi veya tam olarak tahmin edememesidir. Kullanıcı testi, anlatmak yerine göstermelerini sağlar. Siz onların eylemlerini gözlemleyip öğrenirken, katılımcılar siteyi gerçekte nasıl kullanacaklarını gösterirler. Bu hem katılımcılar için hem de tasarımcı olarak sizin için yararlıdır.

Odaklanmak için teste girdiğinizde temel kullanıcı hedefleri hakkında notlar tutmanız önemlidir. Test katılımcılarını davet ettikten sonra, tasarımı olabildiğince çok kullanıcının önüne koyun. Zaman kısıtlamaları sıkıysa, en az beş kullanıcıyla test ettiğinizden emin olun.

Kullanıcı testi konusu başlı başına bir konudur. Zamanınıza ve bütçenize göre en mantıklı yöntemi seçin. Her zaman yeterli zamana sahip olmak harika olurdu, ancak bu her zaman mümkün olmayabilir. Acil durumlarda, "koridor" veya "kafeterya tarzı" kullanılabilirlik testleri yararlı olabilir (yaya trafiğinin yoğun olduğu bir alanda, ürününüzü test etmek için yanından geçen insanların kullanıldığı bir kullanılabilirlik testi). Birkaç iş arkadaşını dahil etmek bile test yapmamaktan her zaman daha iyidir.

Muhtemelen, tasarım desenleriniz kapıdan mükemmel olmayacak. Değişikliklerin yapılması gerekecek ve güncellenen tasarımı doğrulamak için daha fazla test yapılması gerekecek. Bununla birlikte, her test aşamasından daha fazla bilgi edinecek ve tasarım optimize edilene kadar yinelemeye ve test etmeye devam etmek için öğrendiklerinizi birleştirebileceksiniz.

Web tasarım kalıpları, tutarlı bir kullanıcı deneyimi sağlar. Aşağıda, başlamak için daha fazla bilgi sağlayan yardımcı bağlantılar bulunmaktadır:

• Kapsamlı Kullanıcı Testi Kılavuzu
• Steve Krug'un Roket Ameliyatı Kolaylaştırıldı
• Stil Rehberi Örnekleri