MotionLang

フィードバックと操作 · タップへの反応

クリックスパーク点击火花

押した場所から短い火花が数本飛び散り、すぐ消えます。リップルとの役割分担は明快です。リップルは「この範囲が押された」、火花は「まさにこの一点」を描きます。大きさも精度も桁が違います。

ツールでこの項目を開く

使いどころ

小さく正確な操作部(アイコンボタン、いいね、お気に入り)に使い、特にポインタ環境に向きます。タッチでは控えめに。指が落点を隠して大半が見えず、電池だけ消費します。

パラメータ

on pointerdown · 8 sparks · length 0→14px · opacity 1→0 · 380ms ease-out

レシピ

  1. クリックスパーク → on pointerdown · 8 sparks · length 0→14px · opacity 1→0 · 380ms ease-out

AI に渡す一文

クリックスパークを作ってください。pointerdown を監視し、落点に 8 本の短い線を 45 度間隔で生成します。長さを 0 から 14px へ伸ばし、同時に opacity を 1 から 0 へ、380ms の ease-out で、アニメーション終了後に要素を削除します。位置と伸長は transform で行い、left/top は使わないでください。

同じカテゴリの動き