パースを勉強していたら自分でツールを作ることになった【自作サイト紹介】

パースグリッドメーカー作成に至るまで

司書: 前崎

イラストを描き始めて2ヶ月が経ちました！最近はクロッキーだけでなく、キャラクターイラストにも挑戦しています。

今回は、天野こずえ先生の『ARIA』よりアリス・キャロルさんを描いて、背景もあわせて作画してみました。

【作品背景：ARIA】
西暦2300年代、火星はテラフォーミングによって水に満たされた惑星へと姿を変え、アクアと呼ばれるようになっていた。アクアではイタリアの都市・ヴェネツィアの風習や街並みを再現して築かれたネオ・ヴェネツィアと呼ばれる観光都市が存在していた。この街ではゴンドラを操って街中を案内する女性による観光案内業が行われており、この職業はウンディーネと呼ばれていた。ウンディーネに憧れを抱いていた惑星マンホーム（地球）出身の水無灯里は小さなゴンドラ観光会社・ARIAカンパニーへ入社する。灯里は老舗ゴンドラ観光会社・姫屋の跡取り娘である藍華・S・グランチェスタや、天才的な操舵技術を有するも接客を苦手とするアリス・キャロルといった、共に一人前のウンディーネを目指す友達をはじめとする様々な人たちとの出会いやそこで起こる様々な出来事を通じて、ウンディーネとして成長していくこととなる。
出典: フリー百科事典『ウィキペディア（Wikipedia）』

チノーくん

お疲れ様！一見するとすごく雰囲気が良くて素敵なイラストだね。

でも実は、描かれている2枚のイラストにはパース（遠近法）の違和感があることに気づいたかな？

左のイラスト（椅子と船）: 人物に対して椅子が小さすぎるのと、船の左右（右舷・左舷）でパースの向きがズレてしまっているね。服の広がりなど細部の解像感も少し不自然に見えるよ。

右のイラスト（キャラクターと背景）: キャラクターが「俯瞰（上から見下ろす視点）」で描かれているのに対して、背景のカメラは「人間の胸の高さ（水平に近い視点）」になっているんだ。結果として、キャラクターと背景の空間が噛み合っていない印象を与えてしまうね。

司書: 前崎

指摘されると、確かに気になってきました……！

でも、パースってすごく難しくありませんか？一点透視、二点透視、三点透視、魚眼など……理論が多くてどうしても苦手意識があります。

チノーくん

気持ちはすごくよく分かるよ！「理論通りに描かなきゃ」と考えると一気にハードルが上がるよね。

せっかくキャラクターが良い感じに描けたのに、背景を合わせたら違和感が出てしまうのは“イラストあるある”なんだ。

司書: 前崎

キャラクターと背景があるイラストって、どちらかを先に描いてから残りを描き足すことが多いですよね。

背景から先に描く場合は構図が決まっているからキャラクターも配置しやすいですが、キャラクターから描く場合は背景の難易度が跳ね上がる気がします。

チノーくん

「キャラクターから描くか？背景から描くか？」という問題だね。

背景を主役にする人は、最初のラフ段階で画面全体の構成を同時に考えていることが多いんだ。だからキャラクターと背景の視点がズレにくい。

司書: 前崎

そうですね。ですが、初心者だとキャラクターを描くだけでも精一杯で、最初から背景まで同時に考えるのはハード覚悟が必要です……。

チノーくん

大丈夫！最初からカンペキに計算して描ける人はいないからね。

まずは「俯瞰・あおり」「アイレベル」といった、簡単な考え方から一緒に整理してみよう！

俯瞰・あおり・アイレベルの基本

パースの「きつさ」と「ゆるさ」

パースがきつい（強遠近）:

グリッド線の傾きが急な状態。ダイナミックで力強い画面になるけれど、背景と人物を合わせる難易度は上がります。キャラクターを主役にして強調したい構図に向いています。

パースがゆるい（弱遠近）:

グリッド線の傾きが穏やかな状態。画面全体に調和が生まれ、キャラクターと背景が自然になじみやすくなります。空間全体を見せたい構図に向いています。

アイレベル・カメラの位置

アイレベル:

カメラの位置＝画面を撮影している人の「目の高さ」のこと。カメラを上下に傾けても、カメラ自体の高さが変わらない限りアイレベルは一定です。

地平線・水平線:

画面上で「地面がこれ以上先に見えなくなる境界線」。1点透視・2点透視でカメラを水平に向けている場合、アイレベル＝地平線と考えて問題ありません。

3点透視での注意点:

カメラを上下に大きく傾けると、垂直方向にも消失点が生まれます。厳密にはアイレベルと地平線の位置がズレてきますが、一般的なイラスト制作では「アイレベル＝画面のベースとなる高さ」と捉えておけば大丈夫です。

