Daha İyi Bir Varsayılan Firefox UI'si Nasıl Oluşturulur

Firefox için Daha İyi Varsayılan UI Nasıl Oluşturulur

• Firefox 89 sürümünden itibaren kullanıcı arayüzü konusunda tartışmalar oldu ve buna yanıt olarak bu depo popülerlik kazandı.
• Waterfox ve Floorp tarayıcıları da bu temayı varsayılan tema olarak ayarladı.
• 2023 itibarıyla Mozilla, Windows 7 ve Windows 8 desteğini sonlandırmayı kararlaştırdı. v115 en son desteklenen sürümdür ve 2024 Eylül'e kadar kullanılabilir.

İlkeler

• UI/UX tasarımında 3 büyük ve 16 küçük ölçüte odaklanır.
• A/B testi yapılamadığı için kullanıcı davranışını tahmin etmek önemlidir.
• İçgüdüsellik, sadelik, görünürlük, uyarlanabilirlik, tutarlılık, öngörülebilirlik, kontrol edilebilirlik, verimlilik, netlik, yakınlık, boyut, tepki, esneklik, erişilebilirlik, işlevsellik, bağlamsallık, uyum, keyif ve uyumluluk gibi kriterler ele alınır.

Sorunlar

• Firefox 88 Photon UI ile 89 Proton UI arasındaki sorunları vurgular.
• Sekmelerin düğme gibi görünmesi, çok fazla dolgu alanı olması ve ikonların tek başına okunmasının zor olması başlıca sorunlardı.

Sekme Sorunu (Uyarlanabilirlik, Kontrol Edilebilirlik)

• Uyarlanabilirlik ve kontrol edilebilirlik düşünülerek sekme tasarımındaki sorunlar analiz edilir.
• Apple Safari örneğiyle, kullanıcı şikâyetlerine bağlı olarak sekme tasarımındaki değişiklik gösterilir.

Çok Fazla Boşluk Sorunu (Görünürlük, Yakınlık, Boyut, Bağlamsallık)

• Görünürlük, yakınlık, boyut ve bağlamsallık dikkate alınarak çok fazla alanın neden sorun olduğunu açıklar.
• Fitts Yasası ile tıklaması kolay bir UI nasıl tasarlanır anlatılır.
• Google Chrome ile UI aralıkları karşılaştırılarak sorunlar analiz edilir.

İkon Yardımı (Netlik, Erişilebilirlik)

• Netlik ve erişilebilirlik açısından ikonların önemi anlatılır.
• 2023 Chrome tasarım yenilemesi örneğiyle ikonların önemi vurgulanır.

Sekme Yeniden Tasarımı

• Sekme durumu için farklı tasarım seçenekleri açıklanır ve Proton UI'deki yaygın hatalar belirtilir.
• Sekme genişliğine göre akıllı ve verimli davranışlar tasarlanır.

Dağılım

• İyi bir UI için kişisel standartlar olsa da, bir ölçüde bu bir beğeni meselesidir.
• Lepton, Photon, Proton sekmeleri karşılaştırılarak her bir kavram için uygun örnekler seçilir.

İkon Ekleme ve Dolgu Ayarı

• İkon ekleme ve dolgu ayarıyla önceki şikayetler giderilir.
• Edge, Chrome ve Lepton menü ikonlarının karşılaştırılmasıyla Lepton'un ikon tasarımının üstünlüğü vurgulanır.

Tema

• Çeşitli OS ve ayarlara uyum sağlayan bir UI sunar.
• Windows 7'den macOS'a kadar farklı işletim sistemlerinin tasarımlarını takip eder.

Etkileşim

• Kullanıcının ekranda neler olduğunu anlamasına yardımcı olan ve kullanıcıyı keyiflendiren etkileşimler tasarlanır.

Sonuç

• Bu tema, gelenekleri, psikolojiyi ve araştırma sonuçlarını dikkate alarak önceki temalardan en iyi özellikleri devralır.
• OS, karanlık mod, özelleştirilmiş tema ve etkileşimleri duruma göre destekler.

GN⁺'in Görüşü

• Bu yazının en önemli yanı, kullanıcı deneyimini geliştirmek için tasarım ilkeleri ve sorun çözme yöntemlerine dair yapılan derinlemesine analizedir.
• Firefox kullanıcılarına göre bu tema, daha iyi bir tarama deneyimi sunabilecek somut bir alternatif olabilir.
• UI/UX tasarımına ilgi duyanlar için tasarım kararlarının arka planını ve etkilerini anlamaya yardımcı olan içgörülü bir kaynaktır.

[GN⁺]

Hacker News yorumu

