もう3年前になるけど、html5のcanvas要素を使って、画像ファイルを極力使わずにWebサイトをリッチな見た目にする方法を考えていた。当時、スマホやタブレット、ノートPCなどのモバイル端末は、日を追うごとに画面が解像度化、演算能力は向上していった。このまま進むと「ボトルネックとなるのはマシンの演算能力よりもデータ通信速度じゃないか？」って思うようになった。
端末の画面の高解像度化に伴って、より高解像度に耐えうるWebサイトが必要とされ、サイトに掲載される画像の容量は増え、ストレージを圧迫し、ダウンロードにも時間がかかる。そう考えると、大容量の画像ファイルを通信回線に載せるよりも、描画アルゴリズムだけを通信すれば良いんじゃないかって。CGで言うところのプロシージャルテクスチャのような手法を使えば、クライアント側のマシンパワーでリッチな背景を生成できるんじゃないかと。
html5のcanvasを使えば、CGを描画するのと同じように、ブラウザ上に自由にグラフィックを描画できる。当時、すでにこういうものが登場していた↓
canvasでキラキラした背景を作る方法
背景を画像ではなく乱数を使ってcanvasに円を描画する、広義のプロシージャル手法ってこと。
当時はjavascriptも知らなかったのでこれで全体像を勉強した。↓
さらに最近ではWebGL環境も整ってきて、ブラウザ上で手軽にCGが描画できるライブラリも出てきた。
jsdo.itのページ
ということで、こういう考えでWordPressテーマを自作したいのであった。
関連記事
TensorFlowでCGを微分できる『TensorFlow...
cvui：OpenCVのための軽量GUIライブラリ
ヒトデの骨格のような構造物を作成するシステム『KINEMAT...
TeleSculptor：空撮動画からPhotogramme...
機械学習に役立つPythonライブラリ一覧
OpenCVでiPhone6sのカメラをキャリブレーションす...
ManuelBastioniLAB：人体モデリングできるBl...
iOSで使えるJetpac社の物体認識SDK『DeepBel...
Iterator
動的なメモリの扱い
Web経由でRaspberry PiのGPIOを操作したい
ZBrushで作った3Dモデルを立体視で確認できるVRアプリ...
このブログのデザインに飽きてきた
OpenCVでPhotoshopのプラグイン開発
OpenCVのfindEssentialMat関数を使ったサ...
Managing Software Requirements...
Pythonのソースコードに特化した検索エンジン『Nulle...
OpenCV3.3.0でsfmモジュールのビルドに成功！
GAN (Generative Adversarial Ne...
iPhone・iPod touchで動作する知育ロボット『R...
オープンソースの顔認識フレームワーク『OpenBR』
マルコフ連鎖モンテカルロ法
まだ続くブログの不調
手を動かしながら学ぶデータマイニング
OpenCV 3.3.0 contribのsfmモジュールの...
COLMAP：オープンソースのSfM・MVSツール
NumSharp：C#で使えるNumPyライクな数値計算ライ...
Unity ARKitプラグインサンプルのチュートリアルを読...
ブラウザ操作自動化ツール『Selenium』を試す
UnityのGameObjectの向きをScriptで制御す...
Mitsuba 3：オープンソースの研究向けレンダラ
RSSフィードを読込んで表示するWordpressプラグイン...
PythonでMayaのShapeノードプラグインを作る
Mask R-CNN：ディープラーニングによる一般物体検出・...
WordPress on Google App Engine...
OpenGVの用語
Manim：Pythonで使える数学アニメーションライブラリ
Seleniumを使ったFXや株の自動取引
Raspberry PiのGPIOを操作するPythonライ...
ブログがダウンしてました
Composition Rendering：Blenderに...
Amazon Web ServicesでWordPress
コメント