動画を animation GIF/ animation png(apng) / webpに変換して比較してみたよ｜kurokky
公開時期が遅れてこの記事の二番煎じ的な感じですが、一応apngとwebpでも比較してみたという話です。 尚、noteはwebPに対応していないので是非検証結果ページを見てご自身で判断してください、 ※全てLinux上のcuiでやっています、apngに関してはzlibによる圧縮です。 gif2webpのbuildやffmepgのインストールオプションによってはランセンス的に問題が出てくる場合があります、挑戦しようとする方は自分で調べて違反しないように使用しましょう。 古いバージョンのffmpegだとパッチを当てないといけない場合や他にも環境を整えるのが面倒です。 （「できない」「難しいことはやらない」ということもすごく大事です。） きっかけ先日、noteにこんな記事を書いたんですが、その時に文字数が変わる部分を説明したかったのでmacで画面キャプチャしてgif化したんですね。 『まぁ、画素数
After Effects(アフターエフェクト)でアニメーションLINEスタンプ（Apng）の作り方 - ホワイトボードアニメーション制作・手書き動画ならキザキヤ（東京・新宿）
After Effects(アフターエフェクト)でアニメーションLINEスタンプ（Apng）の作り方 2017年11月20日 2020年2月4日 動くLINEスタンプを作成 皆様、こんにちは。映像制作キザキヤでホワイトボードアニメーションを制作している大橋です。 以前にLINEスタンプの動くバージョンのアニメーションLINEスタンプを制作しました。 それから、しばらく時間が経ち動くLINEスタンプの制作の仕方も忘れ始めていることに気がついたので 再度動くLINEスタンプの制作をすることにしました。 以前にLINEのアニメーションスタンプを制作した時はAdobeのAnimate CCを使用して制作をしました。 このAdobeのAnimate CCが個人的に使いにくかったので、スムーズに制作ができなかったということがありました。 そこで今回は動く（アニメーション）LINEスタンプをAdobeの
APNG AssemblerでアニメーションするPNG(APNG)を書き出す - Qiita
APNGとは？ APNG(エーピング)とはアニメーションするPNG画像のことです。もともとブラウザベンダーのMozillaが提案した規格で、Webサイトでのアニメーション表現に利用できます。従来よりアニメーションGIFが主流でしたが、アニメーションGIFは色数の制限や輪郭のジャギーなどクオリティ面で悩ましいところが多々あります。その悩みを払拭してくれると期待されるのがAPNG形式です。 最近では、LINEのアニメーションスタンプ(うごスタ)にも使われています。 APNGの詳細はICS MEDIAにて解説してますのでご覧ください。 GIFアニメからAPNGの時代に！ 次世代画像形式APNGを使いこなそう LINEのアニメーションスタンプはこう作る！ APNGファイルの作り方を徹底解説 APNGファイルの作成に必要なものはPNGの連番画像 APNGファイルの作成には、次のようなアニメーションの
Chromeの対応で活用の幅が広がりそうなアニメーション画像「APNG」についてまとめてみました - OPTPiX Labs Blog
ウェブ担当の嶋です。 先日Google ChromeやOperaがAPNG（アニメーションPNG）に対応しました。ブラウザでアニメーション画像を表示する場合、アニメーションGIFやmp4などの動画ファイル、そしてHTML5を利用したアニメーションなどが選択肢にあがりますが、これに一つフォーマットが追加されたということになります。 なぜ今APNGなのか。そしてアニメーション画像としてAPNGを使うメリットはどこにあるのか、ちょっとまとめてみました。 ※ 本エントリーではAPNG画像を使用しています。対応していないブラウザ（Internet Explorer等）で見た場合はアニメーションしない静止画として表示されますのであらかじめご了承下さい。また、本エントリーの情報は2017年7月現在の情報です。 そもそもAPNGとは何か APNG(Animated Portable Network Gra
APNGでイラストやアイコンを動かそう！～AdobeAnimateの使い方～ | 東京のホームページ制作 / WEB制作会社 BRISK
APNGでイラストやアイコンを動かそう！～AdobeAnimateの使い方～ 更新日：2024/08/15 イラストや写真を動かして、Webサイトで見られるアニメーションといえばGIFアニメーションですよね。 ですが、近頃GIFアニメーションに代わる新しいAPNGという形式が現れました！ 今回はこのAPNGについてと簡単にアニメーションを作成の過程をご紹介したいと思います。 APNGとはAPNGとはアニメーションPNG、エーピングと読みます。 簡単に言うとアニメーションするPNG画像のことです。 実は、APNGは2004年に作成されたので以前から存在しておりましたが、作成から3年後、公式から仕様に含めないとされていたり、Webブラウザで対応しているのがFirefoxだけだったり…と近頃まで日の目を見なかったものでもあります。不憫。 現在はほかのWebブラウザでも対応できるものが増えてきて、
ウェブ用アニメーションを劣化なく保存できる画像形式APNGの作り方 - ICS MEDIA
APNGエーピング(Animated Portable Network Graphics)形式とは、高画質なアニメーション用の画像形式です。類似の画像形式としてGIFアニメーション形式が存在しますが、APNGは高画質化が可能であり透過情報の扱いに長けています。詳しい利点は記事「これからはGIFアニメからAPNGの時代に」で紹介しています。 本記事ではAPNGファイルの作り方を解説します。APNGファイルの作り方はいろいろありますが、「できるだけデータ容量を軽く」というテーマでまとめてました。 ※LINEアニメーションスタンプの作り方については、記事「LINEのアニメーションスタンプはこう作る！ APNGファイルの作り方を徹底解説」で解説してます。 APNGの作り方の手順 本記事では次の手順で解説します。 Adobe Animateでアニメーションを作成 アニメーションの連番画像を書き出し
LINEアニメスタンプにも利用できる！ APNGやWebPへ変換可能なアプリ「アニメ画像に変換する君」をリリース - ICS MEDIA
LINEアニメスタンプにも利用できる！ APNGやWebPへ変換可能なアプリ 「アニメ画像に変換する君」をリリース GIF画像に変わり得る新世代のアニメーション画像形式として、APNG（エーピング）とWebP（ウェッピー）があります。それらの画像ファイルを簡単に作成できるデスクトップアプリケーション「アニメ画像に変換する君」を弊社が開発し、無償でリリースしています。 ▲ デスクトップアプリケーション「アニメ画像に変換する君」 主な用途としてLINEアニメーションスタンプの制作に利用できます。LINEアニメーションスタンプはAPNG形式が採用されており、Adobe AnimateやPhotoshop等のソフトで制作したアニメーションをAPNG形式に変換する必要があります。 このアプリケーションを使えば、簡単な手順でLINEアニメーションスタンプ用のAPNG形式に変換できます。 ▲「アニメ画像
LINEのアニメーションスタンプはこう作る！ APNGファイルの作り方を徹底解説 - ICS MEDIA
▲メイン画像（「アニメーションスタンプ制作ガイドライン」より引用） ▲トークルームタブ画像（「アニメーションスタンプ制作ガイドライン」より引用） デザイン カラーモードはRGB 画像サイズは幅320×高さ270px以内（幅、高さのどちらかが270px以上あれば、横長や縦長の画像の制作も可能） 背景は透過 アニメーションのない余白部分は削除 APNGファイルの最初のフレーム画像がLINE STOREまたはスタンプショップの販売時や静止時に表示される 再生時間（1つのAPNGファイルあたり） 最大再生時間は4秒 最大フレーム（コマ）数は5〜20フレーム 1〜4回ループ可能（再生時間4秒を超えない範囲内） データ容量（1つのAPNGファイルあたり） 300KB以下 詳しくは「アニメーションスタンプ制作ガイドライン」をご覧ください。この記事の情報もガイドラインの更新にあわせて随時アップデートしてい
1
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
http://www.muckhave.com/2016/07/15/%E3%80%90%E5%8B%95%E3%81%8Fline%E3%82%B9%E3%82%BF%E3%83%B3%E3%83%97%E3%80%91apng%E3%83%95%E3%82%A1%E3%82%A4%E3%83%AB%E3%82%92photoshop%E3%81%A7%E4%BD%9C%E3%82%8B%E6%96%B9%E6%B3%95%E5%AE%8C%E5%85%A8/