PlayCanvasでVueを使って3Dモデルビュワーサイトを作る

WebGL/HTML5ゲームエンジンであるPlayCanvasを使ったwebサイトを制作します。

今まで3Dのコンテンツを使用するためにWebGLを使ってcanvasタグに出力し表示することが通常の動きでした。
しかし、そこまで学ぶにはWebGLへの理解、Three.jsなどのライブラリの使い方を学ぶコストがありました。
それをGUIのエディター画面から3Dコンテンツを作成でき、かつ、htmlなどを操作することで3Dのwebサイトを作成できる。

コードを書くのが苦手な人でも、3Dコンテンツを作成するコストが大幅にカットできてしまう、
そんなPlayCanvasを使った簡単なwebサイトを作成しながら解説します。

今回は、アパレル系のWebサイトでよく見る、3Dモデルビュワー的なWebページをPlayCanvasを使って作ります。
Vue.jsを使いますが、Vue.jsがわからない人でも理解できるような内容にしますので、ぜひご参加ください。

以下のURLからハンズオンで作れるサンプルが確認できます。
https://playcanv.as/p/xIj6iJ4S/

ハンズオンにつきまして、あらかじめPlayCanvasへの登録を済ましておいてください。
無料でアカウントを作成ができますので、以下のサイトから登録をお願いいたします。
https://playcanvas.jp/

ストリーミング配信！！

Zoomウェビナー + YouTube + Twitter(Periscope) での配信を予定しています。

Zoomウェビナーでは、参加URLを事前にご連絡いたします。

2020/09/23 情報更新

今回のZoomウェビナーによるストリーミング配信は中止し、YouTube + Twitter(Periscope)での配信となります。

YouTubeでは、PlayCanvas運営事務局YouTubeチャンネルにて配信いたします。
PlayCanvas運営事務局 YouTubeチャンネル
※事前にチャンネル登録をし、当チャンネルのベルマークから通知をオンにしていただくと配信時の通知がスムーズです。

Twitter(Periscope)では、Twitterから配信を確認することができます。
Twitterアカウント
※当アカウントをフォローしていただくと配信を見逃しにくくなります。

ライブ配信ですのでリアルタイムでのご質問等もチャットにて可能です。
遠方の方やご自宅・オフィスからの参加などなどご参加お待ちしております！

参加対象と参加準備

対象者

• JavaScriptを触ったことがある程度
• PlayCanvasに興味のある人(PlayCanvas Editorの基本操作ができれば尚良い)
• 一つ上のWeb表現を追求したい人
• 3Dモデルのポートフォリオを作りたい人
• 学生・教育機関関係も大歓迎

----- ↓以下ができる人も大歓迎です↓ -----

• webサイトを作ったことがある人
• マークアップやコーディング、フロントエンドの経験がある人
• web業界にいたことがある人

事前準備

• PC・スマートフォン
  ※PCにはあらかじめ"Google Chrome"か"mozilla Firefox"のインストールをお願いいたします

費用

• 参加費: 無料

タイムスケジュール