noteのリアクション用に、アニメーションをつくってみたよ #つくってみた
こんにちは、ゆうらです🌻
10月から、わたしの中で、noteを「ブログに書くほどでもないけど書きたいこととか、後でちゃんと推敲してブログにアップする用の初稿的な役割」に設定したので、今後はnoteの更新頻度もあがることでしょう!
というわけで、リアクションに使っているアニメーションを一新してみました。
この記事を公開するちょっと前から新しくしていたので、気がついた方もいたんじゃないかな?
いままでは適当なアニメーションを設定していて、前から「ちゃんとしたやつに変えたいなー」と思っていたので、ちょうどよかったです!
今回つくったリアクションのアニメーションは、以下の2種類。
スキしたとき
フォローしたとき
この記事では、つくったアニメーションのお披露目と、ひとくち制作小噺を書いていきたいと思います。
はじめに:リアクションとは?
noteで、なにかしらのアクションをした際に表示されるものです。
具体的には、
スキ
フォロー
マガジン追加
シェア
記事の購入
マガジンの購入・購読
サポート
これらのアクションを起こした際に表示されます。
リアクションの設定方法
ブラウザだと、『アカウント設定』から設定することができて、たくさん設定すると、アクションを起こしたときにその中からランダムでひとつ表示させることができます。(だから、おみくじみたいなこともできるかも。)
テキストだけでも設定できますが、お礼のテキストと一緒に画像を追加することもできて、JPG/PNG/GIF(アニメを含む)を設定することができます。
というわけで、今回わたしは、リアクションに使用するためのGIFアニメーションを制作しました。
より詳しい使い方を知りたい方は、以下の記事をご覧ください👉 スキのお礼メッセージを設定する - noteヘルプセンター
ちなみに、わたしのnoteのリアクション設定はこんな感じになっています👇
ここらへんは、最後のおまけパートで詳しくお話ししていこうかと思います。
リアクション用に書き下ろしたアニメーションのお披露目会
さて、前置きが長くなってしまいましたが、いよいよアニメーションのお披露目会です!わーい🥳
ただし、ここに全部載せちゃうと、なにが返ってくるかわからないドキドキ感やわくわく感が削がれちゃうので、ここには一部だけ載せます。
「どうしてもいま全部見たいんだ!」という方は、おまけパートにすべてのアニメーションを載せておくので、そちらをご覧ください。
アニメーションお披露目❶|スキしたときのリアクション(全5種)
まずは、わたしのnoteにスキをした際に表示されるアニメーションを、全5種類のうち2種類紹介します。
うさぎさんとハート
ひとくち制作小噺:「あっ!こんにちは!」「そうだ!これあげる!」というイメージで作りました。うさぎさんからハートのプレゼントをされるイメージです。ハートを差し出したときのエフェクト(ほっこりの波動)がいい感じ。
いぬくんとハート
ひとくち制作小噺:いぬくんのかわいさが最大限引き出せるようにがんばりました。上からハートが降ってきて下に着地する描写は、ゆうら史上はじめての試みだったので、なかなかむずかしかったです。
アニメーションお披露目❷|フォローしたときのリアクション(全1種)
これは、すでにわたしをフォローしていただいている方は、「一旦フォローを解除してからまたフォローする」という作業をしてもらわないと見られないので、惜しまず出していきます。笑
ゆうらと、ゆうらの仲間たち
ひとくち制作小噺:「うさぎさんといぬくんにゆうらがほおずりをする」というアニメーションを作りたくて作りました。他のキャラクターには、賑やかしとして適度に動いてもらいました。
\こちらのイラストを元に作りました/
アニメーションにするにあたって、動かすパーツごとにレイヤーわけをする必要があるので、おんなじ絵をもう一度描く必要があったのですが、このイラストを描いているときから「これを動かすならこういうアニメーションにしたいな」と思っていたアニメーションを作ることができたので、大満足です。
おわりに
お披露目会は以上です!付き合ってくれてありがとうございました!🥳
リアクションのアニメーションはもちろん、ひとくち制作小噺も楽しんでもらえているとうれしいです。
最後まで読んでいただき、ありがとうございます! 💛 よければスキとコメントを残していただけると励みになります💛 記事が気に入ったら、フォローもしてくれるとうれしいです! 気が向いたらサポートもしていただけると、とってもうれしいです。