UI修行#01:「NIKE SNKRS」

「中島健人になれるならイケメンは諦める」でお馴染み、ふうとです。

GWも終わって絶望漂う5月8日、3回目となる社内UI修行は、今日のAPPから「NIKE SNKRS」としました。UI修行のタイムスケジュールはこんな感じ。1時間をフルに使ってやっています。

・AppStoreの「本日のアプリ」から気になったアプリを選ぶ【事前】
・使ってみて最低1ヶ所以上、デザイン的観点で考察したことを記述する【10分】
 (新鮮だった箇所、疑問に思った箇所、改善できそうな箇所etc)
・改善版UIをつくる(最低1画面でOK)【20分】
----- もくもく終了 -----
・シェアとフィードバック【27分】
・今日の気づき【3分】

では、早速。

使ってみての考察

参加者から出てきた気づきや所感をまとめました。前回よりもプラスな点から疑問点・改善したい点まで様々な視点から気づきを出せるようになってきました。

<APP全体> 

・ナイキのスニーカーについて、情報を網羅されており、見応えあり。
・アイテムの画像に統一感があり、BI、VI のコントロールはさすが。
・InstagramライクなUIで好感を持てる。
・アプリ内の探索を楽しむことができ、今時のトレンドを抑えることができている。
・ログインユーザーとゲストユーザーとで閲覧できる情報に差がある。ゲストユーザーにはそもそも非表示にすることで、無駄な遷移をなくすなどして欲しい。
・アイコンと機能が一致しない。

<ホーム(スニーカーの一覧)>

①ヘッダー

・要素が多く、領域が太く感じる。
・「検索」「絞り込み」は機能が似ているため、統合しても良いのではないか。
・レイアウトが変更できる。その際のアニメーションが心地よい。 

②フッター

・遷移先は左から、ホーム・ストーリー・受信トレイ・プロフィール。
→アイコンから機能(遷移先のページの中身)がイメージできない。

③アイテム詳細 ヘッダー

・アイテム名が記載される。
・スクロールで、隠れてしまうので追従したほうが嬉しい。
・表示領域を担保するなら、フッター追従じゃなくても?
→その方がユーザー行動を阻害せずに済みそう。

④アイテム詳細→価格

・価格だけでなく(基本は価格だが)、様々な情報が入っているが統一感がなく戸惑う。
・押下領域と気づけない(押下で購入ができるが、それに気づかず1時間購入できないと勘違いしていた人もいた)。

<ストーリー・受信トレイ・プロフィール>

⑤ ストーリー

・ブランドの新規ファン獲得には最適であるように思うが、コンテンツの充実はこれからという印象。
・ストーリーの一覧が、もったいない。見せ方の工夫が欲しい。
・画像のみの表示のため、たとえ記事を見返したくなっても一から探さなければならない。閲覧済みがわかるようにして欲しい。 記事コンテンツとしてレベルも高く、読み物として面白いので読み返したいというようなニーズも高そう。

⑥タブバーからの遷移(ストーリー)

・内容とコンパスアイコンが合っていないように感じる。 

⑦タブバーからの遷移(受信トレイ・プロフィール)

・受信トレイの用途がイメージしづらい。最初に「はじめまして」など用途を説明するコンテンツが欲しい。
・ログイン後でしか利用できない(遷移できない)こともあり、ユーザーへの認知が難しい。
・ナビゲーションに配置するほどのプライオリティがあるか。 

⑧会員登録

・フォームと、導線に改善の余地あり 。
→フォームの崩れがある
→キーボードが閉じると、ボタンを押したのかとユーザーの混乱を招く
→PINコード入力が手間になる
→国の選択を2回する必要がある
→項目が日本に最適化されていない

・会員登録の段階で、これまでの個人情報を入力しなくても良いのではなかろうか。
→会員登録のハードルが高く感じる。
→会員登録では、FacebookなどSNS連携でのログインにすることで、ハードルを下げられそう。

そのほか

<NIKE+ PASS>
階層が深く、利用しづらい。
店舗などリアルとの連携を考えると、プライオリティを上げるべき。

<リマインダー>
説明不足でちょっとわかりにくいので、具体的にいつにそれぞれ日時が設定されるのかわかるようにしたい。

<絞り込み>
条件の適用と結果ページの行き来が面倒。アイテム数も(おそらく)少ないので、条件入力と同時タイミングにHIT数を提示して欲しい。

---

今回のUI修行の参加者にはすでにこのアプリを利用しているユーザーがおらず、あくまでゲスト利用できる範囲で色々見ています。その中だと、なかなか気づかない体験や、リアル店舗との連携などからの視点を取り入れられていません。

UIの改善案

気づきから各々、UIの改善案を考えてみるということを今回の課題にしています。それぞれがやりやすい形でまとめています。

こうやって見ると、どこを直したいかを考えているかがみんな違うので、そんな視点があるのかと勉強になります。

iPadを使う人、手書きでまとめる人、あらかじめフォーマットを用意する人。参加者は5人でしたが、それぞれ5人の性格が出るので面白いです。

まとめ

最後にみんなでディスカッションをしておしまいです。走り書きで恐縮ですが、このような形で自分だったらどうするかの共有であったり、疑問点の解消がすぐにできる会になってきました。

・初見では良いと思ったが、よく見ると改善の余地あり。
・そういうとここだわりを持って作っていきたいな。
・ユーザー目線で見ると変わる。デザイン的にはよくても。
・親切を突き詰めた時に、デザイン性も担保できるか。
・アイコンだけだとわからない。アイコンに過信しすぎてはダメ。
・ブランディング目的だけなら良いかも?
・買わせたいなら、改善の余地あり。UIが独特すぎる。
・リアルだったり、配送との連携が影に隠れすぎ。前面に出して。
→マニア向け。最新モデルが欲しいようなファンが向け。
・その人たちが情報を逃さずキャッチできることがアプリの強み
→コアユーザーの声も聞いてみたい。
→発売日前にスタンバッてる人もいるっぽい。
・ライトユーザーも喜べるUIだと嬉しい。

後々調べてみたら、アプリのプロデューサーへのインタビューがありました。

制作者の狙いだったりも踏まえて、議論できるように会自体もアップデートしていきたいと思います(気軽に参加できる会にしたいので、バランスは大変ですが)。

ご縁あって、この内容をナイキジャパンさまに共有する機会がありました。このUI修行のような小さな取り組みが、大きな仕事につながれば僕としても、参加メンバーとしても幸せです。

現場からは以上です!

この記事が気に入ったら、サポートをしてみませんか?気軽にクリエイターを支援できます。

ありがとうございます!とってもモチベがアゲアゲです。
29

ふうと

2019年の目標は「中島健人の足元には及ぶ」です、セクシーに生きる。教育を中心にライフイベント全般をより良くします。好きな色は縹色(#2792c3)。デザイナーしてます✏️

#デザイン 記事まとめ

デザイン系の記事を収集してまとめるマガジン。ハッシュタグ #デザイン のついた記事などをチェックしています。広告プロモーションがメインのものは、基本的にはNGの方向で運用します。
4つ のマガジンに含まれています
コメントを投稿するには、 ログイン または 会員登録 をする必要があります。