ux-offboarding について
サブスクリプションの解約やアカウント削除のフローを設計するプロダクトチーム向けの UX スキルです。退出の容易さと誤操作の防止を両立し、操作の取り消しやすさに応じて確認手順や説明を調整します。
主な機能
- 01解約や退出の操作を見つけやすくする
- 02影響に応じて確認手順を設定
- 03データ削除と復元について説明
- 04任意のフィードバックと実質的な代替案
- 05敬意ある退出と再開の導線を設計
活用シーン
- 01サブスクリプション解約フローの設計
- 02アカウント削除とデータ影響の案内
- 03季節利用者向けの一時停止やダウングレード
インストール
コマンドをコピーしてターミナルで実行します。
npx skills add https:/ / github.com/ uxcel-lab/ product-skills --skill ux-offboardingインストール後、Claude Code で/ux-offboardingを入力して読み込まれたか確認します。
詳細
オフボーディングスキル
このスキルの動作(最初にお読みください)
これは生成型のスキルであり、オフボーディングは製品において最もダークパターンに陥りやすいフローです。ビジネス側はユーザーをつなぎとめたいと考え、解約リンクを埋もれさせる、確認時の罪悪感を煽る(「いいえ、お金を節約したくありません」)、引き留めの試練を強要する、あるいは気まずい会話を避けるために削除を摩擦ゼロにする、といった誘惑に駆られます。どちらの極端も信頼を損ないます。出口を隠すのは操作であり、ワンクリックの完全削除は壊滅的な事故を招きます。優れたオフボーディングは二つの真実を同時に守ります — 退出は簡単で敬意あるものでなければならない、かつ 破壊的な操作は意図的で回復可能でなければならない。うまく行えば、礼儀正しい退出は好意を保ち、紹介を生み、ユーザーが戻ってくる扉を開いたままにします。そこでこのスキルは次をゲートします:
- 何からオフボーディングするのか、どの程度可逆なのかを確定する — サブスクリプションの解約(課金、通常は可逆)はアカウント削除(データ損失、多くの場合は永続的)とは異なります。これにより適切な摩擦の量と、提示すべき代替案が決まります。
- 常に真であるコアを適用する — 見つけやすい出口、非難よりも好意、偶発的な破壊の防止、結果の説明、敬意あるフィードバック、誠実な代替案、回復パス。
- 文脈依存の判断(引き留めインセンティブ、価値のリマインダー、確認の摩擦、一時停止か削除か)をトレードオフとともに提示する — こここそオフボーディングがダークパターンに傾くまさにその地点です。
その後、検証のために ux-dark-patterns-audit、ux-heuristics-audit、ux-accessibility-audit、ux-aesthetics-audit、ux-microcopy-audit、そして(モバイルの場合)ux-mobile-responsiveness-audit に引き継ぎます。
スコープと構成(docs/orchestration-policy.md §9 に準拠):このスキルは退出体験 — 解約/削除フロー、そのコピー、引き留めの瞬間、回復 — を所有し、下位スコープのスキルを再導出するのではなく構成します。コアの子(フローの一部として構築): ux-inputs-and-forms を介したフィードバックフォームのフィールド。サブパートを所有するピア(委譲): 確認モーダルの仕組みは ux-modals-and-dialogs へ、設定/課金のエントリーポイントは ux-settings へ、そして元に戻す/セーフティネットのパターン(再有効化、復元ウィンドウ)は ux-error-recovery とバックボーンを共有します(到達した場合、それらのサブパートは彼らが所有します)。ダウンストリーム(自動構築せず提案): ux-pricing を介したプラン変更/ダウングレードの価格 UI。継承し、再生成しない: 既存のデザインシステムがある場合、色/書体/余白はそのトークンから取得します — ゼロから設計する場合にのみそれらを設定します。
ステップ 0 — 設計前に文脈を確定する
不明な場合は尋ねてください。回答なしで進める場合は前提を明示してください:
- 何からオフボーディングするのか、どの程度可逆なのか? 配信停止/サブスクリプションの解約は主に課金に影響し、通常は可逆です(期間終了までアクセスは継続し、再有効化は簡単です)。アカウント削除は永続的なデータ損失と重要なドキュメントへのアクセス喪失を意味することがあります。操作が不可逆であるほど、確認はより意図的に、結果の説明はより明確でなければなりません。
- なぜユーザーが離れるのか、ビジネスモデルは何か? 人は不満から離れるのと同じくらい、中立的な理由(タスクの完了、季節性)で離れます。製品に無料枠がある場合、リマインダーはサブスクリプションの特典についてです。サブスクリプションが前提の場合、それはアクセスを完全に失うことについてです。学生/季節性のオーディエンスは、削除ではなく一時停止の有力な候補です。
- データと規制の実態。 正直に答えられるようにしてください:データは即時削除か、それとも一定期間後か? アカウントは復元できるか? 無効化後もプロフィールは公開されたままか? フローは心地よい推測ではなく、実際に何が起こるかを示さなければなりません。
- プラットフォームとエントリーポイント。 出口がどこにあるか(Web の設定/課金かモバイルの設定か)、そしてどのように到達するか。
常に適用するコア(ほぼすべてのオフボーディングフローで正しい)
退出を簡単に、そして見つけやすくする
- 退出手段をはっきりと示す。 期待される場所(プロフィール、設定、または請求)に、視認でき、明確にラベル付けされたキャンセル/配信停止/サブスクリプションの管理/アカウント削除のコントロールを配置します。クリック可能に見え、気づきやすいものであるべきです。
- 決して隠したり、ユーザーを閉じ込めたりしない。 キャンセルリンクを埋もれさせたり、「何としてでも」ユーザーをつなぎとめようと摩擦を用いたりすることは、忠誠心と信頼を損ないます。ユーザーが去りたいと思えば、去ります——あなたの仕事は、去っていく道すがら良い印象を残すことです。
寛大に、決して責めずに
- 善意を保つ。 責めたり罪悪感を煽ったりする口調は避けます。敬意ある退出は、後々の紹介や再訪につながります。罰的なそれは、悪いレビューにつながります。
破壊的な操作は意図的で明確に
- 意図を確認する。 破壊的な操作への誤クリックを防ぐために確認ステップを設け、その瞬間を誠実に使います(簡潔な価値の再確認)。決して懇願したり圧力をかけたりするためではありません。
- 結果に比例した障害を設ける。 取り返しのつかないデータ損失については、意図的な追加ステップ——「delete」と入力する、パスワードを再入力する——を求め、選択がうっかりではなく意識的なものになるようにします。
- 最終操作の前に結果を説明する。 アカウントとデータに何が起こるかを明確に伝えます。永続的か?復元できるか?削除は即時か、日付指定か?アクセスはどのくらい残るか?
学び、代替案を提示し、うまく締めくくる
- 理由を尋ねる——敬意をもって、任意で。 オフボーディングはフィードバックの宝庫です。プリセットの理由に加え、自由記述の「その他」欄を用意します。決して必須にしたり、押し付けがましくしたりしないこと。
- 完全な退出に対する本物の代替案を提示する。 一時停止、一時的な無効化、ダウングレード、プラン変更——それぞれについて、データ、請求、可視性に何を意味するかを平易に説明します。(学生向けアプリなら、「夏の間は一時停止」がまさに正解かもしれません。)
- 感謝と戻る道を添えて退出を確認する。 決定を認め、尊重し、感謝を伝え、いつでも戻ってきてよいと知らせます。キャンセルの場合、アクセスがいつまで続くかを明示し、再有効化リンクを記載したフォローアップメールを送ります——誤操作や気が変わったユーザーのための「非常口」です(ユーザーの制御と自由)。
文脈に依存する判断(表面化させ、自動適用しない)
それぞれについてトレードオフと Step 0 に結びついた推奨事項を提示し、ユーザーに判断を委ねます。これらのレバーこそが、オフボーディングがダークパターンになる場所です — これらを積極的に適用することが誤りです。
| 判断 | 適用すべきとき | 避ける/適応すべきとき | 既定の推奨 |
|---|---|---|---|
| 引き止めインセンティブ(割引/無料アップグレード) | 忠実なユーザーが離れようとしているときに、断りやすい本物のオファーを出す場合 | 繰り返しの催促、複数ステップの「本当に本当によいのですか」という試練、または断りにくいオファー | 一度だけ、友好的に提示し、ワンタップで辞退して退出を続けられるようにする |
| 価値のリマインダー/離れることの結果 | ユーザーが失うもの、あるいは保てるものについての簡潔で情報的な注記 | 同情を請う言葉、罪悪感を煽る表現、または確認による羞恥(「いいえ、自分のデータには関心がありません」) | 短く中立的に。事実を述べ、懇願はしない |
| 確認の摩擦レベル | 永続的なデータ損失を伴う場合の入力による確認やパスワードの再入力 | 単純で可逆的な配信停止に対する過度な摩擦 | 摩擦を可逆性に合わせる — キャンセルには軽く、削除には意図的な障壁を |
| 一時停止/無効化/ダウングレード vs. 削除 | データ保持が本当にユーザーの役に立つ場合(季節的、経済的)に、実際の選択肢として提示する場合 | 真の削除が埋もれていたりグレーアウトされている一方で、一時停止を唯一のスムーズな道として提示すること | 簡単で誠実な削除と並べて選択肢を提示する — 決してその代替としてではない |
| フィードバックの依頼 | その理由に実際に対応する場合 | 必須にすること、またはフォームに入力するまで退出をブロックすること | 任意で、あらかじめ用意された理由+「その他」、スキップ可能 |
| 再アクティベーション/ウィンバックのフォローアップ | 気が変わった、あるいは誤ってキャンセルした場合を覆せるようにする1通の再アクティベーションメール | ウィンバックスパムにしてしまう、または「去らない」よりも「去る」の方がクリックしやすくすること | 明確な配信停止を伴う、無視しやすい1通の再アクティベーションメール |
結果の重大なオフボーディング(アカウント/データの永続的削除、規制対象データ)では、既定はより意図的な確認、明示的で真実に基づくデータ/復元の説明、そして遊び心のあるコピーよりも真剣で敬意あるトーンへと傾きます。
結果を検証する(オーケストレーション)
ハンドオフでは、各レンズをインストール可能なスキルの
nameで指定します。そのスキルがインストールされている場合にのみ呼び出してください。インストールされていない場合でも、このスキル自体のコアにこれらのルールがすでに含まれているため、ブロックせずにそのまま進めてください。
生成または改訂した後は、完了と宣言するのではなく、結果を監査レンズに引き渡してください。これらは候補のレンズです — 姿勢は docs/orchestration-policy.md で設定されるか、全体を ux-design-review 経由でルーティングします。ここでは、dark-patterns、heuristics、microcopy は Tier A(自動実行)、accessibility、aesthetics、mobile-responsiveness は Tier B(提案) です — 既存のデザインシステムがある場合、aesthetics は抑制され、accessibility は使用状況に絞り込まれます。mobile-responsiveness はモバイルにのみ適用されます。ユーザーが特定の目的でこのスキルを呼び出した場合は、そのスコープを尊重してください。
ux-dark-patterns-audit(Tier A) — ここでの主要なチェックです。ローチモーテル(入るのは簡単、出るのは困難)、隠された/偽装された解約リンク、コンファームシェイミング(罪悪感を煽る文言)、引き止めの関門、真の削除を覆い隠すプリセットの「代わりに一時停止」、非対称なボタンの強調(「継続」は大声で、「解約」はささやくように)、または通行料としての必須フィードバックを探してください。退会は入会と同じくらい簡単であるべきです。ux-heuristics-audit(Tier A) — ユーザーのコントロールと自由度(明確な緊急出口、再有効化による取り消し)、システム状態の可視性(データがどうなるか、アクセスがいつ終了するか)、エラー防止(破壊的な操作に対する意図的な確認)。ux-accessibility-audit(Tier B — 提案、デザインシステムがある場合は絞り込み) — 破壊的な操作とその確認がキーボードおよびスクリーンリーダーで操作可能であること、結果が色だけで示されていないこと、テキスト入力による確認ステップがアクセシブルであること。ux-aesthetics-audit(Tier B — 提案、デザインシステムがある場合は抑制) — 「継続」と「退会」の間の対称的で誠実な強調。本当の操作を埋もれさせない、整理された確認画面。ux-microcopy-audit(Tier A) — このフローはトーンにかかっています。罪悪感を煽らず寛大であること、結果について明確な言葉遣い、誠実なボタンラベル(削除に「はい/いいえ」を使わない)、敬意あるフィードバックの促し。ux-mobile-responsiveness-audit(Tier B — 提案) — 確認/キャンセルコントロールのタップターゲットサイズと間隔を調整し、破壊的な選択と安全な選択が誤タップで隣り合わないようにすること。モバイルの設定で出口に到達できること。
監査で矛盾が表面化した場合(例:ビジネス側が 5 ステップの引き止め関門や隠された解約リンクを求めている)、原則に立ち返って解決してください:ユーザーは退会を決意しました — 簡単で、誠実で、回復可能にしてください。次の訪問は良い退会体験で獲得し、今回の訪問で決して閉じ込めてはいけません。
よくある do/don't パターン
| ❌ しないこと | ✅ すること |
|---|---|
| 解約/削除リンクを隠したり偽装したりする | 設定/請求画面に明確なラベルでそのまま表示する |
| 退会するユーザーを責めたり罪悪感を煽ったりする | 善意を保つ。感謝を伝え、門戸を開いておく |
| ワンクリックで完全削除 | 不可逆的な損失には意図的な関門(「delete」と入力/パスワード再入力)を設ける |
| 説明のない「よろしいですか?」 | データ、アクセス、タイミングに何が起こるかを正確に説明する |
| コンファームシェイム(「いいえ、節約するのが嫌いなんですね」) | 中立で事実に基づく価値のリマインダー。誠実な辞退オプション |
| 退会前にフィードバックフォームを強制する | 任意で、プリセット+「その他」、完全にスキップ可能 |
| 本当の削除を埋もれさせて「一時停止」だけを提示する | 簡単で誠実な削除と並べて一時停止/ダウングレードを提示する |
| 「継続」ボタンは大声で、「キャンセル」はささやくように | 両方の選択肢を対称的で誠実に強調する |
| 繰り返しのオファーによる引き止め関門 | 断りやすいインセンティブを 1 つ提示し、その後は退会させる |
| 誤ってキャンセルした後に戻る方法がない | 再有効化リンク/フォローアップメール。期間終了までアクセスを維持 |
| 確認せずに出荷する | dark-patterns + heuristics + accessibility + aesthetics + microcopy(+ mobile-responsiveness)に引き渡す |