Ana içeriğe atla

Son Kullanıcı Deneyimi için Tasarım Süreçleri - UX Design Process

Proje geliştirme süreçleri ile bu projeleri kullanacak olan son kullanıcıları göz önüne aldığımızda projelerden beklentiler gittikçe artmaktadır. Gerek işlevsellik gerekse fonksiyonellikte artış aranırken bir yanda da yeni çıkan teknolojiler ile birlikte artık oluşturulan projelerde tasarıma da oldukça fazla öncelik tanınmaya başlamıştır. Son 2-3 yıla kadar son kullanıcı deneyimini uzan süreç geliştirme ve entegrasyon süreçlerinden ötürü geri planda bırakırken artık tasarımsal öğelerin uygulamalara uyarlanabilmesi kolaylığı sayesinde istekler içerisine girmiştir. Çok basit bir örnek vermek gerekirse, boş bir windows form oluşturup içerisine standart bir button eklendiğimizde Windows Vista öncesi işletim sistemlerinde çok basit bir görünüm ile karşımıza çıkmaktadı. Ancak bu basit görünümün sebebi windows 'un kullanmış olduğumu temadan kaynaklandığını son kullanıcılara açıklamak oldukça zor bir durumdu. Aynı uygulamayı Windows Vista ya da sonrası bir işletim sisteminde çalıştırdığımızda ise o basit, standart button 'un ne kadar görsel bir görünüme kavuştuğunu görürüz. Ya da eskiden tasarımcılar tarafından hazırlanmış olan görsel öğeleri uygulamalara entegre etmeye çalıştığımızda tasarlanan ile sunulan arasında bariz farkların oluşması proje açısısında oldukça olumsuz bir izlenim bırakıyordu.

Son kullanıcı deneyimlerini en üst seviyeye çıkartmanın yollarından biri de 3. parti yazılım firmalarının hazırlamış olduğu bileşenleri kullanarak tasarımsal zenginliğin sağlanması mümkün. Ancak bu tür yazılım firmalarının bileşenlerini kullanmanın da bariz bir sıkıntısı bulunmaktadır. PERFORMANS. Evet tasarımsal öğelere öncelik vermek istediğimizde performans konusunda bariz kayıplar yaşamamıza neden olabiliyor. Bu durumda da karşımıza seçmemiz gereken iki seçenek sunuluyor. Ya tasarımını benzersiz bir güzelleğe taşıyacağız ya da uygulamanın performanslı bir şekilde çalışmasına olanak tanıyacağız. İşte artık bizler için önemli olan bu iki seçenekten birini seçmek yerine ikisini de kullanıcılara sunabilmektir.

Kullanıcı Deneyimi için Temel Başarı Faktörü Nedir?

Biraz önce de açıkladığımız üzere daha önceden uygulamalar için cin ali gibi tasarımı ile olsun ama herşeyi yapsın yaklaşımı içinde yaklaşılırdı (Yazılımcılar bu yaklaşımı besler. Bu düşüncelerini etrafta istenene benzer örnekleri olmadığı için de son kullanıcı olan müşterilerine kabul ettirebilirlerdi.). Ancak artık müşteriler için projelerde fonksiyonellik başarı için yeterli bir etken olarak görülmemeye başladı. Artık başarılı bir projenin ön şartı her uygulamanın basit yapabildiği bir işlemi olağan üstü birşeymiş gibi gösterebilmek olarak algılanmaktadır. Eskiden bu imajı uygulamayı satan satış temsilcileri sağlar ve satış işlemi tamamlandığında bir butona basar ve o işlemi yapardınız biterdi. Ama dikkat edilmeyen bir nokta var. Müşteri için önemli olanı tekrardan anlatmak gerekirse, bir butona basıp onun bir mi yoksa iki mi saniyede mi olduğu ile ilgilenmek yerine ben bu butona bastığımda ekranda bana farklı birşey gösteriyor mu diye beklenti içerisine giriyor. İşte bu nokta da projeler üzerinde yapılacak olan makyajlar devreye giriyor. Yine butona basma örneğini ön plana alırsak veri transferi esnasında işlem yapılıyor yazmak yerine iki tane kamyon ekran üzerinde hareket ederse bu son kullanıcıyı oldukça fazla etkileyen, şaşırtan ve büyüleyen bir ekten olarak ortaya çıkması olacaktır. Başka bir basit örneği daha incelemek gerekirse, Windows 'un fare ikonlarından klasik kum saati görünümü yerine dönen bir halka ya da bayan Windows kullanıcılarının en çok hoşuna giden yürüyen bir dinozor görünümü insanların ya da son kullanıcıların beklerken sıkılmalarını önlerken hoşta bir görüntü sunuyor olacaktır. mak90_1

