Konuyu Açan
#1
Son birkaç arayüz denememde ChatGPT ve benzeri araçlara aynı isteği verdim: “Mobilde düzgün çalışan, masaüstünde de bozulmayan bir düzen kur.” İlk bakışta sonuçlar gayet derli topluydu; ama telefonda gerçek tarayıcıda açınca küçük pürüzler hemen ortaya çıktı. Özellikle alt sabit butonlar, ekran klavyesi açıldığında içerikle çakışabiliyor; tam ekran hissi veren bölümlerde de adres çubuğunun görünür olup olmaması yüksekliği değiştiriyor.
Ben artık yapay zekâdan yalnızca CSS üretmesini değil, test senaryosu da önermesini istiyorum. Örneğin dar ekran, yatay kullanım, uzun başlık, büyütülmüş yazı ve form alanına odaklanma durumlarını ayrı ayrı kontrol ettiriyorum. Ayrıca “100vh kullan ve bitti” gibi kestirme çözümleri doğrudan kabul etmek yerine, mobil tarayıcı davranışını ve gerekirse dinamik viewport birimlerini değerlendirmesini söylüyorum.
Bir başka işe yarayan yöntem, tasarımı tek bir telefon genişliğine göre değil, içerik taşmasının başladığı eşiklere göre incelemek. Masaüstünde güzel görünen iki sütunlu kartlar, orta genişlikteki bir cihazda sıkışabiliyor.
Siz yapay zekânın ürettiği mobil arayüzlerde en sık hangi hatayla karşılaşıyorsunuz? Gerçek cihaz testi için kullandığınız pratik bir kontrol listeniz var mı?
Ben artık yapay zekâdan yalnızca CSS üretmesini değil, test senaryosu da önermesini istiyorum. Örneğin dar ekran, yatay kullanım, uzun başlık, büyütülmüş yazı ve form alanına odaklanma durumlarını ayrı ayrı kontrol ettiriyorum. Ayrıca “100vh kullan ve bitti” gibi kestirme çözümleri doğrudan kabul etmek yerine, mobil tarayıcı davranışını ve gerekirse dinamik viewport birimlerini değerlendirmesini söylüyorum.
Bir başka işe yarayan yöntem, tasarımı tek bir telefon genişliğine göre değil, içerik taşmasının başladığı eşiklere göre incelemek. Masaüstünde güzel görünen iki sütunlu kartlar, orta genişlikteki bir cihazda sıkışabiliyor.
Siz yapay zekânın ürettiği mobil arayüzlerde en sık hangi hatayla karşılaşıyorsunuz? Gerçek cihaz testi için kullandığınız pratik bir kontrol listeniz var mı?