New Surface Pro 発表! - お絵かきに最適?!4,096段階筆圧...

Microsoftが新型Surface Pro「New Surface Pro」を発表!本体スペックとペンが大幅パワーアップ!そしてバッテリー長持ち

続きを読む

Car Design Academy 動画添削サンプル - カーデザインを学べる...

カーデザインを学べるオンラインスクール「Car Design Academy」の動画添削のダイジェスト版が公開。

続きを読む

ibisPaint Auto Paint - モバイル向けお絵かきAPP「アイビ...

線画大好き色塗り嫌いマンに朗報!絵かきSNSアプリ「アイビスペイント」が、ディープラーニングを利用した線画から自動的に色を塗る機能を追加しリリース!

続きを読む

美しい情景イラストレーション 魅力的な風景を描くクリエイターズファイル - 40...

豪華40名の作家による画集『美しい情景イラストレーション 魅力的な風景を描くクリエイターズファイル』が近日発売されます!

続きを読む

はじめよう!作りながら楽しく覚えるBlender - 挫折者必見!?Blende...

大河原浩一氏著書「はじめよう!作りながら楽しく覚えるBlender」が販売中!Blender入門に最適な一冊です。

続きを読む

明解WebGL iOS/Androidも対応した3D CGプログラミングのWeb標準 - ウェブに浸透してきたWebGLを学ぶのに最適な書籍が登場!

「WebGL 開発支援サイト wgld.org」を運営している杉本雅広氏による書籍『明解WebGL iOS/Androidも対応した3D CGプログラミングのWeb標準』がリックテレコムさんから発売されます!サービスやコンテンツの多さから普通にネットサーフィンをしていても目にかかる機会がかなり増えてきましたよね。世は正にWebGL時代!


PR
クリーク大阪採用

WebGLとは

WebGL(ウェブジーエル)は、ウェブブラウザで3次元コンピュータグラフィックスを表示させるための標準仕様。 OpenGL 2.0もしくはOpenGL ES 2.0をサポートするプラットフォーム上で、特別なブラウザのプラグインなしで、ハードウェアでアクセラレートされた三次元グラフィックスを表示可能にする。 技術的には、JavaScriptとネイティブのOpenGL ES 2.0のバインディングである。 WebGLは非営利団体のKhronos Groupで管理されている。
引用元:WebGL – ウィキペディア

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

  • 単行本(ソフトカバー): 312ページ
  • 出版社: リックテレコム
  • 言語: 日本語
  • ISBN-10: 4897979900
  • ISBN-13: 978-4897979908
  • 発売日: 2015/5/13

本書の特徴

WebGL は、HTML5 で登場してきたグラフィックス処理技術を、遥かに超える高いパフォーマンスを発揮します。2D コンテンツの配信はもちろん、高度な3D 表現でさえもWebGL を用いれば容易に実現することができます。その活躍の場は、PC に限らず、近年ではiOS/Androidデバイスやゲーム機の内蔵ブラウザなど、多彩なシーンへと普及しております。

本書はこの最新鋭のオープンソースの技術を3D初心者にもわかりやすいよう「明解に」解説しました。
3Dを扱うとなると「行列」や「ベクトル」等々数学的な知識が必要になります。実際のところ、本書にもこれらの概念は登場します。でも大丈夫。ここは筆者がていねいに解説しました。

  • 作品の中に、リアルな描写を含んだ多彩な表現を必要とするクリエイター
  • 敏捷に動くiOS/Androidアプリを効率よく開発したいゲーム開発者

これらの人たち必読の一冊!

著者について

杉本雅広(すぎもと・まさひろ)
WebGL の普及に尽力すべく奔走する自称「WebGL エンジニア」。2012 年よりWebGL の開発支援サイトwgld.org を運営開始。同サイトは、日本語によるWebGL を解説したコンテンツとして今もなお貴重な存在。
2014 年からは、IT イベントや勉強会に積極的に登壇すると共に、WebGL 初心者向けの本格スクールを主催。フロントエンドエンジニアだけでなく、WebGL に興味を持つあらゆる人の助けとなるべく日夜活動中。

