トンマナv1.0で
緻密に作り直したワイヤーフレーム

SC-001 ようこそ STEP 1/7

主役 家画像 + 詩的タイトル「あなたの家のエネルギーを、賢く動かす。」+ 暖色グラデ背景

単独で開く →

SC-002 QR読込 STEP 2/7

演出 ダーク背景でカメラUI ／ 4隅Coral コーナーマーカー ／ scan線アニメ ／ 手動入力代替リンク

単独で開く →

SC-003 新規登録/ログイン STEP 3/7

構成 新規/ログイン pillタブ切替 ／ メール+パスワード入力 ／ 同意チェック ／ Apple/Google SNS代替

単独で開く →

SC-004 SMS/メール認証 STEP 4/7

構成 6桁OTP（filledデモ） ／ 残り時間タイマー pulse ／ ヒントカード ／ 再送信リンク

単独で開く →

SC-005 機器ペアリング STEP 5/7

演出 radarPing ／ 4機器リスト（3接続済✓ / 1探索中scan線） ／ ECHONET Lite + Wi-SUN 表記

単独で開く →

SC-005B Bルート連携 STEP 6/7

構成 3分岐選択カード（直接入力=おすすめ Coral ／ 代理申請 Mustard ／ あとで Ink）+ 「おすすめ」バッジ

単独で開く →

SC-006 初めての到達 STEP 7/7

演出 祝福radial光 + 紙吹雪 + ✓バッジpopアニメ + 家画像 + 4機器接続済chip

単独で開く →

SC-101 ホーム ／ 朝 07:24 ／ Coral active

主役 Mustard 帯「太陽が今月働いてくれた金額」 ¥4,820 ／ Coral pillで「¥4,180 家計に残った」

ピン階層 家=親レイヤー（白ソリッド+coral border+halo）／ 太陽光・蓄電池・系統=子レイヤー（半透明ガラス）

整合 家全体 2.0 kW ＝ 太陽光 1.4 + 蓄電池 0.6 + 系統 0.0（合計整合）

単独で開く →

SC-105 ホーム ／ 夜 22:14 ／ 夜モード

主役 Mint 帯（夜は蓄電池が主役）「蓄電池が今日、家を支えてくれた金額」¥620 ／ pill で月累計¥4,820

演出 9段階空グラデで 境界曖昧化 ／ 家画像CSSフィルタ夜化（brightness 0.5 / hue-rotate 200deg）／ 星7つtwinkle

明日 明日のスケジュール帯はMustardに切替（夜→翌朝の太陽への期待）

単独で開く →

SC-103err ホーム ／ 異常検知 14:08 ／ Alert

主役 Alert帯「いまは太陽光と系統で家を動かしています」／ 通信断で蓄電池ピンが点滅 / 自動復旧 3/5回目

演出 最上部に Coral警告バナー（pulse）／ 雲多めグレー寄り背景 / 家画像 saturate(0.65) で覇気を抑える

配慮 「ハチドリが遠隔監視中」で不安を煽らない。生活への影響なしを明示

単独で開く →

SC-802 通知センター（一覧） 14:08 ／ Alert

主役 サマリ 2カラム（対応中 1 / 今日 4）+ 進行中カード（Alert帯）を最上段に

構成 時系列グルーピング（進行中 / 今日 / これより前）／ 色分けアイコン（Alert/AI/OK/Info/System）

配慮 「○日連続トラブルなし」の安心メッセージで締める／ 通知への向き合い方を "穏やかさ" ベースに

単独で開く →

SC-801 アラート詳細 14:08 ／ Alert

主役 Alert帯「3分間 通信断」+ 自動復旧プログレスバー（3/5回目）/ 推定復旧 2分以内

構成 タイムライン（5イベント）/ ハチドリの3アクション / ユーザー任意3ステップ / サポートCTA

配慮 「無理に触らなくて大丈夫」の安心メッセージ / Mint帯で「ハチドリがやっていること」を可視化

