もう3年前になるけど、html5のcanvas要素を使って、画像ファイルを極力使わずにWebサイトをリッチな見た目にする方法を考えていた。当時、スマホやタブレット、ノートPCなどのモバイル端末は、日を追うごとに画面が解像度化、演算能力は向上していった。このまま進むと「ボトルネックとなるのはマシンの演算能力よりもデータ通信速度じゃないか？」って思うようになった。
端末の画面の高解像度化に伴って、より高解像度に耐えうるWebサイトが必要とされ、サイトに掲載される画像の容量は増え、ストレージを圧迫し、ダウンロードにも時間がかかる。そう考えると、大容量の画像ファイルを通信回線に載せるよりも、描画アルゴリズムだけを通信すれば良いんじゃないかって。CGで言うところのプロシージャルテクスチャのような手法を使えば、クライアント側のマシンパワーでリッチな背景を生成できるんじゃないかと。
html5のcanvasを使えば、CGを描画するのと同じように、ブラウザ上に自由にグラフィックを描画できる。当時、すでにこういうものが登場していた↓
canvasでキラキラした背景を作る方法
背景を画像ではなく乱数を使ってcanvasに円を描画する、広義のプロシージャル手法ってこと。
当時はjavascriptも知らなかったのでこれで全体像を勉強した。↓
さらに最近ではWebGL環境も整ってきて、ブラウザ上で手軽にCGが描画できるライブラリも出てきた。
jsdo.itのページ
ということで、こういう考えでWordPressテーマを自作したいのであった。
関連記事
UnityのTransformクラスについて調べてみた
Seleniumを使ったFXや株の自動取引
ROSの薄い本
Theia：オープンソースのStructure from M...
Managing Software Requirements...
Google XML Sitemap Generatorプラ...
まだ続くブログの不調
PythonのHTML・XMLパーサー『BeautifulS...
書籍『ROSプログラミング』
ZBrushのZScript入門
ブログのデザイン変えました
OpenCVの超解像(SuperResolution)モジュ...
AMIMOTO（PVM版）で作成したインスタンスをAMIMO...
Webページ制作のためのメモ
HD画質の無駄遣い
PGGAN：段階的に解像度を上げて学習を進めるGAN
OpenCV 3.1のsfmモジュールを試す
OpenCVで顔のモーフィングを実装する
今年もSSII
書籍『3次元コンピュータビジョン計算ハンドブック』を購入
3分の動画でプログラミングを学習できるサイト『ドットインスト...
ManuelBastioniLAB：人体モデリングできるBl...
ブログがダウンしてました
Google Chromecast
ヒトデの骨格のような構造物を作成するシステム『KINEMAT...
openMVGをWindows10 Visual Studi...
Raspberry Piでセンサーの常時稼働を検討する
ドットインストールのWordPress入門レッスン
Blendify：コンピュータービジョン向けBlenderラ...
OpenMVSのサンプルを動かしてみる
Unityで画面タッチ・ジェスチャ入力を扱う無料Asset『...
Human Generator：Blenderの人体生成アド...
3DCG Meetup #4に行ってきた
Math Inspector：科学計算向けビジュアルプログラ...
ArUco：OpenCVベースのコンパクトなARライブラリ
『Geocities-izer』 どんなWebページも一昔前...
Mayaのプラグイン開発
UnityでARKit2.0
サンプルコードにも間違いはある？
PythonでMayaのShapeノードプラグインを作る
オープンソースの物理ベースGIレンダラ『appleseed』
ブログをwpXレンタルサーバーからwpX Speedへ移行
コメント