目次

第1章 WebGLの今までとこれから 
~モバイルウェブの世界とWebGL
  • 1.1 HTML5とWebGL
  • 1.2 ウェブアプリケーションの進化
  • 1.3 開発を始めるための障壁が少ないWebGL
  • 1.4 なぜ今WebGLが注目されているのか
第2章 開発環境の準備 
~WebGLの開発に適した環境を整える
  • 2.1 ブラウザの準備
  • 2.2 JavaScript開発に欠かせないデバッグテクニック
  • 2.3 開発者ツールの代表的な機能
  • 2.4 ローカルサーバを用いた開発
  • 2.5 モバイル端末でのデバッグ
第3章 WebGLの基本構造と概念 
~WebGLの基本的な処理の流れや概念を理解する
  • 3.1 canvasとコンテキストオブジェクト
  • 3.2 WebGLコンテキストの取得
  • 3.3 「gl」という名前の変数を使う
  • 3.4 最小構成のWebGLプログラム
  • 3.5 WebGLとcanvas 2Dの違い
  • 3.6 WebGLにおける頂点
  • 3.7 頂点とプリミティブ形状
  • 3.8 まずは描画してみる
  • 3.9 WebGLとバッファオブジェクト
  • 3.10 三角形を動かす
  • 3.11 三角形を増やす
  • 3.12 WebGLとの向き合い方
第4章 座標変換とシェーダ 
~線型代数学の活用とシェーディング
  • 4.1 線型代数学とは
  • 4.2 行列という概念
  • 4.3 座標変換はなぜ必要なのか
  • 4.4 様々な座標変換
  • 4.5 行列が実際に利用されるタイミング
  • 4.6 シェーダを学習するタイミング
  • 4.7 シェーダの記述方法
  • 4.8 シェーダのコンパイルとリンク
  • 4.9 関数にして手順を効率化する
  • 4.10 シェーダやプログラムオブジェクトのエラーを検知する
  • 4.11 行列演算の補助ライブラリ
  • 4.12 minMatrix.jsの使い方
  • 4.13 行列を適用して頂点を動かす
  • 4.14 複数の行列を組み合わせる
  • 4.15 回転を行うモデル座標変換行列
  • 4.16 拡大縮小を行うモデル座標変換行列
  • 4.17 アニメーション
  • 4.18 行列やシェーダとの向き合い方
第5章 GLSLによるシェーダの記述 
~シェーダ記述言語GLSLについて知る
  • 5.1 シェーダの誕生とプログラマブルシェーダ
  • 5.2 固定機能パイプラインとシェーダ記述言語
  • 5.3 シェーダの種類と役割
  • 5.4 GLSL記述の基礎知識
  • 5.5 変数の型と厳密なデータ型チェック
  • 5.6 スウィズル演算子
  • 5.7 その他の特殊な変数型
  • 5.8 制御構文と特殊な記述ルール
  • 5.9 組込み変数(ビルトイン変数)
  • 5.10 組込み関数(ビルトイン関数)
  • 5.11 ストレージ修飾子
  • 5.12 精度修飾子とprecision宣言
  • 5.13 GLSLとの向き合い方
第6章 様々なライティングテクニック 
~3DCGにおける基本的な照明効果
  • 6.1 3DCGは「まやかしの表現」
  • 6.2 ライティングとは
  • 6.3 立体形状のモデルデータ
  • 6.4 インデックスバッファ
  • 6.5 インデックスバッファを用いたレンダリング
  • 6.6 シェーダとアプリケーション
  • 6.7 シェーダへのデータ転送
  • 6.8 深度テスト
  • 6.9 深度バッファ
  • 6.10 基本的な3つの光
  • 6.11 法線とライトベクトル
  • 6.12 長さを揃える ~ベクトルの正規化
  • 6.13 拡散光の実装
  • 6.14 頂点シェーダとフラグメントシェーダ
  • 6.15 反射光を加味したライティング
  • 6.16 環境光を取り入れたライティング
  • 6.17 ライティングとの向き合い方
