しょぼちむを使ったお手軽WebGL体験

テーマ:
当記事は しょぼちむ Advent Calendar 2014  4 日目の記事です。

■しょぼちむとは?

画像検索「しょぼちむ」で検索すると以下のような画像が出てきます。

しょぼちむ画像検索

おわかりいただけただろうか


■しょぼちむアイコン

しょぼアイコン
この強烈なしょぼちむアイコン。
今回このイメージを元にして、
手軽にWebGL化実験を行います。

■使用するツールとサービス
・Blender(3Dモデル作成ツール)
・SketchFab(WebGLの3Dモデル投稿サービス)

■3Dデータを作ろう
・まず最初に円柱をつくります。

モデリングその1

・次に、形を整えます。

モデリングその2
・出来上がります。

モデルその3
※ちゃんとパンツはいてます

■SketchFabを利用する

スケッチファブのロゴ

SketchFab  投稿するにはユーザー登録が必要。

Blender(3Dツール)からダイレクトにアップロードを行うこともできます。(詳細

sketchfab1

ログイン後に「My settings」をクリック

sketchfab2

「PASSWORD & API」から「API token」の文字列をコピーします

exporter
Blender側で「Sketchfab Exporter」のAddonをオンにする
(デフォルトでこのAddonは入ってます)

sketchfab3

ツールウィンドウ内のSketchFabウィンドウの中のApi Keyに先ほどコピーした文字列を入れておきます。

Titleは適当に暑墓地無、Descriptionはアイドルとかにして、uploadボタンをクリック。
しばらくするとアップロードが完了し、SketchFabサービス内の「My models」に新しくアップロードされているのが確認できます。

mymodels

ここから見に行けます
※WebGLに対応した携帯端末(iOS8のiPhoneとか)で見れます。

パンツは派手です。女子力高し。

簡単ですが以上。
しょぼちむのお手軽WebGL体験でした。

AD