• Yeni kullanıcı arayüzünün temel sorunu, her şeyin gereğinden fazla büyük olmasıdır. Bu, mobil ekranlarda uygun olabilir; ancak bir masaüstü ekranda alanın boşa harcanmasına neden olur. Bu durum makalede de belirtildiği gibi artırılmış dolgu kısmından kaynaklanmakla kalmıyor; compact UI yoğunluğu seçeneğinin kaldırılması da buna katkı sağlıyor. Yine de about:config içinde browser.compactmode.show ayarlanarak tekrar geri getirilebilir. Bu seçenek desteklenmiyor olarak işaretlenmiş olsa da yıllardır bu şekilde duruyor.
• Lepton adlı popüler bir Firefox temasının yazarı olarak, Mozilla'nın daha az iyi kararlarını nasıl geliştirdiğimi ve bunun nasıl popüler olduğunu anlatan çeşitli kararlarımı görebilirsiniz. Bu yazı bir dizi bölümünün bir parçası.
• Tarayıcı UX'sini iyileştirmenin dikey sekmelerden başlaması gerektiğine güçlü şekilde inanıyorum. Yatay sekmelerde 6-8 sekmeyi açmak, yönetmeyi ve takip etmeyi zorlaştırır. Dikey, iç içe geçmiş sekmelerde yeni sekmede açılan bağlantılar otomatik olarak alt sekme olur. Bu sayede yatay sekmelere göre yapı ve bağlam daha kolay anlaşılır. Buna farklı siteleri gösteren renklerin eklenmesiyle sekme gruplarını görüp ayırt etmek de kolaylaşır. Ayrıca araştırma veya dokümantasyon sırasında ilerlemeyi korumak için bir sekme "ağacını" yer imlerine ekleyebilirsiniz. CSS dosyası ve birkaç ekran görüntüsü burada bulunuyor.
• Bu gönderi, bir tema yazarının UX kurallarından başlayarak objektif olarak daha iyi bir Firefox teması yaptığına dair ikna etmeye çalıştığı izlenimini veriyor ama değişikliklerin çoğu kişisel zevke dayanıyor. Oldukça iyi yapılmış ve bakımlı olduğu kesin; ama benim için görsel olarak çekici değil ve kısmen daha karmaşık görünüyor. Herkesin zevki farklıdır; Firefox tek bir tasarımı seçmiş olsa da bu değişiklikleri destekleyebiliyor olması iyi bir şey. Ancak yazarın kendi zevkinin deneysel olarak doğru olduğunu ispatlamaya çalışması biraz aptalca duruyor.
• Firefox, sekmeleri berbat ettikten sonra birincil tarayıcım olmaktan çıktı. Arada sırada test için açıyorum ama yine de her altı ayda bir tekrar denemem gerektiğini içimden geçiriyorum. Özellikle açık tema, açık gri zemin üzerindeki beyaz düğmelerle daha da nahoş duruyor. Üstelik Windows'un sistem tema ayarını bile saygı görmezden geliyor. Edge'de bunu anlayabiliyorum, Chrome'da olmasa da en azından kontrastı yeterli. Firefox ise bunu tamamen atlamış.
• Sekmelerin düğme olmasına hiç aldırmayan insanlar da var. İlk kez kullananlar için gerçekten rahatsız edici mi? Bazen bunu yalnızca benim düşündüğümü sanıyorum.
• Herkesin kendi rahatsızlığı var; benimki de şunlar:
  • Büyük bir yer imi klasöründe çok dal içeren ağaç yapısı varsa, yeni yer imi ekleme arayüzündeki küçük açılır pencereden yeni bir yer imi eklemek berbat.
  • Yer imi kenar çubuğu isimle arama yapabilir ama yer iminin nerede olduğunu gösteremez. Bookmark search plus 2 bunu çözer ama bunun olmaması gerekirdi.
  • Birden fazla kenar çubuğu açamıyorsun. Bu yüzden dikey sekmeleri düzenlemek için Tree Style Tabs ile yer imi klasörlerini ve aramayı aynı anda açamıyorsun. Bu saçma.
  • Gerçekten mesele bunlarla sınırlı. Bunların çoğu yer imi yönetimiyle ilgili! Geri kalan arayüz iyi mi, yoksa buna alışıp da tuhaflıkları görmeyi bıraktığım için mi emin değilim. Yine de Firefox'tan oldukça memnunum. Diğerleri gibi UI yeniden tasarımıyla ilgili şikâyet etme ihtiyacı duymuyorum.
• En büyük "gereksiz Firefox UI değişikliği" şikâyetim, browser.urlbar.clickSelectsAll ayarının 4 yıl önce kaldırılmasıdır. Tahmin edildiği gibi Mozilla umursamıyor. Hata raporlarını okuyunca bunu kullanıcıya karşı düşmanca bir yaklaşım olarak tanımlayabilirsiniz. Başka hiçbir metin alanı böyle davranmaz. Mozilla'nın bu özelliği yayınlayıp onu kapatmak için bir seçenek bırakmamasını hiç anlamıyorum.
• Firefox'un asıl UI/UX felaketi, kalmış eski kalıntılardadır. Tüm temel tarayıcı işlevleri kendi farklı görünümlerinde açılır. Ayarlar bir tarayıcı sekmesinde, geçmiş bir kenar çubuğunda açılır; ama geçmişi yönetmek için ayrı bir pencerede açılır. Yer imleri ve indirmeler de o pencerede açılır. İndirmeler için küçük bir açılır pencere var ama indirmeleri yönetmek için bu pencereyi kullanmak gerekir. Yer imleri için Ctrl+Shift+O bu pencereyi açar, ama Ctrl+B kenar çubuğunu açar. Profil? Kullanıcı dostu bir profil özelliği yok, ama about:profiles içinde saklanan eski bir kalıntı arayüzü gibi görünüyor. Parolalar tarayıcı sekmesinde açılır ve gerçekten diğerleriyle aynı kalıpta değil, tamamen farklı bir görünüme sahip.
• Proton UI hakkında kimsenin dile getirmediği en kötü şey, modern 1080p (veya daha yüksek) ekran kullananlar için objektif olarak büyük bir geliştirmenin olması; benim eski X220 ThinkPad'ımda bu değişiklikler ekran alanını anlamsızca tüketerek verimli çalışma kapasitemi etkiliyor. Bu durumda konu Electron ya da React ile her şeyi şişirmekle aynı şey değil; Mozilla'nın Firefox için hala bir şeyler yaptığını yüzeysel görünmesini sağlamak adına UI'yi gereksiz yere değiştirmesi. Proton bana bu kadar kötü geldiği için kullanıcı tanımlı userchrome çalıştırıyorum.