diff --git a/src/components/LabGuide.astro b/src/components/LabGuide.astro index e33cf3f..e507d91 100644 --- a/src/components/LabGuide.astro +++ b/src/components/LabGuide.astro @@ -1,6 +1,6 @@ --- // /series6(フィジカルAI研究室)の見出しの下に置く解説(2026-11-07) -// 1 研究室の構成:机の上・Mac・借りた GPU の3か所と、その間を行き来するもの(図は HTML で組む。AI も読めるように) +// 1 研究室の構成:机の写真と、手元に置くもの・時間で借りるものの一覧(矢印の図は 2026-11-07 にやめた) // 2 いま回している実験:お手本 → 学習 → 実機 → 人の直し → 直した成功を学習に足す、のループと各段の数字 // 3 使っている技術:π0.5・追加学習(LoRA)・借りる GPU・推論サーバー・巻き戻しと人の直し // 写真は public/site/lab/(desk.webp は 2026-10-29 の横からの録画 IMG_4215.MOV の80秒目、 @@ -9,19 +9,17 @@ // 数字はどれも LOG の記録の値。新しい LOG で数字が変わったら、ここも書き換える type Link = { log: string; slug: string; t: string }; -const zones = [ - { key: 'desk', name: '机の上', img: true, items: [ - { h: 'mechArm 270', p: '6つの関節を持つ小型のロボットアーム。中の Raspberry Pi が指令を受けて関節を動かします。' }, - { h: '上のカメラ', p: 'スマホを真上に付けて、マットとブロックと箱を撮ります。π0.5 が見るのはこの画像だけです。' }, - { h: 'ゲームパッド', p: 'AI が失敗しかけたとき、人が関節を直すのに使います。3,198円の互換品です。' }, +// 構成は、手元に置くものと時間で借りるものの2つに分ける(2026-11-07 に矢印の図から改めた) +const kit: { group: string; items: { h: string; p: string }[] }[] = [ + { group: '手元に置くもの', items: [ + { h: 'mechArm 270', p: '6つの関節を持つ小型のロボットアーム。中の Raspberry Pi が関節を動かす' }, + { h: '上のカメラ', p: '真上に付けたスマホ。π0.5 が見るのはこの画像だけ' }, + { h: 'ゲームパッド', p: 'AI が失敗しかけたとき、人が関節を直す。3,198円の互換品' }, + { h: 'Mac', p: '画像と関節の角度を記録し、借りた GPU とやり取りする' }, ] }, - { key: 'mac', name: '手元の Mac', items: [ - { h: '記録と中継', p: 'カメラの画像と関節の角度を1秒10コマで記録し、借りた GPU に送り、返ってきた動きをアームへ渡します。' }, - { h: 'AI と組み立てる', p: '手順と分析は Claude、アームを動かすプログラムは Claude Code と一緒に書いています。' }, - ] }, - { key: 'gpu', name: '時間で借りる GPU', items: [ - { h: 'Runpod の A40', p: 'GPU のメモリは 48GB、1時間あたり約98円。π0.5 の学習と推論は、すべてここで行います。' }, - { h: 'Hugging Face', p: '学習済みのモデル(6.3GB)の置き場所。GPU を借りるたびに、ここから13秒で取ってきます。' }, + { group: '時間で借りるもの', items: [ + { h: 'Runpod の A40', p: 'π0.5 の学習と推論をする GPU。メモリ 48GB、1時間あたり約98円' }, + { h: 'Hugging Face', p: '学習済みのモデル(6.3GB)の置き場所' }, ] }, ]; @@ -80,27 +78,20 @@ const tech: { name: string; sub: string; p: string; fig?: boolean; links: Link[] ---

研究室の構成 | Setup

-

机の上のアーム、手元の Mac、時間で借りる GPU の3か所でできています。AI の学習と推論は、すべて借りた GPU の上で行っています。

-
- {zones.map((z, i) => ( - <> - {i > 0 && ( - - )} -
-

{z.name}

- {z.img && マットの上の mechArm 270 が赤いブロックをつかみ、右に白い箱が置いてある} +

机の上のアームとカメラと Mac に、時間で借りる GPU を足しただけの構成です。Mac が上のカメラの画像と関節の角度を借りた GPU へ送り、π0.5 が次の1秒ぶんの関節の角度を返して、Mac がそれをアームへ渡します。

+
+ マットの上の mechArm 270 が赤いブロックをつかみ、右に白い箱が置いてある +
+ {kit.map((g) => ( +
+

{g.group}

- {z.items.map((it) => (
{it.h}
{it.p}
))} + {g.items.map((it) => (
{it.h}
{it.p}
))}
- - ))} + ))} +
-

