Merhaba Arkadaşlar,
Bu konuyu açma sebebim okumakta olduğum bir kitabın Apendix bölümünde bulunan Arayüz Tasarımı adlı bölümü sizinle paylaşmak istememdir. Kitap ingilizce olup kendi yorumlarımı da katarak bir kısmını çevirmiş bulunmaktayım. Kitabın ilgili bölümü bitene kadar çevirilerim devam edecek ve konuyu güncel tutacağım. Çeviri işlemi tamamlandığında buradaki bilgileri içeren bir word dosyasını da forma eklemeyi düşünüyorum.
Splash Screen
o Minimize, Maximize ve Close butonları olmamalı. Kenarlık stili boyutlandırılamayacak şekilde ayarlanmalı. Açıldığında ekranı ortalamalı.
Form
o Formlarda genellikle Minimize ve Close butonları aktif olmalı ayrıca formlar ekranı ortalayarak açılmalı.
Formda Yerleşim ve Organizasyon
o Kullanıcı arayüzü ya dikey ya da yatay olarak tasarılanmalıdır. En önemli bilgiler üst-sol’da bulunmalı.
o Formdaki ilişkili kontroller bir kutu içine alınabilir. Bu sayede kullanıcının sağlıklı bir şekilde yönlendirilmesi mümkündür.
o Her metin kutusu bir etiket ile tanımlanmalıdır. Program çıktıları için metin kutusu değil etiket kullanın. Bu sayede çıktıya müdahale engellenmiş olur. Tanımlamanın anlamlı olmasına dikkat edilmelidir. Tanımlama 1 satırda ve maksimum 3 kelimede bitirilmelidir. Etikette metinler sola dayalı olmalı ve etiketlendiği objenin üstünde veya solunda konumlandırılmalıdır.
o Etikette sadece başlangıç harfi büyük olmalı ve tanımlamadan sonra “:” konulmalıdır.
o Butonların resim yazısı anlamlı olmalıdır. Buton yazısı 1 satır ve 3 kelimeyi aşmamalıdır. Butonların resim yazısında her kelimenin baş harfi büyük olmalı. (Bağlaç ve Edatlar hariç)
o Eğer birden fazla buton dikey olarak yerleştiriliyorsa butonların yükseklik ve genişliği aynı olmalı, yerleşim yatay olarak yapılmışsa sadece yüksekliğin aynı olması yeterlidir. Butonların yerleşimi hiyerarşik olmalı. Hiyerarşi söz konusu değilse kullanım sıklığı göz önüne alınmalı.
Resim Ekleme
o Resimlerin kullanımı oldukça önemlidir. Eğer sadece estetik amaçlı resimler eklenecekse, resmin boyutu küçük olmalıdır. Estetik amaçlı yüklenen resmin kullanıcıyı rahatsız etmemesi gerekmektedir.
Font Seçimi
o Tüm uygulamada sadece bir yazı tipi kullanılmalı. Segoe UI tercih edilebilir.
o En fazla iki farklı yazı büyüklüğü kullanılmalı.
o İtalik ve altı çizili yazı tiplerinden kaçınılmalı, çünkü bu şekilde yazılan yazıların okunması oldukça zordur.
o Kalın yazı tipi kullanımı sınırlı olmalı. Başlık, yönlendirme ve vurgu amaçlı kullanılabilir.
Renklendirme
o Kullanıcı ara yüzü siyah, beyaz ve gri tonlarla tasarlanmalıdır. Renkler gerçekten geçerli bir sebep varsa tercih edilmelidir.
o Arka fon için beyaz, parlak beyaz veya gri tonlar seçilmelidir, yazılar için ise siyah.
o Arka fon koyu ve yazı tipi açık olmamalıdır. Koyu arka fon gözleri yorarken, açık renkli yazı tipi yazının bulanık görünmesine sebep olur.
o Siyah, beyaz ve gri renkleri haricinde kullanılacak renk sayısı maksimum 3
olmalıdır. Seçilen renkler birbirlerini tamamlayıcı nitelikte olmalıdır.
o Bir nesneyi tanımlamak için sadece renk yeterli değildir. Mutlaka etiket kullanılmalıdır.
Metin Kutusu ve Etiket İçin Kenarlık Stili
o Metin kutuları için kenarlık stili Fixed3D (Sanırım Basık) olmalıdır.
o Etiketler için ise kenarlık stili saydam olmalıdır.
o Program çıktısını döndüren etiketler içinse kenarlık stili FixedSingle (Sanırım Kabarık) olmalıdır.
o Windows Uygulamalarında kullanıcının müdahale edemediği veriler 3-Boyutlu gösterilmez. Bu sebepten etiketlere Fized3D kenarlık stil özelliği verilmemelidir.
Etikete, otomatik boyutlan özelliği atama
o Etiket program çıktısı veriyorsa boyutu otomatik olarak ayarlanabilmeli.
Kısayol Atama
o Kullanıcı girişli her nesne için kısayol atanmalıdır. Atama sırasında anlamlı harfler kullanılmalıdır. Harflar yetmediği zaman sayılar ve sesli harfler kullanılabilir.
Sekme Sırası
o Sekme sırası formdaki nesnelerin anlamlı şekilde gezilebilmesini sağlamalıdır.
InputBox ve MessageBox Fonksiyonlarının Prompt ve Title Özellikleri
o Title’da her kelimenin ilk harfi büyükken, Prompt’ta sadece ilk kelimenin baş harfi büyük olmalıdır.
MessageBox
o Mesaj kutusunda Exclamation ya da Question ikonları sürecin devam edebilmesi için evet/hayır gibi cevapların gerektiği durumlarda, Information ikonu bilgi içerikli mesajlarda, Stop ikonu ise ciddi uyarılarda kullanılmalıdır. MessageBox’ta varsayılan buton kullanıcının en sık kullanımı göz önüne alınarak belirlenmelidir.
Seçenek Grubu Nesnesi
o Seçenek sayısı maksimum 7 olmalıdır. Seçeneklerin tanımlandığı etiketlerde seçenekler için kısayol bulunmalı. Seçenekler çerçeve içinde belirtilmelidir.
o Varsayılan buton ayarına dikkat edilmelidir.
Edit-08-12-2011---->Çevirinin kalan kısmı eklenmiştir.
Onay Kutusu
o Her bir onay kutusu için kısayol tuşu konulmalıdır.
Liste Kutusu
o En az 3 en fazla 8 item içermelidir. Atanacak bir kısayol tuşu ile otomatik olarak listbox içine girilebilmelidir.
o Listedeki veriler ya alfabetik ya da kullanım sıklığına göre sıralanmalıdır. Eğer liste kutusunda tek seçim yapılıyorsa en sık seçilen item varsayılan olarak ayarlanmalıdır. Birden fazla seçim varsa varsayılan item seçmeye gerek yoktur.
Açılan Kutu
o Kısayol atanmalıdır. Sıralama liste kutusundaki mantıkla aynı olmalıdır.
Menü Standartları
Menü isimleri büyük harfle başlamalı ve sadece bir kelimeden oluşmalıdır. (Dosya, Düzen… gibi) Kısayol atanmalıdır.
o Menü içindeki sık kullanılacak itemler için de kısayol tuşları atanmalıdır.
o Windows standartları menü oluşturulurken göz önünde bulundurulmalıdır.
o İlişkili menü itemleri gruplanmalı bu amaçla ayraç/ayraçlar konulmalıdır.
Çeviri işlemi bitmiştir. Herkese faydalı olması dileğiyle.
Yararlanılan Kaynak: Diane ZAK, Programming With Microsoft Visual Basic 2010
Edit-07-03-2012---->Arayüz Makale ve Örnekleri
12. mesaja arayüz tasarımı ile ilgili bir makale ve örnek uygulamaların bulunduğu bir site ekledim. Mesaja gitmek için tıklayınız.
Bu konuyu açma sebebim okumakta olduğum bir kitabın Apendix bölümünde bulunan Arayüz Tasarımı adlı bölümü sizinle paylaşmak istememdir. Kitap ingilizce olup kendi yorumlarımı da katarak bir kısmını çevirmiş bulunmaktayım. Kitabın ilgili bölümü bitene kadar çevirilerim devam edecek ve konuyu güncel tutacağım. Çeviri işlemi tamamlandığında buradaki bilgileri içeren bir word dosyasını da forma eklemeyi düşünüyorum.
Splash Screen
o Minimize, Maximize ve Close butonları olmamalı. Kenarlık stili boyutlandırılamayacak şekilde ayarlanmalı. Açıldığında ekranı ortalamalı.
Form
o Formlarda genellikle Minimize ve Close butonları aktif olmalı ayrıca formlar ekranı ortalayarak açılmalı.
Formda Yerleşim ve Organizasyon
o Kullanıcı arayüzü ya dikey ya da yatay olarak tasarılanmalıdır. En önemli bilgiler üst-sol’da bulunmalı.
o Formdaki ilişkili kontroller bir kutu içine alınabilir. Bu sayede kullanıcının sağlıklı bir şekilde yönlendirilmesi mümkündür.
o Her metin kutusu bir etiket ile tanımlanmalıdır. Program çıktıları için metin kutusu değil etiket kullanın. Bu sayede çıktıya müdahale engellenmiş olur. Tanımlamanın anlamlı olmasına dikkat edilmelidir. Tanımlama 1 satırda ve maksimum 3 kelimede bitirilmelidir. Etikette metinler sola dayalı olmalı ve etiketlendiği objenin üstünde veya solunda konumlandırılmalıdır.
o Etikette sadece başlangıç harfi büyük olmalı ve tanımlamadan sonra “:” konulmalıdır.
o Butonların resim yazısı anlamlı olmalıdır. Buton yazısı 1 satır ve 3 kelimeyi aşmamalıdır. Butonların resim yazısında her kelimenin baş harfi büyük olmalı. (Bağlaç ve Edatlar hariç)
o Eğer birden fazla buton dikey olarak yerleştiriliyorsa butonların yükseklik ve genişliği aynı olmalı, yerleşim yatay olarak yapılmışsa sadece yüksekliğin aynı olması yeterlidir. Butonların yerleşimi hiyerarşik olmalı. Hiyerarşi söz konusu değilse kullanım sıklığı göz önüne alınmalı.
Resim Ekleme
o Resimlerin kullanımı oldukça önemlidir. Eğer sadece estetik amaçlı resimler eklenecekse, resmin boyutu küçük olmalıdır. Estetik amaçlı yüklenen resmin kullanıcıyı rahatsız etmemesi gerekmektedir.
Font Seçimi
o Tüm uygulamada sadece bir yazı tipi kullanılmalı. Segoe UI tercih edilebilir.
o En fazla iki farklı yazı büyüklüğü kullanılmalı.
o İtalik ve altı çizili yazı tiplerinden kaçınılmalı, çünkü bu şekilde yazılan yazıların okunması oldukça zordur.
o Kalın yazı tipi kullanımı sınırlı olmalı. Başlık, yönlendirme ve vurgu amaçlı kullanılabilir.
Renklendirme
o Kullanıcı ara yüzü siyah, beyaz ve gri tonlarla tasarlanmalıdır. Renkler gerçekten geçerli bir sebep varsa tercih edilmelidir.
o Arka fon için beyaz, parlak beyaz veya gri tonlar seçilmelidir, yazılar için ise siyah.
o Arka fon koyu ve yazı tipi açık olmamalıdır. Koyu arka fon gözleri yorarken, açık renkli yazı tipi yazının bulanık görünmesine sebep olur.
o Siyah, beyaz ve gri renkleri haricinde kullanılacak renk sayısı maksimum 3
olmalıdır. Seçilen renkler birbirlerini tamamlayıcı nitelikte olmalıdır.
o Bir nesneyi tanımlamak için sadece renk yeterli değildir. Mutlaka etiket kullanılmalıdır.
Metin Kutusu ve Etiket İçin Kenarlık Stili
o Metin kutuları için kenarlık stili Fixed3D (Sanırım Basık) olmalıdır.
o Etiketler için ise kenarlık stili saydam olmalıdır.
o Program çıktısını döndüren etiketler içinse kenarlık stili FixedSingle (Sanırım Kabarık) olmalıdır.
o Windows Uygulamalarında kullanıcının müdahale edemediği veriler 3-Boyutlu gösterilmez. Bu sebepten etiketlere Fized3D kenarlık stil özelliği verilmemelidir.
Etikete, otomatik boyutlan özelliği atama
o Etiket program çıktısı veriyorsa boyutu otomatik olarak ayarlanabilmeli.
Kısayol Atama
o Kullanıcı girişli her nesne için kısayol atanmalıdır. Atama sırasında anlamlı harfler kullanılmalıdır. Harflar yetmediği zaman sayılar ve sesli harfler kullanılabilir.
Sekme Sırası
o Sekme sırası formdaki nesnelerin anlamlı şekilde gezilebilmesini sağlamalıdır.
InputBox ve MessageBox Fonksiyonlarının Prompt ve Title Özellikleri
o Title’da her kelimenin ilk harfi büyükken, Prompt’ta sadece ilk kelimenin baş harfi büyük olmalıdır.
MessageBox
o Mesaj kutusunda Exclamation ya da Question ikonları sürecin devam edebilmesi için evet/hayır gibi cevapların gerektiği durumlarda, Information ikonu bilgi içerikli mesajlarda, Stop ikonu ise ciddi uyarılarda kullanılmalıdır. MessageBox’ta varsayılan buton kullanıcının en sık kullanımı göz önüne alınarak belirlenmelidir.
Seçenek Grubu Nesnesi
o Seçenek sayısı maksimum 7 olmalıdır. Seçeneklerin tanımlandığı etiketlerde seçenekler için kısayol bulunmalı. Seçenekler çerçeve içinde belirtilmelidir.
o Varsayılan buton ayarına dikkat edilmelidir.
Edit-08-12-2011---->Çevirinin kalan kısmı eklenmiştir.
Onay Kutusu
o Her bir onay kutusu için kısayol tuşu konulmalıdır.
Liste Kutusu
o En az 3 en fazla 8 item içermelidir. Atanacak bir kısayol tuşu ile otomatik olarak listbox içine girilebilmelidir.
o Listedeki veriler ya alfabetik ya da kullanım sıklığına göre sıralanmalıdır. Eğer liste kutusunda tek seçim yapılıyorsa en sık seçilen item varsayılan olarak ayarlanmalıdır. Birden fazla seçim varsa varsayılan item seçmeye gerek yoktur.
Açılan Kutu
o Kısayol atanmalıdır. Sıralama liste kutusundaki mantıkla aynı olmalıdır.
Menü Standartları
Menü isimleri büyük harfle başlamalı ve sadece bir kelimeden oluşmalıdır. (Dosya, Düzen… gibi) Kısayol atanmalıdır.
o Menü içindeki sık kullanılacak itemler için de kısayol tuşları atanmalıdır.
o Windows standartları menü oluşturulurken göz önünde bulundurulmalıdır.
o İlişkili menü itemleri gruplanmalı bu amaçla ayraç/ayraçlar konulmalıdır.
Çeviri işlemi bitmiştir. Herkese faydalı olması dileğiyle.
Yararlanılan Kaynak: Diane ZAK, Programming With Microsoft Visual Basic 2010
Edit-07-03-2012---->Arayüz Makale ve Örnekleri
12. mesaja arayüz tasarımı ile ilgili bir makale ve örnek uygulamaların bulunduğu bir site ekledim. Mesaja gitmek için tıklayınız.
