二年前のマッチング画面を今風に変えてみた

1. 二年前のマッチング画面を
今風に変えてみた
Arcana Meetup #67
Kashiwagi Ryota

2. 約二年前
キミスカという新卒向け逆求人サービスの
モバイルアプリを開発しておりました。

4. 二年前キミスカは
モバイルアプリのリリースのために
急ピッチで開発を進めていました。

5. 初のReact Nativeでの
モバイルアプリ開発ということで
ウキウキでした。

6. 本題

7. ある画面の
レイアウト作成（画面全部）の
依頼を受けました

8. ある画面の用件
Web版と同じ感じでいいよ
コンテンツはないからどこかの使いまわして
マッチングアプリっぽいUIがいいね
いい感じにして

9. 当時の記憶が曖昧ですが
このようなニュアンスだったかなと思うが、
たぶん盛ってます。

10. すべての用件を満たし、
スカウトミーが完成しました。
そうです。スカウトミーです。

11. スカウトミーとは？

12. 逆求人型就活サイトのキミスカにおいて、
自ら求人することができるという従来型の就活機能
独自のアルゴリズムにより、
一日三社の企業を表示し、
興味あり、なしを選択できる。
興味ありを受けた企業は、
条件がマッチすれば学生に
スカウトを出すことができる。
学生 企業
→
←

13. アルカナキミスカ内のスカウトミーの扱いです
タスクとして存在しなかったり 仕様が不明だったり

15. ちなみにweb版は
トップ画面の一番いい席に
表示されている。

16. アプリはここから

17. で、アプリ版スカウトミーはというと

19. 情報少な過ぎる説

20. スカウトミーだよ
誰も押さないし
読まないしょ
会社のロゴです
目一杯引き伸ばしてます
企業名
左から興味なし、企業情報、
興味ありボタンだよ
カードになっていて
左右スワイプ、
タップもできます

21. よくない点
・画面を開いた時に情報が少なすぎる
（迷子になる）
・コンテンツを引き伸ばしているのでチープ感
が増す
・アイコンが何を指すのかわかりにくい
・バツのアイコンがなんか嫌
・真ん中の i もよくわからない
・ナビゲーションヘッダーの”スカウトミー”いらん

22. 改善点
・画面を開いたら何をすべきかわかるようにする
・コンテンツは引き伸ばさない
・画面遷移なしで企業の情報にアクセスできる
（スカウトミー用のコンテンツはないので使い回
す）
・わかりやすいアイコンにする

23. 改善点を踏まえ
スカウトミーを新たに
作成しました

24. 新しいスカウトミー
・画面を開いたら何をすべきかわかるように
する
→画面上部に何をするか書いちゃいました
・コンテンツは引き伸ばさない
→刷新した企業概要画面のコンテンツを流
用しました。
・わかりやすいアイコンにする
→アイコンに文字をつけてアクション名を明
記しました

25. こんな感じ

26. →

27. まとめ
少しずつ良くなるよう
UI/UXデザイナーとして
邁進して行きます。

28. 参考

29. おわり