本文へスキップ
  1. TOP
  2. Web制作
  3. 実務知識
  4. 会員サイトで、登録状態・役割・権限・外部連携をどう設計するか

03 / BUILD

つくるフェーズの実務知識

会員サイトで、登録状態・役割・権限・外部連携をどう設計するか

画面一覧より先に、誰が・いつ・何を見て操作できるかを決める

会員の登録状態と役割ごとの権限、外部連携を整理した立体模型

PRACTICAL KNOWLEDGE 実務知識

WRITTEN BY

FHW制作チーム

反省会と日々の制作記録をもとに、担当スタッフが実際に迷い、確認し、判断した過程を整理しています。

会員サイトは、会員登録、ログイン、マイページ、管理画面を用意すれば運用できるわけではありません。

同じ利用者でも、メールアドレスを入力した直後、本登録を完了した後、ログイン中、追加情報の確認待ちでは、利用できる画面と次に行う操作が異なります。利用者、担当者、管理者が同じ情報を扱っていても、閲覧・変更・承認できる範囲は同じではありません。

私たちが会員機能を整理するとき、最初から画面一覧を作ることはしません。外部の会員管理、決済、予約などと連携すると、自社サイト側の表示だけでは処理が完了したか判断できないからです。まず利用者の状態、役割、権限、データの正本、失敗時の戻り先を並べます。

画面ではなく、利用者の状態から整理する

最初に、サービス内で起こり得る状態を並べます。例えば会員登録には、次のような状態があります。

  • 未登録
  • 仮登録メールの送信済み
  • 本登録URLの確認待ち
  • 本登録済み
  • ログイン済み
  • 追加情報の登録待ち
  • 確認・承認待ち
  • 利用停止または退会済み

重要なのは状態を増やすことではなく、各状態について、見せる画面、許可する操作、次へ進む条件、途中で失敗した場合の戻り先を決めることです。

「登録に失敗しました」という一つの表示へまとめると、再入力すべきか、メールを確認すべきか、ログインし直すべきか判断できません。現在の状態と次の操作を対応させることで、途中から再開できる導線を作れます。

役割と権限を、画面名だけで決めない

同じ画面へ到達できても、役割によって許可する操作は異なります。実際の作業から権限を決めます。

  • 利用者本人が自分の情報を閲覧・変更する
  • 担当者が支援に必要な情報を閲覧し、メモや進捗を追加する
  • 管理者が利用状態や担当者を変更する
  • 公開担当者が全体へ表示する情報を承認する
  • システム管理者が権限や連携設定を管理する

「管理者」という一種類へ操作を集めず、閲覧、作成、変更、削除、承認、出力、設定を分けます。利用者本人の情報、担当者だけが記録する内部メモ、全体へ公開する情報では、同じ会員IDに紐づいていても扱いが異なります。

外部サービスとは、成功した後だけでなく途中状態を合わせる

外部の会員管理、決済、予約、顧客管理と連携する場合、自社サイトと外部サービスのどちらを正本にするかを先に決めます。処理は「APIを呼び出せたか」だけでは確認できません。

  • 外部サービスへ送信する前
  • 送信したが応答を待っている
  • 外部処理は成功し、自社側への反映を待っている
  • 外部処理は失敗し、再実行できる
  • 一部だけ完了し、確認が必要
  • 双方で処理が完了した

利用者には「処理中」「完了」「再操作が必要」「問い合わせが必要」など、次の行動が分かる状態として表示します。運用者には、どこまで完了したかを確認できる情報を残します。外部側で管理すべき機密情報と、自社管理画面へ表示する状態情報も分けます。

機能を使わないことと、未完成であることを分ける

運用方針の変更により、完成している会員機能を初回公開では利用しない場合があります。このときは機能を削除するか残すかだけで判断しません。

  • 一般利用者から見えるログイン導線
  • 会員限定情報の公開範囲
  • 保持する会員データ
  • 管理画面の操作
  • 再開時に戻すURLと表示条件
  • 休止中も必要な保守と安全対策

「未公開」と「未完成」を区別し、休止する機能の関連URL、ボタン、権限、データ、通知を一組で確認します。

テストは、状態の移動として行う

画面を一枚ずつ開くだけでなく、利用者が状態を移動する一連の流れとして確認します。

  • 仮登録から本登録を完了できるか
  • 期限切れや使用済みURLで次の操作が分かるか
  • 登録途中で離脱した利用者が再開できるか
  • 役割ごとの閲覧・変更範囲が正しいか
  • 権限のないURLへの直接アクセスを拒否できるか
  • 外部処理の失敗で二重登録が起きないか
  • 停止・退会後にログイン、通知、表示が正しく変わるか

この進め方が有効な場合

  • 仮登録や承認を含む会員登録がある
  • 利用者、担当者、管理者など複数の役割がある
  • 会員種別や契約状態によって表示内容が変わる
  • 決済、予約、顧客管理など外部サービスと連携する
  • 会員機能を段階的に公開・拡張する
  • 既存会員データを移行または同期する

別の進め方が適する場合

ログイン後に同じ静的資料を見せるだけで、会員種別、承認、外部連携、個別データを扱わない場合は、細かな状態・権限設計は不要です。汎用の会員サービスやCMSの閲覧制限で要件を満たせる場合もあります。

個人情報、決済、契約、支援記録などを扱う場合は、画面制作だけでなく、データの所有者、保持範囲、操作履歴、削除方針、外部サービスの責任範囲を含めて設計します。

