このエントリーをはてなブックマークに追加

Dec

10

Vue.jsを使ったモデルビュワーサイトを作る

Hashtag :#playcanvasnow
Registration info

参加枠1

Free

Attendees
6

参加者への情報
(参加者と発表者のみに公開されます)

Description

PlayCanvasでVue.jsを使って3Dモデルビュワーサイトを作るハンズオン

このハンズオンはJavaScriptのライブラリ「PlayCanvas」と「Vue.js」を使用したハンズオンです。

3Dコンテンツを使ったWebサイトを作りたい人必見!

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

作成するプロジェクトについて

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


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

・プログラミング未経験や初心者の方
・JavaScriptを触ったことはあるけどPlayCanvasは知らない
・PlayCanvasのスキルを深めたい
など、幅広く参加できる内容となっています。

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

PlayCanvasとは?

PlayCanvasはオープンソースのゲームエンジンで、
HTMLとWebGLを使ってブラウザゲームや3Dのコンテンツを作ることのできるJavaScriptのライブラリです。
豊富な機能を揃えた3Dエンジンとクラウドホスティングされた開発環境およびツールセットを備えています。

PlayCanvas | 日本公式サイト
https://playcanvas.jp/

参加対象者

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

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

  • webサイトを作ったことがある人
  • 3Dモデルや3DCADなど3DコンテンツをWebで使いたい方
  • PlayCanvasってなんだ?という人

事前準備

あらかじめPlayCanvasへの登録を済ましておいてください
無料でアカウントを作成ができますので、以下のサイトから登録をお願いいたします。

参加方法について

ハンズオンにつきましてはYouTubeのPlayCanvas運営事務局チャンネルでストリーミング配信を予定しております。
connpassの方で参加登録をして頂いた方には、当日の配信チャンネルのURLが公開されます。
かつ、配信URLをメールでも事前にご連絡させていただきます。

またYouTubeチャンネルを登録し通知をONにすることで見逃すことはなくなります。
PlayCanvas運営事務局 YouTubeチャンネル

タイムスケジュール

オンライン配信日: 2021年 12月 10日 17:00 ~ 18:00 (進行具合で前後する恐れがあります)

時間 内容
17:00 配信開始
17:00 - 17:10 オープニング
17:10 - 18:00 ハンズオン

※タイムスケジュールは進行具合で時間が前後する可能性がありますことをご了承ください。

PlayCanvas運営事務局について

PlayCanvasは、ブラウザ向けに作られたWebGL/HTML5ゲームエンジンです。
PlayCanvas運営事務局は日本国内でのPlayCanvasの普及を目的に活動しています

発表者

Media View all Media

If you add event media, up to 3 items will be shown here.

Group

PlayCanvasMeetup

Number of events 74

Members 587

Ended

2021/12/10(Fri)

17:00
18:00

Registration Period
2021/12/03(Fri) 12:00 〜
2021/12/10(Fri) 18:00

Location

オンライン配信

オンライン

オンライン配信

Attendees(6)

ahirutaro

ahirutaro

Vue.jsを使ったモデルビュワーサイトを作るに参加を申し込みました!

to123

to123

Vue.jsを使ったモデルビュワーサイトを作るに参加を申し込みました!

どんちゃん

どんちゃん

参考にさせていただきます!

MinamiYamaguchi

MinamiYamaguchi

Vue.jsを使ったモデルビュワーサイトを作るに参加を申し込みました!

yukiyama9999913

yukiyama9999913

Vue.jsを使ったモデルビュワーサイトを作る に参加を申し込みました!

smacab

smacab

Vue.jsを使ったモデルビュワーサイトを作る に参加を申し込みました!

Attendees (6)

Canceled (1)