流れるバナーも、止まるGIFも。Movie to GIFに新機能を足しました
朝晩は少し涼しくなってきましたね。
どうも、Kyosukeです。
今回はnoteに嬉しいGIFの新機能のご紹介です。

ただ、その前に。どうしても先に書いておきたいことがあります。

01. 先に、お礼を言わせてください
Movie to GIF は無料で出しています。会員登録も課金もありません。
ですが、チップを送ってくださった方がいました。
メイシンさん

チップには、メッセージを添えられるようになっています。
どなたからのものかは伏せますが、うれしかった言葉をふたつだけご紹介します。
まず、390円のチップに添えられていた一文。
ありがとうございました。サンキュー(390)をおくります。
こちらこそサンキューです♪
そして、これ。
以前使わせていただいてから、実は今も愛用しています
ありがとうございます。とてもうれしかったです!
無料で何かを出すと、「届いているのか分からない」状態になります。
そこに「使ってます」のひと言が活動の燃料になります。
いつもコメントを下さるみな様も本当にありがとうございます!
というわけで、本編へ戻ります。
02. 【新機能】流れるバナーが作れる「マーキー」
記事やWebサイトで、細い帯が流れているの、見たことありませんか。
あれ、自分で作れたらいいのに、とずっと思っていました。
なので作りました。マーキーです。

白紙からは始まりません
開くと、いきなり見本が並んでいます。

押すと、その見た目が丸ごと入ります。色も、流れる速さも。
あとは好きに変えるだけ。
見本は「テイスト」ごとに用意しました。
はっきり / 線画アイコン / パステル / クレヨン / らくがき / メンフィス の6種類です。
「おまかせで組む」ボタンもあります。選んだテイストの中で、勝手に並べてくれます。

絵は181点、入っています
図形だけだと「模様」しか作れないので、絵も同梱しました。
桜・ひまわり・もみじ・雪、本・鉛筆・吹き出し、医療、料理……全部で181点です。
選ぶときは、先にテイストを選びます。
輪郭の濃さや塗り方が違うものが隣り合うと、帯としてすぐ崩れるんですね。なので、混ざりようがない作りにしました。
線画のアイコンだけは色を着せられます。濃い地の上でも、白を着せれば沈みません。
いちばん苦労したのは「継ぎ目」
流れる帯って、ループの端で「ガクッ」となりがちです。
このツールは、どう設定してもループがきれいにつながります。
速さを変えても、明滅させても、回転させても、色を回しても。
継ぎ目を探さなくていい。ここだけは、何度も測り直しました。
作ったバナーは、リンクで渡せます

GIFができると、その下に「バナーのリンクを共有」ボタンが出ます。
押すとURLがコピーされます。受け取った人がそれを開くと、同じバナーが載った状態でツールが立ち上がります。
色だけ変えて自分のものにする、みたいな渡し方ができます。
設定はぜんぶURLの中に入っているので、私のサーバーには何も残りません。
(自分で入れた画像だけは渡せません。図形と設定だけが乗ります)
触ってみて、変なところがあったら教えてください。
03. GIFの最後のコマを、止められるようにしました

GIFって、止まらないじゃないですか。
ずっとぐるぐる回っていて、記事に置くと、目の端でいつまでも動いている。
なので、最後のコマだけ長く止めるツールを作りました。「ループ調整」です。

できあがったGIFを放り込んで、止める秒数を決めるだけ。
ポイントは、作り直していないことです。
コマの表示時間を書き換えているだけなので、画質は元のまま落ちません。
1周の長さ・コマ数・容量も出るので、noteの上限に収まっているかもその場で分かります。
止まらない版と、最後で止まる版の比較



04. 縦の動画、切らずに横長にできます

縦長の動画をnoteに貼ると、画面いっぱいに縦へ伸びて、記事が間延びします。
かといってクロップすると、見せたいものが切れる。
なので、余白を足して横長に整えられるようにしました。「画面」タブの下のほうです。
映像はそのまま。足りない側に単色の余白を足して、指定の比率に収めます。
比率はボタンで選べます
余白の色は白・黒・好きな色から
映像を左右(上下)のどちらに寄せるかも選べます
容量の推定も、貼り先の上限判定も、余白込みの大きさで計算しています。
実際に貼られるのは、そちらの大きさなので。
おわりに
相変わらず、動画も画像もサーバーには送られません。 ぜんぶブラウザの中だけで終わります。
インストールも会員登録も課金もいりません。
あばけろ君は左肩でいつも「バグ報告はラブレターだね」と言っています🐸
今回はそこに、本物のラブレターが何通か届いてしまいました。
チップをくださったみなさん、ありがとうございます。
おかげで、さらにnoteの皆さんに優しいツールになりました。
▼ぜひ触ってみてください👇
「ここが使いにくい」「この端末で動かない」も大歓迎です。
応援のコメントもお待ちしております😊
LINE公式やDMに送ってもらえたら、次のアップデートで直します😌🐸
不定期でAIやWebに関する情報や便利なアプリを紹介しています。 よければLINE公式の登録もお待ちしております✨

いいなと思ったら応援しよう!
よろしければ応援お願いします!いただいたチップは、よりよい記事づくりのために大切に使わせていただきます🐸