Aracılığıyla paylaş


Diyaloglar ve kayar menüler

İletişim kutuları ve açılır öğeler, bildirim, onay veya kullanıcıdan ek bilgi gerektiren bir şey olduğunda görünen geçici kullanıcı arabirimi öğeleridir.

Diyalog

bir diyalog örneği

İletişim kutuları, bağlamsal uygulama bilgileri sağlayan modal kullanıcı arabirimi katmanlarıdır. Diyaloglar, açıkça kapatılana kadar uygulama penceresi ile etkileşimleri engeller. Genellikle kullanıcıdan bir tür eylem isterler.

Açılır Menüler

Flyout örneği

Açılır pencere, kullanıcının yaptığı işlemle ilgili kullanıcı arabirimini görüntüleyen basit bir bağlamsal açılır penceredir. Yerleştirme ve boyutlandırma mantığını içerir ve ikincil denetimi ortaya çıkarmak veya bir öğe hakkında daha fazla ayrıntı göstermek için kullanılabilir.

İletişim kutusundan farklı olarak, açılır panelin dışında bir yere dokunarak veya tıklayarak, Escape tuşuna veya Geri düğmesine basarak, uygulama penceresini yeniden boyutlandırarak veya cihazın yönünü değiştirerek açılır paneli hızla kapatabilirsiniz.

Doğru kontrol bu mu?

İletişim kutuları ve açılır öğeler, kullanıcıların önemli bilgilerin farkında olmasını sağlar, ancak kullanıcı deneyimini de kesintiye uğratır. İletişim kutuları kalıcı (engelleyici) olduğundan, kullanıcıları kesintiye uğratarak iletişim kutusuyla etkileşime geçinceye kadar başka bir şey yapmalarını engeller. Açılır pencereler daha az rahatsız edici bir deneyim sunar, ancak çok fazla açılır pencere görüntülemek dikkat dağıtıcı olabilir.

Bir iletişim kutusu veya açılır öğe kullanmak istediğinizi belirledikten sonra hangisini kullanacağınızı seçmeniz gerekir.

İletişim kutularının etkileşimleri engellemediği ve açılır pencerelerin engellemediği göz önünde bulundurulduğunda, iletişim kutuları kullanıcının belirli bir bilgiye odaklanmak veya bir soruyu yanıtlamak için her şeyi bırakmasını istediğiniz durumlar için ayrılmalıdır. Bunun dışında, bir şeye dikkat çekmek istediğinizde açılır menüler kullanılabilir, ancak kullanıcı bunu görmezden gelirse sorun olmaz.

İletişim kutusunu kullan...

  • Devam etmeden önce kullanıcının okuması ve onaylaması gereken önemli bilgileri ifade etme. Örnekler:
    • Kullanıcının güvenliği tehlikeye atıldığında
    • Kullanıcı değerli bir varlığı kalıcı olarak değiştirmek üzereyken
    • Kullanıcı değerli bir varlığı silmek üzereyken
    • Uygulama içi satın alma işlemini onaylamak için
  • Bağlantı hatası gibi genel uygulama bağlamı için geçerli olan hata iletileri.
  • Sorular, uygulamanın kullanıcıya engelleyici bir soru sorması gerektiğinde ( örneğin, uygulama kullanıcı adına seçim yapamazsa). Bloklama sorusu göz ardı edilemez veya ertelenemez ve kullanıcıya net tanımlanmış seçenekler sunmalıdır.

Açılır menü kullanın...

  • Bir eylemin tamamlanması için gereken ek bilgileri toplama.
  • Yalnızca bazı zamanlarda ilgili bilgileri görüntüleme. Örneğin, bir fotoğraf galerisi uygulamasında, kullanıcı bir resim küçük resmine tıkladığında, resmin büyük bir versiyonunu görüntülemek için bir açılır menü kullanabilirsiniz.
  • Sayfadaki bir öğenin ayrıntıları veya daha uzun açıklamaları gibi daha fazla bilgi görüntüleme.

İletişim kutularını ve açılır menüleri kullanmaktan kaçınmanın yolları

Paylaşmak istediğiniz bilgilerin önemini göz önünde bulundurun: Kullanıcıyı kesintiye uğratacak kadar önemli mi? Ayrıca bilgilerin ne sıklıkta gösterilmesi gerektiğini de göz önünde bulundurun; birkaç dakikada bir bir iletişim kutusu veya bildirim gösteriyorsanız, bunun yerine birincil kullanıcı arabiriminde bu bilgi için alan ayırmak isteyebilirsiniz. Örneğin, bir sohbet istemcisinde, bir arkadaşınız her oturum açtığında açılır öğe göstermek yerine, şu anda çevrimiçi olan arkadaşlarınızın listesini görüntüleyebilir ve oturum açtıklarında arkadaşlarınızı vurgulayabilirsiniz.

İletişim kutuları, bir eylemi (örneğin, bir dosyayı silmeyi) gerçekleştirmeden önce onaylamak için sık sık kullanılır. Kullanıcının belirli bir eylemi sık sık gerçekleştirmesini bekliyorsanız, kullanıcıyı eylemi her seferinde onaylamaya zorlamak yerine hata olduğunda eylemi geri almak için bir yol sağlamayı göz önünde bulundurun.

Örnekler

Dialog oluşturma adımları

Diyaloglar makalesine bakın.

Açılır panel oluşturma

Flyout makalesine bakın.