モック（試作）｜実際のデータではありません
ONE STYLE MEMBERS ／ MOCK

V2（2026-10-25 改善版）ができました

運営の画面収録のご要望と追加案を入れた、パターン1の改善版です。この目次とパターン1〜3は「V1（今の版）」としてそのまま残しています。どの画面でも、上の帯の「V1｜V2」で、同じ画面・同じ立場のまま見比べられます。

V2（2026-10-25 改善版）を見る →
  1. ホームの未読の帯：左の太い線・丸いアイコン・枠線をなくし、薄い地に文字だけに。運営の声 0:15〜0:26「装飾とか、このラインとか、ごちゃつきそうな部分いらない」
  2. チャット一覧を1本の平らな一覧に：「あなた宛ての未読」「AIに質問する」「よく使うチャット」の見出し・色の説明・緑の地・左の線をやめ、メールの受信箱のように。並び順はそのまま。右の緑の数字＝あなた宛て、灰色の数字＝それ以外の未読、小さなピン＝ピン留め。検索は虫めがねを押すと開き、「未読だけ表示」は一覧の上の小さな切り替え。0:30〜0:43「平坦になってないとごちゃごちゃする」
  3. 大ボタン4つ：白丸と右下の矢印をなくし、1色（ベージュ）にそろえ、線のアイコンと見出しを少し大きく。運営の画像を入れられる作りに（帯の「大ボタン：画像入りの見本」で見え方を確かめられます）。0:51〜1:00「画像用意できたら変えられる」
  4. ホームから「やること」を外す：タスクはチャットの各部屋の「タスク」で見られます。1:14〜1:19「『やること』とかもいらない」
  5. 線・飾りを減らす：下線のリンクをやめ、箱の枠線の代わりに余白と細線1本で区切ります。
  6. ホームを短く：あいさつ → 大ボタン4つ → お知らせ → 直近の予定 で終わり。各種設定・ワンスタイル365日・管理画面へ（運営のみ）・不具合・要望の報告は、右上の人のアイコンの中へ（パソコン・スマホとも）。
  7. お知らせ・直近の予定は「見出し＋行」：区切りは細線1本、新着は太字だけ。
  8. 色を絞る：緑＝あなた宛てと押すボタンだけ、赤＝チャットの「ここから未読」の線だけ。
  9. 未読の帯をまとめる：受講生は帯をやめ、大ボタン「チャット」の中に「あなた宛て N件」。運営は「返事を待っている人 N人・いちばん長くお待ちの方」の帯を、平らにして残します。

チャットの発言の見た目（相手＝薄い緑・自分＝白・To：あなた＝左の線・未読は赤い線だけ）、ガラスのヘッダー・下のメニュー・入力欄・下から出るシート・報告の入力は、V1 のままです。V2 はパターン1だけです（パターン2・3 は V1 で見られます）。

会員サイト「レイアウト・機能整理の改修」モック

運営の改修依頼に沿って作った、触れる試作です。同じ機能・同じ架空データで、見た目と使い勝手の方向が違う3パターンを用意しました。どのページでも、上の帯の「パターン 1・2・3」で同じ画面のまま切り替えられます。表示されている名前・投稿・予定はすべて架空で、押しても何も送られません。

ログイン後の画面から試す（ホーム）

実際のサイトでは、ログインするとホームが最初に開きます。ホームから、チャット・講座・課題・予定へ進めます。まずはここから触ってみてください。

パターン1　ホーム →パターン2　ホーム →パターン3　ホーム →

上の帯の「受講生として見る｜運営として見る」（スマホでは「受講生｜運営」）で、見る立場を切り替えられます。運営として見ると、辻さん（講師）の画面になり、チャットが多く、あなた宛ての未読も多く、「管理画面へ」が出ます。

未読・やること・予定が1件もないとき（入会したてなど）の見え方は、何もないときの画面（パターン1）→
どのページでも、上の帯の「見本：いつもの画面｜何もないときの画面」で切り替えられます（スマホでは帯の「その他 ▾」の中です）。

迷ったら、パターン1（今のサイトの雰囲気のまま）がおすすめです。
見方：3つのパターン（見た目の方向）×チャットのスマホ2案（案A＝下のメニュー／案B＝左上の三本線）です。スマホは、各パターンの「チャット（スマホ 案A／案B）」で2案を並べて比べられます。

スマホで開いている場合：「ホーム」「チャット」を押すと、枠のない全画面で、実際のサイトのように動きます。下のメニュー（ホーム｜チャット｜講座）で行き来できます。チャットは案A（下のメニュー）で出ます。案B（左上のメニュー）を試したい場合は、各パターンの「案B（左上のメニュー）で試す」を押してください。

PATTERN 1

上品・ゆったり

今の One Style の見た目そのまま。余白を多めにとり、見出しは明朝、一覧の行間もゆったり。左メニューの「チャットルーム」は開いたり閉じたりできます（開いている間は、いちばん上に出ます）。

ホーム（ログイン後）→チャット（パソコン）→チャット（スマホ 案A／案B）→チャット（スマホ）→案B（左上のメニュー）で試す →

パソコン用のチャット画面は、パソコンで開いてご覧ください。

PATTERN 2

仕事向け・すっきり（Chatwork寄り）

毎日たくさん返信する運営向け。一覧は1行に「名前・最終発言・時刻・件数」で詰め、本文はゴシック中心で密度高め。あなた宛ての未読は緑の見出し帯と濃い地で強く示します。左メニューの一覧は、はじめから開いた状態で、パターン1・3と同じく閉じることもできます。

ホーム（ログイン後）→チャット（パソコン）→チャット（スマホ 案A／案B）→チャット（スマホ）→案B（左上のメニュー）で試す →

パソコン用のチャット画面は、パソコンで開いてご覧ください。

PATTERN 3

やわらかい・カード（ラフ寄り）

運営のラフに寄せた形。一覧もメッセージも淡い地の上の角丸カードにし、ボタンは丸く大きめ。スマホで指で押しやすいことを優先しています。

ホーム（ログイン後）→チャット（パソコン）→チャット（スマホ 案A／案B）→チャット（スマホ）→案B（左上のメニュー）で試す →

パソコン用のチャット画面は、パソコンで開いてご覧ください。

見方のヒント：チャットの一覧の並びは「あなた宛ての未読（緑） → AIアシスタント → よく使うチャット（ピン留め） → ほか」です。緑の数字がその部屋の「あなた宛て」の件数で、「ほか2件」はあなた宛てではない未読です。「未読だけ表示」で絞れます。会話の赤い線が「ここから未読」で、未読は赤い線から下です。相手の発言は薄い緑の地、自分の発言は白、あなた宛て（To：あなた）は左端の濃い緑の線で見分けます。「ホーム」と「タスク」を別々のメニューにせず、ホームに集めています（タスクは「やること」に出ます）。
仮置きの点：「課題・添削」の添削の受け取り方は相談中のため、今は仮置きの表示です。講座の課題は、講座の各回から提出する形にしています。
キーボードでも操作できます（Tab で移動、Enter で決定、Esc で概要パネル・メニューを閉じる、入力欄で ⌘／Ctrl＋Enter で送信）。