見出し画像

スマホニュースアプリ「全国農業新聞電子版」のUI/UXデザイン改善 Vol.2

前回の記事「スマホニュースアプリ「全国農業新聞電子版」のUI/UXデザイン改善 Vol.1」に引き続き、前回のUXデザイン(ペルソナ設計とカスタマージャーニーマップ設計)をベースにUIデザインを考えていきます。

全国農業新聞アプリのUI/UXデザイン問題点

まずは既存のアプリのUI/UXデザインの問題点を分析していきます。分析の手順としては、大枠の部分、つまりユーザーの動線設計(画面遷移図)から見ていき、その後に各画面の問題点を考えていきます。

画面遷移図におけるUI/UXデザイン課題

スライド2

上図は全国農業新聞アプリの主要画面の画面遷移図です。

有料定期購読への申込み動線が多く、一見するとユーザーを誘導しやすくしている動線設計になっているように見えますが、トップ画面にいきなり定期購読購入ボタンが配置されていたり、定期購読への心理的ハードルが下がりやすそうな記事読了後の部分に定期購読購入ボタンがなかったり、以下のペルソナのカスタマージャーニーマップに示すようなUXデザインフローと矛盾点があります。

1. 記事を探す
2. 記事を読む
3. 記事をブックマークする
4. 記事をシェアする
5. 定期購読を申し込む

各画面におけるUI/UXデザイン課題

次に主要画面の課題をヒューリスティック評価で洗い出していきます。ヒューリスティック評価とは専門家による知見にもとづいて、UIデザインの観点からアプリやWEBサービスなどのチェックを行うことです。

スライド3

トップ画面のヒューリスティック評価では主に以下3つの課題が見つかりました。

1. カテゴリ毎に記事が整理されていないため、ユーザーが探したい記事がどこにあるのか見つけにくい。
2. 記事を読む前に定期購読ボタンが目に入ってしまい、記事を未読で購入評価しにくい状態で混乱してしまいやすくなる。
3. 記事検索機能がないため、記事を見つけにくい。

スライド4

記事詳細画面のUIデザインの課題は以下が挙げられます。

1. 表示が紙の新聞形式になっており、ペルソナが片手でスマホを操作して読みにくい。
2. ブックマークボタンを押しても、紙面全体がブックマークされるため、後で本当に読みたい記事が探しにくい。
3. シェアボタンをタップした時にどこの記事がシェアされるか分かりにくい。
4. SNSシェアがツイッターしかなく、共有・拡散しづらい。

スライド5

単品記事一覧画面のUIデザインの課題は、単品購入と定期購読について、どこがどのように異なるのか説明がないため購入を躊躇してしまう点が挙げられます。

スライド6

設定画面のUIデザインの課題は以下が挙げられます。

1. 一番ペルソナが購入したい気持ちになりそうな箇所(記事を読み終わったタイミング)に購入ボタンがなく、定期購読を申し込んでもらう機会を少なくしている可能性がある。
2. 定期購読を購入した時のメリットや説明などが記載されていないため、購入決定を迷ってしまう。

全国農業新聞電子版アプリのUI/UXデザイン改善案

これまでに分析、考察してきたペルソナ、カスタマージャーニーマップ、ヒューリスティック評価をもとに全国農業新聞電子版アプリのUI/UXデザインの改善案を解説していきます。

画面動線のUI/UXデザイン改善

スライド7

画面動線はペルソナのカスタマージャーニーマップのフローに従って設計しました。つまり、ペルソナが記事を探して定期購読を決定するまで以下のようなステップを考えました。

1. カテゴリ分けされた記事一覧画面で記事を探す。キーワードでも記事を探しやすいように記事検索機能も追加するとUI/UXデザインがさらに改善されると考えます。
2. 記事詳細画面で試し読み記事を読む。
3. 記事詳細画面で記事毎にブックマークする。ブックマークした記事は元のカテゴリに自動的に振り分けられれば、ペルソナがあとで探しやすくなると思います。
4. 記事詳細画面でSNSシェアする。
5. 記事を読み終えてから定期購読しようか検討する
6. 定期購読申込み説明画面で定期購読することで何ができるか理解した後に購入を決定する。

また、農業就業者にとって天気や気温情報は重要情報のため、週間天気予報を全国農業新聞アプリ内で見ることができれば、ユーザーがより流入しやすくなると考えられます。そのため、新規機能として実装するのも良いのではないでしょうか。GPS機能と連携することで、近所のより正確な天気・気温情報を得ることが可能となりそうです。

各画面のUI/UXデザイン改善

トップ画面(記事一覧)

全国農業新聞_Top_2

