クックパッドの春インターン「サービス開発コース」に参加してきました
先日Cookpad Spring 1day Internship 2019のサービス開発コースに参加してきました。
その時の内容が非常に勉強になったので備忘録を兼ねてブログに書こうという回です。*1
基本的に下のスライドの内容を部分部分反芻していくブログになると思うので、通した内容が知りたい方は直接スライドをどうぞ。
概要
エンジニアとデザイナーを志望する参加者が二人一組になってサービスのプロトタイプを作ってみようというものでした。
募集サイトでは「アイデアを形にするプロセスを体験」と書いてありましたが、実際はサービスを作る上で考えるべきことと、アイデアを伝える手法について学んだような気がします。
（スライドで言う仮説と実行）
主に勉強になったことたち
- 上から考える
- プロトタイプの作成
- UIデザインの手法
何が勉強になったか説明するために僕が個人でやってて陥りがちだったことを挙げたいと思います。
- 実装中の「この機能（or アプリ）便利なのか…？誰が使うんだ…？」
- ここのUIこっちの方がいいかなぁ → クソダサになったぞ！のようなデザインの迷走
上から考えるは 実装中の「この機能便利なのか…？誰が使うんだ…？」、UIデザインの手法はデザインの迷走、プロトタイプの作成は両方に対する解決策を提示してくれたと感じています。
上から考える
勝手に僕が「上から考える」って言ってるだけでそんなことはスライドには書いてません。
機能から考えるのではなくユーザーから考えるということです。
特に僕は個人で自分が欲しいだけのアプリを開発していたので、なんとなく作りたい機能を実装してもユーザー（=自分）の欲求に当てはまるものになっていました。*2
ですが、今回講義で説明いただいた内容では、「どんな人のどんな欲求を満たすためにどんな課題を解決するためにどんな機能が必要なのか」という順番で考えを進めていきました。
整理すると、今までの僕が「機能 → 欲求」（こんな機能作ろ、こういうところで便利そうだし）という調子だったのに対して、「対象 → 欲求 → 課題 → 機能」という順番でした。
考えてみれば当然のことではありますが、「こんな機能作りたい！」ベースで機能を考えがちになってしまっていたことを認識させられました。
勉強のために何かを作るのであれば技術ベースの考えは目的にあった考え方だと思いますが、自分にかかっていたバイアスを認識できたことが個人的には大きかったです。
一連の流れ、先述の「サービスを作る上で考えるべきこと」についても本当に勉強になりましたが、僕がブログでうんたら言うよりスライドに書いてあることを読んだ方がいいと思うのでそちらはスライドをご覧ください。
プロトタイプの作成
プロトタイプを作ろうと言う話です。
個人開発では頭の中でプロトタイプを作って即実装となりがちだったのですが、単純にプロトタイピングした方が考えの解像度が段違いだと言う認識を受けました。
また、スライドにもありますが、必要最低限でプロトタイプを作ることによって素早くユーザーに当ててフィードバックを受けることができると言う点もなるほどと感じました。
まだこれでフィードバックを受けたことはこのインターン以外ではありませんが、今後は是非やっていきたいと燃えています。
それと、インターンでは紙にUIを書くペーパープロトタイプを行ったのですが、紙の表現力が思ってた以上に素晴らしかったのと、Marvelというアプリが素晴らしかったのが印象的です。
「XDは実際に画面の関係を作れるから良い！」とか聞いていましたが、紙とスマホだけでそれができればもう最高って話ですよ。
UIデザインの手法
これはインターンの内容と言うよりは終わった後に直接伺ったことなのでアレですが「作ったアプリがクソダサい」と直接相談して答えてもらったことが印象的でした。
スライドとかもないのでガチ備忘録です。
ブログというより自分のメモに近しくなりますがご容赦ください。
勉強の方法
- 他のアプリを観察する
作るとき
- 情報を整理する
- 線の引き方に気をつける
ex) 線が重なるとうるさい
ex2) 影も線になる → 影は必要なの？（色だけでも区切りにはなる）
線は情報を区切る → 情報に対して区切り方が不適切だとユーザーは違和感を覚える - 一つの要素を一つの表現にまとめる = 別の要素はそこから外す
ex) ユーザーの情報はカードに、それに対する他ユーザーのアクションはelevationをつける - 情報を切らない
画面のインタラクションで画面間の関係を示す
ex) リストに要素を登録する画面はリストの下から出てくる
→ 保存するときはリストに収まるようなアニメーション - ユーザーに違和感を与えない、初見でもわかるように
- 線の引き方に気をつける
画面全体で情報をどう整理するのかを考える → 色などのテーマ決め → コンポーネントのデザインなど
インプットもアウトプットも増やしていこうね ← 先のペーパープロトタイプが役に立つのでは
まとめ
マジの最高でした、やっぱりサービス作りたいですね。 やっていくぞ。
本当にありがとうございました。
*1:当日サインした書類の内容を正直あまり覚えていないので、気をつけて書きますがもし書いちゃダメなことが書いてあればお手数ですが連絡いただければと思います。
*2:WhiskeyNote、インストールしてね！