Kısaca özetlemek gerekirse son kullanıcıların deneyimleri için yapılacak en iyi işlem projelerin fonksiyonellik özelliklerine verilen önem kadar tasarımsal özelliklerine öncelik vermektir.

Bugüne kadar son kullanıcıların tasarımsal ihtiyaçlarını karşılamaktan bahsederken sürekli olarak bu işlemi çok basit bir şekilde Windows ortamında WPF, web ortamında ise XBAP ve Silverlight yardımı ile yapabileceğimizi açıklamaya çalıştık. Bu uygulamalarda tasarım işlemlerini bu kadar basit yapılabilmesini sağlayan faktörlere göz atıyor olalım.

Tasarımcı için Araçlar

Tasarımcılar hazırlamış oldukları grafikleri kendi kullanmış oldukları uygulamalar yardımı ile hazırlamaktadır. Ancak bu uygulamalar Visual Studio ile tam uyum içerisinde çalışmamakta ve yukarıda bahsetmiş olduğumuz sorun, eksiklik v.b. gibi durumlar ile yazılımcıları tabikii de projeyi karşı karşıya bırakmaktadır. Bu sebepte hazırlanmış olan grafiklerin Visual Studio 'da sorunsuzca kullanılması için güzel bir ürün grubu hazırlandı ve tasarımcıların kullanımına sunulmuştur. Bu ürün Expression Studio ailesidir.

mak90_2
Microsoft Expression Studio ürün ailesinin içerisinde yer alan araçlar yukarıdaki gibidir. Bu araçları kısaca açıklamak gerekirse,

Expression Blend: WPF ve Silverlight için grafik ve animasyon tasarımlarının Visual Studio ile uyumlu olarak tasarlanabildiği araçtır. Bu araç sayesinde tasarımcı ile geliştirici arasında köprü kurularak daha etkileşimli bir şekilde çalışmaları sağlanır.

Expression Design: Adobe ürünlerinde olduğu gibi vektorel ve Illustrator grafik tasarımlarının yapıldığı araçtır. *.psd dosyalarını düzenleme özelliği ile tasarımcıların işlerini kolaylaştırmaktadır. Ayrıca WPF ve Silverlight uygulamaların da XAML kullanıldığı için bu ürün yapılmış olan tasarımları XAML çıktı verir ve yazılımcıların işlerini kolaylaştırır.

Expression Media: Medya dosyalarını zenginleştirilmiş içerik ile desteklemek ve Silverlight için Streaming optimizasyonunu sağlar.

Expression Web: HTML, CSS, JavaScript ve Asp.Net bileşenlerini kolayca düzenleyebileceğimiz web editörüdür. Ayrıca PHP ve ASP desteği de vardır.

Expression Studio ailesi ürün gruplarının tümü ile birlikte oldukça güçlü bir paket halini almakta ve geliştirici tasarımcı arasında ki ilişkiyi geliştirmektedir. Ayrıca geliştiricilerin Visual Studio üzerinde geliştirmiş oldukları WPF ya da Silverlight projelerini tasarımcılar Expression Blend yardımı ile düzenleyebirler. Ayrıca bu düzenleme olanağının tam tersi de mümkündür.

mak90_3

Kısaca toparlamak gerekirse, son kullanıcıya tasarım olanaklarını kolayca sunabilmek için Expression Studio ailesine gereksinim vardır.

WPF Projesi Geliştirmenin İş Akışı

WPF projesi geliştirmek analistlerden, geliştiricilere, tasarımcılara, testçilere çok daha fazla dikkat gerektiren bir süreç sunmaktadır. İstenen son kullanıcı deneyimini çok iyi anlamak ve ihtiyaçları çok doğru olarak tespit etmiş olmak gerekmektedir. Proje geliştirme sürecini en basit ve iyi şekilde anlatan süreç aşağıdaki şemada görülebilir.

mak90_4
WPF projesini geliştirmek için gerekli iş süreci bu şekildedir. Şimdi adım adım neler yapmaları gerektiğine göz atalım.

1. Elicit Requirements (Gereksinim Analizi - İster Gereksinimleri)

Yazılım projelerini geliştirirken en önemli faktörlerin başında ne gibi istekler ve bu isteklere karşın ne gibi kaynakların harcanacağını tespit etmek gelir. Bu ihtiyaçları karşılayabilmek için müşteriler ile detaylı ve akıllarında yer alan bütün istekleri söyletecek kadar konuşturmak ve bilgi toplamak gerekmektedir. Bütün ihtimallerin, durumların ve senaryoların belirlenmesi ile bu süreç işini tamamlayacaktır.

