【サイトをシンプルに！】ユーザビリティ向上とUX改善を解説「ゆうちょ銀行編」

システムやサイトをみた時、私ならこんなUXでできるだろうと思ったことありませんか。

ここでは色んなシステムやサイトをUX改善してもっともusabilityよくなることを目指して勝手ながら分かりやすくUXを改善してみます。

今回はゆうちょ銀行さんのゆうちょダイレクト画面をUXデザインを改善しました。

ゆうちょ銀行さんのゆうちょダイレクト画面

実際使ったことはないですが、銀行系のよくある古いデザインで自分が持ってる口座の情報が一目で入ってこないことを感じました。

仮でターゲットを20〜60までを想定しました。年齢が上がることを考えてfontサイズを大きく、パネル式にした方がみたい情報がすぐわかりやすくなるかと思います。

この画面をUXデザイン改善をする時の見るべきポイントです。

• ゆうちょのヘッダーがある
• お客さま番号、ログイン情報、ログアウト
• 口座の情報がみれる
• 入出金明細照会
• FAQ、マニュアルがある

まず1回目全体を改善してみました。

修正箇所です。

• ヘッダーが二つのためにゆうちょダイレクトの専用ヘッダーにして、ゆうちょトップに行けるボタンを配置。
• よくある質問関連は外に出す
• お名前、お客さま番号、ログイン情報などは入ってすぐみれる場所に配置
• 保有している口座情報をタイル式で表示、何個持ってるかすぐ追加可能に変更
• 入出金明細照会は余白を入れてみやすくする

ログアウトのボタンが二つあって、同じグレー色のため押せるイメージがないです、また重要な意味があると思うため二つ置く前提として色で差があるようにしました。

下にあるお知らせ３つはタグで区別をさせることでどんな情報かすぐ分かるようになります。

ヘッダーとお知らせの情報を減らすことで画面のファーストビューで一目に情報が入ることが分かります。

まずユーザーがログインした後トップ画面をみた際にどんな情報がみたいのかを考える必要があります。

例えば、サイトにあるお客様番号をみてお問い合わせが多いです。

対応するヘルプセンターの人がその画面を説明する時に分かり安い場所に配置した方が両方とも楽になります。

集めたデータをみて分析しデザインに反映することも大事と思います。