単独で開く →

SC-803 守りモード（災害時） 13:42 ／ Guardian

主役 Alert tint バナー + Coralグラデの盾アイコン＋呼吸アニメ／「i-Power が家を守っています」

構成 自動制御 4件（Mustard帯）／ 蓄電池準備（Mint帯・進捗バー）／ 単一CTA「守りモードのまま続ける」

配慮 「あなたは いつもどおりお過ごしください」 ／ 解除後は元のモードに自動復帰

単独で開く →

SC-805 停電中ホーム（自立運転） 14:53 ／ Outage

主役 Mint緑光＋盾アイコン／「あと 1h 35m」大数字 + "i-Power が家をバックアップ中"

構成 Alert帯バナー ／ 蓄電池進捗（Mint帯・52%→16:28まで予測）／ 動いている機器6種 ／ 延命Tips 3つ ／ ハチドリ電話・チャットCTA

配慮 ダーク背景＋Mint緑光で「電気は消えたが i-Power の光が残っている」演出 ／ 災害3部作の中核

単独で開く →

SC-804 停電復旧確認 16:30 ／ Recovery

主役 Mintホロー光＋大きなチェックアイコン／「16:30 復旧 ／ i-Power がその間ずっと電力を維持」

構成 守ったもの 3メトリクス（Mint帯）／ 反実仮想カード（Coral帯・"もし蓄電池がなければ"）／ 動いた機器 5台 ／ タイムライン

配慮 災害"後"のRELIEFを Mint で演出 ／ 反実仮想で価値最大訴求（SNS拡散導線含む）

単独で開く →

SC-301 くらし ／ 物語 5月 ／ Mint active

主役 Mint帯「あなたが今月、まちに分けた電気」28.4 kWh ／ 「1%は微力かもしれないけど、無力じゃない」

物語 4コマ生活シーン（朝コーヒー→昼太陽光→夕蓄電バトン→夜守り）／ 季節ヒント3つ ／ SNSシェアCTA

役割 情緒側の極。レポートの「数字」と対比する「物語」の場所

単独で開く →

SC-201 レポート ／ 数字 5月 ／ Twilight active

主役 Mustard帯「太陽が今月働いてくれた金額」¥4,820 ／ Before/Afterバー（通常¥18,000 vs 今月¥4,820）

グラフ 12ヶ月折れ線（mustard→coral グラデarea）／ 30日電源構成絶対量スタック ／ 過去月アーカイブ

役割 機能美の極。ApexChartsで4種類のチャート、データ密度MAX

単独で開く →

SC-401 機器 ／ 一覧 入口 ／ Mustard active

構成 4機器を縦リスト ／ 太陽光(Mustard)・蓄電池(Mint)・エコキュート(Coral)・EV(Twilight)

遷移 蓄電池タップで詳細へ（device-battery-v1.html）／ EV未接続は opacity 0.62

サマリ 上部に横スクロールチップで4機器の状態を瞬時把握

単独で開く →

SC-402 機器 ／ 蓄電池詳細 詳細 ／ Mustard active

主役 Mint帯「蓄電池の状態」／ SoCラジアルゲージ 68% ／ 充電速度+1.2kW・満充電まで2時間半

グラフ 24時間充放電（線→0方向グラデ）／ 充電 mint上向き／ 放電 coral下向き

情報 スペック表（i-Power 9.8 / 9.8 kWh / サイクル 312/6,000）／ 通信ステータス pulse

単独で開く →

SC-403 機器 ／ 太陽光詳細 12:30 ／ 発電中

主役 Mustard帯「いまの発電量 4.5 kW」+ 24h 実績/予測グラフ + 累計（今日18.4kWh / 今月552kWh）

パネル Twilight帯 / 12枚のソーラーパネル grid 表示 / 「12/12 正常」緑pulse

単独で開く →

SC-404 機器 ／ エコキュート詳細 14:30 ／ 待機中

