作った3Dモデルをたくさんの人に見てもらいたい。ブログに組み込みたい。クライアントとイメージを共有するため同じ3Dモデルを見ながら打ち合わせがしたいなど、これらの要望をすべて叶えてくれるのがSketchfabです。
ウェブでカスタマイズができる3Dビューワーの開発を承ります！
ウェブ上で、3Dモデルの色変えができるシミュレータの開発を承っております。お気軽にご相談くださいませ！
Sketchfabとは？
今回ご紹介する3D viewerのSketchfabは、web上で簡単に3Dモデルを公開、共有、配信、閲覧、さらには3Dプリントまで行うことができる無料のウェブサービスです。特徴をまとめます。
- 3Dモデルを公開できる
- 3Dモデルがwebで閲覧できるのでソフトのインストールが不要
- 3Dモデルを共有できる
- 3Dモデルのダウンロードを許可できる
- パスワードをかけ閲覧制限がかけられる（有料）
- ライトニングなどの設定ができる
- ブログやSNSに埋め込みができる
- 3DモデルをVRモード（2眼）で閲覧できる
- ARコンテンツとして利用できる（β版）
- アニメーションをつけた3Dモデルも公開できる
- 注釈をつけることができる
- VRモードで閲覧できる（編集も可能！）
これだけの機能がすべてwebで完結する3DviewerがSketchfabです。非常に便利なサービスですので、ぜひとも使い方をマスターして、日常の創作活動やビジネスに活用していただければと存じます。
それでは早速基本的な使い方から見ていきましょう。
1.Sketchfabの使い方（基本編）
1-1.sketchfabのアカウントを作成する
sketchfabに3Dモデルを掲載するまでの流れを見ていきましょう。
まずサイトへ移動し、アカウントを作成します。画面右上にある「SIGN UP」をクリックして登録を済ませます。（FacebookなどSNSのアカウントでも可能です）
アカウント作成が完了したら次はアップロードです。
1-2.3Dモデルをアップする
ログイン後、管理画面が表示されますので画面右上にある「UPLOAD」をクリックして、アップロード画面を開きます。
アップロード画面が開きますのでファイルを選択します。
3Dモデルの対応形式はこちら。
- 3DC point cloud (.3dc)
- 3DS (.3ds)
- ac3d (.ac)
- ASCII (.asc)
- Biovision Hierarchy (.bvh)
- Blender (.blend)
- Carbon Graphics Inc (.geo)
- Collada (.dae)
- Design Web Format (.dwf)
- Designer Workbench (.dw)
- DirectX (.x)
- FBX (.fbx)
- Generic Tagged Arrays (.gta)
- Kerbal Space Program (.mu)
- Keyhole Markup Language (.kmz)
- Lightwave (.lwo .lws)
- Open Flight (.flt)
- Open Inventor (.iv)
- OpenSceneGraph (.osg .osgt .osgb .ive)
- Polygon File Format (.ply)
- Shape (.shp)
- Standard Tessellation Language (.stl)
- Valve (.vpk)
- Virtual Reality Modeling Language – VRML (.wrl, .wrz)
- Wavefront (.obj)
ファイルを選択後、ファイルの中身を確認されますので、「Continue」をクリックして先へ進みます。
ファイルのアップロードが完了すると掲載内容を記入するフォームが表示されますので入力します。（内容は後からでも変更することができます）
- Model name：3Dモデルのタイトル
- Description：3Dモデルについての説明
- Categories：カテゴリー
- Tags：タグ（コンマで区切りを入れ複数入力ができます）
- Private mode：限定公開（有料プランのみ）
- Allow Download：ダウンロードの許可（Yesにすると3Dモデルがダウンロードできるようになります）
入力が完了したら「Continue」をクリックし、先へ進みます。
サイトへの掲載処理が開始されます。
完了後、プレビュー画面が表示されますので、すぐに公開する場合は「Publish Anyway」をクリックします。問題がある場合は「Edit 3D Setting」をクリックします。
- Edit 3D Settingの方法についてはページ下部にて解説しています
これで3Dモデルの公開は完了です。
それぞれのボタンについてはこちらをご参照ください。
- Embed：埋め込みコードを発行
- Share：ページの短縮リンク発行、ソーシャルボタン表示
- Like：3Dモデルに対して評価ができる
- Setting：3Dモデルの各種設定（後ほど詳しく解説します）
1-3.3Dモデルをブログに埋め込む
作成した3Dモデルをサイトやブログに埋め込んでユーザーやお客様に見ていただきたい。そんな時に使うのが「Embed」です。Youtubeと同様の手順となりますが、見ていきましょう。
3Dモデルが表示されている画面で「Embed」をクリックします。
埋め込みコードが表示されますので、すべてコピーします。
コードを表示したい箇所に貼り付ければ完了です。
下記の数字を変更することで表示サイズが変えられます。
- width：横幅（例：500px , 100%）
- height：高さ（例：300px）
実際に貼り付けたものがこちら（width：100%、height：380px）
Ahirusantexture
by 3dwave
on Sketchfab
1-4 : 3Dモデルをシェアする
掲載した3Dモデルのページをシェアします。Embedの隣にある「Share」をクリックするとページにアクセスするための短縮URLが発行されます。
注意点として、誰かにページのURLを教える場合は、短縮URLを教えないとページが表示されないケースが確認できておりますので、ページのURLをメールなどで送信する場合は必ず短縮URLを記載するようにしてください。
2.3Dモデルの設定を変更する
sketchfabではweb上で3Dモデルの表示設定を変更することができますので、早速内容を確認していきましょう。
2-1.設定ページへ移動する
3DモデルのページからSettingにカーソルを合わせ、「3D Setting」をクリックます。
2-2.向きを変更する
画面左のX,Y,Zをクリックすることで、それぞれの軸を中心に向きを変えることができます。
- Show advanced rotation：より自由に向きを変えられるようになります
- Straighten model：元の向きに戻します
- Camera Field Of View : カメラの向きを変えられます
2-4.影の設定
Shadingを変更することで影を変えることができます。
- Lit：通常
- Shadeless：影なし
左がLit、右がShadelessです。
2-5. 背景を変更する
3Dモデルの背景を設定することができます。
画面左にある「Fixed Background」を設定します。
- ONの場合：背景に写真を使用します
- OFFの場合：背景に写真を使用しません
今回は背景に写真を使用するケースを想定して解説していきます。
Fixed BackgrondをONにしたら、Ligtningのアイコンをクリックします。
Lightningのページで背景写真が変更できます。
それぞれのタブについて見ていきます。
このタブをクリックすることで写真を変更できます。
写真が変更できたら設定を決めていきます。
- Orientation：背景の角度を設定
- Brightness：背景の明るさを設定
- Blur：ぼやけ加減を設定
背景を変更したイメージがこちら。
有料のProプランに加入すると背景写真に自分の好きな画像を設定できるようになります。
2-6.ライトニングの設定
先ほどのLightningのアイコンをクリックしたページでライトの設定が行えます。
ライトニングを設定する場合は「Light」をONにします。
それぞれのライトをクリックすることで照射の向きや範囲、ライトの色などを設定することができます。
2-7.3Dモデルに訳注を入れる
Sketchfabでは3Dモデルに訳注を入れ、詳細を解説することができる機能があります。まずはメニューのAnnotationアイコンをクリックします。
次に訳注を入れたい箇所をダブルクリックします。
記入フォームが表示されますので、タイトルと内容を記入します。
最後に、訳注がクリックされた時のカメラのアングルを決定します。
画面左の訳注の番号を選択し、3Dビューを動かしてアングルを変更します。
アングルが決定したらメニューにあるカメラのアイコンを選択します。
これで訳注がクリックされた時のアングルが設定されました。
実際に作成された訳注がこちらになります。
Kitty55 by 3dwave on Sketchfab
3.3DモデルをVRモードで閲覧する
掲載した3DモデルはGoogle CardboardなどのHMDで閲覧できるようになっています。
閲覧の方法は以前ご紹介したこちらの記事をご参照ください。
4.3DモデルをARで楽しむ
Sketchfabは掲載した3DモデルをARとして楽しめるようにするための開発が進められており、現在のところテストバージョンを試すことができます。
やり方は以前ご紹介したこちらのページをご参加ください。
さいごに
いかがでしたでしょうか。高機能で無料、さらにはwebですべて完結してしまう3D ViewerのSketchfabに関する使い方をひと通りご紹介いたしました。
クライアントに3Dモデルを確認していただく際、3Dビューのソフトが必要になるケースが多く、閲覧のためにソフトをインストールしなければならない手間が発生していましたが、sketchfabであればインターネットの環境さえあればスマホからでもアクセスできるので非常に便利です。
これからも進化を続けていくであろうSketchfab。使い方をマスターして役立てていきたいですね！
NEW : Sketchfabでオリジナルウェブサイトが作れる
Sketchfab APIを使用することで、ウェブサイトで3Dを使ったカスタマイズページや3Dカタログのページが簡単に作成できるようになりました。これまでのウェブサイトとは違うリッチな表現ができるようになっています！
ウェブでカスタマイズができる3Dビューワーの開発を承ります！
[…] Webで完結！無料で使える3D viewer「sketchfab」の使い方 […]