![UI - UX Uzmanı Olun - Input Kullanımı [Bölüm 1]](https://i.ytimg.com/vi/tshfZ-96utM/hqdefault.jpg)
İçerik
Kariyerime başladığımda web tasarımcısıydım. Küçük işletme siteleriyle başlayıp sonunda daha büyük müşterilere geçerek dört yıl boyunca web tasarımında çalıştım. Beni ilgilendirenin grafik tasarım olmadığını ya da daha büyük markalar için çalışmadığını öğrendim. Bir web sayfasının görsel tasarımından çok sayfalandırma kalıpları, insanların formlarla etkileşim şekli ve algılanan performans gibi şeylerle daha çok ilgileniyordum.
Bilim kurgu filmlerini izlerken arayüzlere bakardım. Ve video oyunları oynadığımda, menülerin düzenlenme şeklini gözlemlerdim. Bu özelliklerden herhangi biri size tanıdık geliyorsa, özünde bir UI tasarımcısı da olabilirsiniz.
Ajans işimden ayrıldım ve kendi şirketimi kurdum. LinkedIn sayfamda yeni kariyer hedefimi özetlemeye çalıştım: mümkün olan en iyi yazılımı yapmak. Serbest çalışmaya başladığımdan bu yana dört yıl geçti ve yolculuğum durmadı. Bu günlerde, Mono. Kısa süre önce dördüncü ekip üyemizi karşıladık.
Bu makalede, bir UI tasarımcısı olmanın nasıl bir şey olduğunu, işin tam olarak neyi gerektirdiğini, en iyi öğrenim kaynaklarını nerede bulacağınızı ve mesleğinizde nasıl daha iyi olacağınızı açıklamak istiyorum.
Bir UI tasarımcısı ne yapar?
Genel olarak bir kullanıcı arayüzü tasarımcısının çalışmasını dört kategoriye ayırabileceğinizi görüyorum. Müşteri ile iletişim kurarsınız, araştırırsınız, tasarlar ve prototipler hazırlarsınız ve geliştiricilerle iletişim kurarsınız. Şimdi bu aşamaların her birine daha ayrıntılı bir şekilde bakalım.
Müşteri iletişimi
Müşteri iletişimi tamamen müşterinin problemini anlamakla ilgilidir. Amaç, müşterinizin işini kavramaktır, bu nedenle bir projenin başlangıcı genellikle çok fazla konuşma gerektirir. Başlarken müşterinizin alanı hakkında çok fazla bilgi sahibi olmamanın bir sakıncası yoktur - olası tasarım çözümlerini tasavvur ederken onların işlerine yeni bir şekilde bakabilirsiniz.
İyi bir kullanıcı arayüzü tasarımcısı olmak için, sonunda müşterinizin işiyle birlikte düşünebilmeniz gerekir. Örneğin, müşteriniz havacılıkta olabilir. Onlar için çalışmak, sonunda sizi bu endüstri hakkında oldukça bilgili hale getirecektir. Bu nedenle, burada kendi mutluluğunuz için bir ipucu, çalıştığınız sektörleri akıllıca seçmektir, böylece umursamadığınız veya hiç ilgilenmediğiniz bir konuda uzman olmazsınız.
Bir proje sırasında iletişim durmaz. Bir tasarımcı olarak işinizi sürekli olarak sunacaksınız. Şirketimizde uzak bir ekibiz, bu nedenle çok sayıda yüz yüze görüşmemiz yok. Bunun yerine, video konferans yoluyla ekran paylaşımından yoğun bir şekilde yararlanıyoruz. Skype ve Slack gibi iletişim araçları her gün kullanılıyor.
Eşzamanlı ve eşzamansız iletişim yöntemlerini birleştirmek faydalıdır. Hızlı bir şekilde çok fazla bilgiye ihtiyacınız varsa bir arama harikadır, ancak aynı zamanda yanınızda olmalısınız. Slack'i 'sanal su soğutucumuz' olarak düşünüyoruz ve karmaşık tasarım projelerini yönetmek için Basecamp'ı kullanıyoruz. HTML ve CSS kullanarak prototipler tasarladığımızda, kodu doğrudan tartışmak için GitHub Sorunlarını kullanırız.
Araştırma
Müşteri iletişiminin yanı sıra çok fazla araştırma yapacaksınız. Bu, saha çalışmaları, müşteri ile atölye çalışmaları, rekabeti analiz etme veya bir strateji tanımlamayı içerebilir - esasen, elinizdeki sorunu anlamanıza yardımcı olacak her şey hakkında.
Araştırma, tasarım seçimlerinizi bilgilendiren şeydir. Bu bir zamanlar okuduğunuz bir makale veya Apple'ın henüz yayınladığı yeni bir şey. Neden belirli bir tasarım seçimi yaptığınızı açıklama zamanı geldiğinde, araştırmanız sizi yedekler.
Araştırma çok geniş olabilir. Sık sık yeni cihazları araştırma amacıyla test ediyorum veya kullanıcı arayüzünü incelemek için yeni bir web uygulamasına kaydoluyorum.
Tasarım ve prototipleme
Bir tasarımcı olarak, muhtemelen zamanınızın çoğunu tasarım ve prototipleme çalışmaları yaparak geçireceksiniz. Bir UI tasarım projesi, eskizden ayrıntılı tasarıma ve kodlamaya kadar çeşitli şekillerde ilerleyebilir.
Kullandığınız yöntem büyük ölçüde proje türüne bağlıdır. Ne tasarlıyorsun Bu bir web sitesi mi yoksa onu bir uygulama olarak adlandırmayı mı tercih edersiniz? Yerli teknolojiyi kullanıyor mu? Yeniden mi tasarlıyor yoksa sıfırdan mı başlıyorsunuz?
Şirketimizde sabit bir süreç yoktur, ancak çoğu proje aynı kaba sırayı takip eder: eskizler ve tel kafeslerle başlar, ayrıntılı görsel ve etkileşim tasarımına geçer ve bir prototip ile sona erer.
Tasarımcılar olarak, araçlarımızı düşünmek için çok zaman harcıyoruz. Harika araçlar önemli olsa da, en önemli şey değildir. Adobe Creative Suite'i ve Sketch gibi uygulamaları yetkin bir şekilde kullanabilmek, çizmek için bir kalem veya boyamak için bir fırça kullanabilmeye eşdeğerdir. Hala resmi yapman gerekiyor.
Bununla birlikte, aletlere sağlıklı bir ilgi duymak iyi bir şeydir. Daha üretken olmama yardımcı olabilecek yeni araçları denemeyi seviyorum. En sevdiğim vektör düzenleme aracı Illustrator, ancak görsel tasarım çalışmalarımın çoğu bugünlerde Sketch'te yapılıyor. Diğer ekip üyeleri, Affinity Designer gibi daha yeni araçlara geçti.
Araçlar çok kişisel bir seçimdir. Kolayca birlikte çalışabildiğimiz sürece, herkes kendi seçimini yapmakta özgürdür. Müşterilerimizle tasarımlarımız hakkında konuşmayı kolaylaştırmak için InVision ile prototipler yapıyoruz. Ancak daha gelişmiş prototipleme için HTML ve CSS kullanıyoruz. İhtiyacınız olan alet, onunla yapmak istediğiniz işe bağlıdır.
Geliştirici iletişimi
Bir UI tasarımcısının çalışmasının sıklıkla unutulan bir kısmı geliştirici iletişimidir. Bugünlerde tasarımlarınızı sadece geliştiricilere göndermek ve doğru şekilde uygulanmalarını ummaktan kurtulamazsınız. En iyi tasarımcılar, zorluğun tasarımı yaratmak değil, sadece onay vermesi gereken paydaşlara değil, aynı zamanda onu uygulaması gereken geliştiricilere de iletmek olduğunu bilir.
Bir tasarımın iletişimi birçok şekilde gelir: ayrıntılı özellikler, varlıklar sağlama, tasarımı birlikte gözden geçirme. Her durumda teslim etmenin mantıklı olduğu şey, büyük ölçüde projenin yerel mi yoksa web uygulaması mı olduğuna bağlıdır.
Geleneksel yaklaşım, ekran tasarımlarının yanında varlıklar sunmaktır. Ekran tasarımları, tasarımın bir bütün olarak neye benzeyeceğini görmek için kullanılabilirken, varlıklar kullanıma hazır PNG'ler ve simgelerin SVG'leri olduğundan, geliştiricilerin bir grafik düzenleyiciyle uğraşmasına gerek kalmaz.
Şirketimizde biz bundan daha fazlasını sunmanın savunucusuyuz. Tasarımlarımızda tutarlılığın korunmasına yardımcı olmak için bileşen stil kılavuzları kullanıyoruz. Bir web projesi ile uğraşırken, uygulamaya hazır, parça parça belgelenmiş ayrıntılı HTML ve CSS setleri sunuyoruz. Yazılım geliştirmenin her aşamasında bir tasarım gözüne sahip olmanın birinci sınıf yazılım yaratma hedefime ulaşmanın tek yolu olduğuna inanıyorum.
Web ve yerel uygulamalar
Bir platform için yerel bir uygulama tasarladığınızda (ör. İOS veya Android), belirli kurallara uyma eğilimindesiniz. Web için tasarım yaparken çok fazla rehberlik yoktur. Genelde olan şey, müşterinizin markaları için, nesnelerin nasıl görünmesi gerektiğini belirleyen bir dizi grafik yönergesine sahip olmasıdır.
Bununla birlikte, bu yönergeler pazarlama web sitelerine göre uyarlanma eğilimindedir ve içindekiler her zaman iyi kullanıcı arayüzü kararlarına yol açmaz. Yazı tipleri, okunaklılık nedeniyle değil, pazarlama nedenleriyle seçilme eğilimindedir. Renkler, bir reklam kampanyasında işe yarayan, ancak günlük kullandığınız bir uygulamada işe yaramayan koyu ve çarpıcı olabilir. Bu kılavuzların yorumlanması gerekir.
Web için birkaç kullanıcı arayüzü kuralı vardır. Web'in farklı tarzların bir eritme potası olduğunu iddia edebilirsiniz. Bir web sitesinden çok bir uygulama hissi veren herhangi bir şey yapıyorsanız, Bootstrap ve ZURB Foundation gibi yaygın olarak kullanılan çerçeveler hakkında bilgi sahibi olmanız gerekir. Tekerleği yeniden icat etmek istemediğiniz için çerçeve, nesnelerin nasıl görünmesi gerektiğini belirlemeye başlar. Ve bu muhtemelen iyi bir şey.
Şirketimizde Bootstrap kullanmayı seviyoruz. Düğmeler, veri tabloları ve modlar gibi yaygın kullanıcı arabirimi öğeleri için makul varsayılan boyutlar sağlar.
Web tasarımında, web'in teknik kapasiteleri ile daha kısıtlısınız. Eskiden bir web sitesinde yuvarlatılmış köşeler gibi basit görsel gelişmeleri uygulamak zor olurdu. Bu günler çoktan geride kaldı - artık bol miktarda gölge, geçiş, animasyon ve hatta 3B içeren kullanıcı arayüzleri çizmekte özgürsünüz.
Bir tasarımcı olarak, tarayıcıda süreç ve tasarım üzerinde kontrolü ele almak çok daha gerçekçidir. Pek çok kullanıcı arayüzü tasarımcısının yerel bir uygulamanın kullanıcı arayüzü programlamasını devraldığını görmedim, ancak bir web uygulamasının HTML ve CSS'sini yapan bir tasarımcı yaygın bir durumdur. Kendi tasarımlarınızı kodlayabilirseniz, kodlamayan meslektaşlarınız üzerinde bir avantaja sahip olursunuz ve bana göre web'in nasıl çalıştığını gerçekten anlamanın tek yolu budur.
Web kısıtlamaları
Yakında, öğrendiğiniz tüm harika numaraların her tarayıcıda desteklenmediğini ve web için tasarım yapmanın gerçekliğinin bu olduğunu keşfedeceksiniz. Mümkün olduğunda gelişmiş içerik yüklediğiniz, aynı zamanda içeriğin nasıl azaldığını da düşündüğünüz aşamalı geliştirme gibi iyi bilinen ilkeleri takip etmek iyidir.
Son zamanlarda "hardalı kesmek" popüler hale geldi. BBC'nin web ekibi tarafından desteklenen bu, "iyi" ve "kötü" tarayıcıları ayırt etmeyi ve "kötü" tarayıcılara sınırlı bir deneyim sağlamayı içerir. Ancak, gerçekten yalnızca içerik siteleri için işe yarar.
Uygulama benzeri deneyimler söz konusu olduğunda, birçok kişi, geliştirmeyi kolaylaştırmak için desteği yalnızca önde gelen birkaç tarayıcıyla sınırlıyor. Ne yazık ki, bu bizi içeriği görüntülemek için belirli bir tarayıcıya ihtiyaç duyduğunuz 1996 durumuna geri getiriyor.
Beceri setinizi geliştirmek
Öyleyse, hızlı hareket eden web endüstrisini nasıl güncel tutarsınız ve becerilerinizi nasıl geliştirirsiniz? Becerilerinizi geliştirmek için birkaç farklı yönteme bakalım ...
Platform bilgisi
Bir tasarımcının cephaneliğinin önemli bir parçası platform bilgisidir. Çeşitli işletim sistemlerini ve insanların bunları nasıl kullandığını bilmelisiniz. Tasarımcılar olarak Mac'leri kullanma eğilimindeyiz, ancak o zaman insanların çoğunun işlerini yapmak için Windows kutuları kullandığını unutmak kolaydır.
Bir şeyi ancak kendiniz kullanırsanız gerçekten anlayabileceğinizi hissediyorum. Tasarım için Mac'imi kullanmayı tercih ediyorum, ancak diğer çeşitli platformların gelişimini takip etmek için çok zaman harcıyorum. Mac'ime sanal makine olarak birkaç Windows kopyası yükledim. Kullanıcı arayüzündeki çeşitli değişiklikleri kontrol etmek için Microsoft’un Insider Programını kullanarak yeni Windows 10 sürümlerini test etmekle meşguldüm.
Ayrıca nasıl çalıştığını test etmek için düzenli olarak yeni donanım satın alıyorum. Platformu test etmek için bir Apple Watch satın aldım. Daha sonra sattım çünkü hayatıma pek bir şey katmadığını hissettim.
Dahası, web kendi işletim sistemi olarak görülebilir. Her hafta her tarayıcı satıcısına eklenen yeni özelliklerle sürekli olarak gelişmektedir. Tarayıcıların teknik yönlerini, özellikle de CSS ve grafik yeteneklerini bilmek son derece değerlidir. SVG ve WebGL'nin ne olduğunu ve Web Animasyonları API'sini nasıl kullanabileceğinizi bilmeniz gerekir.
Her platform zamanla gelişir ve bir kullanıcı arayüzü tasarımcısı olarak güncel kalmak sizin görevinizdir. Sonuçta, tasarladığınız her ne olursa olsun tek başına yaşamaz, daha büyük bir yazılım ekosisteminin parçasıdır.
Temellere geri dönün
Bugün mücadele ettiğimiz şey, 20 yıl önce mücadele ettiğimiz şeyden çok farklı değil. Kitaplarda tonlarca iyi tavsiye var. Başlangıç olarak Jason Fried ve Matthew Linderman'ın Web için Savunmaya Yönelik Tasarımını ve Steve Krug tarafından yazılan Don't Make Me Think'i deneyin.
Modalite ve uygunluk gibi kavramları bilmiyorsanız, okumalısınız. Fitts yasasının ne olduğunu açıklayabilmelisiniz. Gestalt yakınlık yasası mı? Bu, UI tasarımının ekmek ve tereyağıdır.
Oyunlardan ve filmlerden ilham alın
Bir UI tasarımcısı olarak, işimi yapmak için diğer ilham kaynaklarından yararlanıyorum. Oyunlardan çok ilham alıyorum. Bazı oyunlar çok karmaşıktır ve UI tasarımcıları, iş projelerinde çalışan UI tasarımcısı ile aynı karmaşık arayüz sorunlarını çözmek zorunda kalmıştır.
Oyunlar aynı zamanda trendleri de gösterebilir. Colin McRae Rally'nin menülerinde bulunan minimalizm bana iOS7'nin yönünü hatırlatıyor. Bir bakıma, artık moda olan UI animasyon tasarımı yıllar ve yıllar önce oyunlarda karşımıza çıkıyordu. Skeuomorphism'den yalın, işlevsel arayüzlere ve "düz tasarıma" geçiş oyunlarda da belirgindir. 2006’daki Oblivion’u 2011’in Skyrim’i ile karşılaştırın. Her iki oyun da aynı serideki RPG'ler, ancak fark çarpıcı.
Iron Man gibi Marvel filmlerindeki fütüristik arayüzler de benim için ilham kaynağı oldu. Tam olarak kullanılabilir örnekler değiller, ancak bir bütün olarak bilgi işlem hakkında daha fazla düşünmemi sağlıyorlar. Ekranların geleceğini mi istiyoruz yoksa ekranların yok olmasını mı istiyoruz? Bu muhtemelen tasarımcılarla dolu bir barda sormak için iyi bir sorudur.
Bir tasarımcı olarak sıkı çalışma, ısrar, akranlarınızla konuşma ve çok şey okuyarak büyürsünüz. Yaklaşık bir yıl önce, New York Times'da, 80'li yaşlarında zanaatlarını geliştirmeye devam eden insanlar hakkında bir makale okudum. Daha yeni başlıyormuşum gibi hissediyorum. Ya sen?
