8月上旬状況

8月上旬雑記です。ほぼみっかの追加別日はまったく進んでおりません。申し訳ないです。

考えただけで特に何にもなってないゲーム案

ウディコンもたけなわというわけで、ちょっと考えたけどこれ作るの……面倒だな……！となって何にも至っていない案を置いてみます。

近況

最近は小説を書いています。ほぼみっかの背景画像を探していた時に、使わないけど綺麗だなーという画像があって、何となくそれを背景にした文章を思い浮かべてみたら、ちょっと書けそうな気がしてきたので書き始めてみた感じです。ただ何か絶対的な目的があるわけでもなく、内輪で見てもらえればいいかなーという書き方をしています。エンタメ性とか考えてないやつですね。自分で書いててこれは一体何なのかという感じになります。でもまあ小説書くのは楽しいですね。詰まるとうぐぐとなるのですが、軽く妄想した場面を自分が読んで分かるように書くと、自分が読んで分かるのでなるほどなあとなります。でも読んでなるほどなあとなるよりここ変だなとかここおかしいなとかここ表現くどいなとかここ何言ってるかわけわかんねえなとかの方が断然多いので、小説書くのは難しいですね。辛いです。

そんな感じで書いていますが、進んでいません。書きながら設定を固めているので、こっち書いてあっちいじってこっちいじってあっち直してという感じで、進んだと思ったら進んでなかったりしています。あんまり長引くとめんどいので七月中の完成を目指して書いていたのですが、予定がどんどんずれています。おかしい。最初に妄想した時は、出だしを考えて、中盤考えて、ラスト考えて、これ繋げばいけるだろう！という感じだったのですが、その繋ぎがもう繋がらないという、無計画制作のスケジュールガバガバさここに極まれりです。ただこういう書き方じゃないと、設定書いてる間に書き飽きて本文書かないということになるので、完成しない率が高くなるんですよね。ちなみにこういう書き方しても完成しない率は高いです。どういうことなんだ！？（圧倒的未完率）

今のところ三万字まできました。一本の小説でこの長さはかなり久しぶりです。いつぶりでしょうか。覚えてないくらいです。七月中にできて人に見せられそうなレベルなら、スクリプト入れてティラノフェス出すのもありだなーと思ってたんですが、何かもう完成さえすればいいかなという感じになっています。ほぼみっかの別日も進めたいですし、ウディコン作品もやりたいんですよね。やりたい気持ちが先走ってちょっと手をつけたりもしたのですが、いやこれは腰を据えてやりたいとやっぱり置いています。

小説書いてる時の難点がありまして、しっかりした長い文章を書く体力が残らないことです。長文感想を書きたいと思っても、小説書くだけでいっぱいいっぱいになってしまうというか。感想書きたい作品もあるので、何とか近いうちに完成させたいなあと思います。その後どうするかは未定です。終わればいいんだ終われば！

らっくがっき

JPEGとPNG、画像容量の話

フリゲを作る際に使う画像は、JPEGとPNGが多いのではないかと思います。後はGIFでしょうか。ブラウザ向けならSVGもあると思いますが、今回はおそらくメインであろう、JPEGとPNG画像の容量、その減らし方について書いてみたいと思います。

ただ容量を減らすと劣化する場合があるので、絶対にクオリティを優先するものや、そこまでして容量減らさなくておｋという場合は、特に気にしなくても良いと思います。逆に私のようにPC容量カツカツだったり回線が細くてアップロードが辛かったりする場合は、気にしておくとデータ管理が楽になるのではという感じです。
あと、UnityだとUnity側で独自の処理が入るので、それ用のアレをした方が軽量化できると思います。描画処理周りは未着手です。単純に容量のお話です。ではいきます。

まず、そもそもとして、

JPEGにするかPNGにするか問題

というのがあります。PNGは透過できるので、立ち絵やアイコンなんかはPNGじゃないといけませんが、一枚絵、CGイラストはどうするか。
私は基本的に、JPEGにしています。というのも、フルカラーPNGは綺麗なんですが、そのままだと画像容量がめっちゃ大きくなるので、扱いづらいからですね。でっかくて色数多いと一枚1MBいったりします。おお。

ただ、PNGは減色をすると、容量を減らせます。フルカラーではなくて、256色にするわけです。しかし、元々色数の多い画像を減色すると、なんかこう……色欠けてません……？ みたいな見かけになっちゃいます。
そして、ここがポイントなのですが、

• 減色したPNGより、品質85～90で出力したJPEGの方が、劣化しないし容量軽い

ということがままあります。これは私の経験則です。根拠は？と言われると、何かそんな感じ、としか言えないですが、ほぼみっかプラスのCGは、大体品質90JPEGなので、ご覧いただいた方は、そんな劣化してない感をお分かりいただけるのではないかと思います。

実際どんな見た目なのよ問題

折角なので、実演してみましょう。

これはほぼみっかプラスの清瀬君別日に入れた清瀬君画像です。今見るとなんかめっちゃ恥ずかしいですが、それは置いときまして、フルカラーPNG、減色PNG、品質100JPEG、品質95JPEG,品質90JPEG、品質85JPEG、品質80JEPGと左右の順で載せています。KB数も入れました。

