一畳ちょっとの二人部屋

一畳ちょっとの二人部屋

創作や趣味のゲームの話

【ココフォリア】オンセ部屋デザインのネタ帳・キャラコマ置き場編【TRPG】

B!
LINE

f:id:entori:20210830040633p:plain

 オンラインセッションの部屋に配置するキャラクターコマ置き場のデザインでよくある基本的なものを色々と作ってみました。

 
 以前からPCコマの置き場を考えるのが苦手でそもそも置き場を作らないことも多かったのですが、基本的なやつだけでも一度勉強しておけば必要な時にスッと作れるようになるかな~と思いネタ帳として自分用のサンプルを作ってみたので公開します。
 こういうデザインが多い/少ないは完全に自分の体感なので気にしないでください。あと分類はフィーリング。
 コマ置き場だけでなく何かを置くエリアであれば応用がきくと思います。
スマホなどの小さい画面だと一部線の細いものが見づらいかもしれません。
 

ライン型

 単体の線描(+α)で構成されるものをここに分類しています。

横線

f:id:entori:20210830040846p:plain
 一番シンプルなパターン。とはいえ本当に横線のみだと単なる装飾に見えてしまうこともあるのでここが置き場だよ!と分かるように文字が書かれていることが多い気がします。

 

縦線

f:id:entori:20210830040902p:plain

 横よりは分かりやすいですが、やっぱり文字がついてたり、二重になってたりちょっとしたフラッグのようなアクセントがついてたりとデザインに一工夫あることが多いです。
 
 

斜め線

f:id:entori:20210830040916p:plain
 縦・横よりは線単体で使われているパターンを見ます。三角形や文字と組み合わせてみたり、四角形の四隅にテープを貼るような形で配置して置き場所を分かりやすくしているものも。

 
 

フレーム型

 主に四角形をベースにしてコマを囲む形のものをここに分類しています。
 

四角フレーム

f:id:entori:20210830041327p:plain

 四角に限らず丸、三角、その他さまざまな図形をシンプルな線描にしているもの多し。

 
 

後光フレーム

f:id:entori:20210830041349p:plain
 丸っぽいフレームの中でも特異的に多く見る(気がする)やつです。正方形コマ向けですがお洒落でなおかつシンプルにも豪華にもできるのがいいのかもしれない。

 このコマ置き場の勉強中に動く素材を作ったので以前作った別のやつと合わせてBOOTHで配布しています。無料素材ありますので↓こちらからどうぞ。

飾り枠

f:id:entori:20210830041359p:plain
 ちょっと手の込んだオシャレな形のやつ。シナリオのテーマに合った装飾がついている豪華なものをよく見ます。これは画面の雰囲気に合わなかったのでほぼ四角になっちゃいましたが。

 
 

途切れ+多角形フレーム

f:id:entori:20210830041409p:plain
 ひとつにまとめてしまいましたが、線の一部を途切れさせて抜け感を出したり角を斜めに切ったりしている四角形ベースのフレーム。

 
 

アングル

f:id:entori:20210830041423p:plain
 アングル=角のことです。四角形のうちの二辺だけ。これが並んでいるとまず装飾と間違うことはないので、純粋に線だけでデザインする場合に使える最もシンプルな形はこれになるのかもしれません。

 
 

隅の三角形

f:id:entori:20210830041435p:plain
 四隅に置く場合と対角に位置する二隅に置かれる場合とがあります。大きめで分かりやすければ一つだけの場合も(その場合は『隅』というより普通に三角形メインのデザインという感じはします)。

 
 

写真フレームなど

f:id:entori:20210830041445p:plain
 インスタント風の写真フレームや絵画の額縁、WANTEDポスター、スマホ画面などいろいろなバリエーションを見ます。お花のリースなんかもかわいいですね。

 

 

 

アイコン型

 どう呼ぶべきかよく分からないのですが、↓のような写真の切り抜きや単体のイラスト、アイコンなどをそのままポンと置いてコマ置き場の目印にしているものをここに分類しています。
 でもあまりいい例が作れなかったのでサンプルが1つしかない。
 

単体イラスト

f:id:entori:20210830041541p:plain
 花のイラストが多い気はするものの花をモチーフに使う人が多いだけかもしれない。

 

f:id:entori:20210830041553p:plain
 1パターンしか作れなかったのでかわりに背景違いバージョン。

 
 

地面/椅子型

 主に全身の立ち絵でコマ置き場に合わせて実際にその場に立っている(座っている)ように見せるデザインのものをここに分類しています。
 

波紋

f:id:entori:20210830041604p:plain
 波紋というか水面。全身立ち絵で足の位置を波紋の中心に合わせます。波紋動いてるやつお洒落でいいよね。そのうち素材作るかもしれない。

 →作りました。無料素材ありますので以下からどうぞ。

 素材が動いている様子はこんなかんじ↓

 
 