2. UI Prototype (Doğrulanabilir Prototifler Oluşturmak)

Protofif oluşturmak yazılım geliştiriciler, mühendisler ve tasarımcılar arasında daha etkili fikir paylaşımını arttırması sebebiyle daha çok tercih edilmektedir. Çünkü hayallerde olan bir tasarının gerçeğe dönüşmeye başlaması ile (herhangi bir çizim bile olabilir) çok daha etkili çözümlerin ortaya çıkabileceği ve son kullanıcı deneyimi açısından çok etkili çözümler bulunabilir. Prototif hazırlamanın bir kaç yolu vardır. Şimdi bunları inceliyor olalım;

    •Yazılı Dökümanlar: Oluşturulan her projenin adımlarını ve isterlerini barından yazılı bir dökümanı olması oldukça çok önemlidir. Herhangi bir araç ve alt yapı gereksinimi bulundurmaz. Sadece bir kağıt ve kalem yardımı ile aklınıza gelenleri o an yazarak daha sonrasında detaylı bir şekilde değerlendirebilmenize olanak tanıyabilir.

    •Tasarılaştırmak: Visio, Powerpoint gibi uygulamalar ile akış ve gelişim süreçlerinin tasarlanması. Visio ile oluşabilecek kullanıcı ekranlarının tasarımlarının temel anlamda hazırlanabilmesi.

    •Expression Blend 3 - Sketch Flow: WPF ile hazırlanan uygulamaların hangi adımlarından sonra nereye gideceğini ya da ne işlemler yapabileceğine açıklamak açısından kullanılması gerekmektedir.

    •Görülebilir Prototif: Sahte veriler yardımı ile gerçek uygulama üzerinde test yapmak ve sunumlarını gerçekleştirmek olarak görebiliriz.

Prototiflerin oluşturulması test süreçlerinin daha etkili yapılması ve gelecekte oluşabilecek olan sorunların tespit edilmesi ve hazırlanan uygulamaların daha stabil kullanılabilmesi açısından oldukça önem taşımaktadır.

    •İşleyişi: Prototifin oluşturulması ve gerekli dökümanların hazırlanabilmesi için öncelikli olarak bu süreçleri takip edebilecek bir ekip oluşturulmalı ve bir kişi ekibin liderliğini üstlenmelidir. Ayrıca test yapacak olan çalışan topluluğu lider tarafından hazırlanan test dökümanlarına göre hareket etmeli ve yapılan testler sonucunda oluşan gelişimleri yine bu dökümana ekleyerek tekrardan test liderine gönderir. Bu süreç test başarılı bir şekilde tamamlanana kadar devam edecektir.

3. İş Süreçlerinin Hazırlanması ve İşin Çalışanlara Dağıtılması

4. Grafik Tasarımı

Uygulama içerisinde yoğun olarak kullanılacak olan grafiksel öğelerin hazırlanması esnasında geçen süreçtir.

5. Test Yazılımı

ROLLER

Hepinizin tahmin edeceği üzere bir projede çalışan çalışanların üzerine atanan roller vardır. WPF ya da Silverlight ile son kullanıcı deneyimini maksimize edecek projeler hazırlarken de proje içerisinde çalışanların rol tanımları önceden belirlenmiş ve kesinleştirilmesi gerekmetkedir. Şimdi bu rollerden ve görevlerinden kısaca bahsediyor olalım.

    •Uygulama Geliştici & Mühendisi:
Bu ünvana sahip olan çalışanlar veri modellerinin, işlevselliğin ve temel tasarım üzerinde uygulamanın yapması gereken işlevleri yapabilmesine olanak tanıyan süreci tamamlamaktadır.
    •Grafik Tasarımcı: Analistlerin son kullanıcılar ile yapmış oldukları toplantılar sonrasında tespit edilmiş isteklerini karşılayacak olan görsel öğeleri tasarlayacak olan kişidir. 3B, 2D, Animasyonlar ve diğer bütün grafiksel işlemleri uygulama da kullanılması için tasarlar.
    •Etkileşim Tasarımcısı: Grafik tasarımcısı tarafından hazırlanan tasarımları uygulama içerisinde nerelerde kullanılabileceğine karar veren ve bu kararlarını Visio v.b. uygumalar ile dökümante eder.
    Entegrasyon Uzmanı & Mühendisi: İlk olarak söylememiz gereken sektörde çok zor bulunan biz uzmanlık alanıdır. Bu ünvan ile çalışan kişiler geliştiricinin ve tasarımcının hazırlamış olduğu parçaları birleştirerek uygulamanın geliştirme sürecinin tamamlanmasını sağlamaktadır.

