Tasarım eğitiminde yeni verilen "Kullanıcı Arayüzü Tasarımı" dersi önce web tasarımı, ardından mobil uygulamalarla başlıyor. Kullanıcı arayüzü tasarımı, mobil uygulamaların popülaritesine yol açarak, web tasarımında WordPress'in hakimiyeti nedeniyle tasarımcılara daha fazla hareket alanı bıraktı. Bu yazımızda Android mobil uygulamalarda projenin oluşturulması ve tasarımın hazırlanması süreci hakkında bilgi vereceğiz. Belirli maddelerin miktarı ve işlemdeki yerleri değişebilir. Ama genel olarak süreç böyle işlemektedir.
Öncelikle uygulama fikri iyice araştırılmalıdır. Araştırma önemlidir, böylece daha önce yapılan yanlışlar tekrarlanmaz. Bulunan örnek tasarımlardan stiller, kompozisyonlar, gridler gibi temel tasarım fikirleri geliştirilebilir ve bunlar tasarımlara eklenebilir. Tabii ki, inceleme örnekleri mevcut tasarımları kopyalamak için tasarlanmamıştır. Araştırma süreci önemlidir, çoğaltmak değil, bu tasarımların çalışmayan unsurlarını analiz etmek ve iyileştirmek önemlidir. Renk kombinasyonları, tipografi seçimleri ve görsel dilin detaylı bir incelemesi, tasarlanan arayüze bonus puanlar katacaktır.
Akış şeması, tasarım süreci başlamadan önce bir mobil uygulamadaki ekranlar, hangi ekrandan hangi ekrana ve uygulama içindeki diğer gezinme fikirleri arasındaki geçişlerin görsel bir düzenlemesidir. Kısacası, esasen bir içerik planlama şemasıdır ve bunu tasarım süreci boyunca belgelemek önemlidir. Bu nedenle hangi ekranların tasarlanacağına sürecin en başından karar verilmelidir. Uygulama için bir akış şeması geliştirmek için içerik editörleri, yazılım geliştiriciler ve diğer proje personeli ile birlikte çalışılmalıdır. Akış şeması, bir uygulamadaki arayüzler arasındaki geçişlerin, iş akışının ve sürecin her aşamasının (arayüzün) oklarla birbirine bağlanarak görsel bir temsilidir. Örneğin bir sosyal medya uygulaması yapılıyorsa; "giriş" ekranından diğer arayüzlerden hangilerine geçiş yapacağı belirlenir. Arayüz tasarımı aşaması başlamadan önce akış şemalarını analiz etmek ve sonlandırmak hem tasarımcılar hem de yazılım geliştiriciler için işleri kolaylaştırır.
Öncelikle uygulamanın ana arayüzünde kullanılacak logoyu tasarlayarak bir mobil uygulama fikrine başlamak, birçok tasarım kararını önceden almak ve işi kolaylaştırmak anlamına gelir. Telefonda veya tablette diğer uygulama logolarının yanında yer alan tasarımı renk, tipografi, çizim ve şekil açısından dikkatlice düşünmek gerekir. Çok fazla renk ve ayrıntı içeren çizimlerin kullanılması, 180×180 piksele kadar olan simgelerin okunmasını zorlaştırabilir. Bunun yerine, birden fazla renk içermeyen bir tasarım yapmak için birkaç basit şekille okumak daha kolaydır. Logo tasarımı, uygulamanın amacına uygun bir şekilde değerlendirilebilir. Tasarım yaparken şeklin özgün olması görünürlük açısından oldukça faydalıdır. Ayrıca rengi dikkatli kullanmakta fayda var. 180x180 piksel içinde 3 veya 4 renkli bir tasarım yapmak okumayı zorlaştırabilir. Ayrıca, bu küçük tasarım alanında, uygulamanın adından ziyade uygulamanın baş harflerini logoya koymak daha iyidir.
Wireraming kavramı aslında bir arayüz tasarımının şematik bir diyagramıdır. Yani tasarımın görsel iskeletidir. Genellikle elle çizilir ancak artık arayüz tasarımının gelişmesiyle birlikte dijital ortamda da hazırlanabilmektedir. Wireframing, bir arayüzdeki görsel öğelerin düzenini ana hatlarıyla belirtmek için kullanılır. Bir arabirimdeki öğeler, hizalama, hiyerarşi, karşıtlık, süreklilik, yakınlık, arka plan ve şekiller arasındaki kompozisyonu ve ilişkileri düzenlemek için bir wireframing tasarlamak yararlıdır. Düğmenin konumu, görüntünün konumu ve boyutu ve metin arasındaki ilişki bu süreçte çözülür. Wireframingler tasarlanırken nasıl farklı görsel senaryoların ortaya çıkacağı, hangi özelliklerin nerede duracağı ve bilgi ile özellikler arasındaki öncelik ilişkisi göz önünde bulundurulmalıdır. Bunun için arayüzde tutarlı bir grid oluşturmak en mantıklısıdır. Bir wireframing oluşturmak, tüm arayüzlerde tasarım tutarlılığı sağlar ve tasarım öğelerini yerleştirmesine yardımcı olur.
Copyright © 2024 Tüm Hakları Saklıdır.