主役 Coral帯「タンクのお湯 90%（333ℓ）」+ ラジアルゲージ + 残時間 6〜8時間

スケジュール 24時間タイムラインバー / 深夜沸き上げ + 夕方追加 / 「今」位置インジケータ

単独で開く →

SC-103 明日のスケジュール詳細 22:14 ／ AI予測

主役 Mint帯「予測自給率 94%」+ 24h 電力フロー積み上げ予測 + 発電22/消費15/売電7 kWh

提案 Coral帯 / 3つのAI提案リスト（食洗機/洗濯機/蓄電放電）+ 合計節約 ¥350

天気 Mustard帯 / 4時間帯（6/12/18/24時）の気温・天気アイコン

単独で開く →

SC-501 自動制御設定 9:18 ／ AIモード

主役 Mustard帯 / 3モード切替（自動 active / 提案 / 手動）+ 説明カード

優先度 Coral帯 / 節約60% / 快適30% / 環境10% を3色グラデバーで配分表示

ルール Mint帯 / 4ルール（太陽光連動/蓄電池自動/エコキュート最適/売電制御）+ トグル / Twilight帯通知設定

単独で開く →

SC-502 AI 提案 履歴 22:18 ／ Trust

主役 サマリ3指標（承認42 / 見送り8 / 節約¥3,820）+ フィルタChip3個

構成 時系列グループ（今日/今週/過去）／ 各行: アイコン色分け + 承認/見送りバッジ + 効果¥

配慮 見送り側に "機会損失 ¥35" を表示 ／ AI への信頼育成の核

単独で開く →

SC-503 自動制御 動作ログ 22:18 ／ AI Log

主役 大数字 "今日 5回" ヒーロー＋"¥360 多く節約 ／ 今週累計 31回"

構成 時系列ログ（今日/昨日/これより前）／ 時刻 × 機器アイコン × 動作 × 効果¥

配慮 「i-Power AI の日々の仕事」タイトルで AI の存在を可視化

単独で開く →

SC-601 モーダル ／ 提案承認 22:14 ／ Coral帯

主役 ホームの「承認する」CTAの先 / Coral帯「i-Power AI からの提案」+ 食洗機×太陽光ピーク提案

構成 対象/時刻/運転 詳細 + Mustard期待効果（¥120/100%）+ Mint根拠カード

単独で開く →

SC-602 モーダル ／ 自動実行切替 7:24 ／ Mint帯

主役 10日連続承認の学習結果 / Mint帯「今後はAIに任せませんか？」+ 連続バッジ + 統計

配慮 「3日連続見送れば自動で提案モードに戻る」逃げ道を明示して安心感

単独で開く →

SC-603 モーダル ／ 機器手動制御 14:30 ／ Mustard+Alert

主役 蓄電池 強制放電などの破壊的操作確認 / Mustard帯（実機械）+ 操作対象カード

警告 Alert帯「この操作で起きること」4項目 + Mint「通常はAIに任せることを推奨」推奨バー

単独で開く →

SC-MENU メニュー ／ 管理 設定 ／ Ink active

構成 プロフィールカード+5セクション（契約Coral/AI Mustard/機器Mint/通知Twilight/アカウントInk）

バッジ 未読「2件」coral pill ／ 「更新」mustard pill ／ 状態 透明pill

役割 実務側の極。Ink active で感情から距離を置く中立色

単独で開く →

SC-MENU-03 通知の設定 9:22 ／ 設定詳細

主役 6カテゴリ別カード（災害/機器/AI/レポート/お知らせ/静音時間）+ マスタートグル＋細分化

構成 災害は常時ON推奨（音とバイブ＋画面通知）／ レポート日次はデフォルトOFF

配慮 「池田さんに合う頻度を」のパーソナル呼びかけ

単独で開く →

SC-MENU-01 プロフィール編集 9:22 ／ 個人情報

主役 "あなたと、ご家族のこと" / Coralグラデのアバター + 編集ボタン

