ホーム » UX Design » UX-design #Day12(メルカリ) #1

目次

UX-design #Day12(メルカリ) #1

目次

メルカリアプリ ブランドからさがす画面をトレースしてみた!

少し間が空いて12日目です。ご無沙汰しておりました。今日は日本のアプリ、mercari(メルカリ)の画面をトレースしてみました。日本人なら一度は中古の品をこのアプリで探したり、売ったりしたことがあるのではないでしょうか?私も本をたくさん売りました!最近、UXが良くなっていて、売る時も売る内容を自動的に書いてくれたり手間が減った気がします。簡単な画面からトレースしようと思い、一つのパターンしか並んでいない画面を選びました。

【UI/UXの観点から気づいたこと】

  • 下のナビゲーションバーのアイコンは非常にわかりやすいと思います。このアイコンで何をするのかという動詞が想像できます。
  • 良くない点としては、この画面が今、下のナビゲーションバーのどこにいるのかわからないところです。私なら、アイコンとラベルを太くするか、フォーカスされているように色を変えるか、などするでしょう。
  • カードUIの中身は日本人が使う仕様になっていると思いました。ブランドの読み方をカタカナで目立つようにしているのは日本人向けだと思いました!
  • ヘッダーもファーストビューで知っているブランドがなかったらすぐに検索できるように検索窓があるのはいいですね!UX的に改善できそうだなと思ったのは、この検索窓に入力している段階で自動的に候補が上がってくるようになったらとてもいいと思いました。入力して検索を押さないといけないのは少し手間だと感じました。
  • また、ヘッダーのクリアボタン。最初、何をクリアしてくれるのかな?と思いましたが、使ってみたらわかりました。このチェックボックスの選択したもの全てを外してくれる機能でした。この位置にあるので、少し機能が想像しづらかったです。個人的には検索するボタンと並列で置いて、目立たないようにボタンの横幅は狭くして、左に配置したかもしれないです。
  • 一番下に固定で浮いている「検索する」は色がいいですね。このメルカリのプライマリーカラーは目立ちますね。チェックボックスにチェックを入れて検索することがすぐにわかります。
  • この検索するを押した後に検索結果の画面に行くのですが、そこでどのブランドを検索したのかが、ヘッダーでわかるようになっているのがとても良いと思いました。ブランドのタグが表示されていました。

私がトレースしたものについて気づいたことやアドバイスがあれば、コメントいただけると嬉しいです!

またみなさんがこのアプリの画面で気づいがUI/UXについて共有いただけると嬉しいです!!

コメントを送る

世界をUXデザインでより良くする
UXコピーでより良くする
明日も一緒に