もう3年前になるけど、html5のcanvas要素を使って、画像ファイルを極力使わずにWebサイトをリッチな見た目にする方法を考えていた。当時、スマホやタブレット、ノートPCなどのモバイル端末は、日を追うごとに画面が解像度化、演算能力は向上していった。このまま進むと「ボトルネックとなるのはマシンの演算能力よりもデータ通信速度じゃないか？」って思うようになった。
端末の画面の高解像度化に伴って、より高解像度に耐えうるWebサイトが必要とされ、サイトに掲載される画像の容量は増え、ストレージを圧迫し、ダウンロードにも時間がかかる。そう考えると、大容量の画像ファイルを通信回線に載せるよりも、描画アルゴリズムだけを通信すれば良いんじゃないかって。CGで言うところのプロシージャルテクスチャのような手法を使えば、クライアント側のマシンパワーでリッチな背景を生成できるんじゃないかと。
html5のcanvasを使えば、CGを描画するのと同じように、ブラウザ上に自由にグラフィックを描画できる。当時、すでにこういうものが登場していた↓
canvasでキラキラした背景を作る方法
背景を画像ではなく乱数を使ってcanvasに円を描画する、広義のプロシージャル手法ってこと。
当時はjavascriptも知らなかったのでこれで全体像を勉強した。↓
さらに最近ではWebGL環境も整ってきて、ブラウザ上で手軽にCGが描画できるライブラリも出てきた。
jsdo.itのページ
ということで、こういう考えでWordPressテーマを自作したいのであった。
関連記事
adskShaderSDK
『手を動かしながら学ぶエンジニアのためのデータサイエンス』ハ...
AmazonEC2のインスタンスをt1.microからt2....
UnrealCLR：Unreal Engineで.NET C...
クラスの基本
viser：Pythonで使える3D可視化ライブラリ
3Dモデルを立体視で確認できるVRアプリを作っている
サンプルコードにも間違いはある？
仮想関数
フルCGのウルトラマン！？
Google App Engineのデプロイ失敗
bpy-renderer：レンダリング用Pythonパッケー...
第1回 3D勉強会＠関東『SLAMチュートリアル大会』
WordPress on Windows Azure
Caffe：読みやすくて高速なディープラーニングのフレームワ...
Pythonの自然言語処理ライブラリ『NLTK(Natura...
OpenCVでPhotoshopのプラグイン開発
Unityの各コンポーネント間でのやり取り
Javaで作られたオープンソースの3DCGレンダラ『Sunf...
Manim：Pythonで使える数学アニメーションライブラリ
SONY製のニューラルネットワークライブラリ『NNabla』
TorchStudio：PyTorchのための統合開発環境と...
Raspberry Piでセンサーの常時稼働を検討する
AnacondaとTensorFlowをインストールしてVi...
ManimML：機械学習の概念を視覚的に説明するためのライブ...
Webスクレイピングの勉強会に行ってきた
WordPressの表示を高速化する
pythonもかじってみようかと
組み込み向けのWindows OS 『Windows Emb...
ROSの薄い本
Google App Engine上のWordPressでA...
ニューラルネットワークで画像分類
ブログをwpXレンタルサーバーからwpX Speedへ移行
UnityでLight Shaftを表現する
OpenFace：Deep Neural Networkによ...
ZScript
Konashiを買った
オープンソースの取引プラットフォーム
MVStudio：オープンソースのPhotogrammetr...
定数
Google Colaboratoryで遊ぶ準備
OpenCVで平均顔を作るチュートリアル
コメント