VECTARYで3Dウェブサイトを作成する方法

ウェブサイトに目を引く3D要素を追加したいですか？それとも、素敵なウェブサイトやブログにユニークなヒーロー画像やヘッダー画像をお探しですか？YouTube動画と同じくらい簡単に埋め込める3Dオブジェクト全体を設置するのもおすすめです。

プロのグラフィックデザイナーである必要はありません。Vectaryの3D Studioを使えば、ウェブサイト用の3Dデザインを思い通りに作成できます。ライブラリから3Dオブジェクトをドラッグ＆ドロップし、ダブルクリックするだけで簡単にカスタマイズできます。

3Dウェブサイトを簡単に作成

この記事で学べること：

1. Vectaryで3Dヒーロー画像を作成する方法
2. Vectaryでパララックス3D要素を作成する方法
3. インタラクティブな3Dデザインをウェブサイトに追加する方法

1. Vectaryで3Dヒーロー画像を作成する方法

1. Vectaryを開きます。オンラインで利用可能です。
2. ライブラリからオブジェクトをドラッグ＆ドロップするか、独自の3Dファイルをインポートするか、あるいはゼロから独自の3Dデザインを作成します。
3. マテリアル、ライト、スタイルを調整し、テキストや背景を追加します。
4. デザインをリアルタイムでレンダリングします。
5. 3Dデザインを保存し、PNGファイルとしてエクスポートします。

2. ウェブサイト用の3D要素を作成する方法

パララックスの3D要素は、現在のウェブデザインで非常にトレンドになっています。ウェブサイトに最適な雰囲気をもたらしてくれます。例として、こちらの受賞歴のある Niikaによるデザイン をご覧ください：

3D要素を静的なPNGファイルとしてエクスポートしてFramerなどのウェブエディターでアニメーションを追加することも、インタラクティブな3D埋め込みとしてエクスポートすることもできます。Vectaryの Vectary 「Publish」設定から行うことができます。

Vectaryの3D要素を使ってパララックスウェブサイトを作成する方法

お使いのウェブプラットフォームに応じて、以下のリソースをご活用ください：

Wix：マルチレイヤーのパララックスウェブサイトを作成する方法

Squarespace：パララックススクロール

Weebly：Weeblyサイトで動くパララックスバナーを作成する方法

Wordpress：パララックススクロール

3. インタラクティブな3Dデザインをウェブサイトに追加する方法

Vectaryでは、YouTube動画と同じくらい簡単に3Dデザインをウェブサイトに埋め込めます。iPhoneやAndroidでサポートされているAR（拡張現実）機能により、サイト訪問者は3Dデザインを回転・ズームしたり、実世界に配置して確認したりできます。

1. Vectaryを開きます（オンラインで利用可能）。
2. 3DファイルをVectaryにインポートするか（60種類以上のファイル形式に対応）、ゼロから独自の3Dデザインを作成します。
3. 「Publish」タブに移動し、「Generate」ボタンをクリックします。
4. iframeの埋め込みコードをコピーして、ウェブサイトのエディターに貼り付けます。
5. デザインはいつでも変更でき、埋め込みコードを再生成できます。変更したデザインは、すべてのウェブ埋め込みに自動的に反映されます。

Vectary Viewerの詳細はこちら

3D/ARビューワーの例

iPhoneのSafari、またはAndroidのChromeでこのサイトを開き、ARバッジをクリックしてください。

https://www.vectary.com/embed/viewer/v1/viewer.html?model=fcd1e6c3-100f-4f80-93cf-ea6905a1298e&env=studio1&envRotation=0&autoplay=1&turntable=0.5&showPreloader=1

Vectaryの3Dデザインエディターで実現できること

3Dバナーやヘッダー画像でグラフィックデザインのポートフォリオを強化

遊び心のある3Dシェイプは、広告における次のビジュアルトレンドです。オンライン3Dツールで作成した美しいビジュアルで、グラフィックデザイン of ポートフォリオを常に最新に保ち、クライアントを惹きつけましょう。

同僚やクライアントと3Dデザインを共同制作

同僚やクライアントとデザインを共有して、一緒に作り上げましょう。ある人は3Dモデルの作業、別の人はオブジェクトの調整、さらに他の人はコメントの追加など、同時に作業を進められます。Vectaryの3D Studioは、クリエイティブなチームワークを強力にサポートします。

Google Fontsを使用して魅力的な3Dタイポグラフィを作成

Vectaryは、Google Fontsライブラリから1,200種類以上のフォントを導入した初のオンライン3Dツールです。お気に入りのGoogleフォントを選択し、ワンクリックで3Dに変換できます。さらにカスタマイズしたい場合は、ダブルクリックしてVectaryの編集モードに入り、他の強力な3Dモデリングツールをご利用ください。

他のツールで3Dデザインを仕上げる

3D画像をPNGとして簡単にエクスポートし、お好みのグラフィックデザインツールでプロジェクトを仕上げたり Photoshop および Canva、あるいは次のような他のウェブデザインプラットフォームで作業を続けることも可能です： Wix, Wordpress または やWeebly。可能性は無限大です！

FAQ

ウェブサイト用の3Dデザインを作成するために、Vectaryをダウンロードするにはどうすればよいですか？

VECTARYの3D画像作成ツールはオンラインで動作するため、ダウンロードは一切不要です。Chrome、Firefox、Safariなど、すべてのモダンなブラウザで動作します。新規登録またはログインするだけで、すぐに作成を開始できます。

作成した3Dデザインはどのようにダウンロードできますか？

左上のメニューをクリックし、「Project」にカーソルを合わせます。次に、「Export as image」をクリックして3DデザインをPNGファイルとしてダウンロードするか、さまざまな他の3Dフォーマット（3Dプリント用STL/OBJ、汎用3DフォーマットglTF、Sketchup/建築用DAE、あるいはKaydaraが開発し、次の企業が保有する独自フォーマットFBXなど）から選択できます： Autodesk.)