トップ画面のUI/UXデザインのポイントは以下の通りです。

1. 記事のカテゴリ毎にリスト化することで、ペルソナが記事を探しやすくしています。
2. フッターに良く使う項目を配置させることで、目的に応じて画面を行き来しやすくしています。
3. 全体的にも関わりますが、余計な情報は載せないことで画面を有効に使えるようにしています。
4. 有料購読者のみが全て読める記事も一覧に載せることで、定期購読を申し込むことでどのような記事が読めるかペルソナに示して、コンバージョン率を高めます。(冒頭の記事文を読めるようにしても良いと思います)

試し読み記事詳細画面

全国農業新聞_Article_2

記事詳細画面のUI/UXデザインのポイントは以下の通りです。

1. ペルソナが農作業の休憩中にスマホを片手で簡単に操作できるようにするため、紙の新聞形式の表示をやめ、縦スクロールのみで記事が読めるようにしました。バックエンド側の記事の入稿方法が現在の全国農業新聞電子版から変わり、運用コストがやや高くなる可能性がありますが、UI/UXデザイン観点では改善案の方が良いと考えられるため、こちらのデザインを採用しました。
2. 記事毎にブックマークできるようにしています。
3. SNSシェアも記事毎にできるようにし、ツイッターだけでなく、ペルソナが良く使いそうなフェイスブック、LINEに絞ってボタンを追加しています。
4. 記事を読み終え、満足度が高いうちに定期購読申込みに遷移してもらいやすくするために、画面の下部に申込み画面への遷移ボタンを固定で表示しています。

週間天気予報画面

全国農業新聞_Wether_2

週間天気予報はカスタマージャーニーマップの中に登場してこないユースケースのため、マストの機能ではないと考えられますが、農業就業者にとって天気・気温は重要情報の一つですので、アプリへの流入数やアクティブユーザー数を増やす効果を期待し、今回のデザインに入れました。

定期購読申込み説明画面

全国農業新聞_Register_2

定期購読申込みの説明画面のUI/UXデザインについては、申し込もうとしているペルソナに対して、申し込むことで何ができるか、不安に思いそうな点に対する安心材料をシンプルに分かりやすく説明しました。それによって心理的ハードルを下げ、ペルソナが全国農業新聞アプリの定期購読に申し込もうと後押しするような効果が期待できます。

全国農業新聞電子版アプリの今後のUI/UXデザインの方向性

スライド12

UI/UXデザインのプロセスで大事なのは、デザインしたアプリやWEBサービスのプロトタイプやMVP(Minimum Viable Product)を作り、市場からのフィードバックをもらい、プロダクトの改善に活かしていくというPDCAサイクルを高速で回すことですが、前回の記事で作成した農業就業者のペルソナ像を想像すると、いくつか今後のUI/UXデザインに必要な機能の仮説が立てられます。

1.アプリ内で近くのコミュニティやセミナー情報を見ることができる
ペルソナは比較的若い農家のため、技術情報・ノウハウや地域コミュニティがあまりないことが想定されるため、全国農業新聞のスマホアプリ内で近くのセミナー情報やコミュニティ情報を見ることができれば、有効なツールになり得ると考えられます。

2.アプリ内でQ&A掲示板を作れる
1番目のコミュニティやセミナー情報に共通する部分もありますが、スマホアプリ内で農業に関する質問をすると全国の農家から回答がもらえるようになれば、全国農業新聞アプリが農業就業者の情報プラットフォームになり得ます。

3.農業に必要な備品のEC機能
例えば、全国農業新聞アプリ内の記事で最新の農具や肥料などの情報を載せるとともにアプリ内で簡単にそれらの商品をアプリ内のEC機能で購入することができれば、より多くの農家に技術提供ができ、農業活性化に貢献できるUI/UXデザインになるのではないでしょうか。

まとめ

・全国農業新聞電子版アプリのUI/UXデザインの課題は、ペルソナのカスタマージャーニーマップと異なる動線設計になっていること。
・ヒューリスティック評価によって、各画面のUIデザインもユーザーを混乱させるようなデザインになっていることが分かった。
・ペルソナのカスタマージャーニーマップに沿ったUI/UXデザイン案を示した。
・今後のUI/UXデザインの方向性としては、①アプリ内でのセミナー&コミュニティ情報を閲覧できる機能、②アプリ内でのQ&A掲示板機能、③EC機能が考えられる。


最後まで読んでいただき、ありがとうございます。

企業やマーケット関連の話など、ツイッターでもつぶやいてますので、フォローして頂けると喜びます。


この記事が気に入ったらサポートをしてみませんか?