102.3K+İndir
Kullanım kılavuzuna geç
Micro-Interaction Specyazan Owl-Listener

Micro-Interaction Spec Skill.

Mühendisliğe yalnızca bir animasyon referansı değil, küçük bir etkileşimin arkasındaki davranışı verin.

  • Etkileşim Tasarımı
  • UI Devir Teslimi
OpenDesign İndirKullanım Kılavuzunu Görüntüle
Kaynak İncelemesi · Micro-Interaction SpecSKILL.md
Görev Etkileşim Tasarımı Çıktılar • Tek bir etkileşim için tetikleyici ve kural belirtimi. • Zamanlama ve easing notları içeren bir geri bildirim sırası. • Tekrar, ilk kullanım ve erişilebilirlik davranışı. Başlamadan Önce Belirli bir hareket kütüphanesi gerekmez; yine de hedef cihazda test yapmak gereklidir.
Editoryal özet · kaynak incelendi 2026-10-07 · üretilmiş bir örnek değildir

01 İşlevler

Tek Bir Etkileşimi Eksiksiz Tanımlayın

Tetikleyiciler, kurallar, geri bildirim ve döngüler ya da modlar etrafında kurulmuş, odaklı bir etkileşim devir teslim biçimi.

Kaynağa dayalı iş akışıYürütme karşılaştırması değildir

Çalışma Yaklaşımı

Micro-Interaction Spec, küçük bir etkileşimi eksiksiz bir davranış birimi olarak tanımlar. Tetikleyici başlatır, kurallar sonrasında ne olacağını belirler, geri bildirim sonucu iletir; döngüler veya modlar ise tekrarı ve zaman içindeki değişimi açıklar. Bu yapı bir anahtar, favorilere ekleme eylemi, çekerek yenileme, doğrulama ipucu veya uzun basma için işe yarar.

Hareket çıktının yalnızca bir parçasıdır. Görsel değişiklikler, ses ve haptik, olası geri bildirim kanallarıdır; her platformda bulunduğu garanti edilmez. Kaynak, mantığın yanında süre, easing ve erişilebilirlik hususlarını da ister; bu da cilalı bir animasyonun tanımsız bir hata ya da tekrar durumunu gizlemesini önlemeye yardımcı olur.

Beklenen Çıktılar

  • Tek bir etkileşim için tetikleyici ve kural belirtimi.
  • Zamanlama ve easing notları içeren bir geri bildirim sırası.
  • Tekrar, ilk kullanım ve erişilebilirlik davranışı.
Örnek Brief’e Bakın

Brief’ten İncelemeye

  1. 01
    Tetikleyiciyi Tanımlayın

    Etkileşimin bir hareketle, sistem olayıyla veya bir koşulla başlayıp başlamadığını belirtin.

  2. 02
    Kuralları Yazın

    Geri bildirim biçimini seçmeden önce sırayı, koşulları ve dalları açıklayın.

  3. 03
    Algıyı ve Tekrarı Belirtin

    Kullanıcının ne gördüğünü veya hissettiğini, ne kadar sürdüğünü ve sonraki denemelerde neyin değiştiğini açıklayın.

02 Kullanım Alanları

Ne Zaman Kullanılır?

Belirli bir hareket kütüphanesi gerekmez; yine de hedef cihazda test yapmak gereklidir.

İyi Bir Uyum

  • Mühendislik Devir TeslimleriKısa bir etkileşim prototipte açık görünüyor ama yazılı davranışı yoksa işe yarar.
  • Geri Bildirimi İyileştirmeAmaçlı onayı, yararlı bilgi katmayan süslemeden ayırmaya yardımcı olur.

Kontrol Edilecek Sınırlar

  • Her Seferinde Tek EtkileşimBirbirine bağımlı çok sayıda durumu olan bir bileşen için daha kapsamlı bir state-machine modeli gerekir.
  • Cihaz Garantisi YokHaptik veya ses geri bildirimi hedef platformda desteklenmeli ve test edilmelidir.

Bu Girdileri Getirin

  • Eylem ve BağlamTanımlanan kontrolü, hareketi veya olayı tam olarak belirtin.
  • Mantık ve KoşullarBaşarılı, reddedilen ve tekrarlanan eylem davranışlarını sağlayın.
  • Platform KısıtlarıHareket tercihlerini, desteklenen geri bildirim kanallarını ve performans sınırlarını belirtin.

03 Önemli Kararlar

Önemli Kararlar

  1. Döngüler Açıktır

    Tekrarlanan eylemler, aynı geri bildirimi her seferinde yeniden oynatmak yerine ilk kullanımdan farklı bir yanıt gerektirebilir.

  2. Mantık Easing’den Önce Gelir

    Animasyon erişilebilirlik için kaldırılsa bile belirtim yararlı olmaya devam eder.

