
MN
クリスタで3Dを使ってみたけど操作がわからなくてあきらめたことがあります。
CLIP STUDIO PAINTでは、キャンバスに3D素材を配置して使うことができます。
しかし、
「3Dって便利そうだけど難しそうで結局使ってない」
「配置するとたくさんアイコンが出てくるけどよくわからない!」
「結局、3Dを理想の配置にするのに時間がかかってしまう」
「3Dを思うように動かせるようになって時短につなげたい!」
と悩んでいる方もいるのではないでしょうか?
筆者も3Dを使い始めた時、同じようにわからないことが多すぎて困っていました。
そこで今回は、クリスタでの3D追加方法から操作方法、できることなどをまとめた記事を公開します。
一度目を通すだけでも、「こういう風に動かすんだ」「こんなこともできるんだ」という足がかりになるはずです。見出しから知りたい部分だけ見てみるのもアリ!
操作していく中で出てきた悩みの解決方法なども記載していますので、ぜひ参考にして3Dを活用してみてくださいね!
クリスタの3Dをレイヤーに追加する方法
まず、3D素材どこにあるの?どうやって追加すればいいの?という場合は、こちらの項目を参考にしてみてください!
※そもそも3D素材を1ミリも触ったことがないという場合は、いったん現在の内容を保存しておくのがおすすめです。(PC等の環境やデータの大きさによってはソフトが落ちる可能性もあるため)
▼「素材(3D)」のタブはこれ(画像の赤い丸で囲んだ部分)です。こちらを見つけられたら、タッチします。

▼どこにあるかわからない、見当たらないという場合は、「ウインドウ」→「素材」→「素材(3D)」を選択すればOKです。

▼3D素材が一覧で出てきました。使いたい素材がない場合は、「ASSETSで素材を探す」から入手することもできます。

▼使いたい素材をタッチして、そのままレイヤーに持っていきます。

▼これで、3D素材が追加できました。

また、他サイトで取得した素材に関しても、フォルダから直接レイヤーにドラッグすれば配置することができます。
一方で、クリスタが対応していない拡張子だと配置できません。
ACON3Dなどで取得したskpファイルを使いたい場合は、以下の記事を参考にしてみてください!
3Dを追加したら固まった!動かない・フリーズする!という場合
いざクリスタのキャンバスに3Dを読み込もうとしたらソフトが動かなくなってしまった……!
サイズが大きいものでもないのに、クリスタがフリーズしてしまって困る!
という場合は、以下の記事を参考にしてみてください。
配置した3Dを操作するには【位置や形・大きさ】
3D素材を追加することができたら、次は向きや位置、大きさなどを変えて理想の配置にしたいですよね。
今回、かわいい猫の3D素材が目にとまったので、キャンバスに配置してみました。

茶トラ猫とともにたくさんのアイコンが表示されていますね。
(▼表示されない場合は、以下の画像のように「操作」→「オブジェクト」を選択した状態で3Dを配置したレイヤーを選択してください。)

▼もう一度画面を見てみると、猫の上下にずらりと並んだアイコンが……。

これじゃあ、何をどうしたら自分のしたい操作ができるのかわからんという人もいるのではないでしょうか。
そこで、こちらの項目では、3Dを配置する際の基本的な操作について説明します。
カメラ操作
せっかく猫を配置したからには、いろいろな角度から覗いてみたいですね。
では、カメラを操作してみましょう!
カメラ操作は、以下の赤丸部分をタッチしながらスライド操作することで可能です。

上記の画像を見ていただくと、このように、カメラ操作には3つのアイコンがあることがわかります。以下の項目で、各アイコンについて解説していきます。
それぞれの操作を組み合わせると、3Dを理想的なアングルに収めることができますよ!
①対象を中心に回り込む(回転)

①のカメラアイコンは、対象を中心に回転するような視点操作ができるメニューです。
正面のアングルではなく、上から横から見たアングルが欲しい時に便利。
▼このアイコンをタッチしながら(タッチしていると色が変わります)

