マウスで動かした通りに【アニメーション】が作れちゃう?!【Animatize】とは?

Technology
スポンサーリンク

みなさんこんにちは!おさかなです!

今回は「Animatize」について、書いていこうと思います!

それでは、レッツゴー!!!!!

想定読者
・簡単なアニメーションを作りたい方
・マウスで動かしたとおりに、アニメーションを作りたい方
・オリジナルキャラクターを動かしてみたい方

「Animatize」って何?

Animatize」とは、マウスで動かした通りに「アニメーション」が作れるツールのことです。
デフォルトの「海とヨット」を始め、ご自身で用意した「背景」や「キャラクター」画像を用いることもでき、誰でもかんたんにアニメーションが作れる優れものとなっております!(すごい!)

animations the easy way
Create animations by dragging your mouse
【.webp】画像の「軽量化」圧縮サービス!【Squoosh】とは?
みなさんこんにちは!おさかなです!今回は「Squoosh」について、書いていこうと思います!それでは、レッツゴー!!!!!想定読者・画像を圧縮したい方・画像の「拡張子」を変更したい方・画像の編集ツールを探している方...

実際に使ってみよう!

アニメーションを作ろう!

それでは早速サイトにアクセスしましょう!

こんな感じで、マウスで動かすだけで、アニメーションが作れるみたいです!(おお!)

Try it out!」という項目まで、ページをスクロールしましょう!(よいしょ!)

赤枠のキャンバス内に「ヨット」を持っていくと…?

こんな感じで、かんたんにアニメーションが作れました!(おもしろい!)

generate code」ボタンを押すと、HTMLコードが生成され、ブログやWebサイトなどに埋め込むこともできます。(いいね!)

copy code」ボタンで、コードをコピーします。

WordPress内に埋め込む場合は、プラスマーク「+」を押して…。

カスタムHTML」を選択!

表示されたブロックの中に、コードを貼り付ければOKです!(お〜!)

(あともう少し…🚩)

【CSS】いい感じの「破線」が作れちゃう?!【Dashed Border Generator】とは?
みなさんこんにちは!おさかなです!今回は「Dashed Border Generator」について、書いていこうと思います!それでは、レッツゴー!!!!!想定読者・破線を作成したい方・デザインをチェックしながら、破...

「オリジナル画像」を使ってみよう!

ページの下の方にある「Make your own animation」という項目では、1番に「背景」2番に「キャラクター」画像をアップロードすることで、オリジナルのアニメーションが作れます。

実際にアップロードすると、こんな感じ!(わーお!)

同じようにマウスを動かしていくと、あっという間にアニメーションが完成しました!(やったね🌼)

もちろんコードの生成も可能です!

↓実際に作成したものはこちら

おさかな
おさかな

おりゃああああ!

ナビまる
ナビまる

動かしすぎです!笑

これで全ての操作は完了です。(やった~!)
お疲れ様でした☕

ここまで読んでくださり、ありがとうございました!

本や雑誌の「3Dアニメーション」が作れちゃう!?【3D Book Image CSS Generator】とは?
みなさんこんにちは!おさかなです!今回は「3D Book Image CSS Generator」について、書いていこうと思います!それでは、レッツゴー!!!!!想定読者・3Dブックを作成したい方・表紙画像を本にし...
おさかな

文章が書けちゃう、新種のおさかなです。

元不登校。引っ越し以外の理由で3回も転校したのに、結局中卒。
現在はマイペースに「プログラム」書いたり、「作曲」したり「文章」書いたり色々してます。
SAOのユウキが好きです!

おさかなをフォローする

この記事は役に立ちましたか?

タイトルとURLをコピーしました