実際のイラストで確認してみよう

3点透視の参考例として、イラストレーター/バックグラウンドアーティストの吉田誠治さんの著作『TIPS!』から、学びになる誌面を紹介します。（※著者掲載許諾済み）

【ポイント】

箱の天板が見える＝カメラの位置（アイレベル）は箱の上にある（俯瞰）。
完全な理論値通りの3点透視だと縦方向の収束が急激になり、違和感が生まれる場合がある。
プロの技術として、縦方向の線をあえて「緩やか（消失点を遠く）」に設定することで、自然な空間を表現している。

司書: 前崎

なるほど！なんとなく空間の捉え方が見えてきました。さっそく先ほどのイラストを修正してみます！

チノーくん

うん！1枚目に比べて違和感がかなり減って自然になったね！背景もこの調子で合わせてみようか？

司書: 前崎

それが……今の構図だと、自分が表現したい背景のイメージにうまくハマらなくて。パースとは別の部分でも悩んでいるんです。

チノーくん

ふむふむ。それなら、構図作りをサポートするツールを自作してみたから使ってみて！

名付けて『パースグリッドメーカー（Perspective Grid Maker）』です！

Perspective Grid Maker – 3D & Fisheye Perspective Tool

👉パースグリッドメーカーを使ってみる（無料）

Perspective Grid Maker – 3D & Fisheye Perspective Tool

Professional 3D perspective and fisheye grid generator for illustrators, manga artists, and designers with multiple proj…

パースグリッドメーカー（Perspective Grid Maker）の紹介

基本的なカメラ操作

チノーくん

このツールは、3D空間でカメラを直感的に動かしながら、理想の構図やパースグリッドを素早く確認・作成できるWEBツールだよ。

マウスホイール回転: 画角（FOV / 焦点距離）の変更
左ドラッグ: 水平回転（パン）・俯角（チルト）の変更
右ドラッグ: カメラのXY移動（位置調整）

キャンバス・出力設定

最初に最終出力したい画像の「キャンバスサイズ（px）」を設定するのがおすすめ。下書き画像の読み込みや構図ガイドが合わせやすくなります。

下書き画像 (ラフ)の読み込み

自分の下書きラフを読み込み、それに合わせて3Dカメラを動かすことで正確なパース線を逆算できます。　　　　
既存の写真やイラストを読み込んで「どういうパース構造になっているか」の分析にも使えます。

投影方式・画角 (FOV)

直線パース（通常透視）

一点透視図法

水平回転と俯角を0°にして消失点を一つに固定します。お好みでカメラのX, Y, Z移動をします。

二点透視図法

俯角を0°にして消失点を二つに固定します。お好みで水平回転とカメラのX, Y, Z移動をします。

三点透視図法

俯瞰の場合は、俯角を＋側にスクロールします。あおりの場合は、俯角を－側にスクロールします。お好みで水平回転とカメラのX, Y, Z移動をします。

魚眼パース

等距離魚眼

・中心からの距離が、入射角に比例する。
・魚眼で最も基本的・均等な歪み。

立体射影魚眼(✨PRO版限定)

・球面上の形を比較的きれいに保つ。
・周辺に行くほど大きく引き伸ばされるので、魚眼らしい迫力が出ます。

正射影魚眼(✨PRO版限定)

・球を真上から影絵として写す。
・魚眼の中でも周辺が小さくなり、像がギュッと圧縮されやすいのが特徴。

等積魚眼(✨PRO版限定)

・面積を保つ。
・元の面積の比率 ≒ 投影後の面積の比率にする。その代わり、形はかなり歪むことになる。

画角（FOV）と焦点距離

チノーくん

イラスト制作で直感的に扱えるよう、フルサイズ一眼カメラ基準（36×24mm）の焦点距離（mm）で表示・設定できます。（初期値：直線パース 24mm / 魚眼 0mm）

更に詳しく知りたいという人は、Sonyのサイトにわかりやすい説明が書いてあるので、見てみて下さい。

f=\frac{D/2}{tan(θ/2)}​​

f：焦点距離（mm） $D$ ：センサーの対角サイズ（mm） $\theta$ ：対角FOV

フルサイズはセンサーが 36×24 mmなので、対角サイズは　

D=\sqrt{36^2+24^2}≈43.27(mm)

「÷2」はセンサーの中心から端までの距離を使うためですね。

焦点距離 | 撮影の基礎知識 | ソニー

空間・グリッド設定(一部機能✨PRO版限定)

グリッド機能	無料版	✨PRO版限定
床面グリッド (Y=0m)	○	○
アイレベル・XYZ空間軸・消失点放射線	○	○
天井グリッド (Y=3m)	ー	○
壁面グリッド (外周囲い)	ー	○
カスタム高さグリッド (-5m〜5m)	ー	○