会員サイト設計チェックリスト

  • 利用者の状態と遷移条件を整理したか
  • 状態ごとに見せる画面と次の操作が明確か
  • 役割と操作権限を分けたか
  • データの所有者と正本を決めたか
  • 外部サービスとの途中・失敗状態を確認できるか
  • 機密情報を必要以上に保持・表示していないか
  • 未公開、休止、未完成を区別したか
  • 期限切れ、離脱、重複、権限外操作を確認したか

PRACTICAL KNOWLEDGE 同じフェーズの実務知識

私たちが別の制作で得た判断や確認方法を、同じ制作フェーズからご覧いただけます。

複数社でWeb制作の引き継ぎ内容を確認する作業デスク

自社で公開できないWeb制作で、入稿・納品・確認の責任範囲をどう決めるか

外部CMSや別会社の環境へ入稿・納品する制作で、利用できる技術、確認段階、修正の戻し先、完了条件をどう決めるか整理します。

支給デザインを共通ルールと例外へ分けて確認する制作チーム

支給デザインを、共通ルール・例外・動作仕様へどう変換するか

Figma、画像、印刷物、参考サイトなどの支給物から、共通部品、例外、可変条件、レスポンシブ、動作仕様を整理し、複数人で再現できる実装ルールへ変換する方法をご紹介します。

急増したAPI利用料金の請求明細とグラフを確認する制作チーム

55万円請求を生んだ、公開ページと従量課金APIを直結する落とし穴

公開ページへの機械的な大量アクセスが従量課金APIの大量実行へ増幅され、約55万円の請求に至った経験から、外部APIの費用上限、クォータ、キャッシュ、監視の設計を整理します。

公開日時と素材の進行状況を確認するWeb制作の作業デスク

公開日を動かせないWeb制作で、未確定素材・版管理・日時公開をどう管理するか

公開日時が固定された制作で、後から届く素材、複数の版、日時指定公開、公開直前の変更を安全に管理する方法をご紹介します。

Web制作中に増えた要望と工程への影響を整理する制作チーム

その追加要望、今入れますか? Web制作中の変更をどう判断するか

Web制作中に増えた要望を、目的、合意範囲、影響する工程、費用、日程、公開時期から確認し、修正・追加対応・公開後対応へ整理する方法をご紹介します。

短納期の制作で公開条件と後工程をカードに分ける制作チーム

短納期のWeb制作で、削ってよい工程・削ってはいけない確認は何か

短い制作期間で、共通ルール、未確定素材、確認範囲、公開後へ送る改善を整理し、速さのために品質判断まで省略しない進め方をまとめます。

受付窓口で申込書と処理の流れを確認する担当者と利用者

紙・PDFで続けてきた申込・注文業務を、どうWebへ移すか

紙やPDFで行ってきた申込・注文業務をWeb化するとき、利用者の操作、受付側の確認、例外処理、計算、保存、外部連携までを一続きで設計する方法を整理します。

公共空間でスマートフォン、タブレット、ノートPCを使う人々

対応端末・ブラウザは、利用場面からどう決めるか

Web制作の対応端末とブラウザを、利用者、場所、主な操作、重要度から優先・代表・簡易確認へ分け、境界の内容と再現情報を確認する方法を整理します。

Webフォームの入力から通知までを検証する作業デスク

フォームの送信確認で、通知・自動返信・保存データ・担当振り分けまでどう検証するか

Webフォームについて、入力・確認・送信だけでなく、管理者通知、自動返信、保存データ、担当振り分け、本番環境でのメール到達までを一続きで検証する方法を整理します。

CSVの一括更新結果と既存データへの影響を確認する資料

CSVで一括登録・更新するとき、既存データをどう守るか

CSVの一括登録・更新で、識別キー、空欄、部分失敗、事前確認、再実行、復旧を安全に扱う確認方法を整理します。

更新担当者と制作会社がページテンプレートの編集範囲を確認する作業台

お客さまもHTML・CSSを更新するサイトで、編集範囲をどう設計するか

お客さまがHTML・CSSを直接更新するWebサイトで、編集できる範囲、共通部品、CSSの影響範囲、変更履歴、制作会社へ相談する条件をどう決めるか整理します。

少量のサンプルから本番規模の多様なコンテンツへ広げて検証する模型

少量のサンプルで動くWebサイトを、本番規模でも崩さないために何を試すか

数件のきれいなデータだけでは見つからない、最大件数、長文、画像量、空欄、ページ送り、一括処理の問題を公開前に確かめる方法を整理します。

原稿から複数言語のページと公開状態へ展開する編集工程

多言語サイトで、翻訳原稿・共通部品・段階公開をどう同期するか

多言語サイト制作で、ページと言語の対応、翻訳原稿の状態、共通部品の文字量差、言語ごとの段階公開を安全に管理する方法を整理します。

共通基盤でつながりながら役割を分けた複数サイトの建築模型

複数サイト・複数部署で、共通部分と運用範囲をどう分けるか

複数サイトや複数部署で運用するとき、共通化する見た目・情報・仕組み、権限、公開日、正となる情報源をどう分けるかを整理します。

光と布の動きが段階的に変化する展示空間

動きのあるデザインを、雰囲気ではなく実装仕様へどう変えるか

参考サイトやデザインの動きを、開始条件、時間、順番、終了状態、読み込み、端末ごとの代替表現へ分解し、安全に実装する方法を整理します。