04 Örnek Görev Tanımı

Odaklı Bir Brief Deneyin

Aşağıdaki örnek brief test edilmemiştir. Kullanmadan önce becerinin kurulumunu kontrol edin.

Kurulumu İnceleyin

Deponun belgelenmiş kurulum yolunu kullanın ve atıfta bulunulan tüm yardımcı dosyaları saklayın. Bu kayıt, çalıştırılabilir bir uygulamayı değil, odaklı bir tasarım yöntemini tanımlar.

Upstream Kaynak Dosyası
https://github.com/Owl-Listener/designer-skills/blob/9a6930cf84a822eb458624bd11c61aac5bbdf224/interaction-design/skills/micro-interaction-spec/SKILL.md

Belirli bir hareket kütüphanesi gerekmez; yine de hedef cihazda test yapmak gereklidir.

Tek Bir Çıktıyla Başlayın

Beceriyi çalıştırmadan önce bu brief’teki kapsamı, kaynak materyali ve kısıtları uyarlayın.

Örnek Brief
Bir makaleyi okuma listesine kaydetmek için micro-interaction-spec kullanın. Tıklama tetikleyicisini, bekleme ve başarısız kayıt kurallarını, görsel onayı, tekrarlı tıklama davranışını ve azaltılmış hareket alternatifini tanımlayın. Kapsamı bu etkileşimle sınırlı tutun ve web’de haptik desteği varsaymayın.

Sonucu İnceleyin

Gerçek çıktıyı bu gözlemlenebilir ölçütlere göre kontrol edin.

  • Tetikleyici ve ortaya çıkan durum belirsiz değildir.
  • Tekrarlanan etkinleştirmenin tanımlı bir sonucu vardır.
  • Temel geri bildirim, azaltılmış hareket ayarında da korunur.

OpenDesign, kodlama ajanları için yerel bir tasarım çalışma alanı sağlar. Bu listeleme, becerinin pakete dahil olduğu veya harici araçlarının, kimlik bilgilerinin ve yazılım bağımlılıklarının sağlandığı anlamına gelmez.

OpenDesign İndirHızlı Başlangıcı Okuyun

05 Kaynak ve Lisans

Kaynak ve Lisans

Bu sayfa, aşağıda bağlantısı verilen sabitlenmiş kaynak sürümünü anlatır. Kaynaktaki davranış ve gereksinimler değişebilir.

Kaynak Sahibi
Owl-Listener
Depo
Owl-Listener/designer-skills
Beceri Dosyası
interaction-design/skills/micro-interaction-spec/SKILL.md
Lisans
MIT
İncelenen Anlık Görüntü
2026-10-07 · 9a6930cf84a8
Editoryal Kaynak Özeti
Tetikleyiciler, kurallar, geri bildirim ve döngüler ya da modlar etrafında kurulmuş, odaklı bir etkileşim devir teslim biçimi.

Bağlantılı kaynağa dayanan, OpenDesign tarafından hazırlanmış özgün özet. Depo yıldızları tarihli bir popülerlik göstergesidir; beceri kullanımı veya kalite puanı değildir.

06 Başlamadan Önce Sorular

Başlamadan Önce Sorulacaklar

Yalnızca animasyon için mi?

Hayır. Çerçeve tetikleyicileri, mantığı, geri bildirimi ve tekrarı içerir. Animasyon, geri bildirim seçeneklerinden yalnızca biridir.

Durum makinesinden farkı nedir?

Odaklı bir etkileşimin deneyimini belirtir. Durum makinesi ise daha geniş bir durum ve geçerli geçiş kümesini kapsamlı biçimde modeller.

Her etkileşimde ses veya titreşim kullanılmalı mı?

Hayır. Kaynak, dikkate alınacak kanalları listeler; hangilerinin uygun olduğunu ürün bağlamı ve platform belirler.

OpenDesign

Bir Sonraki Tasarım Yinelemesine Yer Açın.

Brief’inizi, kaynak materyalinizi ve tasarım çalışmanızı yerel bir çalışma alanında bir arada tutun. Becerinin kendi kurulumunu, iş akışınıza eklemeden önce kontrol edin.

OpenDesign İndirTasarım Becerilerine Göz Atın
Upstream Kaynak Dosyası
https://github.com/Owl-Listener/designer-skills/blob/9a6930cf84a822eb458624bd11c61aac5bbdf224/interaction-design/skills/micro-interaction-spec/SKILL.md