▼スライドするとアングルを変えることができます。右に上にぐるんぐるん。


下から見る猫も実現可能
イメージとしては、3Dを球体に入れて、その上から沿うようにカメラを動かしているような感じです。
被写体を360度さまざまな方向からとらえることができます。

一方で、この操作だけでは、3Dオブジェクトの位置が思ったような場所にならないこともあります。
そこで、次の②の操作が役立ちます。
②カメラを上下左右に動かす

②のカメラアイコンをタッチしながらスライドすることで、視点を上下左右に動かすことができます。
中心ではなく、画面の端っこに3Dを表示させたいというときなどに便利ですね。


②は、①とは異なり、1枚のガラスに張り付いたカメラを上下左右に操作しているようなイメージです。
そのため、後ろや上に回り込むことはできませんが、3Dオブジェクトが見える位置を大きく変えることができます。

これで、①で3Dをどの角度から見たいか決めて、②でどの位置に置きたいか決めることができるようになりました!
③ズームアップ・ズームアウト(対象に近づく・離れる)

いい感じのアングルにできたけど、ちょっと3Dの位置が遠いな、逆にもっと近づけたいな、というときは、③のズーム機能を使います。
③のアイコンをタッチしながら、上下にスライドすることで、3Dをズームアップ・ズームアウトできます。
▼下にスライドするとズームアップ。近づけます。

▼上にスライドするとズームアウト。離れることができます。

このように、3つのカメラ操作では、3Dに対する視点の角度・位置・距離といったアングルを決めることができます。
3D素材(オブジェクト)の操作
カメラ操作アイコンの右側にある5つのアイコンが、オブジェクト操作機能です。
ちなみに、一番右側にある磁石アイコンのオン・オフによっては操作の挙動が変わるので注意。
オンになっていると、スナップするような感じで動きが制限されることがあります。

①3Dオブジェクトを上下左右に動かす
①のオブジェクト操作アイコンをタッチしながらスライドすると、3D素材をそのままの角度で上下左右に動かすことができます。


②3Dオブジェクトを360度回転させる
②のオブジェクト操作アイコンをタッチしながらスライドすると、3D素材をさまざまな向きに回転させることができます。
ただ、こちらの操作アイコンは少しクセがあり、タッチしてから最初にどの向きにスライドするかによって回転させられる角度に違いが出ます。
たとえば、アイコンをタッチしてから縦の方向にスライドさせると、以下のようにアイコンが赤くなり、操作できる方向が縦に固定されます。

▼一方、アイコンをタッチしてから横にスライドすると、アイコンが緑色になり、回転方向が横のみに固定されます。

▼縦でも横でもなく、斜めなどの方向にスライドすると、自由に回転させることができます。

③3Dオブジェクトを視点と平行に回転させる
③のオブジェクト操作アイコンをタッチしながらスライドすると、3D素材を視点と平行に回転させることができます。

④3Dオブジェクトを地面と平行に回転させる
④のオブジェクト操作アイコンをタッチしながらスライドすると、3D素材を地面と平行に回転させることができます。

⑤3Dオブジェクトを地面と平行に移動させる
⑤のオブジェクト操作アイコンをタッチしながらスライドすると、3D素材を地面と平行に移動させることができます。

パース定規による操作
3D素材を追加すると、同時にパース定規も作成されます。
こちらのパース定規を動かすことでも、3Dの素材を操作することができます。
パース定規は、該当の3D素材のレイヤーにある定規アイコンをクリックすると表示されます。

▼そして、オブジェクト操作状態でパース定規の線をタッチすると、操作可能な部分に目印が表示されます。

▼たとえば、以下のようにアイレベルを上にスライドさせると、3D素材の表示も変わります。

▼パース定規を非表示にしたくなったら、レイヤータブの定規マークのプルダウンを選択します。

▼チェックが入っている部分をタッチして、チェックを外すことでパース定規を非表示にできます。

