WEB制作APNGでアニメーション画像を作るAPNG(エーピング)とはAPNGはエーピングと読みます。Graphics(アニメイテッドポータブルネットワークグラフィックス)の略で、アニメーションするPNG画像です。今まではアニメーション画像の形式といえばGIFアニメーションが主流でしたが、2004年に開発されたAPNGは次世代の画像形式としてWEBにも活用出来ます。LINEスタンプもこのAPNGを採用しており、アニメーションのLINEスタンプを作成する場合には、この形式で提出する必要があります。Photoshopでも作成出来るのか残念ながら2019年の現時点ではPhotoshopではAPNGを書き出すことは出来ません。別のソフトを使用して変換する必要があるので、Photoshopでアニメーションを作っている場合はそれぞれのコマの画像を書き出して、APNGを作るソフトで変換します。Assemblerというソフトを使用して、作成することができます。WindowsでもMacでも使えます。Setting:ループ数を設定します。Frames:全画像のフレームの表示時間を設定します。Compression:圧縮方法等を設定します。Selected:選択した画像のフレームの表示時間を設定します。PNG:APNGファイルの書き出し処理を開始します。用意したコマごとのPNG画像をドロップして順番に並べます速さを設定しますループ回数を設定します圧縮率を設定します保存して出来上がりAPNG非対応ブラウザでは最初の1枚目が静止画として表示されるため、何もない状態から始まるアニメーションなどは注意が必要です。use」2019年IEとEdge、Operaが非対応です。APNGのメリットとデメリットメリットアルファチャンネルを含むGIFアニメの場合、画像の一部を非表示になる透過が出来ますが、APNGの場合はアルファチャンネルがサポートされているので、画像そのものが透過出来る。劣化なくデータを圧縮できる可逆圧縮のため、劣化のないデータ圧縮が可能です。通常は対応していない画像をWEB上に配置した場合、×マークとなり表示されませんが、APNGの場合は最初のフレームが静止画として表示されるため、代替画像を用意して複雑なタグを設置する必要がありません。デメリットサポートされていないブラウザ環境がある前述の通りIE、Edge、Operaなどは非対応です。非対応ブラウザでは1フレーム目が静止画として表示されるので、問題はないのですが、どうしてもアニメーションでないとダメ、というWEB制作案件もあるかと思います。JavaScriptライブラリ「apng-canvas.js」を使用してIEでも擬似的に表示させる方法があります。衣類の汚れは何をどう使う?APNGでアニメーション画像を作る【Mac編】アニメ画像に変換する君このサイトはグラフィックTシャツ「スカラヴィジョン」が運営しています。邦楽の歴代ミリオンセラー。