読者です 読者をやめる 読者になる 読者になる

渋谷ほととぎす通信

完全趣味でやってるUnityメモ。説明できないところを説明できるようにするための個人ブログ。昨日の自分より少しでも大きく慣れるように。。。 ※所属団体とは一切関係がありません

何事も基礎大事!!ほぼ生で書くWebGL スクールに通ってます。


f:id:esakun:20150712111729p:plain

少し前からコチラのスクールに通っておりまして、WebGLを勉強しています。 webgl.souhonzan.org

メインはWebGLの基本的な内容

以下のような内容で全6回 5時間ぶっ通しでやります。

  1. WebGLとはなにか?
  2. WebGLの基礎を知る
  3. テクスチャとライティング
  4. アルファブレンディングとシェーダーによるエフェクト
  5. 環境マップ、バンプマップ
  6. フラグメントシェーダによるエフェクト

すでに5回目を終了し、次回が最終回。

私の動機としては、本当はUnityのシェーダー(HLSL)を勉強したかったのですが、シェーダーの考え方自体はWebGL(GLSL)と変わらないということで、気軽にテスト出来る(ブラウザで試せるという意味で)WebGLを学ぶことにしました。

前々からWebGL自体に興味があったのもあります。

5時間ぶっ通しで結構スピード早い授業

2回目くらいまでは既に理解していた内容で退屈でしたが、3回目くらいから、テクスチャマッピング、ライティングを自分で計算して実装したことがとてもエキサイティングでした。

つめ込まれた授業なので、結構スピードが早いです。前回の復習をちゃんとやっていないと、追いつけなくなります。
しかし、講師の@h_doxasが授業後でもメールやTwitterfacebookで質問に答えてくれるため、非常にありがたかったです。

今までは3DCGソフトが勝手に裏側で動いていたものを自分で実装することで内部構造の理解と、どこにリソースがとられるのか、どうやったらパフォーマンスを出せるのかという視点で考えられるようになったと思います。

WebGLの経験がUnityに生きる

WebGLを勉強した経験はUnity開発でも生きる事を確信しています。

3Dゲームが当たり前になっている中、シェーダ知識はフロントエンドエンジニアにとって必須項目になりつつあります。
ちょっと変わった面白い表現をしようとすると、どうしてもシェーダが関わってきますしね。

このタイミングでこのスクールに参加できたことは大きなアドバンテージになったような気がします。
あとは、復習と経験を重ねてWebGLを自分の手足のようにすることが、とりあえずの目標です。

何事も基礎が大事!

とりあえずHelloWorldしておきました。コチラ

スクールでは、便利なWebGLライブラリ(ThreeJSなど)を使わずにほぼ生のWebGLを使います。先のHelloworldもライブラリを使わずに実装しています(スクールで使用した簡単なラッパーのみ使用)。

そうすることでWebGLの内部構造と処理の流れを正しく理解することができ、応用することが可能です。

今後学んだことの復習をこのブログでまとめていこうと思っています。 その前にスクールで使ったWebGLのラッパーも使わずに生のWebGLを書いてみることから始めるかもしれません。そうしないと本当の意味で理解できていないからです。

※追記:生で書きました!↓↓ esakun.hateblo.jp

私自身も『何事も基礎が大事!』をモットーにしているため、このスクールとはマッチしています。
@h_doxasさん自体が、とてもパワフルな方で毎回刺激を与えてくれます。その度にWebGL頑張ろうって思わせてくれるのもこのスクールの良い所かもしれません。

また、以下の書籍を最近執筆されています。

明解WebGL iOS/Androidも対応した3D CGプログラミングのWeb標準

明解WebGL iOS/Androidも対応した3D CGプログラミングのWeb標準

CEDEC2015にも登壇されるそうです。
WebGLとモバイルウェブの「これまで」と「これから」 そして来たるべきWebGL 2.0へ向けて

興味ある方は、第3回に参加してみてはいかがでしょうか(開催されるか分かりませんが)。

webgl.souhonzan.org