本ページはプロモーションが含まれています

ギャラリー

湖のひととき

CATEGORY
REV.
DRAWN BY
TOM
SHEETS
0枚
湖(湖のひととき)

トム

SESで約8年、環境を変えられないもどかしさの中にいました。32歳で自社開発企業に転職し、今はClaude Codeと自動化で、仕事も時間も組み直している途中です。
・Javaバックエンドエンジニア(Java歴12年以上)
・資格:基本情報技術者/応用情報技術者/Java Silver/Python3エンジニア認定基礎
詳細なプロフィール

𝕏

CODE GALLERY No.27

湖のひととき

桟橋の先に座って、のんびり釣りをする3Dの湖です。朝もや、昼の光、夕焼け、ランタンのともる夜。時刻と天気で、釣れる魚が変わります。

水面をタップすると、そこへウキが飛んでいきます。あとは待つだけです。ちょん、ちょん、と小さく揺れて、すっと沈んだら合わせどき。

点数もタイムもありません。12種類の魚を図鑑に集めてもいいし、音をつけて夕暮れの湖を眺めているだけでもかまいません。

湖へ向かっています

STILL LAKE湖のひととき

HOW TO PLAY遊び方

  1. 投げる:水面をタップ(クリック)すると、そこへウキを投げます。届くのは30mまでです。ドラッグすると、まわりを見回せます
  2. 待つ:ウキが小さく揺れるのは「前アタリ」です。ここで合わせると早すぎて、魚がはなれていきます
  3. 合わせる:ウキがすっと沈んだら、すぐにタップします。1秒ほどで魚は餌を離します
  4. 巻く:長押しのあいだ、リールを巻きます。魚が走ったら指を離して、糸を出してください。張りのメーターが赤いところに入ったまま巻き続けると、糸が切れます
  5. 返す:釣れた魚は図鑑に載ります。見終わったら「湖に返す」で放してあげます

下の「時刻」で朝から夜まで動かせます。「…」の「時の流れ」を「めぐる」にすると、12分で1日が過ぎます。初めは「いまの時刻」で、あなたの時計と同じ空になっています。キーボードでは Space で投げる・合わせる・巻くができます。

FISHどこで、いつ釣れるか

ウキを投げた場所の深さ(浅場・中くらい・深場)と、スイレンの葉の近くかどうか、時間帯、天気で、魚ごとの出やすさが決まります。夜明けと夕方(朝まずめ・夕まずめ)は魚の動きがよく、アタリが早く来ます。くもりや雨の日も少し早くなります。

魚よく釣れるところ
モツゴ・タナゴ岸の浅いところ。タナゴは水草の近くの昼
オイカワ晴れた昼の浅場
ワカサギ朝の深いところ
ギンブナ・ウグイ湖のまん中ほど。昼でもよく来る
ヘラブナ・ニジマス朝か夕方の深いところ。ニジマスはくもりや雨の朝
コイ・ナマズコイは深いところでいつでも。ナマズは雨の夜
イトウ霧の朝か夕方の深場。めったに来ません

もう1種、この湖の言い伝えに出てくる魚がいます。図鑑の最後の欄に、手がかりが書いてあります。

HOW IT WORKSしくみ

1. 湖の形:湖は、楕円のまん中がいちばん深くなる1本の式でできています。地面の絵・岸の木の根元・ウキを投げた場所の深さを、JavaScript と GPU(シェーダー)で同じ式から出すので、見た目と判定がずれません。

// 中心 (0, -66) の楕円。d が 1 より小さいところが湖で、まん中ほど深い
const d = Math.hypot(x / 85, (z + 66) / 68) + 0.03 * Math.sin(x * 0.07 + z * 0.04);
let h = d < 1 ? -0.2 - 13 * Math.pow(1 - d, 1.6) : -0.2 + (d - 1) * 8;

2. 水面の映り込み:カメラを水面で上下にひっくり返したもう1台のカメラで景色を描き、その絵を水面に貼っています。波の傾きで絵を少しずらすと、ゆらいだ映り込みになります。ウキの着水や魚の跳ねは、水面に波紋の輪を足して描きます。

3. アタリまでの時間:待ち時間は、平均 11 秒を魚の活発さで割った指数分布で決めています。たいていは十数秒で来ますが、ときどき長く待たされます。

const mean = 11 / activity(period, weather);   // 朝まずめは 1.6 倍活発
const bite = 3 + -Math.log(1 - rng()) * mean;   // 投げてから本アタリまでの秒数

4. やりとり:魚はときどき「走り」ます。走っている間に巻くと、糸の張りが一気に上がります。張りが 1 を 0.7 秒超えると糸が切れます。小さな魚は巻くだけで寄ってきますが、コイより大きな魚は、走ったら離す、止まったら巻く、をくり返すことになります。

5. 見た目:空・雲・星・月、岸の森の木、光のにじみ(ブルーム)と光芒、手前と奥のぼかしは、ギャラリーの最初の作品「森の呼吸」と同じ作りです。魚の姿は、体の断面の大きさを鼻先から尾まで式で決めて組み立て、模様(縦じま・斑点・うろこ)はシェーダーで描いています。

NOTES注意

  • WebGL2 が使える端末で動きます。3Dの部品(three.js)を読み込むので、初めて開くときは少し時間がかかります
  • 重いときは、画質を自動で下げます。「…」の「画質」で選ぶこともできます
  • 図鑑と設定は、このブラウザの中にだけ保存します。どこにも送りません
  • 音は「音」を押したときだけ鳴ります。音はすべてその場で作っていて、録音した音は使っていません
  • 魚の説明は、実際の魚について書いています。釣れる場所や時間はこのゲームの中の決まりで、実際の釣りの目安ではありません。「湖のヌシ」は作り話です
NEXT READ本棚から1本

AIで開発を組み直すなら、まずこの5冊から

入門・実践・設計まで、Claude Codeの本をレベル別に5冊選んで比べました。

→ おすすめ5冊を見る

  • この記事を書いた人
  • 最新記事

トム

SESで約8年、環境を変えられないもどかしさの中にいました。32歳で自社開発企業に転職し、今はClaude Codeと自動化で、仕事も時間も組み直している途中です。
・Javaバックエンドエンジニア(Java歴12年以上)
・資格:基本情報技術者/応用情報技術者/Java Silver/Python3エンジニア認定基礎
詳細なプロフィール

𝕏

ギャラリー