Slide 1
Slide 1 text
エンジニアと”協同”して
サービスをつくる
Slide 2
Slide 2 text
Goemon @Allied Architects Inc.
Web UX Engineer
PHP / Laravel / MySQL / AWS etc.
@yashikawa3 Follow Me!!♡
Slide 3
Slide 3 text
I. 直近のお仕事紹介
II. デザイナー vs エンジニア
III. エンジニアと協同してサービスをつくる
Agenda
Slide 4
Slide 4 text
あらためて⾃⼰紹介
ü Web開発10年くらい
ü プログラム開発がメイン
ü PMもやる
ü デザインは素⼈同然
Slide 5
Slide 5 text
I . 直近のお仕事紹介
Slide 6
Slide 6 text
担当範囲
ü プロジェクトマネジメント
ü 要件定義
ü インフラ設計・構築
ü データベース設計・構築
ü アーキテクチャ設計
ü バックエンドプログラム開発
ü 画⾯設計
Slide 7
Slide 7 text
突然ですが質問
画⾯設計(構成 / 要素決め)は誰がやってますか？
1. デザイナー
2. エンジニア
3. プロダクトマネージャー
4. その他
Slide 8
Slide 8 text
画⾯設計
ü ワイヤーフレーム作り
Cacooべんり
⾃分 ：構成、要素決め
デザイナ：Webデザイン
Slide 9
Slide 9 text
画⾯設計
↓
デザイン
↓
プログラム開発
この⼯程の⼿戻りが少ない
Slide 10
Slide 10 text
Ⅱ. デザイナー vs エンジニア
͜ͷσβΠϯ
࣮ݱ͍͠Μ
Ͱ͢έυʂʁ
Slide 11
Slide 11 text
思考プロセスの違い
デザイナー
どう伝えるか
が主な関⼼事
エンジニア
どう作るか
が主な関⼼事
Slide 12
Slide 12 text
「このデザイン実現できません」の⾏間
n裏側のデータ構造に起因することが９割
n⾮機能要件を満たすコストとのトレードオフ
（速度性能、メンテナンス性能、etc）
Slide 13
Slide 13 text
プロダクトにとっては
どちらも⼤切
(性質・状況にはよる)
鵜呑みにする必要はない
Slide 14
Slide 14 text
ただし・・・
開発が進めば進むほど⼿戻りの
ダメージは双⽅にとって⼤きい
Slide 15
Slide 15 text
Ⅲ. エンジニアと”協同”して
サービスをつくる
Slide 16
Slide 16 text
プログラム開発にはいるまえに
ワイヤーの時点で詳細まで
エンジニアと話し合う
Slide 17
Slide 17 text
プログラム開発にはいるまえに
要素に過不⾜は
ないか？
複数選択か？
単⼀選択か？
データが存在しない
時はどうする？
この条件は
実現できるか？
この条件は実現できるか？
Slide 18
Slide 18 text
(基本的には)
画⾯はデータベースの投影である
ü データベース（≠SQL）とは何か
ü データ構造についての最低限の知識
（テーブル、リレーション、etc）
データベースを知ることでエンジニアとのやり取りも
スムーズになる
Slide 19
Slide 19 text
正しい使い⽅を簡単に、誤った使い⽅を困難に
良いインタフェースとは次の2つの条件を満たすインタフェー
スのことです。
ü正しく使⽤する⽅が操作ミスをするより簡単
ü誤った使い⽅をすることが困難
妥協しないポイントを定める
中途半端に作ってUXを著しく損ねるくらいなら
機能単位でリリース⾒送りも検討する
Slide 20
Slide 20 text
エンジニアもデザイナーも
「最⾼のサービスを作る」
という同じ⽬的を持つ仲間
お互い歩み寄りながら進もうZE☆
いちばん⼤切なこと
Slide 21
Slide 21 text
Thank you