Kullanıcı testi oturumlarında sık karşılaşılan bir an vardır: Katılımcı giriş ekranında duraksar, bir şeyler yazar ve başını kaldırarak 'doğru yapıp yapmadığını' kontrol eder. Bu duraksama, prototipin gerçek bir uygulama olmadığını fark ettiğinin işaretidir. O andan sonra toplanan tüm veriler, bu farkındalığın filtresinden geçer. Özellikle finansal ürün testlerinde bu sorun daha belirgindir çünkü kullanıcılar tutarsızlıklara karşı hassastır. Bir bankacılık prototipi gerçek kimlik doğrulamayı atladığında, katılımcılar sadece ilgisizleşmekle kalmaz, oturumu durdurup sorunu bildirirler. Sonuçta ekip, kullanıcıların gerçek bir üründe nasıl davranacağını değil, bir demonstrasyonda nasıl davrandığını gösteren bulgularla ayrılır.
Çözüm, düşündüğünüzden daha dardır: Katılımcı güveninin oluştuğu anı belirleyin ve bu etkileşimi gerçek kılın. Bir bankacılık uygulamasında bu an giriş ekranıdır. Bu makalede, gerçek bir ürün gibi davranan bir login akışı oluşturacağız: doğrulayan kimlik bilgileri, canlı hata durumu ve iOS'ta doğal hissettiren bir Face ID animasyonu. Tüm bunlar için hiç kod yazmanıza gerek yok. ProtoPie Studio'nun ücretsiz planı ile başlayabilir, Figma'dan aldığınız UI'ı kullanabilirsiniz. Gerekli Lottie dosyasını da sağlıyoruz.
Adım adım ilerleyelim: Öncelikle Figma'dan Scene olarak dışa aktarın, böylece katman hiyerarşisi korunur. Her katmanı anlamlı isimlendirin, örneğin 'Giriş Kullanıcı Adı' gibi. Ardından statik alanları gerçek metin girişi kabul eden Input katmanlarıyla değiştirin. ProtoPie'nin Input katmanı, klavyeden gerçek yazı girişine izin verir. Şifre alanı için Text Password tipini seçerek maskelenmiş görünüm elde edin. Sonra bir hedef sahne oluşturun ve butona Tap tetikleyicisi ekleyerek Jump yanıtı verin. Ancak bu haliyle herkes geçiş yapabilir, bu yüzden değişkenler ekleyin: username ve password adında iki Text değişkeni oluşturun ve bunları giriş katmanlarına bağlayın.
Sistem Güvenliği
Şimdi butonun Tap tetikleyicisine bir Condition ekleyin: username '[email protected]' VE password 'ABC123' olduğunda Jump çalışsın. Yanlış girişlerde hata mesajını gösterin. Bunun için hata katmanının opaklığını başlangıçta 0 yapın ve ikinci bir Condition ile yanlış girişlerde opaklığı 100'e çıkarın. Son olarak Face ID animasyonu ekleyin: Media > Lottie katmanı sürükleyin, Lottie dosyanızı yükleyin ve ekran dışında konumlandırın. Bu detay, testçilere 'Bu gerçek mi?' sorusunu sordurtur. Artık prototipiniz yalan söylemiyor; kullanıcılar gerçek bir uygulama gibi etkileşime giriyor ve topladığınız veriler güvenilir oluyor.