案件によっては、数十ページに及ぶもののあるワイヤーフレーム。
ディレクトリマップを元に、全ページ作り終えた…!
と安心しがちですが、実はまだ作り漏れているページがあるかもしれません。
一呼吸置いて、確認してみましょう!

~作り漏れページチェックリスト~

【完了系】

・ログアウト

・各種完了


【特殊ルート系】

・パスワード再発行


【警告・お知らせ系】

・コンテンツ削除

・コンテンツ登録

・入力中のページを離れる


【システム異常系】

・ 不正リクエスト(400)

・認証エラー(401)

・アクセス禁止(403)

・NotFound(404)

・サーバー内部エラー(500)

・サーバー過負荷(503)



以下、詳細をご説明します。


【完了系】
・ログアウト
・各種完了

フォームを入力→確認 までは良いのですが、意外と忘れがちな完了画面。
単純にTOPへ戻るだけでなく、次のCVにつながるレコメンドを表示させるなど、
ユーザーの次のアクションへ導く工夫ができるページです。
忘れず作成しましょう!



【特殊ルート系】
・パスワード再発行

会員機能のあるページだと、パスワード発行は当たり前ですよね。
最近では、セキュリティの観点から、長く複雑なパスワードを要求することも多いかと思います。
パスワードを忘れてしまった時の救済フローもきちんと用意しておきましょう。



【警告・お知らせ系】
・コンテンツ登録
・コンテンツ削除
・ページを離れる

コンテンツ登録完了をお知らせる「登録しました」のお知らせ、
何かコンテンツを削除する際に表示される「削除してもよろしいですか?」の警告、
入力中のフォームを離れる際に表示される「ページを離れてもよろしいですか?」の警告など、
モーダルで表記することの多いこれらも、忘れがちな画面です。
しっかり警告・お知らせをしつつも、ユーザーが不快にならないようUXを工夫することが大事です。



【システム異常系】
・ 不正リクエスト(400)
・認証エラー(401)
・アクセス禁止(403)
・NotFound(404)
・サーバー内部エラー(500)
・サーバー過負荷(503)

404 Not Foundでお馴染みの3桁の数字。
これらは、「HTTPステータスコード」というWebサーバーからのレスポンス状態を表す数字コードです。
この「HTTPステータスコード」のうち、エラーを表す数字400番台、500番台の、よく目にするものをピックアップしてみました。
これらのページも案件に応じて作っておくと安心でしょう。


補足ですが、100~300番台の数字の意味は下記になります。エラーではなく、処理を表すのですね。
100番台=リクエスト情報処理中
200番台=リクエスト処理成功
300番台=リダイレクト処理



いかがでしたでしょうか?
無我夢中でワイヤーフレームを作成しているとつい忘れがちになってしまう画面。
実はUXを左右する重要な画面も多くあります。
これらもしっかり設計し、デザイナーさん、エンジニアさんが困らないワイヤーを作りましょう!


PREV
2021.05.31
はじめてのAdobeXD 便利機能の紹介