1ヶ月の復習をします。

Review the past month

インデックス/非インデックス付きジオメトリ

glslにて頂点が再利用されているかどうかのやつ。
BufferGeometryで自分で作るやつは最初非インデックス。
setIndex()で定義可能。

BoxGeometryなど、最初からあるやつはインデックス付きジオメトリ。

ハイパフォーマンスチューニング

今日2周目読み終わったけど、これ2週間で１周目読んだんだなあ。コツコツの力すごい。

The power of steady, consistent effort is amazing.

ease-outの式

1.0 - (1.0 - t)²

glslでこっちを向いているかどうか

gl_FrontFacing

値の変更

どんな値でも、変更される可能性のあるものはMathUtils.lerpを最初に試すこと。

udpateMatrixWorld updateWorldMatrix

1/2の記事によると、各オブジェクトはローカル行列とワールド行列(matrixWorld)を持つので、
udpateMatrixWorldが基準でupdateWorldMatrixは階層を考慮した変換を行う。

wobble

復習してみたけど、またvertうまく法線を計算できなかった。位置を法線によってぐにゃぐにゃにしているけど、positionA,positionBそれぞれの法線じゃないとだめじゃね？って思った。

くそー。。。レベルアップゆえの疑問点と思っておこう。

customShaderMaterialは、定義用にcsm_Positionとかが用意されているけど、ちゃんと普通のpositionやnormalもある。

ノイズにpositionを渡しているけど、そのpositionに更にノイズを書けると、よりグニョングニョンになる。

デザイン

ちょっと発見多すぎて良書すぎる

同系統の色でまとまりすぎてつまらなくなっていないか
ポジティブなメッセージには明るい明度の画像をつかう。
四角や丸と、図形を色々使っていないか。
整列されたカードの画像とか、１枚だけ人物が入っていないかとか、画像の内容は統一させる。
タイトル＋セクション, タイトル＋セクション ... となっていると単調なので、何かしら変化を加える。
背景画像に人物がいたら、なるべく顔に被らないように（カバーでも）
関係ない写真や関連のない写真になっていないか。忘れがち。
ワイヤーフレームは「情報設計」。ここにこの情報を置く、みたいな。
デザインカンプで見た目の良さをきめる。

Three.js

https://three-training2.vercel.app/src/examples/20-transformplane/index.html
https://three-training2.vercel.app/src/examples/40-multicanvas/index.html

上記はどちらもDOM要素の位置にcanvasの内容を描画するが、アプローチが異なる。

項目	20-transformplane	40-multicanvas
レンダリング方法	3D空間内でメッシュを配置	ビューポート/シザーで領域を切り分け
シーン管理	1つのシーンに複数メッシュ	各要素ごとに独立したシーン
カメラ	1つのカメラ	各要素ごとにカメラ
座標変換	DOM座標→3D座標に変換	DOM座標→ビューポート座標に変換
canvas位置	position: fixed	position: absolute + transform
DOM要素	opacity: 0で非表示	表示したまま（canvasが背景）

基本的に20のほうが楽でメモリも使わない。ただ、要素ごとに異なる3Dシーンなら 40-multicanvas が適している。

線形代数入門

行列の掛け算

行列の掛け算は、2行2列 * 2行5列など、1個目の列、2個目の行が等しくないとできない。
非可換性 AB ≠ BA

一次変換

一つの見方として、
行列はベクトルを別のベクトルに変換するもの。

2行1列の行列を別の2行1列の行列に変換するには、必ず2行2列の行列を左から作用させる（行列の左側に2行2列をおいて計算する）ことが必要。
2次元ベクトルは2行1列で表せるから2行1列が出てきたけど、３次元ベクトルなら3行1列

英語

Until heroes arose to defend us
drive back the darkness
ignites the soul
it is impenetrable
black sheep
look alive
The biggest show yet
carb loading マラソンなどの長時間の持久系スポーツで高いパフォーマンスを発揮するため、レース数日前から炭水化物（糖質）の摂取量を増やし、筋肉や肝臓にエネルギー源であるグリコーゲンを通常より多く蓄える食事法
get through
gajillion percent
sick
gimme that
I wish you were here
they will face my wrath
mess with
Better luck trying 「もっとうまくやれる」「次こそはうまくいくよ」といった、相手の失敗を慰めつつ、次の挑戦を応援する気持ちを込めたフレーズ
'cause で becauseらしい
pull up アメリカのギャングスラングでは、喧嘩しに来るという意味
going down　スラングで「やるぞ！」
Took blood, sweat, and tears to look natural
we run the town
he feasted on souls
the world trembled when he roared
mock me
go after
off the charts
stare
how am I supposed to どのように～するべきなのですかという直訳になるが、意味的には「そんなことは無理だ」というイメージ
That's the spirit
Out of thin air
wrap it up
stop by

感想

血と汗と涙的な表現って海外発祥だったんだ。日本限定かと思った。

I thought "blood, sweat and tears" expressions were unique to Japan, turns out they originated overseas.

BLOG

1/15

1/14

1/13

1/12

1/11

1/10

1/8

1/7

1/6

1/5