第7章 テクスチャとブレンディング 
~よりリッチな表現を目指して
  • 7.1 WebGLとイメージデータ
  • 7.2 画像やcanvasの一辺の長さに注意
  • 7.3 テクスチャと画像ファイル
  • 7.4 テクスチャオブジェクトの初期化
  • 7.5 画像のロードを考慮した初期化処理
  • 7.6 テクスチャ座標
  • 7.7 テクスチャをシェーダで参照する
  • 7.8 テクスチャパラメータの指定
  • 7.9 テクスチャの元データ
  • 7.10 動画をテクスチャに適用する
  • 7.11 色の合成 ~ブレンディング
  • 7.12 アルファブレンディング
  • 7.13 アルファブレンディングと深度
  • 7.14 カリング
  • 7.15 面の表と裏
  • 7.16 カリングの有効化と設定
  • 7.17 テクスチャやブレンディングとの向き合い方
第8章 モデルデータの扱い方 
~外部データを活用して3Dシーンをより豊かに
  • 8.1 モデリングソフトウェアとWebGL
  • 8.2 モデルデータのファイル形式
  • 8.3 WebGLでモデルデータを利用するためには
  • 8.4 objson.jsを利用したOBJ形式ファイルの読込み
  • 8.5 オンラインでモデルデータを入手する
  • 8.6 WebGLにおけるモデルデータとの向き合い方
第9章 インタラクティブに動きのあるシーンを描く
~ユーザのアクションに応じた対話的処理
  • 9.1 より動きのあるコンテンツ制作のために
  • 9.2 描画の前に外部ファイルを取得しておく
  • 9.3 描画命令を複数回呼び出す
  • 9.4 点光源の実装に必要な2つの座標
  • 9.5 動的にライトベクトルを算出する
  • 9.6 オブジェクトを落下させる
  • 9.7 ユーザのアクションに応じて動くカゴを描く
  • 9.8 カゴのモデルデータ読込みと描画
  • 9.9 キー入力を検知する
  • 9.10 シェーダによるエフェクトの追加
  • 9.11 りんごとカゴのヒット判定
  • 9.12 WebGLにおける表現
第10章 WebGLとモバイルウェブアプリケーション
~モバイル端末でのWebGLコンテンツ制作
  • 10.1 真のマルチプラットフォームアプリ
  • 10.2 モバイル端末上でのWebGL動作状況
  • 10.3 モバイル端末ならではの入力方式
  • 10.4 JavaScriptからジャイロセンサの情報を取得
  • 10.5 WebGLの描画結果にイベント情報を反映する
  • 10.6 モバイル端末ならではのコンテンツ作り
  • 付録 GLSL ビルトイン関数一覧

明解WebGL iOS/Androidも対応した3D CGプログラミングのWeb標準 | リックテレコム 書籍情報

お求めはこちらから

WebGL 開発支援サイト wgld.org

http://wgld.org/

関連記事

  1. フェイス リファレンス キャラクターに個性を持たせる顔のしくみと作り方

コメントをお待ちしております

日本語が含まれない投稿は無視されます。-Posts that do not include the Japanese will be ignored-(スパム対策-anti Spam-)

2015.05.08Comicon Challenge 2015 の作品をチェック! - テーマは「FUSION(フュージョン)」ミックスされたコミックキャラクターが続々登場!

2015.05.11Cycles Demoreel 2015 - 無料3Dソフト「Blender」のレンダラーの力を魅せつける!最新デモリール!

3D人について

3D/2D/CG関連のネタ・ツール情報をほぼ毎日紹介!掲載してほしい情報、ツール検証依頼などありましたら、メッセージボックス、ツイッターもしくはFacebookのメッセージからどうぞ!

おしらせ

沢山のメッセージありがとうございます!!記事掲載に関しては随時対応していきますので、何卒宜しくお願い致します。
友だち追加
follow us in feedly

 RSSリーダーで購読する

おすすめ商品Pickup