Mac は上のカメラの画像と関節の角度を、指示文と一緒に借りた GPU へ送ります。π0.5 は次の1秒ぶんの関節の角度を返し、Mac がそれをアームへ渡します。

@@ -156,23 +147,14 @@ const tech: { name: string; sub: string; p: string; fig?: boolean; links: Link[] .lg-p { margin: 0; font: 400 15px/27px var(--sans); color: var(--ink-2); word-break: auto-phrase; text-wrap: pretty; } /* 1 構成:3つの場所と、その間を行き来するもの */ - .lg-map { display: grid; grid-template-columns: minmax(0, 1.35fr) 112px minmax(0, 1fr) 112px minmax(0, 1fr); align-items: start; } - .lg-zone { padding: 24px; border-radius: 8px; background: var(--bg); } - .lg-zone-gpu { background: var(--dark); color: #fff; } - .lg-zone-name { margin: 0 0 16px; font: 700 18px/28px var(--sans); color: var(--ink); } - .lg-zone-gpu .lg-zone-name { color: #fff; } - .lg-desk { display: block; width: 100%; height: auto; margin: 0 0 16px; border-radius: 6px; } + /* 写真はブロックから箱まで入れたいので、切り抜かずに元の比率のまま置く */ + .lg-setup { display: grid; grid-template-columns: minmax(0, 7fr) minmax(0, 5fr); gap: 40px; align-items: center; } + .lg-desk { display: block; width: 100%; height: auto; border-radius: 8px; } + .lg-kit { display: grid; align-content: start; gap: 28px; } + .lg-kit-h { margin: 0 0 12px; font: 700 13px/20px var(--sans); color: var(--ink-3); } .lg-items { margin: 0; display: grid; gap: 14px; } - .lg-items dt { font: 700 15px/24px var(--sans); color: var(--ink); } - .lg-items dd { margin: 2px 0 0; font: 400 14px/24px var(--sans); color: var(--ink-2); word-break: auto-phrase; } - .lg-zone-gpu .lg-items dt { color: #fff; } - .lg-zone-gpu .lg-items dd { color: #c8c8c2; } - .lg-flow { display: grid; align-content: start; gap: 28px; padding: 72px 8px 0; } - .lg-flow-go { min-height: 76px; align-content: start; } - .lg-flow span { display: grid; justify-items: center; gap: 4px; text-align: center; font: 500 12px/18px var(--sans); color: var(--ink-2); word-break: auto-phrase; } - .lg-flow .ms { font-size: 28px; color: var(--ink); } - .lg-flow-back .ms { color: var(--ink-3); } - .lg-flow-text { margin: 24px 0 0; max-width: 46em; font: 400 14px/24px var(--sans); color: var(--ink-3); } + .lg-items dt { font: 700 16px/24px var(--sans); color: var(--ink); } + .lg-items dd { margin: 2px 0 0; font: 400 14px/22px var(--sans); color: var(--ink-2); word-break: auto-phrase; } /* 2 実験のループ */ .lg-loop { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 12px; } @@ -218,11 +200,7 @@ const tech: { name: string; sub: string; p: string; fig?: boolean; links: Link[] .lg-loop { grid-template-columns: repeat(3, minmax(0, 1fr)); } } @media (max-width: 1023px) { - .lg-map { grid-template-columns: minmax(0, 1fr); } - .lg-flow { grid-auto-flow: column; justify-content: center; gap: 32px; padding: 12px 0; } - .lg-zone { align-self: stretch; } - .lg-flow span { display: flex; align-items: center; gap: 6px; min-height: 0; } - .lg-flow .ms { font-size: 22px; transform: rotate(90deg); } + .lg-setup { grid-template-columns: minmax(0, 1fr); gap: 28px; } .lg-loop { grid-template-columns: repeat(2, minmax(0, 1fr)); } .lg-tech-row { grid-template-columns: minmax(0, 1fr); gap: 8px; } .lg-tech-body.has-fig { grid-template-columns: minmax(0, 1fr); gap: 20px; } @@ -230,8 +208,6 @@ const tech: { name: string; sub: string; p: string; fig?: boolean; links: Link[] } @media (max-width: 599px) { .lg-lead { margin: -16px 0 24px; font-size: 15px; line-height: 26px; } - .lg-zone { padding: 20px 18px; } - .lg-flow { gap: 16px; } .lg-loop { grid-template-columns: minmax(0, 1fr); } .lg-num { font-size: 36px; } .lg-tech-row { padding: 22px 0; }