構成 基本情報 / ご家族の情報 / 設置住所 / アカウント削除（注意操作）

単独で開く →

SC-MENU-02 契約・料金プラン 9:30 ／ 契約

主役 "家を守る、約束のかたち" ／ Mustardグラデのプラン Hero + 月額 ¥20,000

構成 設置済み機器3つ ／ 月額内訳 ／ 契約情報（番号/日付/担当者）

単独で開く →

SC-MENU-05 利用規約 9:40 ／ 法的

主役 17条構成（目的/定義/サービス/利用条件/料金/禁止/変更/免責/賠償/解約/反社/管轄 等）

配慮 同意済みChip（2025/05/12 第3版）／ 福島弁護士の最終確認待ち

単独で開く →

SC-MENU-06 プライバシーポリシー 9:42 ／ 法的

主役 「サービス品質の向上にデータを利用します」 ／ 16条構成

構成 3層構造（個人情報 / 利用データ / 匿名加工情報）+ 第4条で AI モデル販売まで明文化

役割 データビジネス対応 ＋ 個人情報厳格保護の両立／法律事務所レビュー前β版

単独で開く →

SC-MENU-07 サポート問い合わせ 11:18 ／ 駆けつけ

主役 "困ったときは、いつでも呼んでください" ／ 3連絡方法（電話/チャット/メール）

構成 FAQ 5件 + 24h緊急電話（停電・機器故障時）

単独で開く →

SC-MENU-08 サインアウト確認 22:30 ／ 離脱

主役 "またお会いしましょう" ／ Coralの logout アイコン

配慮 4つの安心ポイント（蓄電池・AI制御・守りモード・履歴は戻る）／ 信頼担保

単独で開く →

SC-MENU-09 About / バージョン 9:48 ／ 情報

主役 確定 i-Power HOME ロゴ全面利用 ／ v 1.5.0

構成 アプリ情報（提供元/所在地：東京・福岡・兵庫）／ バージョン情報 ／ ライセンス・履歴リンク

単独で開く →

SC-901 通信エラー 10:22 ／ API遅延

主役 "サーバーへの接続に失敗しました"＋"ネットワークは生きているが、応答が遅れている"

構成 トリガー説明3行（クラウド障害／API応答5秒超／機器制御は影響なし）+ 再試行

単独で開く →

SC-902 オフライン 10:22 ／ Network

主役 Twilight アイコン＋"インターネット接続が見つかりません"＋"でも、心配いりません"

構成 状態カード4行（機器制御:正常／蓄電池:正常／同期:待機／通知:待機）+ 再接続CTA

配慮 オフラインを恐怖→安心に翻訳。i-Power はローカルで動き続ける

単独で開く →

SC-903 認証エラー 09:45 ／ Auth

主役 Mustard 鍵アイコン＋"ログイン情報の確認が必要です"

構成 出現条件3項目（30日不使用／パスワード変更／定期確認）+ サインインCTA

単独で開く →

SC-904 機器エラー 11:08 ／ Hardware

主役 Alert グラデ▲アイコン＋"機器に異常が見つかりました"＋"すでに対応を始めています"

構成 対象機器カード（蓄電池 / E-204）+ i-Power が既にやったこと3項目 + 電話CTA

配慮 "もう動いている" 安心メッセージ。SC-801 アラート詳細へ接続

単独で開く →

SC-905 サーバーメンテナンス中 02:15 ／ 計画

主役 回転する歯車＋"i-Power Engine をよりよくするため、システムを更新中"

構成 計画メンテ情報（開始/終了/内容）+ カウントダウン「あと 2h 45m」+ 復旧通知CTA

単独で開く →

SC-906 アップデートのお願い 09:08 ／ Update

主役 Coralグラデの上矢印アイコン（floatアニメ）＋"i-Power HOMEを最新版に更新しましょう"

構成 バージョン Before→After（v1.4.2 → v1.5.0）+ What's New 4項目 + いま/あとで CTA

単独で開く →