Rate elementi, kullanıcıların bir içerik, hizmet veya deneyimi belirli bir ölçek üzerinden puanlamasını sağlayan görsel bir değerlendirme elementidir. Yıldız, ikon veya benzeri görsel göstergelerle desteklenen yapısı sayesinde kullanıcılar, değerlendirmelerini hızlı ve sezgisel bir şekilde yapabilir.
Rate elementi; memnuniyet, kalite, performans, beğeni düzeyi gibi öznel değerlendirmelerin toplanmasında kullanılır. Görsel geri bildirim sunması, kullanıcı etkileşimini artırır ve değerlendirme sürecini kolaylaştırır.
(i) Rate elementi yalnızca web uygulamalarında desteklenmektedir.
1.1. Sık Kullanım Senaryoları
Ürün veya hizmet memnuniyet değerlendirmeleri
İçerik, eğitim veya etkinlik puanlamaları
Kullanıcı geri bildirim ve anket ekranları
Kalite, performans veya deneyim ölçümleri
Yorum ve değerlendirme sistemleri
2. Temel Özellikler
Görsel puanlama sistemi: Yıldız veya ikon tabanlı yapısı sayesinde kullanıcılar değerlendirmelerini sezgisel olarak yapabilir.
Belirli bir ölçek üzerinden değerlendirme: Puanlama, tanımlanan minimum ve maksimum değerler (ör. 1–5) üzerinden gerçekleştirilir.
Anlık görsel geri bildirim: Kullanıcı puanlama yaptıkça seçilen değer görsel olarak vurgulanır.
Form ve aksiyonlarla uyumlu çalışma: Rate elementi; form submit, state güncelleme, anket ve geri bildirim senaryolarında sorunsuz şekilde kullanılabilir.
2.1. Rate Elementi Özellikleri (Properties)
Properties panelinden aşağıdaki ayarları yapılandırabilirsiniz:
Value: Seçilen puanı veya değerlendirme sonucunu gösterir. Başlangıç değeri olarak sabit bir puan belirlenebilir veya değer dinamik olarak değiştirilebilir.
Allow Half: Kullanıcıların yarım puan seçebilmesine olanak tanır (örn. 3.5 yıldız veya toplam puanın 4.3 olarak gösterilmesi gibi).
Count: Puanlama sisteminde yer alacak toplam yıldız veya puan sayısını belirler (örn. 5 yıldız veya 10 yıldızlık bir değerlendirme).
2.2. Elemente Eklenebilen Aksiyonlar
Rate elementi, kullanıcıların yaptığı puanlama işlemlerine bağlı olarak olay (event) bazlı aksiyonlar tetiklenmesini destekler. Aksiyonlar, elementin kendisine değil; kullanıcı puanı değiştirdiğinde tetiklenen event’e bağlanır.
Rate elementi için aksiyonlar, Properties > Add Action alanı üzerinden aşağıdaki event aracılığıyla tanımlanabilir.
Desteklenen Aksiyon Tetikleyicisi
onChange: Kullanıcı Rate elementi üzerinde seçtiği puanı her değiştirdiğinde tetiklenir.
Kullanım amaçları:
Seçilen puanı state veya değişken olarak kaydetmek
Kullanıcı geri bildirimlerini anlık olarak işlemek
Puanlamaya bağlı olarak ek alanlar göstermek (ör. düşük puanda yorum alanı açmak)
Anket veya değerlendirme sonuçlarını güncellemek
API veya workflow tetikleyerek değerlendirme verisini göndermek
Örnek senaryo: Kullanıcı bir hizmeti 2 yıldızla değerlendirdiğinde, sistem otomatik olarak “Geri bildiriminizi paylaşmak ister misiniz?” alanını görünür hale getirir.
Aksiyonlara İlişkin Temel Kurallar
Rate elementi yalnızca onChange event’i üzerinden aksiyon tetikleyebilir.
Kullanıcı puanı her güncellediğinde onChange event’i çalışır.
Aynı onChange event’i için birden fazla aksiyon tanımlanabilir.
Rate elementi, özellikle geri bildirim, memnuniyet ölçümü ve anket senaryolarında aksiyonlarla birlikte kullanıldığında etkili ve kullanıcı dostu bir değerlendirme deneyimi sunar.
3. Rate Elementi Nasıl Kullanılır?
Bu bölümde Rate elementinin kullanıcı geri bildirimi toplamak amacıyla nasıl kullanıldığını, örnek bir uygulama senaryosu üzerinden ele alacağız.
Senaryo: Uygulama Memnuniyet Değerlendirmesi
Bir mobil/web uygulamasında, kullanıcı belirli bir işlemi tamamladıktan sonra (örneğin bir görevi bitirdiğinde veya uygulamayı bir süre kullandığında) memnuniyetini hızlıca belirtmesi için bir değerlendirme ekranı gösterilir.
Bu ekranda kullanıcıdan:
Uygulamayı yıldızlarla puanlaması,
İsterse uygulama mağazasına yönlenmesi,
Ya da değerlendirmeyi geçmesi beklenir.
Bu yapı sayesinde kullanıcıdan doğrudan ve düşük eforlu geri bildirim alınır.
Senaryoda:
Ekranın üst kısmında kullanıcıya teşekkür mesajı gösterilir.
Orta alanda Rate elementi ile yıldızlı puanlama yapılır.
Rate seçimine göre kullanıcı aksiyon almaya yönlendirilir.
Alt kısımda kullanıcıya iki seçenek sunulur:
Rate on App Store
No, thanks
Adım 1 - Veri Kaynağı Oluşturma
DataSources modülünde tablo oluşturma:
Datasources modülüne gidin.
Ardından Tables sekmesine gidin.
“AppRate” adında yeni tablo oluşturun.
Kurulması gereken tablo yapısı aşağıdaki gibidir:
Önemli Alan adları:
Description: Kullanıcının uygulama hakkında yaptığı yorum veya değerlendirme metnini tutar ve listeleme ekranlarında geri bildirim olarak gösterilir.
RatingValue: Kullanıcının verdiği puan değerini saklar ve ortalama puan hesaplama, filtreleme ve istatistiksel analizlerde kullanılır.
Adım 2 – UI Elementlerini Ekleme ve Yapılandırma
UI Design modülünü açın.
Sayfaya Elements > Container > VerticalStack elementini sürükleyip bırakın.
Vertical Stack elementi içerisini VerticalStack > Styling > Layout > Yatayda Ortala olarak ayarlayın.
Görsel boyutlarını Image > Styling > Layout > Width ve Height > 125 px olarak ayarlayın.
Image altına Vertical Stack içerisine Elements > Display > Label elementini sürükleyip bırakın.
Yazı içeriğini Label > Properties > Value > “Teşekkürler!” olarak güncelleyin.
Yazı stilini Label > Styling > Text > Style > Normal Text ve Heading 3 olarak seçin.
Altına bir Elements > Display > Label elementi daha sürükleyip bırakın.
Yazı içeriğini Label > Properties > Value > “Geri bildiriminiz bizim için çok değerli. Yorumunuz için teşekkür ederiz.!” olarak güncelleyin.
Altına Elements > Numeric Input > Rate elementini sürükleyip bırakın.
Başlangıçta Rate elementi değerini Rate > Properties > Value > 5 olarak ayarlayın.
Senaryonuza bağlı olarak Rate > Properties > AllowHalf > Kapalı olarak ayarlayın.
Yarım işaretlemeler için tabloda RatingValue alanını tipini Decimal olarak tanımlamanız gerekir.
Yıldız sayısını Rate > Properties > Count > 5 olarak ayarlayın. Ön tanımda kendisi 5 olarak gelecektir.
Rate elementi altına Elements > Text Input > TextArea elementini sürükleyip bırakın.
Altına Elements > Navigation > Button elementini sürükleyip bırakın.
Buton üzerindeki yazıyı Button > Properties > Label > “Gönder” olarak güncelleyin.
Button elementine Button > Add Action > onClick > Managed DB > Save Record kayıt aksiyonunu ekleyin.
Aksiyonda AppRate tablosunu ve aşağıdaki sütunları seçin.
CreatedDate alanına Default > Now tanımlamasını yapın.
Description alanına Components > TextArea > value tanımlamasını yapın.
RatingValue alanına Components > Rate > value tanımlamasını yapın.
Id alanına Default > New Guid tanımlamasını yapın.
Son durumda kayıt aksiyonu aşağıdaki gibi olmalıdır.
Gönderim sonrası ana sayfaya dönüş yapmak için Button > Add Action > Navigation > Navigate alanında ana sayfanızı seçiniz.
Preview
Uygulama test edildiğinde, kullanıcı uygulama hakkındaki görüşlerini ve değerlendirmelerini yıldızlı puanlama alanı üzerinden kolayca iletebilir. Kullanıcı, verdiği puanı seçtikten sonra yorum alanına düşüncelerini yazabilir ve “Gönder” butonu ile geri bildirimini sisteme iletebilir. Gönderim sonrası kullanıcıya teşekkür mesajı gösterilerek değerlendirme sürecinin başarıyla tamamlandığı bilgisi sunulur. Bu yapı sayesinde kullanıcı memnuniyeti ve geri bildirim toplama süreci pratik ve anlaşılır bir şekilde yönetilir.
4. Ortak Özellikler (Properties)
Rate elementi üzerinde yer alan bazı alanlar tüm UI elementlerinde ortak olarak kullanılır. Bu nedenle, aşağıdaki özelliklerin detaylı açıklamaları ilgili genel kılavuz sayfalarında yer almaktadır:
Rate elementini kullanırken aşağıdaki iyi uygulamalar, kullanıcıların değerlendirme yapmasını kolaylaştırır ve toplanan geri bildirimlerin kalitesini artırır:
Puanlama ölçeğini net ve tutarlı belirleyin. 1–5 veya 1–10 gibi ölçekler açıkça tanımlanmalı ve uygulama genelinde tutarlı kullanılmalıdır.
Puanlamanın neyi ifade ettiğini açıklayın. Gerekirse Rate elementinin yakınında kısa bir açıklama veya etiket kullanarak kullanıcıyı yönlendirin.
Varsayılan puan atamasını dikkatli kullanın. Otomatik seçili bir değer, kullanıcıyı istemeden yönlendirebilir. Gereksiz durumlarda boş bırakılması önerilir.
6. Kısıtlamalar
Rate elementi yalnızca web uygulamalarında desteklenir.
Sayısal hassasiyet gerektiren değerlendirmeler için uygun değildir; yalnızca sembolik puanlama sağlar.
Aksiyonlar yalnızca onChange event’i üzerinden tetiklenebilir.