Son kullanıcı deneyimini arttırmak için yapılması ve dikkat edilmesi gerekenleri, çalışanların ne tür vasıflarda olması ve neler yapması gerektiğini açıklamaya çalıştık. Ayrıca tasarımcı ile geliştiricinin birlikte rahatça çalışılması için gerekli olan araçların neler olduğundan da bahsederek genel hatları ile proje geliştirme sürecini tanımlamış olduk.
Ayrıca son kullanıcı tasarım süreçlerini akış şeması üzerinde incelemek isterseniz burada yer alan PDF dosyasından yararlanabilirsiniz.

Sonuç olarak bu yazımızda en temel hatları ile WPF ya da Silverlight teknolojilerinden yararlanarak son kullanıcıların deneyimlerini arttıracak uygulamaları nasıl geliştirebileceğimizi anlatmaya çalıştık.

Umarım sizler için yararlı olabilmiştir.

Turhal Temizer

info@turhaltemizer.com

Yorumlar

Bu blogdaki popüler yayınlar

Olasılıksız - Kitap Yorum

Olasılıksız hayatımda okuduğum en iyi kitaptı. Tek çırpıda hiç sıkılmadan, eğlenerek okudum bu kitabı, tavsiyem sizinde okumanız.Kitabın kapağı ve içeriği ile ilgili kısa bilgi aşağıdadır.Olasılık, tahmin, düşünceler, nöbetler, karışıklıklar, ileriyi görebilme zannı, dejavu ve tabii ki olasılıksız şeyler. Bu kelimelerle içli dışlı olabileceğiniz, bütün bu kelimelerin yaşamdaki yerini kavrayabileceğiniz müthiş bir uyarlama.Adam Fawer' ın ortaya çıkardığı bu uyarlama romanın müthiş bir çalışmanın ve araştırmanın sonucu ortaya çıktığının kitabın başından sonuna kadar farkındasınız. Bu uyarlamasını, derin araştırmalarıyla birleştirip romanı tekdüzelikten çıkarıp müthiş bir yere koyduğu için de Fawer' a müteşekkir oluveriyorsunuz. Sıkıcı diye nitelendirebileceğiniz teorik bilgileri bile bir çırpıda okuyuveriyorsunuz. Teorik bilgiler dahi olaylarla sonuna kadar bağlantılı aktarılmış. Tekdüzelikten çıkmış bir roman; olasılıksız. Her an olayın kurgusunun değişmesi olasılık dahilinde. …

.Net 3.5 SP1 – Full Install Packages (Tam Kurulum)

.Net Framework 3.5 SP1 ‘i bilgisayarınıza kurmak istediğinizde normal şartlar altında Microsoft ‘un sitesinde 2.7 mb ‘lik bir dosya indirir ve kurulum işlemlerinizi bu dosya üzerinden yaparsınız. Ancak bu indirmiş oluğunuz dosya yaklaşık 220 mb ‘lik veriyi internetten indirerek kurulum yapmaktadır. İnternet çıkışına izin verilmeyen kurumlar ve kuruluşlar için bu durum bir sıkıntı oluşturmaktadır. Bu sebepten ötürü aşağıdaki link yardımı ile tam yükleme paketini indirdikten sonra hiç internet ihtiyacınız olmadan .Net 3.5 SP1 ‘i kurabilmeniz mümkün olacaktır.Link

Çoklu Dil Desteği – Veri Tabanı Tasarım Örnekleri ile

Zaman içerisinde karşımıza çok farklı projeler gelebilmektedir. Ancak bu projeler içerisinde özellikle de global ölçekli ya da bu ölçekte uygulama geliştiren firmalarda bazı temel gereksinimler sürekli olarak karşımıza çıkabilmektedir. Bu gereksinimlerden biri ve belki de en önemlisi olan çoklu dil desteğinin veri tabanı (DB) katmanında nasıl yapıldığını kısa ve hızlıca inceliyor olacağız.Öncelikle çoklu dil desteği dediğimizde aklımıza gelen ilk çözüm yolu *.resx dosyalarını kullanmak gelmektedir. Ancak bu uzaktan yönetilen ya da anlık olarak metin değişikliği gereksinimi bulunan uygulamalarda bazı ufak problemler çıkartabilmektedir.Ne gibi problemler derseniz; iki grupta inceleyebiliriz. Web projeleri ve windows üzerinde çalışan projeler.Web projelerinde IIS üzerinde yer alan bir *.resx dosyasını değiştirdiğinizde son kullanıcı tarafında etkisi hemen görülmeyebilir. Cache mekanizmaları sebebiyle ortalama 15-30 dakika arasında bir görüntüleme süre farkı ile karşılaşabiliriz. Faha köt…