課題地図を9秒で去る人に1つ読ませたい ― 最初の画面を写真つきの3課題に

この記事の素材(コード・ログ・データ 6ファイル・まとめてダウンロードあり)
AIで読む ChatGPT・Claude などで、この記事に質問できます

pixelstomotors.com の課題地図(/issues)は、2026年10月26日から11月14日までに人が21回開いたが、表示時間の真ん中の値は9秒で、25%より下まで進んだのは1回、課題地図の中のリンクを押したのも1回だった。 そこで最初の画面を、42件の課題のうち緊急度と深刻度が最も高い3件を写真つきのカードで並べ、ボタンを「42件すべてを見る」の1つにする形に変えた。

この直しで、次のことが変わりました。

  • 開いた人が、最初の画面で「まず何を読めばいいか」を3つの課題として受け取れるようになった。前は、見出しと長い説明文と数字5つのあとに、ボタンが2つ並んでいた
  • 同じ42件の課題の名前が、分類の箱と一覧で2回並ぶことがなくなった。目立たせる印(42件中26件に付いていた)もなくなった
  • サイトのトップにあった課題地図のバナーは「36件」のまま古くなっていた。課題のデータから件数を数える形に作り直し、トップの下のほうから上から5分の1ほどの位置へ上げた
  • かかった時間は、改修案を出してから課題地図の公開まで約40分(08:41〜09:20ごろ)、トップのバナーが約5分(09:31〜09:35)。エイイチが手を動かしたのは、方向を選ぶ・写真を選ぶ・Studio.Stock にログインする・写真の切り抜き方を指示する、の4つ。効いたかどうかは、課題地図から課題ごとのページへ進んだ回数で、この先の人の表示が30回を超えてから確かめる(下の作業ログの「効いたかの見方」)

課題地図は、フィジカルAI(現実の物を動かす AI)とロボットが社会で使われる前に解いておかないといけない課題を、技術・制度・体験の3つの視点で42件に整理したページです。週に1回、各課題に関わる新しい動きを出典つきで足しています。このサイトの中では、研究の記録と並ぶもう1つの柱のつもりで作ってきました。

ところが、週の分析でサイトの計測(ページごとに、人がどこまで下に進んだか・何秒いたか・どこを押したかを数える自前の仕組み)を見ると、課題地図は「開いて、9秒ほど見て、離れる」使われ方をしていました。TOP(40回)に次いで、GPU を買うか借りるかのページと並んで2番目に多く開かれているのに、中身はほとんど読まれていません。

やったことなぜ結果
週の3つの数字とページごとの読まれ方を見た
週の分析
課題地図は21回開かれ、25%より下まで進んだのは1回
課題地図から次にどこへ移ったかを見た
中を回っているかを確かめるため
21回のうち、次の行き先の記録があるのは4回。課題ごとのページの表示は合わせて4回ほど
改修の方向を3つ出した
何を主役にするかを先に決めるため
エイイチが「まず読む3つ」を選んだ
カードの印を、番号 → アイコン → 写真と替えた
アイコンだけでは物足りないとエイイチが判断したため
Studio.Stock の AI で作られた写真3枚に決めた
課題地図を直して公開した最初の画面で1つ開かせるため
3課題のカード・ボタン1つ・分類の箱から名前の一覧を外した
トップの課題地図のバナーを作り直した
「36件」のまま古くなっていたため
件数を自動で数え、位置を上げた

作業ログ ― 週の分析から課題地図とトップのバナーの公開まで

ここから下は、作業の順に、取った数字・決めたこと・コードを全部残す。効果の数字は、測った値と見込みを分けて書く。直した後の数字はまだ取れていないので、「見込める効果」は見込み。

11/9の週の3つの数字:AI の依頼読みは40、人の表示は68(6日分)

このサイトで主に見る3つの数字は、AI の利用者の依頼で読みに来た数(ChatGPT・Claude・Perplexity などが、だれかに頼まれてページを取りに来た回数)、AI のサービスのリンクから来た人の数、サイト名で検索して来た人の数。11月14日の朝に、計測をつないだ道具(MCP の kpi・site_usage・crawler_visits)で取った。下の表は記事を書くときに取り直した数(09:38)で、11/9 の週の AI の依頼読みは、朝の39から40に1つ増えている。

