漫画・クリスタでのLINE風トーク画面の作り方

トークメーカーは、もともと漫画にトーク画面を入れるために作ったツールです。モノクロ（漫画用2値）で書き出せて、CLIP STUDIO PAINT にレイヤーが分かれたまま渡せます。ここでは、原稿のコマにLINE風トーク画面を貼り込むまでの流れをまとめます。

1. モノクロ（漫画用）モードにする

画面上部の配色を モノクロ(漫画用) に切り替えます。カラーの色味を白黒に変換するのではなく、最初から漫画原稿向けに設計された白黒の配色に切り替わります。ベタになる部分、線になる部分、トーンにする部分が最初から分かれているのがポイントです。

自分の吹き出しの塗り

「チャット設定」の モノクロ時 自分の吹き出しの塗り で2種類から選べます。

• グレー（クリスタでトーン化しやすい） — あとから任意の%の網点に変えられます。相手と自分の差が付きやすい選択です。
• 白（縁のみ） — 塗らずに輪郭線だけ。絵の情報量を増やしたくないコマ向き。

線画を2値のまま出すかどうか

「チャット設定」の 線画の書き出し（PSD） で決めます。

• モノクロ2値（印刷向け・既定） — アンチエイリアスなし。線・ベタ・文字がぴったり黒か白のどちらかになるので、印刷原稿にそのまま使えます。
• グレー（Web・Kindle向け／アンチエイリアス） — 中間調を残します。画面で読ませる作品や、大きく縮小して使う場合はこちら。

2. コマに合わせる（原稿を重ねる）

「コマ合わせ（原稿を重ねる）」を使うと、実際のコマの上にトーク画面を重ねながらサイズと角度を確かめられます。

1. トーク画面を入れたいコマのあたりを画面キャプチャします。クリスタから書き出す必要はなく、範囲スクショで十分です。
2. その画像をプレビューに直接ドラッグ＆ドロップします（⌘/Ctrl+V の貼り付けでも読み込めます）。
3. 重なった状態のまま、吹き出しの数や文字量を調整します。

重ねた原稿は書き出しには写り込みません。あくまで確認用の下敷きです。

3. レイヤー分けPSDで書き出す

右上の ▾ から「PSD（クリスタ用レイヤー分け）」を選びます。中身はカラーとモノクロで構成が変わります。

モノクロ（漫画用）のレイヤー構成

この5枚は、会話名（ヘッダーのタイトル、なければ相手の名前）を付けたレイヤーフォルダにまとめて入ります。原稿ファイルに読み込んでも他のレイヤーと混ざりません。

カラーのレイヤー構成

トーンレイヤーの使い方

モノクロで書き出すと、中間色は独立した「トーン」レイヤーにグレーのまま出ます。クリスタでこのレイヤーを選び、レイヤープロパティでトーンをオンにすれば、任意の線数・濃度の網点に変換できます。作品のトーン設定に合わせられるよう、あえて網点に焼かずグレーで渡しています。

解像度を選ぶ

▾ の中の「解像度」で 1x(1080px)／2x(2160px)／3x(3240px)／4x(4320px) を選びます。ここでの数字は横幅のピクセル数です。600dpiの同人・商業原稿でスマホ画面を大きめのコマに入れるなら 3x か 4x、コマの一部に小さく入れるなら 2x でも足ります。原稿上での実寸に近い大きさを選ぶと、拡大縮小による線の劣化を避けられます。

4. 線画SVG（ベクター）で書き出す

吹き出しなどの輪郭だけをベクターで書き出す方法もあります。▾ →「線画SVG（ベクター）」。

1. クリスタで［ファイル → 読み込み → ベクター］を選び、書き出したSVGを指定します。
2. 読み込んだレイヤーを選び、レイヤーの「表現色」を〈モノクロ〉に 変更します。これでアンチエイリアスのない2値になります。

忘れないよう、書き出したSVGのレイヤー名自体に指示が入っています（例：「線画・表現色をモノクロに」）。「線画の書き出し」をグレーにしてある場合は、そのままでOKという名前になります。

ベクターなので、読み込んだあとで拡大縮小しても線がぼやけません。コマに入れる大きさを後から変えたい、線の太さをクリスタ側で調整したい、という場合はSVGのほうが扱いやすいことがあります。ただしSVGに入るのは線だけで、ベタ塗り（電池残量やホームバーなど）は含まれません。ベタも要る場合はPSDと併用してください。

5. クリスタで原稿に貼り込む

1. PSDを開く（またはSVGを読み込む）と、レイヤーが分かれた状態で入ります。
2. フォルダごと選択して原稿ファイルにコピー＆ペーストするか、［ファイル → 読み込み → 画像］で配置します。
3. コマの枠に合わせて位置と大きさを調整します。2値で書き出している場合は、拡大縮小の補間方法に注意してください。大きく変倍するなら、あらためて近い解像度で書き出し直すほうがきれいです。
4. 不要なレイヤー（ステータスバーが要らない、背景を透過にしたい等）は非表示にするだけで調整できます。
5. トーンレイヤーは、貼ってから作品の網点設定に合わせて変換します。

コマに直接重ねたいときは「アイコン+吹き出し」モード

スマホの画面枠ごと入れるのではなく、アイコンと吹き出しだけを絵の上に浮かせたいことがあります。上部の表示モードを アイコン+吹き出し にすると、画面枠がなくなり背景が透過した状態で書き出せます。日付・時刻を出すかどうかも切り替えられます。

文字を自分で打ち直したいとき

書き出したPSDの文字はレイヤーが分かれてはいるものの、画像として入っています（テキストオブジェクトではありません）。台詞をクリスタ側で打ち直したい、写植の都合で全部テキストレイヤーにしたい、という場合は次のようにします。

1. トークメーカー側では、本文を空にした状態（吹き出しだけ）で書き出します。
2. クリスタのテキストツールで、吹き出しの中に文字を打ちます。

このとき、トークメーカーの見た目に近づけたい方向けの推奨設定は次のとおりです（クリスタのテキストツール側の設定です）。

サイズ15は目安です。原稿の解像度や、コマに対してスマホ画面をどれくらいの大きさで入れるかによって変わるので、まずこの比率で置いてから全体を拡大縮小するとバランスが崩れません。

絵文字の扱い

絵文字はセット（Noto／OpenMoji）で統一されます。モノクロのときは輪郭を「線画」レイヤー、面を白抜きにして「トーン」レイヤーに敷くので、原稿の中で浮かず、トーン化もしやすくなっています。カラー絵文字がモノクロ原稿の中で真っ黒に潰れる、という事故が起きません。

データは外に出ません

ネームや原稿のスクショを読み込んでも、それが外部に送られることはありません。画像の生成も、重ねた原稿の処理も、すべてお使いの端末内（ブラウザ）で完結します。未発表の原稿を下敷きにしても安全です。

関連ページ

• 使い方ガイド（基本操作）会話の入力、画面の調整、書き出しまで。まずはこちらから。
• インスタ風DM画像の作り方インスタ風モードの違い。DMのシーンを描くときに。
• よくある質問書き出せる形式、解像度、対応端末など。