f:id:entori:20210830041616p:plain
 足元からのびる影が立ち位置の目印に置かれているパターン。次の項目との合わせ技で椅子の脚元から影が伸びてたりするのもよく見ます。

 
 

椅子

f:id:entori:20210830041625p:plain
 椅子とかソファーを置き場にしてるやつ。地面/椅子型のなかでは断トツに多い(体感)。なんならちゃんと座っているポーズの立ち絵を描いてる人もわりと見る気がします。すごいな皆。

 
 

カード型

 主に四角形で、フレーム型とは違いカードのようになっているものをここに分類しています。
 

半透明

f:id:entori:20210830041636p:plain
 シンプルかつ抜け感のある定番。

 
 

グラデーション

f:id:entori:20210830041648p:plain
 端の方が段々消えていくタイプ(つまり透明度がグラデーションする)と普通に色でグラデーションするものの2通り。色のグラデーションはその時々のwebデザインで流行ってるのと同じような色使いをよく見るのでそのへんの色見本から拾ってくるとうまく作れるかもしれない。

 このサンプルは半透明かつ透明度のグラデーション。透明度のグラデーションはトーンを砂で削ったようなざらっとした質感のものも多い気がします。
 
 

ストライプ(太)

f:id:entori:20210830041700p:plain

f:id:entori:20210830041713p:plain

 なぜか2色作った。

 言わずもがな非常に人気のあるデザインのひとつです。
 →このストライプがゆっくり動く素材も作りました。白はBOOTHで無料で入手できます。

 

ストライプ(細)

f:id:entori:20210830041723p:plain
 トーンっぽい。太いストライプが多くてこちらはあまり見ませんがかわいいと思います。トーンっぽい仲間で言うと水玉とかもあり。

 
 

シャドー

f:id:entori:20210830041734p:plain
 影の部分にだけ色がついているコマ置き場。ご覧のとおりちょっと浮き上がってくるような独特な見た目です。

 
 

半透明+枠

f:id:entori:20210830041751p:plain
 組み合わせのバリエーションでよく見るやつ。カード部分だけだと物足りない時は枠を重ねると定番のおしゃれ感がでる気がします。

 
 

テクスチャ

f:id:entori:20210830041801p:plain
 四角にテクスチャを貼りこんであるタイプ。自分で作るといい感じのテクスチャ探すのが難しいので紙とか石とか金属とか普段から使えそうなものをストックしておくとぱっと作りやすいかもしれない。紙は目の粗い素材を半透明にすると薄い和紙っぽくなってかわいいです。

 
 

写真

f:id:entori:20210830041812p:plain
 写真を四角形に切って並べるやつ。これもよく見ます。3人以上のシナリオでたくさん並んでいるとデザインのアクセント(というか面積によっては主役)になって華やかですね。

 
 

文字型

 文字のみ、あるいは文字を主体にしたデザインをここに分類しています。
 

名前(横書き)

f:id:entori:20210830041825p:plain
 PC○、HO○、あるいはPCの名前だけを書いておくタイプ。縦書きと比べてなぜか小さめのフォントサイズのものが多いような気がしますが自分も最初大きめで作ってやっぱダサいな……と思って小さくしたのでそういうことなのかもしれない。

 
 

名前(縦書き)

f:id:entori:20210830041837p:plain
 普通に縦書きの場合と縦中横の場合と両方あり。

 
 

名前+リボン

f:id:entori:20210830041847p:plain
 リボンあるいは名前枠。名前だけだと目立たないor寂しい時のバリエーション。

 
 

名前+データ

f:id:entori:20210830041858p:plain
 なんならデータのみとかも見たことありますがゲーム画面みたいになってちょっとかっこいいやつです。画面の情報量も増えるのでPCに合わせて作る余裕がある場合はやってみると楽しいかもしれない。

 
 

名前+イラスト

f:id:entori:20210830041914p:plain
 ワンポイントイラストが添えられてるだけの場合もあるんですが、背景と一体化したようなふんわり広範囲にわたるデザイン+名前というのをちょくちょく見かけてはいいな~と思ってたので真似してみた。

 
 

名前+事前配布ハンドアウトなど

f:id:entori:20210830041925p:plain
 このシナリオに事前配布ハンドアウトはないので雰囲気だけですが、こんな感じで色つきの四角を敷いて上に文章のせるやつよく見ますよね。黒を敷いてるのがほとんどな気はしますが有彩色もいい感じになります。

 
 

 
  あまり部屋に気合入れるタイプではないんですが人の部屋見るのは大好き。時間がある時はいい感じのやつを作れるように練習していきたいですね。

 

配布中無料素材など

 BOOTHでココフォリアのお部屋素材を配布しています(APNGが使えればココフォリア以外でも使えます)。長時間卓で画面を見続けていても疲れないように・素材を置いた部屋の雰囲気を壊さないようにじんわり動くものが中心です。
 一番よく使うベーシックなものはだいたい無料で、色違いなどのバリエーション部分が販売になっています。