- Geliştirme yaparken bir şey inşa eder, defalarca tıklar, düzenler ve yeniden tıklarsınız
- Sayfalar arası geçişlerde geri düğmesini birçok kez kullanırsınız
- Bu bir tür QA taktiğidir; tıklayarak sorunları bulma ve düzeltme sürecidir
- Ahşap işçiliğine benzer şekilde, önce büyük sorunları çözer, ardından ince detayları pürüzsüz hale getirirsiniz
UI testi
- Yazılımda o kadar çok değişken vardır ki her şeyi test etmek ve parlatmak zordur
- UI’yi tekrar tekrar kullanarak sorunları bulma ve düzeltme süreci yinelenir
Radyo seçenek listesi üzerinde çalışma
ile aynı satıra yerleştirilir, ortalanır ve aralarına boşluk konur- Eskiden CSS
float kullanılırdı, artık bu iş flexbox ile kolayca yapılır
Foo
.container {
display: flex;
flex-direction: row;
align-items: center;
gap: .5rem;
}
Sorunun bulunması ve çözümü
- UI’de radyo düğmesi ile etiket arasında tıklanamayan ölü bir alan keşfedilir
- Sorunun nedeninin flexbox
gap özelliği olduğu doğrulanır
gap kaldırılıp etikete padding eklenerek sorun çözülür- Etikete padding eklenerek ölü alan olmadan tıklanabilir hale getirilir
Sonuç
- Küçük sorunlar birikerek büyük bir rahatsızlığa yol açabilir
- Sorunları bulup düzeltme süreci tekrarlandığında sonunda akıcı bir sonuç elde edilir
GN⁺ özeti
- Bu yazı, UI geliştirme sürecinde ortaya çıkabilecek küçük sorunları bulma ve çözme sürecini anlatıyor
flexbox ile yerleşim düzeni kolayca kurulabilir, ancak beklenmedik sorunlar çıkabilir- Sorunu çözmek için çeşitli yöntemler denenir ve sonunda
padding kullanılarak çözüm bulunur
- UI geliştiricileri için yararlı ipuçları sunar ve küçük sorunları çözme sürecinin önemini vurgular
Henüz yorum yok.