Riveめもめもー4
初回はこちら
2回目
3回目
四回目です。(ちょっと飽きてる
うーん使う予定が思いつかないとモチベーションが上がりませんわ。
まぁ、やったからにはあと2個だし、頑張っべ、
あ、
![](https://assets.st-note.com/img/1701308982645-LqVxrqtOWM.png)
ファイルの数の上限だぜ!ロックを解除したければこちらを読め!
ですって。
Riveね、、お仕事ツールとして使うならいいんだけど、
個人のおもちゃ(・ω・)として、毎月五千円はちょっと高いんだよなぁ、、あ、相場の関係で六千円弱ですねこれ。(´・ω・`)
えっと、無料で使用できるファイル上限は3つまでなので、新しく作るならどれかを削除しなければいけません
(いうて、サンプルやし、消しても痛くない)
Ratingを消しますかね。。
右クリックすりゃ消せますわ(多分)ぽちっと
![](https://assets.st-note.com/img/1701309192040-1DDQj6PlzX.png)
![](https://assets.st-note.com/img/1701309212970-yRsqpcebEw.png)
消してやったぜ、真っ白にな(?
さて、今回は何かなぁ、、
![](https://assets.st-note.com/img/1701309295315-ptEyrBwlUy.png?width=1200)
Cursor Tracking
マウスカーソルの位置を元に動きを付けるやつですね。
さてさて、まずは再生っと。
![](https://assets.st-note.com/img/1701309361040-TxiNJW2xOA.png)
立体感が消えた・・・?
えーっと、こいつをクリックすると、、、?
![](https://assets.st-note.com/img/1701309402491-tEH2jrlWQ3.png)
ふむふむ。
![](https://assets.st-note.com/img/1701309419335-QqFAswdmWa.png)
マウスカーソルがスクリーンショットに乗ってくれないので、わかりにくいですが、
マウスカーソルの位置を見てくれるようになっています。
ほほー、面白いね。
ちなみに目をクリックすると
![](https://assets.st-note.com/img/1701309494425-0gT08UA27E.png)
おとなしくなります。
さて、見ていくか、、
Icon_pressedレイヤー
これは、ボタンを押したときに「ボヨヨン」っと目がちょっと大きくなったり小さくなったりするんです。それをやってます。
![](https://assets.st-note.com/img/1701309535631-vJ1qJc4rPy.png?width=1200)
On/Offレイヤー
こいつはですね、目をクリックしたときの動作が入っております。
モノクロのスン・・って画面と、
動きまくる画面の切り替えが行われております。
![](https://assets.st-note.com/img/1701309782594-m8e9jSHXui.png?width=1200)
Blinkレイヤー
これが今回の本命っぽいです。ここでカーソルの位置を特定して何かしらをしているのでしょう。。
(先に言うと違います。ごめんなさい見当違い。)
![](https://assets.st-note.com/img/1701309807718-fodzxBldbW.png?width=1200)
えーっと、No_Blinkのタイムラインを先に見てみますね、
![](https://assets.st-note.com/img/1701309882329-l6uhByG7pJ.png?width=1200)
えーっと空っぽでしたw
何もしないということですね。
では次Blinkのタイムライン
![](https://assets.st-note.com/img/1701310041538-Babdwn8tj9.png?width=1200)
何だ、瞬きのアニメーションしか入ってないぞ、、
じゃぁ、、、どこじゃ、、、カーソル追いかける奴は、、、、
(調べるなう。。)
うーん、ここかしら、、
![](https://assets.st-note.com/img/1701311542621-gkl6BjZLE0.png?width=1200)
Listeners内のHitBoxが何かをやっているようです。
HitBoxの中身、HitBoxがありますね(名前を同じにされると紛らわしい、、
えーっとHitBoxってのは、、
![](https://assets.st-note.com/img/1701312307618-FYHdH4bmaa.png)
なんやねん、、これ(感想
ただの赤い四角があるだけですね、、、あ、PointerMoveのポインターを追う範囲を見ているのか。。。な?
あーですわ。
HitBox:
マウスカーソルを追う範囲(その範囲にカーソルがあると動きが発生する
ですわ。
色は普段見えないようにされております。
後ですね、alignにCtrl_lockが入っていますね、それがこちら。
![](https://assets.st-note.com/img/1701312083967-ahAEsnyzhr.png?width=1200)
どいつや!(わからないから二回言う。
おお!?・・・こいつを動かすとですね、、
![](https://assets.st-note.com/img/1701312130769-pi0jFLiGWW.png?width=1200)
動くんですねぇ、、
おそらくAlignに入っているものをマウスに向かって動かすということなんでしょう。。。
ちなみにこちら、動く範囲が制限されております。目から飛び出してしまわないようになっているんです。。。
(どこでやってんだよもう!)いろいろちょっと調べますね。
えーっと?まず、動く黒目の部分がこいつ
(ちょっと調べるときにたくさん名前変えたので、本来の名前から変わります。)
![](https://assets.st-note.com/img/1701314380367-H8auTBvTXW.png?width=1200)
うん、で、ですね、この中のPath(どっちも)にですね、
![](https://assets.st-note.com/img/1701314521343-ddmQHKKt2P.png?width=1200)
Bind Bones、、ボーンの指定が入っております。
ボーンはアニメーションをセットするためのツールですね。二つのボーンがあり、一つは中心部、もう一つは上下の部分を動かすためのボーンになります。
じゃぁ、それぞれのボーンの設定はどうなっているかというと、、
![](https://assets.st-note.com/img/1701314732269-TQViJLyU5j.png?width=1200)
C_1 Bone(私が勝手に命名)ですが、こちらは黒目の中心部が動くためのボーンになります。
えーっと、名前はいいや、
そのボーンのConstraintsに設定があるので見てみましょう。
Strength:100% これはカーソル位置を全力で追いますよという意味(雑
その次はPupil_center こちらは、、あとで見ます。
あとは、、いいや。(投げ
もう一つ
C_2 Bone こちらは黒目の上下部分が動くためのボーンです。
![](https://assets.st-note.com/img/1701315007942-6YVTwmlY3b.png?width=1200)
えーっと?こちらのConstraintsは、、
Strength:85% カーソル位置を追うけど、ちょっと弱めみたいな感じです。
これ見てもらうとわかるんですが、
![](https://assets.st-note.com/img/1701314975371-mAUZCLck44.png)
びみょーに上下の位置の方が内側寄りにちょこっとまがっているんですよ。
わかるかな?
目ってほら、丸い球じゃん。
だから中心にあるときはまっすぐな黒目でいいんだけど、左右に移動したときはちょっとだけ曲げるとちょっとリアルになるのよ。
ちなみにStrength:100%にするとこうなる
![](https://assets.st-note.com/img/1701315120645-eFLU0l3D9X.png)
はぁ、こまけぇ、、(褒
はい。で、Pupil_sidesの設定がありますね、
多分動ける範囲を決めているのだと思われます。
では、Pupil_centerと、Pupil_sidesを見ていきましょう。
うう、しんどい。。
![](https://assets.st-note.com/img/1701315338851-ggk4q3oL0O.png)
うーん、、Pupil_center、Pupil‗sidesいずれも指定は特にありません、じゃぁ、親のCtrl_lookは、というと、、?
![](https://assets.st-note.com/img/1701315412481-2HUj9jYOBz.png?width=1200)
はえぇ、Constraintsに指定がありますね。内容は、、
範囲にLimitがあり、
Distanceが44.3。。。。
終わらねぇぜ、、w
ちなみにLimitは、、
![](https://assets.st-note.com/img/1701315484738-EN3ag0PtgP.png?width=1200)
えーっとね、まぁ、こういうことだろうな、
Limitの位置から半径44.3の範囲を稼働範囲としているんでしょう。
なぜそう思うかって?
Ctrl_lookにあったDistanceの値を増やすと、、
![](https://assets.st-note.com/img/1701315577795-0mHUcAaB8k.png?width=1200)
赤い丸がでっかくなるからだよ!
で、その状態で動かすと、赤丸が中心のLimitからちゃんと抜け出さないようになっているからだよ!
ちなみに黒目の稼働範囲も広がりますね
![](https://assets.st-note.com/img/1701315627850-AvB1LfVTZT.png)
えーっと、、なので、
・黒目をマウスの位置に動かす処理
・黒目の移動範囲を制御
この二つで、目の動きがコントロールされているわけですね。
あああああああ!
全然まとまってないじゃないか!(憤慨
己の力不足を痛感しておるよ。
マウスにくっつけて動かす程度なら、ListenersにPointer Moveを追加してalignにくっつけたいオブジェクトを指定するだけでいけそうですわ。(多分
「目から飛び出させない」という条件が増えたおかげでなかなかあれでしたね、(´・ω・`)
次回、次は多分、簡単だとおもうの。。。
ではでは