3DデザインツールSpline使ってみた

--

web用の3Dデザインを作れるツールSplineを使ってみました👏🏻
以前はベータ版が配布されていましたが、現在はPreview Releaseという状態みたいで、基本的に無料で使うことができます。

UIと使い心地

3DのモデリングツールというとBlenderなどがありますが、機能が多すぎるが故に使い慣れるのにものすごく時間を要します…

今回使ってみたSplineは、UIがすごくシンプルなのが特徴です。
FigmaやsketchなどのUIデザインツールライクな見た目でとても親しみがあり、使い心地もシンプルです。

SplineのUI。左右にペインがありFigmaなどと似ている。

できること

種類は多くありませんが、他の3Dモデリングツール同様にマテリアルを変えたり、ライティングをいじったり、ベベルをつけてみたりと様々なことができます。
ショートカットを暗記しなくても右のペインから数値やバーを変更するだけなので割と簡単。

そしてSplineの特徴としてはRenderがないこと! いろいろ変更を加えて、Playボタンを押せばすぐにプレビュー状態となります。(Renderが無い分?操作が重くなりがちな気はする…)

そして、もう一つの特徴としては、作ったモデルに対してインタラクティブなアニメーションをとても簡単に設定できることです!

このようにホバーに対してのアニメーションをつけたり

ベイビーヨーダの頭をマウスホバーすると目を瞑るようにしてみた。かわいい

クリックでインタラクションも設定できます。

これはデフォルトのライブラリにあるノート(こんなこともできる..!)

Splineのwebサイト自体も浮遊している3Dモデルを触って動かすことができます。

Splineで生成したコードを埋め込んでいるのだろう💭

Exportが豊富でかんたん

ExportのセクションからWeb contentsやImage、Videoなど様々なものに簡単にExportすることができます。

Public URLを選択するとSplineのURLが生成され、ブラウザ上で作成した3Dモデルを触ることができます。またembed用のコード(iframe)も合わせて生成されるのでそのまま簡単にwebに取り込むこともできます!

またWeb contentを選択するとhtmlやjsでも書き出してくれるので、こちらもまた簡単にwebに取り込むことができます。
(Videoはproプランじゃないとダメでした)

さらっと触った感じ、Splineの主な特徴はこんな感じ。

  • UIデザインツールライクなUIで操作がしやすい
  • Renderをかえさずプレビュー状態でモデリングができる
  • 簡単にインタラクティブなアニメーションをつけられる
  • Exportsが簡単でwebに取り込みやすい

操作が簡単な分、blenderなどと比べるとできることが少なさそうですが、とりあえず簡単な形のものを3Dモデリングしてみたい方にはとても良さそう。(まだプレリリースなのでアップデートもこれからどんどんされていきそう)

Founderの方がYoutubeでチュートリアル動画をあげているので、ベーシックな操作はそこから学ぶことができます!

次は、同じく3Dデザインツールのvectaryを試してみよう💭

--

--