見出し画像

Webのインタラクティブ表現についてオンライン勉強会で登壇してみた

先日チームの勉強会で登壇する機会があったのですが、時期もあって初めてのオンライン開催になりました。初めての試みで学びも多かったので、今回は登壇内容の紹介に加えてオンライン勉強会についてもシェアできればと思います。

登壇内容

資料はこちら

デモのリポジトリはこちら

以下は補足になります。

この勉強会のもと

以前sretks.comというサイトを作った(詳細はURLとWebGL総本山の記事を見ていただければ)ときに思ったこととして、Three.jsもBabylon.jsもとても高機能で何でもできるものの、それらを極めて2D・3D・インタラクションすべてを実装するより「それぞれの表現が得意なライブラリを組み合わせる」方が楽なんじゃないか & チーム開発のときも分担しやすいんじゃないかというのがありまして、その例を紹介しています。

構造

以下の図のイメージです。コンテンツ本体となる3Dの上に、2Dエフェクトやタイトルアニメーションを別のCanvasで重ねてるだけです。

オンライン勉強会について

内容の変更

もともとはWebGLについての勉強会だったんですが、オンラインだと参加した方が資料を見たりコードを編集したりを並行して進めるのは大変かなと思い、ゆるく話しながらブレストする感じの進行&テーマに変えさせてもらいました。

ツール

今回はZOOMではなく、最近話題のremoというツールを使ってみました。

気になったこと

「同じテーブルについた人としか話せない」というのは面白い体験でしたが、それゆえに最初に共通の情報が得にくいかもしれません。

今回は主催の方がイベントを作成して私は招待で入ったのですが、発表用のPresentモードが見つからず(主催者側からしか設定できない?)、準備を主催者にまかせてしまったのも少し申し訳ないと思ったり。

体験としては面白かったので、有料がもう少し安ければ・・・もっと使ってみたいところです。

最近別のチームでMiroというサービスを使っていたのですが、RemoでテーブルわけしてMiroで付箋を貼りあうみたいな構成だと音声はテーブル単位で他のチームを邪魔しない&付箋は俯瞰して見れるのでオンラインワークショップに向いてるかもしれません。

全体の所感

2019年に地方移住してから仕事自体はほぼリモートだったのですが、デザインや開発などはやれたものの、プランニング方面(特に複数人の合意形成)にはかなり難しさを感じていたので、今回の経験は非常に良かったです。

これからは「リアルでなければできない」と考えられていた領域がどんどんリモート化していくのかなと思いますが、リアルを単に乗せ換えるのではなく、リモートならではのメリットを生かした方法を考えたいですね。

おわりに

今回の勉強会はKonelの開発チームと実施しました。Konelは、デジタル・アナログ・Fab領域を横断した面白いプロジェクトを手掛けている集団です。最近は「サイバー和菓子」という日本の天気をもとに和菓子を3Dプリンティングする企画を実施しています。

今はリモートでのブレストを試みてるそうなので、この時期だからこそ何かやらなければ、という企業の方は是非ご連絡くださいませ〜


この記事が気に入ったらサポートをしてみませんか?