週(月曜はじまり)AI の依頼読みAI のリンクから来た人サイト名の検索人の表示
10/26〜11/15500164
11/2〜11/86130(途中の数)136
11/9〜11/14(6日)401まだ記録していない68

この週に、AI の依頼読みの中に初めて Perplexity-User(Perplexity の利用者の依頼で読む仕組みの名乗り)が5件出た。1件ずつの時刻を出すと、11月13日 05:03 の1秒の間に /settings・/manage/env・/__debug__/ など、設定や秘密の値の置き場所を探す住所を取りに来ていた。同じ時刻帯に、GPTBot・ClaudeBot・Googlebot など20種ほどの名乗りを順に使って、/.aws/credentials・/gcp-key.json・/.git/config のような住所を探す記録が並んでいた。AI の名乗りを借りて、秘密のファイルを探して回る機械だった。 どれもサイトにはない住所で、すべて404(ページがない)を返している。この5件を除くと、この週の AI の依頼読みは35になる。ChatGPT-User を名乗った同じ種類の4件は、Cloudflare が本物ではないと判定していて、もともと数に入っていなかった。

もう1つ見つかったのは、ページの中で組み立てる前のプログラムの書きかけ({s.img.startsWith('/'))を、GPTBot と ClaudeBot がリンクの行き先と読んで取りに来ていた記録。これはサイトに実在しない住所の404で、前に「コードの中の文字列を住所と読んだ404は直さない」と決めた種類のもの(LOG411)。

人の表示が11/11 から急に減っている件は、LOG494 で調べて、原因はまだ決められないとしたまま。Search Console(Google の検索での表示回数を見る道具)の数が出そろうのを待っている。

ページごとの読まれ方:TOP と並んで、課題地図と GPU のページが多く開かれていた

人の表示だけを、ページごとに数えた(10/26〜11/14)。

ページ人の表示表示時間(真ん中の値)25%まで50%まで75%まで下まで
TOP(/)4015秒70%48%28%18%
GPU は買うか借りるか(/gpu-buy-or-rent)
2111秒52%52%10%0%
課題地図(/issues)219秒5%0%0%0%
4コマの一覧(/manga-archive)
149秒21%7%7%0%
導入シミュレーションのシリーズ(/series8)
1215秒17%17%17%8%
LOG18(Figma のバリアブルとスタイル)
1153秒91%64%27%9%
メッセージ(/message)
1110秒100%100%91%9%
LOG17(4コママンガの SNS 投稿術)
730秒86%86%43%0%
LOG12(ハコブくんの管理画面の UI デザイン)
639秒100%67%50%33%

最後まで読まれているのは、初期の DAY の記事(12・17・18)だった。3本とも「薬剤搬送ロボット」のシリーズの中で書いた、Figma の色の管理や管理画面のデザインの解説で、ロボットの研究そのものより、29年のデザイナー経験から書いた内容になる。ページごとにどこから来たかは今回は取っていないので、検索から来ているかは確かめていない。

GPU のページは、10/28 の改善(改善 No.01)で最初の画面に結論を出した。そのとき「結論を読んで前半で離れるのは失敗ではない」と決めているので、75%まで進むのが1割という形は狙いどおりになる。見るべきなのは計算機(#calc)が押されるかで、こちらはまだ0回。

課題地図は、表示は GPU のページと同じ21回なのに、25%より下まで進んだのが1回だけだった。

課題地図から次にどこへ移ったか:21回のうち、課題地図の中を回ったのは1回

計測は、ページからページへの移り方も記録している。課題地図にかかわる移り方を抜き出した。

移り方回数
課題地図 → 4コマの一覧(/manga-archive)
2
課題地図 → 課題地図の更新履歴(/issues/updates)
1
更新履歴 → 4コマの一覧1
記事(配膳ロボットの隠れた待ち)→ 課題地図
1
TOP → 課題地図1
記事(LOG126)→ 課題地図
1
課題「動作のポータビリティ」→ ロボティクスの単語帳の記事
1

課題地図を開いた21回のうち、次の行き先の記録があるのは4回で、残りの17回はそのページで閉じたか、前のページに戻ったと考えられる。課題ごとのページの表示は、責任の分け方(/issues/liability-demarcation)が2回、シミュレーションと実機の差(/issues/sim2real-gap)が1回、動きの持ち運び(/issues/motion-portability)が1回だった。課題地図への入り口は、ヘッダーのメニューの「課題地図」が5回押されていた。メニューを順に見て回る人が、中身を読まずに次へ移っている形に見える。

エイイチは、ここまでで十分と判断した。

いやもう十分でしょ。改修案を考えてください。

Claude は直前に、どのページも人の表示が30回に届いていないので、直しても効いたかは判断できない見込みだと伝えていた(Web の改善の決まりで、対象の数が30未満なら「判断できない」とする)。11/5 には「次に直すのは TOP。11/16 の分析で決める」とも決めていた。エイイチはそれを踏まえて、課題地図を先に直すことにした。

課題地図の中身を確かめた:同じ42件が2回並び、印は42件中26件に付いていた

課題地図のトップ(p2m-site の src/pages/issues.astro)の並びは次のとおりだった。

  1. 最初の画面:見出し、長い説明文(「個別のデモ動画や製品発表ではなく、放置すればフィジカルAIの社会実装そのものが頓挫する——」)、数字5つ(42課題・9分類・9規制・50出典・17件の最近の動き)、ボタン2つ(課題一覧を見る・関連でたどる課題マップ)
  2. 最近の動き(6件)
  3. 9つの分類:分類ごとの箱の中に、その分類の課題の名前を全部並べている(合わせて42件)
  4. 社会実装で論点となる規制・制度
  5. すべての課題:42件のカード(2回目)
  6. この課題地図について
直す前の課題地図の最初の画面。見出しと長い説明文、数字5つ、ボタン2つが並ぶ
直す前の「9つの分類」。分類ごとの箱の中に課題の名前が全部並び、緊急度と深刻度がどちらも4以上の課題は濃い字になっている

「9つの分類」の箱の中では、緊急度と深刻度がどちらも4以上の課題を濃い字にしていた。数えると、42件のうち26件がこれにあたる。半分以上に付いた印は、どれが大事かを伝えられない。

改修の方向を3つ出した:エイイチは「まず読む3つ」を選んだ

案は、並べ方の違いではなく、何をページの主役にするかの違いで出す(デザインの進め方の決まり)。

方向主役よい所弱い所
A:「まず読む3つ」
緊急度と深刻度が最も高い3課題
9秒で離れる人に、1つでも課題を開かせる
3つ以外の課題は、下まで進まないと見えない
B:「今週の動き」
今週わかった動き3件(出典つき)
週1回の更新が見え、また来る理由になる
動きが少ない週は、最初の画面が弱くなる
C:「地図」
課題どうしのつながりの図(今の /issues/map)
名前のとおりで、見た目の印象が強い
スマホでは図が小さく押しにくい。作り直す量がいちばん多い

どの方向でも、最初の画面のボタンは1つにする(2つあると迷う)。エイイチは A を選んだ。

緊急度と深刻度がどちらも満点(5と5)の課題は5件ある。並べ方の決まり(深刻度 → 緊急度 → 番号の順)で上から3件を取ると、介護現場へのロボット導入の壁(1番)、実機データの圧倒的不足(5番)、動作のポータビリティ不在(17番)になった。残りの2件は、人とロボットの共存安全基準(21番)と、物理を持つAIのセキュリティ(28番)。上の3件はどれも、このサイトでやっている研究(病院や店のロボットの試算、実機での学習、Motion UX)に近い。

最初の画面だけを先に作った:説明文を1文にし、3課題のカードとボタン1つ

デザインの進め方の決まりどおり、最初の画面1枚だけを先に仕上げて見せた。説明文を「放っておくと、ロボットが現場に入る前に止まってしまう課題を42件に整理しました。まず読むなら、この3つです。」の1文にした。数字5つは、ボタンの下の小さい1行(9分類・50出典・最近の動きを最後に調べた日)にまとめた。課題マップへのボタンは外し、42件の一覧の説明文の中の文字リンクに移した。上のタブからも行ける。

最初の案では、カードの頭に「01・02・03」の番号を置いた。エイイチから、番号より写真かアイコンのほうがよいのでは、と言われ、サイトで使っているアイコン(Material Symbols)に替えた。介護は歩く高齢者の人、実機データはデータベース、動きの持ち運びは左右の矢印。アイコンにした画面を見たエイイチの判断は「アイコンだけでは物足りない」だった。

写真が3枚そろうまではアイコンのままにし、そろったら写真に替わる作りにした。1枚だけ写真になると、そろって見えないため。

写真を Studio.Stock で探した:ロボットの写真はなく、人と現場の写真から選んだ

エイイチから、無料の写真の置き場所として Studio.Stock を教えてもらった。Studio.Stock は、Web 制作の道具 Studio が出している写真の置き場所で、写真はすべて AI で作られたもの。Studio のヘルプでは、商用利用ができ、クレジットの表記もいらないとされている(Studio.Stock のヘルプ)。ダウンロードには Studio のアカウントでのログインがいる。

ページは開いてから中身を組み立てる作りで、外から取るだけでは検索の結果が読めなかった。そこでデスクトップアプリの中のブラウザで開き、英語の言葉で検索した結果から、写真の名前と番号を抜き出した。

検索の言葉出てきたもの
robot arm
腕を鍛える人、肩の骨の模型、生姜 など(ロボットはなし)
robot
モーションキャプチャーの服の人、工場の作業者、金属部品を見る技術者 など
elderly care介護職員と高齢者の写真 8枚
motion captureダンスの動き・光の線 など
factory machine
工場の作業者・金属部品を測る人 など
technology lab
研究者が動きのデータを見ている写真 など
caregiver hospital
介護職員が高齢者を手伝う写真 6枚

ロボットが写った写真は1枚もなかった。 課題に近い人と現場の写真を11枚選び、並べてエイイチに見せた。

Studio.Stock で選んだ候補11枚。介護A〜D、データA〜C、動作A〜D

Claude は介護B(車いすを押す介護職員の後ろ姿)とデータB(研究者2人が人の動きの骨組みを画面で見ている)を勧め、3枚目は合う写真がないので、Studio.Stock のプロンプト編集(文字の指示で写真を直す機能)か ChatGPT で作ることを勧めた。エイイチが選んだのは、介護A(笑顔の介護職員)・データB・動作D(工場の技術者)だった。カードに入れた画面を見て、3枚目を動作A(工場の通路を書類を持って歩く作業者)に替え、さらに顔は見せなくてよいと指示があったので、胸から下で切り抜いた。

写真は、Mac の上で Studio.Stock の置き場所から元の大きさのまま取り、iCloud の PixelstoMotors/issues_images/top3_original/ に置いた。そこからカード用に 16:10・1200×750 の jpg に切り抜いた(顔の位置に合わせて、縦長の写真は上下の切り抜く位置を変えた)。公開用は Cloudflare R2(このサイトの画像と動画の置き場所)に issues-top3-*.jpg の名前で入れた。置き場所は MASTER の保存先の表に1行足した。

  • ねらい:9秒で離れる人に、最初の画面で課題を1つ開かせる
  • 変わったこと:最初の画面が「見出し・長い説明文・数字5つ・ボタン2つ」から「見出し・1文・写真つきの3課題・ボタン1つ」になった
  • 見込める効果:課題地図から課題ごとのページへ進む回数が増える(直す前は21回のうち1回ほど)。見込みで、まだ測っていない

スマホでは写真を左の正方形にした:1枚目のカードで画面が埋まったため

写真をカードの上に横長で入れると、スマホでは1枚目のカードだけで画面が埋まり、2枚目以降が見えなくなった。スマホのときだけ、写真を左の96px の正方形にし、課題の名前と要約を右に並べる形にした。これで最初の画面で2枚目のカードの頭まで見える。

直した後の課題地図の最初の画面(PC)。写真つきの3課題のカードと、ボタン「42件すべてを見る」
直した後の課題地図の最初の画面(スマホ)。写真を左の正方形にし、2枚目のカードの頭まで見える

公開したあと、エイイチから説明文の改行の指示があった。「…課題を42件に整理しました。」と「まず読むなら、この3つです。」の間で改行し、PC で「3つです。」だけが次の行に落ちないようにした。

分類の箱から課題の名前の一覧を外した:42件が2回並ばないように

「9つの分類」の箱には、分類の名前・件数・説明だけを残した。課題の名前は、下の「すべての課題」のカードで1回だけ見える。箱の中の濃い字(目立たせる印)も、一覧と一緒になくなった。

直した後の「9つの分類」。箱には分類の名前・件数・説明だけが残る

トップの課題地図のバナーを作り直した:「36件」のまま古くなっていた

課題地図を公開したあと、エイイチから「TOPのバナーが古いので新しくしてください」と指示があった。トップの「記録」の一覧の下に置いていたバナー(public/embeds/top-banner.html を iframe で読むもの)は、課題が36件だったころの「PHYSICAL AI — 36 ISSUES TO SOLVE」と、36個の丸の図のままだった。字も、サイトの今の字(Inter と Noto Sans JP)ではなく、前の IBM Plex Mono だった。

直す前のトップの課題地図のバナー。36件のころの英字と丸の図のまま

この部品は、公開済みの記事(LOG343・LOG344)がコードの中に載せているので、消さずに残した。代わりに、トップのページの中に直接組む部品(src/components/IssuesBanner.astro)を新しく作った。件数は課題のデータから数えるので、課題が増えても「42件・9分類」が自動で合う。右には課題地図と同じ写真3枚を、課題の名前つきで並べた。形は、すぐ上の「1年の記録」のバナーにそろえた(白いカード・左に文字・右に写真・ボタン1つ)。

作り直している途中で、エイイチから、バナーのページの中での位置ももっと上に、と指示があった。トップは、25%の深さまで進むのが7割、半分までが5割しか読まれていない(上の表)。「記録」の一覧の下(ページの上から約8割の所)から、「Pixels to Motors の1年」のすぐ下(上から約5分の1の所)へ上げ、「課題地図 | Issues」の見出しを付けた。見出しと同じ「課題地図」の小さなラベルは、カードの中から外した。

直した後のトップの課題地図のバナー。写真3枚と、課題のデータから数えた「42件・9分類」
  • ねらい:トップから課題地図へ来る人を増やす
  • 変わったこと:バナーの位置がトップの上から約8割 → 約5分の1になり、件数が36件 → 42件(自動)になった
  • 見込める効果:トップから課題地図への移り方(今は TOP → 課題地図が1回)が増える。見込みで、まだ測っていない。バナーには data-ev="TOP:課題地図" を付けたので、押された数は計測の「押したもの」に出る

効いたかの見方:課題地図から課題ごとのページへ進んだ回数

直す前の課題地図は、人の表示21回のうち、課題地図の中のリンクを押したのが1回、課題ごとのページの表示が合わせて4回ほどだった。直した後は、次の2つを見る。

見るもの
直す前(10/26〜11/14)
取れる場所
課題地図 → 課題ごとのページへの移り方
ほぼ0(課題地図 → 更新履歴の1回だけ)
計測の移り方(site_usage の moves)
「まず読む3つ」のカードが押された回数
なし(カードがなかった)計測の押したもの
トップのバナーが押された回数
記録なし(iframe の中だったため数えていない)
計測の押したもの(TOP:課題地図)

課題地図の人の表示は、この3週間で21回。30回に届くまでは「判断できない」とする。11/16 の週の分析で途中の数を見て、Web の改善の記録(web_improvement_trial.md)に改善 No.04 として書く。

作業ログ ― コード・データ・手順

この記事のコード・ログ・データは、1ファイルずつ下に置いています。全文はリンク先にあります。

ファイルの一覧(6本)

01_sec02.txt ― 課題地図のトップの変更(commit cf784da・src/pages/issues.astro)・9,339字

02_sec02.txt ― 課題地図のトップの全文(公開後の src/pages/issues.astro)・9,604字

03_sec02.txt ― トップの課題地図のバナー(新しい部品 src/components/IssuesBanner.astro)・3,011字

04_sec02.json ― 主な3つの数字(kpi_since1026.json・/api/kpi-stats)・26,103字

05_sec02.json ― 人の表示のページごとの読まれ方(ev_human_since1026.json・/api/ev-stats?who=human)・39,375字

06_sec02.json ― Perplexity-User を名乗った訪問(cr_since1109_perplexity_user.json・/api/cr-stats)・19,674字

ここから下は、公開したコードの変更と、分析に使った数字の元データを全部載せる。数字の元データは、記事を書くときに取り直したもの(2026-11-14 09:38 JST に、Mac から計測の表を鍵つきで取った)。来た所(referrers)のうち、住んでいる場所が分かる自治体のサイトの名前は <自治体のサイト> に置き換えた。

課題地図のトップの変更(commit cf784da・src/pages/issues.astro)

最初の画面を「まず読む3つ」とボタン1つにし、分類の箱から課題名の一覧を外した変更。写真がそろうまではアイコンで出す作りも入っている。

01_sec02.txt9,339字・164行・diff
commit cf784daf271e9ddb269ba57d042df6d602d55951
Author: Claude <noreply@anthropic.com>
Date:   Sat Nov 14 09:19:30 2026 +0900

    課題地図のトップ:最初の画面を「まず読む3つ」(写真つき)とボタン1つに。分類の箱から課題名の一覧を外した
    
    Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>
    Claude-Session: https://claude.ai/code/session_01LevEXS2w3GWf5pnT1ChrKx
別のタブで開く保存

説明文の改行(commit 58f31c9)

commit 58f31c91dd61fe60adfc5e34ce03412566187ef2
Author: Claude <noreply@anthropic.com>
Date:   Sat Nov 14 09:24:31 2026 +0900

    課題地図のトップ:説明文を「整理しました。」で改行
    
    Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>
    Claude-Session: https://claude.ai/code/session_01LevEXS2w3GWf5pnT1ChrKx

diff --git a/src/pages/issues.astro b/src/pages/issues.astro
index f291d9e..aa814a6 100644
--- a/src/pages/issues.astro
+++ b/src/pages/issues.astro
@@ -34,7 +34,7 @@ const jsonLd = {
   <section class="ihero">
     <p class="ihero-k">課題地図</p>
     <h1 class="ihero-h">{ISSUES_TITLE}</h1>
-    <p class="ihero-lead">放っておくと、ロボットが現場に入る前に止まってしまう課題を{issues.length}件に整理しました。まず読むなら、この3つです。</p>
+    <p class="ihero-lead">放っておくと、ロボットが現場に入る前に止まってしまう課題を{issues.length}件に整理しました。<br />まず読むなら、この3つです。</p>
     <ol class="top3">
       {top3.map((i) => (
         <li>

課題地図のトップの全文(公開後の src/pages/issues.astro)

02_sec02.txt9,604字・179行・astro
---
// 課題地図のトップ(/issues)
import IssuesLayout from '../layouts/IssuesLayout.astro';
import IssueCard from '../components/issues/IssueCard.astro';
import NewsList from '../components/issues/NewsList.astro';
import { allIssues, CATEGORIES, REGULATIONS, SOURCES, NEWS, LAST_CHECKED, ISSUES_TITLE, jdate } from '../lib/issues';
import { SITE, PUBLISHER } from '../lib/seo';
別のタブで開く保存

トップの課題地図のバナー(新しい部品 src/components/IssuesBanner.astro)

03_sec02.txt3,011字・52行・astro
---
// 課題地図(/issues)への入口。TOP の「記録」の下に置く(2026-11-14)
// 前は public/embeds/top-banner.html(36件のドット地図・iframe)。LOG343・LOG344 が同じ部品を載せているので、その部品は消さずに残してある
// 件数は課題のデータから数える。写真は課題地図のトップの「まず読む3つ」と同じ(R2 の issues-top3-*.jpg)
import { allIssues, CATEGORIES } from '../lib/issues';
const n = (await allIssues()).length;
const photos = [
  ['/media/issues-top3-caregiving.jpg', '介護現場へのロボット導入の壁'],
別のタブで開く保存

トップのページへの組み込み(commit 611ff96・src/pages/index.astro)

「記録」の下の iframe(top-banner.html)を外し、1年の記録の次に「課題地図 | Issues」の節を足した。

commit 611ff9639037faf87669748989d1eddd70c509e0
Author: Claude <noreply@anthropic.com>
Date:   Sat Nov 14 09:35:11 2026 +0900

    TOP:課題地図のバナーを新しくした(件数を課題のデータから数え、写真3枚)。位置を「記録」の下から1年の記録の次へ上げた
    
    元の public/embeds/top-banner.html は LOG343・LOG344 が載せているので残した
    
    Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>
    Claude-Session: https://claude.ai/code/session_01LevEXS2w3GWf5pnT1ChrKx

diff --git a/src/pages/index.astro b/src/pages/index.astro
index d3db8eb..7a87a3c 100644
--- a/src/pages/index.astro
+++ b/src/pages/index.astro
@@ -14,6 +14,7 @@ import LoadMore from '../components/LoadMore.astro';
 import GuideCards from '../components/GuideCards.astro';
 import ThinkingBanner from '../components/ThinkingBanner.astro';
 import OneYearBanner from '../components/OneYearBanner.astro';
+import IssuesBanner from '../components/IssuesBanner.astro';
 import TopAiGuide from '../components/TopAiGuide.astro';
 import BrowserSimTest from '../components/BrowserSimTest.astro';
 import { allManga } from '../lib/records';
@@ -132,6 +133,13 @@ const jsonLd = [
     <OneYearBanner />
   </div></section>
 
+  <!-- 課題地図(/issues)への入口(2026-11-14)。前は「記録」の下の iframe(top-banner.html・36件のドット地図)だった。
+       TOP は25%の深さまでで7割、半分まで5割しか読まれないため、1年の記録の次へ上げた(エイイチの指示) -->
+  <section class="sec"><div class="panel">
+    <h2 class="sec-h">課題地図 | Issues</h2>
+    <IssuesBanner />
+  </div></section>
+
   <!-- 導入前ガイド:LP 2つ(GPU を買うか借りるか・配膳ロボットの導入前シミュレーション)への入口 -->
   <section class="sec"><div class="panel">
     <h2 class="sec-h">導入前ガイド | Guide</h2>
@@ -174,7 +182,6 @@ const jsonLd = [
   <section class="sec" id="record"><div class="panel">
     <h2 class="sec-h">記録 | Record</h2>
     <LoadMore limit={12} total={records.length}>{records.map((c) => <RecordCard item={c} />)}</LoadMore>
-    <div class="embed-banner"><iframe src="/embeds/top-banner.html" sandbox="allow-scripts allow-popups allow-popups-to-escape-sandbox allow-top-navigation-by-user-activation" title="お知らせ" data-embed style="height:240px"></iframe></div>
   </div></section>
 
   <!-- ロボットに関わる人へ(2026-11-12)。相手ごとに、困りごと → 作れるもの → 裏づけの記録。

Studio.Stock の写真を Mac に取ったコマンド

Studio.Stock にログインしたあと、選んだ写真の元の画像を、写真の番号から取った。

cd "$HOME/mnt/PixelstoMotors" && mkdir -p issues_images/top3_original && cd issues_images/top3_original
for p in "Y9IKnc705GbYbdc5Oh3wQ caregiving" "YUQoYePLY0UggDHvD_b_X data" "3G_9DIXCkFlKm5QZJtdEU motion"; do
  set -- $p
  curl -sSf -o "$2_$1.png" "https://storage.stock.studio.design/images/$1.png"
done
# 3枚目を替えたとき
curl -sSf -o motion_YurzumT_a563fgTqeHbzQ.png "https://storage.stock.studio.design/images/YurzumT_a563fgTqeHbzQ.png"

写真をカード用に切り抜いたスクリプト(1回目)

from PIL import Image
import glob, os
# 1回目(介護A・データB・動作D)。top は、縦長の写真で切り抜く位置を上からどれだけ下げるか(0〜1)
for f, name, top in [("caregiving", "issues-top3-caregiving.jpg", 0.25), ("data", "issues-top3-data.jpg", 0.5), ("motion", "issues-top3-motion.jpg", 0.2)]:
    src = glob.glob(f"top3_original/{f}_*.png")[0]
    im = Image.open(src).convert("RGB"); w, h = im.size
    tw, th = (w, int(w * 10 / 16)) if w / h < 1.6 else (int(h * 16 / 10), h)
    x = (w - tw) // 2; y = int((h - th) * top)
    im.crop((x, y, x + tw, y + th)).resize((1200, 750), Image.LANCZOS).save(name, quality=84, optimize=True, progressive=True)
    print(name, os.path.getsize(name), (w, h))

切り抜きの出力(1回目)

issues-top3-caregiving.jpg 76266 (896, 1344)
issues-top3-data.jpg 125350 (1672, 941)
issues-top3-motion.jpg 94235 (1152, 1536)

3枚目を動作A に替えて切り抜き直したスクリプト

from PIL import Image
# 3枚目を動作A に替え、顔を入れずに胸から下で切り抜いた(top=0.62)
im = Image.open("top3_original/motion_YurzumT_a563fgTqeHbzQ.png").convert("RGB"); w, h = im.size
th = int(w * 10 / 16); y = int((h - th) * 0.62)
im.crop((0, y, w, y + th)).resize((1200, 750), Image.LANCZOS).save("issues-top3-motion.jpg", quality=84, optimize=True, progressive=True)
print(y)

R2 に入れたコマンド(tools/upload_media.py)

# upload_media.py は、フォルダの下の画像を全部入れるので、カード用の3枚だけを別のフォルダに写してから入れた
mkdir -p up && cp "$HOME/mnt/PixelstoMotors/issues_images/"issues-top3-*.jpg up/
python3 um.py up

R2 に入れた出力

入れる 3・入っている 0・名前の重なり 0・合計 0.3MB
  3/3
おわり

記事のために計測の数字を取り直したコマンド

鍵は KIOXIA の p2m_stats_key.txt から読み、画面にもログにも出していない。

D="$HOME/mnt/PixelstoMotors/デジタルツイン学習R2R2R/記事/LOG507_data"; mkdir -p "$D"
K=$(head -c 400 "$HOME/mnt/KIOXIA/p2m_stats_key.txt" | tr -d '\r\n ')
g(){ curl -sS -H "Authorization: Bearer $K" "https://pixelstomotors.com$1" -o "$D/$2" -w "$2 %{http_code} %{size_download}\n"; }
g "/api/kpi-stats?format=json&since=2026-10-26&until=2026-11-14" kpi_since1026.json
g "/api/ev-stats?format=json&since=2026-10-26&who=human" ev_human_since1026.json
g "/api/cr-stats?format=json&since=2026-11-09&bot=Perplexity-User" cr_since1109_perplexity_user.json

取り直しの出力

kpi_since1026.json 200 18367
ev_human_since1026.json 200 30955
cr_since1109_perplexity_user.json 200 15297
2026-11-14 00:38 UTC

主な3つの数字(kpi_since1026.json・/api/kpi-stats)

04_sec02.json26,103字・1,399行・json
{
 "since": "2026-10-26",
 "until": "2026-11-14",
 "pendingDays": [],
 "byWeek": [
  {
   "week": "2026-10-26",
   "days": 7,
別のタブで開く保存

人の表示のページごとの読まれ方(ev_human_since1026.json・/api/ev-stats?who=human)

05_sec02.json39,375字・2,159行・json
{
 "total": 6591,
 "counted": 367,
 "truncated": false,
 "since": "2026-10-26",
 "week": null,
 "who": "human",
 "byWeek": [
別のタブで開く保存

Perplexity-User を名乗った訪問(cr_since1109_perplexity_user.json・/api/cr-stats)

11/9 からの全クローラーの数と、Perplexity-User の1回ずつの訪問(hits)。errors には、同じ時刻帯に秘密のファイルの置き場所を探した404 が並んでいる。

06_sec02.json19,674字・1,071行・json
{
 "total": 10385,
 "truncated": false,
 "since": "2026-11-09",
 "bot": "Perplexity-User",
 "byBot": [
  {
   "bot": "meta-externalagent",
別のタブで開く保存

次は、11/16 の週の分析で、課題地図から課題のページへ進んだ回数を見る

課題地図の人の表示が30回に届くまでは、効いたかは判断できない。11/16 の分析では、途中の数として、課題地図 → 課題ごとのページへの移り方、「まず読む3つ」のカードとトップのバナーが押された回数を見て、改善 No.04 として記録する。あわせて、Search Console で 11/10〜11/13 の検索の表示回数を見て、人の表示が減った件(LOG494)の続きを確かめる。