アップロードする画像のサイズについて(随時追記予定)

f:id:gridrooms:20210130171110p:plainPhoto by Andrea Piacquadio from Pexels

グリッドルームズオンラインにアップロードする画像についてのルールを書きます。

前提として:
解像度(画像の大きさ)は小さい方がいいです。
ファイル容量も小さい方がいいです。
美しさも正義だけど・・・
小さいは正義です!

最初に、3行でまとめると

  1. 通常のアイテムや家具、パーツの大きさは320px x 320pxを基準にする。
  2. 大きさは4の倍数にする(64px, 128px, 320pxなど)
  3. イコン画像は128pxを基準とする

となります。320pxというのは基準ですから、もちろんものによっては大きい画像でも良いでしょう。以下に詳しい説明とルールを書きます。

  • ファイル形式はPNGのみOK(透過PNGの場合は出力に24bitを選びましょう。)
  • ファイルの容量は最大で250KBまで。
    • ファイル容量と画像のサイズは別物ですが、容量も小さければ小さいほどダウンロードする負荷が下がりますのでゲームが軽くなります。
    • しかし、小さくすればするほどディテールが下がりますので、ぼやけの原因になります。作りながらバランスを探すのが良いです。
    • ファイルの圧縮は大事です。圧縮すると画質を買えずにファイル容量が下がります。
    • 圧縮におすすめのアプリは、フォトショップであれば「Web用に書き出し」オプションを使うことですが、フォトショップがない方は、以下の記事の工程4を見てください。

 

  • 画像のサイズについて(解像度のこと、320pxとか)

    • ファイル容量とは別です、画像の大きさのことを言います。
    • 画面上で見える大きさにもよりますが、ズームインしたときのボヤケとの戦いでもありますし、ものによってケースバイケースにサイズを決める必要があります。
    • アバターアイテムや家具などの1キャラ分以下のサイズなら、一つの基準として320px * 320xを目安にすると良いでしょう。
    • 例えば、キャラのてに持たせる野球のボールを作る場合、ズームインしても大きなサイズにはなりませんし、画面で占める割合はとても小さいです。なのでこの場合は、ボヤケやディテールとの関係もありますが、64pxとか128pxでも十分でしょう。
    • 4の倍数のピクセル数にする。4の倍数のサイズにしておくと、低画質モードが実装される際に、画像が歪んだり変化することを防げます。(4の倍数が良いのです!)例えば、4px, 8px, 16px, 24px, 32px, 64px, 128px, 256px, 320px, 512px, 1024pxなどです。4の倍数に画像のサイズをしておくと、後々歪みが出ません。
    • 基準値を320pxとしておすすめしていますが、目や髪の毛など、ズームインしてよく見たいアイテムのとき、ズームインしたときにボヤケてほしくない、などのときは512pxにしたり、800pxや1024pxなど、拡大して調節します。大きくするとその分負荷が上がり、ゲームが落ちやすくなったり、重くなったりするのでご注意ください。個人的には目や髪の毛は、ディテール次第ですが、1024pxでも良いかなとは思います。重要だしズームインしたいし・・・。
    • 逆に、鼻、口、眉毛、などの小さなものでディテールのもとから少ないものなどは64pxや128pxなど、へたすると鼻なんかだと32pxなんかでも十分かもしれません。その分負荷が減りますのでゲームが軽くなります。^^
    • 眉毛など、ながぼそいものを作るときは、1辺が512pxでも、もう1辺が256pxなどであれば、実際に正方形にして考えると512px x 512pxの半分ということになるので、実際にはメモリは半分しか取りません。なので、1辺が長いときは、1辺を短くすることで、ディテールを保ちながら大きさを小さくできます。
    • 例としては、眉毛なら800x240くらいで、十分なディテールを出せると思います。目なら1024x512くらいでしょうか。
    • もちろん、これらはケースバイケースですし、どのような形の目や眉毛を作るかにもよりますので、色々試してみてください。
    • アイテムをアップロードするときに使うアイコン画像は、持ち物やショップに並べるときの参考画像ですので、小さくて大丈夫です。基準値を128px x 128pxにすることをおすすめします。
  • 画像の解像度とメモリの関係について
    • 仮に画像の解像度が2000px * 2000pxだったとしましょう、そうすると1pxごとのメモリ使用は、赤、青、緑、透過値と4種類のデータを使わないといけないので4バイトになります。2000x2000個のピクセルがあるので、画像1枚につき、4,000,000 ピクセル * 4バイトとなり、1枚で16MBのメモリを使用することになります。
    • もし、これが服のパーツで、一人10枚身につけていたら、一人部屋に入るたびに160MBものメモリーが増えることになります。10人はいったらそれだけで1.6GBですね^w^;
    • なので、画像はできるだけ小さくするようにしましょう、もちろんディテールとの相談の上で、ですよ!
  • その他思いついたら追記していきます。

 

それでは皆さん、上記のことに注意をしながらも、あくまで目安程度にかんがえてください。

そこまでギチギチに縛られる必要もないので、適度に快適で楽しいグリッドライフを楽しみましょう!\(^o^)/