いかがでしょう。ありすぎてわけ分からん感もありますが、減色PNGは色が欠けていて、品質90JPEGは普通にフルカラーPNGっぽいのではないでしょうか。これ80まで落としても、拡大しなければそんな劣化感もないですね。フルスクにしない場合は80でもいけるかもしれません。95・100はKB数増えた割に90と変わらない気もします。

JPEGの品質について、Googleは85を推奨しているようです。85より上げても容量増えるけど品質はそんな目に見えて上がらんよという感じですね。実際そんな感じがします。

　
画像を最適化する
https://developers.google.com/speed/docs/insights/OptimizeImages

これについてQiitaで検証されている方がいるので、こちらもご覧になってみてください。

　
Googleが薦める「Jpegの品質は85」を検証する
https://qiita.com/miyanaga/items/a616261de490cc342d0

私の経験だと、CGイラストはとりあえず品質90JPEGにしておくと、容量をそれなりに減らせる＋一つ一つどの程度劣化しているか確認しなくて済む、というあたりで、一番楽な感じです。注視しないor拡大しないイラストなどは、85か80で出力すると、クオリティと容量のバランスが取りやすいと思います。こうして見るとCGイラストも基本85でも大丈夫かもしれませんね。

PNG減色のお話

PNG画像の減色の話をしましたが、そもそも減色ってどうやるのか、というと、私はPNGooを使ってます（WindowsPCです）。

　
pngquant
https://pngquant.org

このサイトにあるやつですが、英語なので、下記の紹介ページがDL方法も使い方も分かりやすいと思います。

　
【画像軽量化！】PNG画像の軽量化ツールの決定版「PNGoo」の使い方
https://web-diy.jp/2017/01/170130_01/

色数多い一枚絵だと、減色すると何か色欠けてる感が出ることがありますが、小さい立ち絵やグラデ入らないアニメ塗り（色数少ない系画像）の場合は、そんな滅茶苦茶は差が出ないと思います。例をユウちゃんにお願いしましょう。

これは左が356KB、右が109KBです。

見比べるとちょっと瞳の色が減ってますが、画像がもっと小さくて色数少ないと、そこも保たれると思います。

減色することで、一枚で約250KBの差が出るのは大きいですね。差分が10枚になったりすれば、一枚約350KBだと全部で3.5MBになります。6人キャラがいると21MB。これを減色すると一枚約100KBで10枚が1MB、掛けることの6で6MBですから、15MBも削減できます。立ち絵だけで、かなりの削減量です。

ただ上にも書いた通り、色数多いと減色した時に明らかに減色した感が出るので、注意が必要です。

左がフルカラー420KB、右が減色90KB。300KB余り減りますが、これを減色するのはちょっと……となっちゃいますね。ここは綺麗に見せたい、という部分は、フルカラーでも良いと思います。

立ち絵の容量をもっと減らそうとする場合、体・眉・目・口等にパーツを分けて、合成と変更をゲーム側で行うのが一番ですが、これは画像自体がどうこうという話から逸れるので、置いときます。

また、色数少ないドット絵であっても、フルカラーのPNGで出力されてる場合、減色すると容量が減ります。

一枚だけだと微々たるものですが、ファイル数が多いと結構減るので、使ってる色数と相談しつつ、減色していくといい感じにコンパクトにできると思います。

画像ファイル減量系ツール・サービス

フリーソフト

• PNGoo：PNG減色圧倒的簡単さ
• Ralpha：色々一括で処理できる、個人的によく使う（窓の杜レビュー）
• Caesium：色々一括で処理できる（k本的に無料ソフト・フリーソフトレビュー）
• Voralent Antelope：色々一括で処理できる（窓の杜レビュー）
• Yukari：パッとアバウトにトリミング・リサイズしたい時便利

WEBサービス

• Tinypng：PNG減色
• jpegmini：JPEGの容量減らす

終わり！

とりあえずはそんな感じです。何か足すことあったら足します。

余談

画像周りで参考になりそうな記事。

• レスポンシブ画像について：https://developers.google.com/web/fundamentals/design-and-ux/responsive/images?hl=ja
• 画像のダウンロード サイズの縮小（Android）：https://developer.android.com/topic/performance/network-xfer?hl=ja
• グラフィカルコンテンツ（英語）：https://developers.google.com/web/fundamentals/performance/get-started/graphicalcontent-4?hl=ja
• 適切な画像形式（英語）：https://web.dev/choose-the-right-image-format/
• 正しい圧縮レベル（英語）：https://web.dev/compress-images/

英語記事そのままだと読めねえよ！となるので翻訳して読んでます。

可逆とか非可逆とかは自分の頭だと説明できないので、既に説明されているページを読むのが一番分かりやすいと思います。

ほぼみっかプラスのCGとかは、おまけ的なものも含めて183ファイルくらいで30MBくらいです（アバウト計測）。カメラ使う画像は1280*720よりサイズを大きくしていることもあるので、その割には結構軽くできてるんじゃないかと思います。
立ち絵は12人で7MBくらいです。表情多いのが10人くらいですかね。体・眉・目・口・照れ・汗でパーツ分けしてます。