地面に設置させる
3Dモデルをいろいろと操作していたら、地面から離れてしまった!
という場合に便利なのが、「モデルを床面に設置させる」機能です。
たとえば、以下の画像の猫は、現在地面から上方向に離れています。
そこで、赤い丸で囲んだアイコン(箱の上に下方向の矢印が刺さっている)をタッチ。

▼すると、地面にピッタリ落ち着きました。

その他にも、この操作バーには、回転のリセットや左右反転などの便利なメニューがあります。
ためしにいろいろとタッチしてみるのも面白いですよ!
複数の3D素材を同じレイヤーに設置する
同じレイヤーに複数の3D素材を設置すれば、たとえばテーブルの上にティーカップを乗せるといった動作が簡単にできます。パースも合っている状態で設置でき、カメラ操作もやりやすいです!
▼テーブルと同じレイヤーに設置したティーカップを操作している画面です。
右の磁石アイコンをオンにした状態でテーブルの面に接すると、オレンジの枠が表れてピタッと乗せることができました。

やり方は簡単で、もとある3Dのところへ同じレイヤーに配置したい3D素材をドラッグするだけです。
▼いろいろ乗せてみるのも楽しいですよ!すべて同じレイヤーに配置しています。

ただし、3Dの素材によっては同じレイヤーに配置できないこともあるため注意。
原因としては、バージョンによって3D間で仕様が異なる場合があるためです。
このような場合は、何度やっても別のレイヤーに配置されてしまうので、おとなしくそのまま調整するか、似たような違う素材を探してくるかの選択になると思います。
一部のオブジェクトを非表示にしたい・消したい場合【壁や天井など】
壁や天井など特定のオブジェクトを消したい場合は、リストから非表示にすることができます。
▼たとえば、このお部屋の壁を非表示にしたい場合。

▼非表示にしたいオブジェクトを選択して赤い状態にしたら、ツールプロパティの「3Dオブジェクト」の項目にあるプルダウンリストを開きます。
すると、選択したオブジェクトはリスト上でも色が変わっているので、どれを選ぶべきかわかりますね。
こちらの目のマークをクリックすることで、オブジェクトの表示・非表示を切り替え可能です。

▼目のマークをクリックして非表示にすると、壁がなくなりました。

それぞれのオブジェクトに分かりやすい名前がついている場合は、わざわざ非表示にしたいオブジェクトを選択しなくても、リストから直接非表示にすればOKです。
この方法は、非表示にしたいオブジェクトの名前がわからない場合に有効なので、覚えておいて損はないと思います。
複数のオブジェクトを選択するには
また、上記の3Dモデルではできなかったのですが、まとめて複数のオブジェクトを選択することができるものもあります。
▼たとえば、以下の3D素材は、Shiftキーを押しながらタッチすることで、複数の壁などを選択できます。

▼オブジェクトのリストを見ると、リスト上でも先ほどの2つの壁が選択されていることがわかります。あとは、目のマークをぽちぽちっとクリックすればOK!

▼2つの壁を非表示にすることができました!

一気に非表示にする方法がなさそう?なので、たくさん消したいオブジェクトがある場合は大変ですが、仕方ないですね。
動かせる3D素材の場合【ドアの開閉など・マテリアル】
3D素材の中には、ドアなどのパーツが動くものや、現在とは異なるレイアウトを選択できるものもあります。
たとえば、下の画像はカラオケルームの3D素材ですが、ドアが動きます。

じゃあどうやってドアを開くのかというと、以下のメニューを使います。
▼手の上にボールが乗っているようなアイコンが3つ並んでいるのがわかるでしょうか。

ドアを開く、など、動くパーツを操作するためには、上の画像でいう③のアイコン、「可動パーツのプリセットを選択」を選びます。
▼すると、以下のような操作バーが出現するので、これでドアの開き具合を調整できるのです。

▼操作バーを100にしてみたらドアが全開になりました。

