28 Ocak Pazartesi ´13   —   6 Yorum


Geçtiğimiz hafta, iOS geliştiricilerimizden biri, varolan iPhone uygulamamızı iPad'e sadece birkaç ayarla oynadıktna sonra derleyerek çalışır hale getirdi, sonuç tabi ki götü başı dağılmış bir uygulama, ama fonksiyonel. Tabi ki iPhone ve iPad arasında deneyim tasarımı farklılıkları var fakat teknik olarak çok küçük problemler var. Uygulamanın uyumsuzluğunun 95%'i sadece görsel problemler ve bu problemler tasarımın özellikle iPhone ekran çözünürlüğüne göre yapılmış olmasında.

Mobil uygulamalar çok iyi örnekler değiller bu yazı için çünkü uygulamanın çalışacağı cihazlar belirli ve çözünürlükleri belirli, yazılan uygulamalar da çalışacakları cihazlara oldukça bağlılar.

Web'de ise durum biraz daha farklı, cihazları veya ekran çözünürlüklerini kontrol edemezsiniz, ayrıca web uyuglamalardan daha universal bir içerik türü, çok farklı cihazlar tarafından okunabilen çok daha geniş bir kitleye hitap edebildiginiz bir içerik dağıtım türü. Bu yazıda size bu farklılıkların bazı çıkış noktaları anlatacağım ve farklı bir arayüz geliştirme yaklaşımdan bahsedeceğim.

Az önce mobil uygulamalar bu problemin açık şekilde görüleceği ortamlar olmayabilir demiştim fakat Android işletim sistemi üsütnde çalışan uygulamalar bu yazıya daha yakın örnekler olabilirler çünkü piyasadaki farklı ekran çözünürlüğüne sahip cihaz sayısı oldukça yüksek, dolayısıyla web örneğine daha yakınlar.

Farklı çözünürlüklere sahip kullanıcı kitlesine üretilen klasik bir tasarım senaryosunda, kullanıcı analitikleri analizi yapılıp en çok kullanılan ekran çözünürlüğü belirlenir. Vazgeçilebilecek ekran çüzünürlüklerinden kurtulduktan sonra kabul edilebilecek minimum ve maksimum ekran çözünürlüğü tanımlandıktan sonra buna göre bir tasarım çalışması yapmak genel yaklaşımdır. Kullanıcı deneyimi tasarlandıktan sonra arayüz tasarımı yapılır ve arayüz tasarımı bittikten sonra tasarlanan asset'ler (resimler, ikonlar, butonlar, arka plan grafikleri vs) çoğu zaman arayüz geliştiricisinin ekran çözünürlüğünde test edilir ve az sonra belirteceğim deneyler yapılmaz.

Devamını Oku →
20 Temmuz Pazar ´08   —   18 Yorum

Web İkonları

v0.7'de sitenin alt kısmına yerleştirmek üzere tasarladığım, web 2.0 button görünümüne sahip ikonları Dosyalar bölümünde Grafik dizininde "rss_xhtml_icons.psd" ve "valid_css_xhtml_icons.psd" dosyaları olarak bulabilirsiniz. (Her ne kadar sayfalar valid olmasa da :-) )

http://www.mfyz.com/?/dosyalar/Grafik

Kullanımı Creative Commons 2.5 lisansına uygun olmalıdır. Lisans hakkında bilgi almak için de http://www.mfyz.com/?/hakkinda/lisans/ adresini ziyaret edebilirsiniz.
20 Temmuz Pazar ´08   —   2 Yorum

Bazı İkonlar

Sitede kullandığım ve zamanında yaptığım bazı ikonlar. PHP logosunun web 2.0 patlamadan önce aqua buton denemelerimden ortaya çıkardığım versiyonu, şu an günlük sayfalarında tarihi görüntülediğim takvim ikonu ve anasayfada kullandığım firefox bannerı ve alternatifi.

Dosyalar bölümünde Grafik dizininde psd dosyalarını bulabilirsiniz.
http://www.mfyz.com/?/dosyalar/Grafik

Kullanımı Creative Commons 2.5 lisansına uygun olmalıdır. Lisans hakkında bilgi almak için de http://www.mfyz.com/?/hakkinda/lisans/ adresini ziyaret edebilirsiniz.

Popüler Etiketler

javascript js date tarih web app php open source mfyz design nedir mootools ajax xmlhttprequest imza html signature apple mail gimp howto jquery textarea iphone ipad kontrol yapıları if while ubuntu cache sosyal medya istatistik social media statistics graph less css css3 opengraph api facebook share ie browser rss lifestream parse xml seo search optimization meta auth url kitap örnek kod proje ios itunes mobile app banner htaccess fql wanda digital mysql db code sql diff doritos kampanya tytz blog chart google grafik job developer pharma hack wordpress lisans subversion svn apache server windows twitter bootstrap html5 wireless ui ux icons internet explorer player license assets framework iOS internet dokuman portfolio optimizasyon git version control deployment linux konsol login workspace pear mdb2 prepare execute mssql pgsql form radio style network insanlar compile support notebook laptop plugin http service tool kurulum table browsers object fstab ntfs www subdomain redirect crossdomain icon ikon download xhtml terminal startups music language database free macosx app store store in-app purchase purchase subscription verification storekit itunes connect regex zaman widget development osx applications button switch phpstorm jetbrains ide editor newsletter session spam firefox integration cookie cms link tebrik connect sitemap nasıl screen query select box ruffles compiler on-the-fly analyse procedure webkit export input ipucu logo injection route router mod_rewrite calendar generator coding oyun