pudule live cording
TRANSCRIPT
徳島でニートしながら
SWTokyoに参加した話
小西 裕介
2013/02/20（水）
13年2月21日木曜日
（１）自己紹介
（２）Puduleぶっちゃけ話
（３）エンジニアへの危険ワード
（４）ＬＩＶＥコーディング
13年2月21日木曜日
（１）自己紹介
（２）Puduleぶっちゃけ話
（３）エンジニアへの危険ワード
（４）ＬＩＶＥコーディング
13年2月21日木曜日
konif
@konifar
http://konifar.com
http://partymegane.com
【こにふぁー】文系卒・プログラミング経験０
➡ (株)ワークスアプリケーショ
ンズ入社・勤怠管理ソフト開発
➡ 速度改善リーダーなど色々
やって４年間がんばる
➡ 別のことやりたくなり退社
➡ １０日間ニート
13年2月21日木曜日
konif
@konifar
http://konifar.com
http://partymegane.com
【こにふぁー】文系卒・プログラミング経験０
➡ (株)ワークスアプリケーショ
ンズ入社・勤怠管理ソフト開発
➡ 速度改善リーダーなど色々
やって４年間がんばる
➡ 別のことやりたくなり退社
➡ １０日間ニート ⬅ ここの話
13年2月21日木曜日
今まで作ったもの①
13年2月21日木曜日
給料の計算を６倍くらいに改善 ４０時間 ⇒ ７時間くらい
某電機メーカーさんや某ファミレスの給料が毎月ちゃんと
振り込まれるのは僕のおかげ かも
今まで作ったもの①
13年2月21日木曜日
今まで作ったもの②
13年2月21日木曜日
問合せ管理ツール『Commutan』 1000件溜まっていたお客様からの問合せが100件くらいに
部署内だけのために作ったが全社で使われることに
今まで作ったもの②
13年2月21日木曜日
今まで作ったもの③今まで作ったもの③
13年2月21日木曜日
今まで作ったもの③今まで作ったもの③
若手メンバーの日報管理ツール 日報をメールで読んでメールでフィードバックするのが
めんどくさくなったので作成
報告に対してコメントできる機能があり それは全社の
システムに取り入れられた らしい
13年2月21日木曜日
今まで作ったもの④
13年2月21日木曜日
今まで作ったもの④
アニメ聖地巡礼アプリ『Dive』 初SWTokyoで作って Most votest awardとったやつ
13年2月21日木曜日
今まで作ったもの⑤
13年2月21日木曜日
今まで作ったもの⑤
美術館音声ガイドアプリ『Loope』 ２回目のSWTokyoで作ったやつ（完成せず）
13年2月21日木曜日
今まで作ったもの⑥
13年2月21日木曜日
今まで作ったもの⑥
面接調整ツール『Padule』 飛び入りのSWTokyoで作ったやつ ⬅ 今回のメインの話
13年2月21日木曜日
（１）自己紹介
（２）Puduleぶっちゃけ話
（３）エンジニアへの危険ワード
（４）ＬＩＶＥコーディング
13年2月21日木曜日
参加は全くの予想外
13年2月21日木曜日
参加は全くの予想外
13年2月21日木曜日
ここにいました
13年2月21日木曜日
MTGで感じる違和感・・・
（エンジニアチームの最初の会話にて）
こに「僕ってがっつり役割ある感じですか？w」
もろ「え？w」
ふみ「え？www」13年2月21日木曜日
「まあいっか」と決意する
13年2月21日木曜日
エンジニア同士の役割決め
13年2月21日木曜日
エンジニア同士の役割決め
その前に少し補足します
13年2月21日木曜日
WEBサービスの役割分担
13年2月21日木曜日
何となくイメージできますか？
・フロントエンド
・バックエンド
・マークアップ
・フレームワーク
・ワイヤーフレーム
・Html
・Javascript
・CSS
・Rails
・DB
13年2月21日木曜日
Facebookメッセージを例に
13年2月21日木曜日
Facebookメッセージを例に
『フロントエンド』＝目に見える部分時系列でメッセージが並ぶ
開封されたら横にチェックマークがつく
13年2月21日木曜日
Facebookメッセージを例に
『フロントエンド』＝目に見える部分時系列でメッセージが並ぶ
開封されたら横にチェックマークがつく
『バックエンド』＝裏側の処理部分
返信ボタンを押したら、内容が保存される返信の時間は、各国の時間で保存する
同時に１万人が返信しても大丈夫なようにする
13年2月21日木曜日
Facebookメッセージを例に
『フロントエンド』＝目に見える部分時系列でメッセージが並ぶ
開封されたら横にチェックマークがつく 『要件定義』＝何ができるかを洗い出す作業
「横にプロフィール画像つけたい」「Enterで返信させたい」
「開封状況がわかるようにしたい」『バックエンド』＝裏側の処理部分
返信ボタンを押したら、内容が保存される返信の時間は、各国の時間で保存する
同時に１万人が返信しても大丈夫なようにする
13年2月21日木曜日
エンジニアでも得意分野は違う
『フロントエンド』＝目に見える部分時系列でメッセージが並ぶ
開封されたら横にチェックマークがつく
『バックエンド』＝裏側の処理部分
返信ボタンを押したら、内容が保存される返信の時間は、各国の時間で保存する
同時に１万人が返信しても大丈夫なようにする
フロントエンジニアマークアップエンジニアデザイナー
エンジニアプログラマー（ＳＥ）インフラエンジニア
13年2月21日木曜日
それぞれ使う技術も違う
『フロントエンド』＝目に見える部分時系列でメッセージが並ぶ
開封されたら横にチェックマークがつく
『バックエンド』＝裏側の処理部分
返信ボタンを押したら、内容が保存される返信の時間は、各国の時間で保存する
同時に１万人が返信しても大丈夫なようにする
フロントエンジニアマークアップエンジニアデザイナー
エンジニアプログラマー（ＳＥ）インフラエンジニア
Html, JavaScript, CSS
＝画面作るのに必要な技術
Rails, Java, DB
＝裏側の処理を作るのに 必要な技術
13年2月21日木曜日
Html, CSS, JavaScript
って何？
13年2月21日木曜日
‧HTML：文字とかの骨組みだけ
‧CSS：⬆の色とかレイアウトとかを整理
‧JavaScript：⬆に動きをつけたり
ざっくり役割
13年2月21日木曜日
つまりこんな感じ
13年2月21日木曜日
HTML
つまりこんな感じ
13年2月21日木曜日
HTML
+CSS
つまりこんな感じ
13年2月21日木曜日
HTML
+CSS
+JavaScript
つまりこんな感じ
13年2月21日木曜日
だんだんかっこよくなると覚えておけばいいです
13年2月21日木曜日
「エンジニアと言っても
できることとできないことがある」
と、覚えておいてください。
エンジニアの役割の補足まとめ
13年2月21日木曜日
エンジニア同士の役割決め
戻ります
13年2月21日木曜日
Pudule にいたエンジニア
こにふぁー
もろみん
ふみ
13年2月21日木曜日
Pudule にいたエンジニア
こにふぁー
もろみん
ふみ
デザイン : できない
フロント : ちょっとできる
バック : 結構できる
13年2月21日木曜日
Pudule にいたエンジニア
こにふぁー
もろみん
ふみ
デザイン : できない
フロント : ちょっとできる
バック : 結構できる
デザイン : できない
フロント : できない
バック : できる
13年2月21日木曜日
Pudule にいたエンジニア
こにふぁー
もろみん
ふみ
デザイン : できない
フロント : ちょっとできる
バック : 結構できる
デザイン : できない
フロント : できない
バック : できる
デザイン : できる
フロント : できるかも
バック : できない
13年2月21日木曜日
Pudule にいたエンジニア
こにふぁー
もろみん
ふみ
デザイン : できない
フロント : ちょっとできる
バック : 結構できる
デザイン : できない
フロント : できない
バック : できる
デザイン : できる
フロント : できるかも
バック : できない
13年2月21日木曜日
Pudule にいたエンジニア
こにふぁー
もろみん
ふみ
デザイン : できない
フロント : ちょっとできる
バック : 結構できる
デザイン : できない
フロント : できない
バック : できる
デザイン : できる
フロント : できるかも
バック : できない
画面を作る
裏側を作る
かっこ良くする
13年2月21日木曜日
開発方針
13年2月21日木曜日
開発方針の決定
13年2月21日木曜日
開発方針の決定画面イメージや必要な機能が結構ふわっとしていた
「なんかGoogleカレンダーっぽい感じで」「調整さんを特化させた雰囲気で」
13年2月21日木曜日
開発方針の決定画面イメージや必要な機能が結構ふわっとしていた
「なんかGoogleカレンダーっぽい感じで」「調整さんを特化させた雰囲気で」
MTGで聞く限りあんまり難しい技術は必要よさそう「超大人数とかで使うものじゃない」
13年2月21日木曜日
開発方針の決定画面イメージや必要な機能が結構ふわっとしていた
「なんかGoogleカレンダーっぽい感じで」「調整さんを特化させた雰囲気で」
MTGで聞く限りあんまり難しい技術は必要よさそう「超大人数とかで使うものじゃない」
見た目に結構こだわりそう「美人事向け」
「パズルみたいに楽しい体験を」
13年2月21日木曜日
開発方針の決定
どんどん作って共有してフィードバックもらって修正する
13年2月21日木曜日
ひたすら開発
13年2月21日木曜日
13:00 ランディングページ完成
13年2月21日木曜日
15:00 人事用画面を共有
13年2月21日木曜日
16:00 画面がかっこよくなる
13年2月21日木曜日
18:00 こにし離脱
13年2月21日木曜日
と思ったら・・・
13年2月21日木曜日
21:00 緊急の作成依頼が入る
13年2月21日木曜日
21:45 「いつやるの？今でしょ！」
13年2月21日木曜日
22:00 バスの中で作業開始
13年2月21日木曜日
22:05 酔って気持ち悪くなる
13年2月21日木曜日
22:50 申請画面を共有
13年2月21日木曜日
3:30 色々作業して睡眠
13年2月21日木曜日
次の日は完全に離脱
13年2月21日木曜日
次の日のことは
実はあんまり知らないが
メンバーに入れてもらった
13年2月21日木曜日
（１）自己紹介
（２）Puduleぶっちゃけ話
（３）エンジニアへの危険ワード
（４）ＬＩＶＥコーディング
13年2月21日木曜日
『危険ワード』
＝ちょっと気遣い欲しい振舞
※ 完全に主観です
13年2月21日木曜日
「いい感じにしといてください」
13年2月21日木曜日
「いい感じにしといてください」エンジニアとのやり取りは
美容師に髪型を頼むようなもの初対面で「おまかせで」といわれると困る「木村カエラみたいにしてください」みたいに言ってくれると楽。
13年2月21日木曜日
「いい感じにしといてください」エンジニアとのやり取りは
美容師に髪型を頼むようなもの初対面で「おまかせで」といわれると困る「木村カエラみたいにしてください」みたいに言ってくれると楽。
時間があれば、イケてるエンジニアと話して固めるのもアリ
優秀なエンジニアは、相手の持つイメージを話しながら吸い上げてくれる！
が、そんなエンジニアばかりではない。
13年2月21日木曜日
「ここ直すの簡単ですよね？」
13年2月21日木曜日
「ここ直すの簡単ですよね？」簡単そうに見えても結構めんどく
さいところはあるギリギリの積み木のように精密に作られていることも多い。簡単そうでもお伺いが欲しいかも。
13年2月21日木曜日
「ここ直すの簡単ですよね？」簡単そうに見えても結構めんどく
さいところはあるギリギリの積み木のように精密に作られていることも多い。簡単そうでもお伺いが欲しいかも。
だからこそ、なるべく早くこだわりポイントを伝えてほしい先に言ってくれればいくらでも修正可能。
最低限何が欲しいか、最低限じゃないけどここにはこだわりたい、といった内容は早く教えて
13年2月21日木曜日
「・・・（反応がない）」
13年2月21日木曜日
「・・・（反応がない）」文句でも何でもいいからレスポン
スが欲しいイメージを実際に形にすると、必ず食い違いが出ます。そこはぜひとも指摘してほしいです。
13年2月21日木曜日
「・・・（反応がない）」文句でも何でもいいからレスポン
スが欲しいイメージを実際に形にすると、必ず食い違いが出ます。そこはぜひとも指摘してほしいです。
褒めたら頑張るエンジニアも多いです。自分はそうです。
開発には、結構地道な作業もあります。その分フィードバックがあるとテンション上がります。
13年2月21日木曜日
「食べログみたいの作りたい」
13年2月21日木曜日
「食べログみたいの作りたい」意義を感じられないとやる気が出ないエンジニアもいます。作ろうとしているサービスに価値を感じられない
と力を注げないエンジニアもいます。「食べログみたいなのだったら食べログでいい
じゃん」と思ってしまうわけです。
13年2月21日木曜日
「食べログみたいの作りたい」意義を感じられないとやる気が出ないエンジニアもいます。作ろうとしているサービスに価値を感じられない
と力を注げないエンジニアもいます。「食べログみたいなのだったら食べログでいい
じゃん」と思ってしまうわけです。
作る事自体に喜びを感じるエンジニアもいます。要見極め。
作ることが楽しいというエンジニアにとっては問題ないです。ただ、その場合は何を作りたいかを
明確に伝えてあげてください。
13年2月21日木曜日
「エンジニアを気持ちよくすれば
短時間ですごいの作ってくれる」
と、覚えておいてください。
『危険ワード』のまとめ
13年2月21日木曜日
（１）自己紹介
（２）Puduleぶっちゃけ話
（３）エンジニアへの危険ワード
（４）ＬＩＶＥコーディング
13年2月21日木曜日
これ作ります
13年2月21日木曜日
13年2月21日木曜日
最後に宣伝
13年2月21日木曜日
ありがとうございました
13年2月21日木曜日