可動パーツが設定されている場合は、このようにしてパーツを動かすことができます。
▼また、このカラオケルーム素材には②の「レイアウトのプリセット選択」もいくつか登録されており、たとえば天井抜きであったり、右側の壁がないバージョンなどといった異なるレイアウトを選択することもできます。

これなら、いちいち壁を選択して非表示にする必要もなく便利ですね!
また、カラオケルームにはありませんでしたが、①の「マテリアルのプリセット」に関しても登録されている素材がありましたので紹介します。
▼描画の用途に合わせられるよう、複数のマテリアルプリセットが登録されている椅子の素材です。

このように、異なるプリセットを選択することで目的に合わせて違うスタイルを使用できる素材もあるのですね!
オブジェクトの種類によっては異なるメニューが出てくる場合も
キャラクターなど、オブジェクトの種類によっては、マテリアルのプリセットではなく他のメニューが出てくる場合もあります。
たとえば、この猫の3Dの場合は、右下の方のメニューが異なりますね。

このような場合、メニューを選択することでキャラクターの見た目を変えられることもあります。
▼試しに、一番右のメニューを選択してみました。

▼すると、一覧が表示されました。こちらの3Dモデルでは、目をつぶっている表情も選択できるのですね!

地面を移動したい・斜めにしたい場合
視点や3Dモデルではなく、地面の角度をつけたい場合や、位置を移動したい時の操作について説明しています。
カメラ操作以外で地面の高さを移動したい時
現在のカメラアングルやオブジェクトの向きのまま地面の高さや位置を移動したい場合は、「レイヤー移動」で変更できます。

▼こちらの3Dを、「レイヤー移動」を選択した状態でタッチして上に移動させます。

▼3Dモデルと地面がキャンバス上部に移動しました。

地面を斜めにしたい時
3Dモデルではなく、地面自体を斜めにしたいという場合は、ロールの値を変えることで実現できます。
▼まず、オブジェクトのツールプロパティの、スパナアイコンを選択します。

▼編集画面が開くので、「カメラ」を選択します。
「ロール」のバーか数値を変更します。

▼ためしに変更してみると、地面が斜めになりました。
床面の線が出ていないので分かりづらいのですが、3Dのすぐ下に影があるのでそれでわかると思います。

このような機能をつかうことで、あえて斜めの角度にしたシーンなどを作ることができます。
他のコマにコピーした3D素材が見当たらない場合
たとえば漫画を描いていて、あるコマに使った3D素材を他のコマでも使いたい。という場面があったとします。
この時、3D素材のレイヤーは当然複製可能なのですが、違うコマレイヤーにそのコピーした3Dレイヤーを移動させても見当たらない!ということがありました。
▼2コマ目に「ぬこ」を複製したのに、いない……。

で、これはなぜかというと、コピーした3Dは該当のコマに追加されているのですが、位置が以前のコマのままだからです。
1コマ目の3Dと同じ位置にあるため、当然2コマ目からははみ出しているので見えないということですね。
このような場合は、画像のようにレイヤー移動などを使って、該当のコマ内に3Dを移動させればOK。

▼レイヤー移動でスーッと下にスライドする


これで、1コマ目と同様に3Dを複製することができました!
3Dの基本操作を使いこなして作業を効率化しよう
今回は、クリスタでの3Dの配置方法や、視点の操作などについて解説してみました!
いろいろと紹介してしまったので、思ったより長くなってしまいましたね。
実際にどのアイコンがどの操作を示すのか理解したうえで使ってみると、意外と簡単に操作できることがわかったのではないでしょうか。
まだいまいちコツがつかめないという人は、一度にすべて覚えようとするのではなく、ひとつずつ理解していくのがおすすめです!
無事に3D素材が配置出来たら、アタリとして使ってみたり、LT変換などで線画化したりできますよ!
LT変換のコツなどはこちらの記事から見ることができます。
また、こちらの記事で解説しきれなかったデッサン人形の操作や、そのほかの機能・トラブル解決に関する内容などは、今後別の記事として追加していく予定です!

ぜひ3Dを使いこなして、効率的に作業を進めていきましょう♪