The Presentation depends on the experience that I joined The StartupWeekend Suddenly. I spoke to NOT Engineer in PASONA Inc. at 2013/02/20.

1. 徳島でニートしながら
SWTokyoに参加した話
小西 裕介
2013/02/20（水）
13年2月21日木曜日

2. （１）自己紹介
（２）Puduleぶっちゃけ話
（３）エンジニアへの危険ワード
（４）ＬＩＶＥコーディング
13年2月21日木曜日

3. （１）自己紹介
（２）Puduleぶっちゃけ話
（３）エンジニアへの危険ワード
（４）ＬＩＶＥコーディング
13年2月21日木曜日

4. 【こにふぁー】
文系卒・プログラミング経験０
➡ (株)ワークスアプリケーショ
ンズ入社・勤怠管理ソフト開発
➡ 速度改善リーダーなど色々
konif
@konifar やって４年間がんばる
http://konifar.com ➡ 別のことやりたくなり退社
http://partymegane.com ➡ １０日間ニート
13年2月21日木曜日

5. 【こにふぁー】
文系卒・プログラミング経験０
➡ (株)ワークスアプリケーショ
ンズ入社・勤怠管理ソフト開発
➡ 速度改善リーダーなど色々
konif
@konifar やって４年間がんばる
http://konifar.com ➡ 別のことやりたくなり退社
http://partymegane.com ➡ １０日間ニート ここの話
13年2月21日木曜日

6. 今まで作ったもの①
13年2月21日木曜日

7. 今まで作ったもの①
給料の計算を６倍くらいに改善
４０時間 ７時間くらい
某電機メーカーさんや某ファミレスの給料が毎月ちゃんと
振り込まれるのは僕のおかげ かも
13年2月21日木曜日

8. 今まで作ったもの②
13年2月21日木曜日

9. 今まで作ったもの②
問合せ管理ツール『Commutan』
1000件溜まっていたお客様からの問合せが100件くらいに
部署内だけのために作ったが全社で使われることに
13年2月21日木曜日

10. 今まで作ったもの③
13年2月21日木曜日

11. 今まで作ったもの③
若手メンバーの日報管理ツール
日報をメールで読んでメールでフィードバックするのが
めんどくさくなったので作成
報告に対してコメントできる機能があり それは全社の
システムに取り入れられた らしい
13年2月21日木曜日

12. 今まで作ったもの④
13年2月21日木曜日

13. 今まで作ったもの④
アニメ聖地巡礼アプリ『Dive』
初SWTokyoで作って Most votest awardとったやつ
13年2月21日木曜日

14. 今まで作ったもの⑤
13年2月21日木曜日

15. 今まで作ったもの⑤
美術館音声ガイドアプリ『Loope』
２回目のSWTokyoで作ったやつ（完成せず）
13年2月21日木曜日

16. 今まで作ったもの⑥
13年2月21日木曜日

17. 今まで作ったもの⑥
面接調整ツール『Padule』
飛び入りのSWTokyoで作ったやつ 今回のメインの話
13年2月21日木曜日

18. （１）自己紹介
（２）Puduleぶっちゃけ話
（３）エンジニアへの危険ワード
（４）ＬＩＶＥコーディング
13年2月21日木曜日

19. 参加は全くの予想外
13年2月21日木曜日

20. 参加は全くの予想外
13年2月21日木曜日

21. ここにいました
13年2月21日木曜日

22. MTGで感じる違和感・・・
（エンジニアチームの最初の会話にて）
こに「僕ってがっつり役割ある感じですか？w」
もろ「 え？w」
ふみ「 え？www」
13年2月21日木曜日

23. 「まあいっか」と決意する
13年2月21日木曜日

24. エンジニア同士の役割決め
13年2月21日木曜日

25. エンジニア同士の役割決め
その前に少し補足します
13年2月21日木曜日

26. WEBサービスの役割分担
13年2月21日木曜日

27. 何となくイメージできますか？
・フロントエンド ・Html
・バックエンド ・Javascript
・マークアップ ・CSS
・フレームワーク ・Rails
・ワイヤーフレーム ・DB
13年2月21日木曜日

28. Facebookメッセージを例に
13年2月21日木曜日

29. Facebookメッセージを例に
『フロントエンド』
＝目に見える部分
時系列でメッセージが並ぶ
開封されたら横にチェックマークがつく
13年2月21日木曜日

30. Facebookメッセージを例に
『フロントエンド』
＝目に見える部分
時系列でメッセージが並ぶ
開封されたら横にチェックマークがつく
『バックエンド』
＝裏側の処理部分
返信ボタンを押したら、内容が保存される
返信の時間は、各国の時間で保存する
同時に１万人が返信しても大丈夫なようにする
13年2月21日木曜日

31. Facebookメッセージを例に
『フロントエンド』
＝目に見える部分
時系列でメッセージが並ぶ
開封されたら横にチェックマークがつく
『要件定義』
＝何ができるかを洗い出す作業
「横にプロフィール画像つけたい」
「Enterで返信させたい」
「開封状況がわかるようにしたい」
『バックエンド』
＝裏側の処理部分
返信ボタンを押したら、内容が保存される
返信の時間は、各国の時間で保存する
同時に１万人が返信しても大丈夫なようにする
13年2月21日木曜日

32. エンジニアでも得意分野は違う
『フロントエンド』 フロントエンジニア
＝目に見える部分
時系列でメッセージが並ぶ
マークアップエンジニア
開封されたら横にチェックマークがつく
デザイナー
『バックエンド』
エンジニア
＝裏側の処理部分
返信ボタンを押したら、内容が保存される プログラマー（ＳＥ）
返信の時間は、各国の時間で保存する
同時に１万人が返信しても大丈夫なようにする インフラエンジニア
13年2月21日木曜日

33. それぞれ使う技術も違う
Html, JavaScript,
『フロントエンド』 フロントエンジニア
CSS ＝目に見える部分
時系列でメッセージが並ぶ
マークアップエンジニア
開封されたら横にチェックマークがつく
デザイナー
＝画面作るのに必要な技術
Rails, Java, DB
『バックエンド』
エンジニア
＝裏側の処理部分
返信ボタンを押したら、内容が保存される プログラマー（ＳＥ）
＝裏側の処理を作るのに
返信の時間は、各国の時間で保存する
必要な技術
同時に１万人が返信しても大丈夫なようにする インフラエンジニア
13年2月21日木曜日

34. Html, CSS, JavaScript
って何？
13年2月21日木曜日

35. ざっくり役割
•HTML：文字とかの骨組みだけ
•CSS： の色とかレイアウトとかを整理
•JavaScript： に動きをつけたり
13年2月21日木曜日

36. つまりこんな感じ
13年2月21日木曜日

37. つまりこんな感じ
HTML
13年2月21日木曜日

38. つまりこんな感じ
HTML
+
CSS
13年2月21日木曜日

39. つまりこんな感じ
HTML
+
CSS
+
JavaScript
13年2月21日木曜日

40. だんだんかっこよくなる
と覚えておけばいいです
13年2月21日木曜日

41. エンジニアの役割の補足まとめ
「エンジニアと言っても
できることとできないことがある」
と、覚えておいてください。
13年2月21日木曜日

42. エンジニア同士の役割決め
戻ります
13年2月21日木曜日

43. Pudule にいたエンジニア
こにふぁー
もろみん
ふみ
13年2月21日木曜日

44. Pudule にいたエンジニア
デザイン : できない
こにふぁー フロント : ちょっとできる
バック : 結構できる
もろみん
ふみ
13年2月21日木曜日

45. Pudule にいたエンジニア
デザイン : できない
こにふぁー フロント : ちょっとできる
バック : 結構できる
デザイン : できない
もろみん フロント : できない
バック : できる
ふみ
13年2月21日木曜日

46. Pudule にいたエンジニア
デザイン : できない
こにふぁー フロント : ちょっとできる
バック : 結構できる
デザイン : できない
もろみん フロント : できない
バック : できる
デザイン : できる
ふみ フロント : できるかも
バック : できない
13年2月21日木曜日

47. Pudule にいたエンジニア
デザイン : できない
こにふぁー フロント : ちょっとできる
バック : 結構できる
デザイン : できない
もろみん フロント : できない
バック : できる
デザイン : できる
ふみ フロント : できるかも
バック : できない
13年2月21日木曜日

48. Pudule にいたエンジニア
デザイン : できない
こにふぁー 画面を作る
フロント : ちょっとできる
バック : 結構できる
デザイン : できない
もろみん 裏側を作る
フロント : できない
バック : できる
デザイン : できる
ふみ かっこ良くする
フロント : できるかも
バック : できない
13年2月21日木曜日

49. 開発方針
13年2月21日木曜日

50. 開発方針の決定
13年2月21日木曜日

51. 開発方針の決定
画面イメージや必要な機能が
結構ふわっとしていた
「なんかGoogleカレンダーっぽい感じで」
「調整さんを特化させた雰囲気で」
13年2月21日木曜日

52. 開発方針の決定
画面イメージや必要な機能が
MTGで聞く限りあんまり
結構ふわっとしていた
難しい技術は必要よさそう
「なんかGoogleカレンダーっぽい感じで」
「超大人数とかで使うものじゃない」
「調整さんを特化させた雰囲気で」
13年2月21日木曜日

53. 開発方針の決定
画面イメージや必要な機能が
MTGで聞く限りあんまり
結構ふわっとしていた
難しい技術は必要よさそう
「なんかGoogleカレンダーっぽい感じで」
「超大人数とかで使うものじゃない」
「調整さんを特化させた雰囲気で」
見た目に結構こだわりそう
「美人事向け」
「パズルみたいに楽しい体験を」
13年2月21日木曜日

54. 開発方針の決定
どんどん作って共有して
フィードバックもらって修正する
13年2月21日木曜日

55. ひたすら開発
13年2月21日木曜日

56. 13:00 ランディングページ完成
13年2月21日木曜日

57. 15:00 人事用画面を共有
13年2月21日木曜日

58. 16:00 画面がかっこよくなる
13年2月21日木曜日

59. 18:00 こにし離脱
13年2月21日木曜日

60. と思ったら・・・
13年2月21日木曜日

61. 21:00 緊急の作成依頼が入る
13年2月21日木曜日

62. 21:45 「いつやるの？今でしょ！」
13年2月21日木曜日

63. 22:00 バスの中で作業開始
13年2月21日木曜日

64. 22:05 酔って気持ち悪くなる
13年2月21日木曜日

65. 22:50 申請画面を共有
13年2月21日木曜日

66. 3:30 色々作業して睡眠
13年2月21日木曜日

67. 次の日は完全に離脱
13年2月21日木曜日

68. 次の日のことは
実はあんまり知らないが
メンバーに入れてもらった
13年2月21日木曜日

69. （１）自己紹介
（２）Puduleぶっちゃけ話
（３）エンジニアへの危険ワード
（４）ＬＩＶＥコーディング
13年2月21日木曜日

70. 『危険ワード』
＝ちょっと気遣い欲しい振舞
※ 完全に主観です
13年2月21日木曜日

71. 「いい感じにしといてください」
13年2月21日木曜日

72. 「いい感じにしといてください」
エンジニアとのやり取りは
美容師に髪型を頼むようなもの
初対面で「おまかせで」といわれると困る
「木村カエラみたいにしてください」
みたいに言ってくれると楽。
13年2月21日木曜日

73. 「いい感じにしといてください」
エンジニアとのやり取りは
美容師に髪型を頼むようなもの
初対面で「おまかせで」といわれると困る
「木村カエラみたいにしてください」
みたいに言ってくれると楽。
時間があれば、イケてるエンジ
ニアと話して固めるのもアリ
優秀なエンジニアは、相手の持つイメージを話し
ながら吸い上げてくれる！
が、そんなエンジニアばかりではない。
13年2月21日木曜日

74. 「ここ直すの簡単ですよね？」
13年2月21日木曜日

75. 「ここ直すの簡単ですよね？」
簡単そうに見えても結構めんどく
さいところはある
ギリギリの積み木のように精密に作られているこ
とも多い。簡単そうでもお伺いが欲しいかも。
13年2月21日木曜日

76. 「ここ直すの簡単ですよね？」
簡単そうに見えても結構めんどく
さいところはある
ギリギリの積み木のように精密に作られているこ
とも多い。簡単そうでもお伺いが欲しいかも。
だからこそ、なるべく早くこだ
わりポイントを伝えてほしい
先に言ってくれればいくらでも修正可能。
最低限何が欲しいか、最低限じゃないけどここに
はこだわりたい、といった内容は早く教えて
13年2月21日木曜日

77. 「・・・（反応がない）」
13年2月21日木曜日

78. 「・・・（反応がない）」
文句でも何でもいいからレスポン
スが欲しい
イメージを実際に形にすると、必ず食い違いが出
ます。そこはぜひとも指摘してほしいです。
13年2月21日木曜日

79. 「・・・（反応がない）」
文句でも何でもいいからレスポン
スが欲しい
イメージを実際に形にすると、必ず食い違いが出
ます。そこはぜひとも指摘してほしいです。
褒めたら頑張るエンジニアも多い
です。自分はそうです。
開発には、結構地道な作業もあります。その分
フィードバックがあるとテンション上がります。
13年2月21日木曜日

80. 「食べログみたいの作りたい」
13年2月21日木曜日

81. 「食べログみたいの作りたい」
意義を感じられないとやる気
が出ないエンジニアもいます。
作ろうとしているサービスに価値を感じられない
と力を注げないエンジニアもいます。
「食べログみたいなのだったら食べログでいい
じゃん」と思ってしまうわけです。
13年2月21日木曜日

82. 「食べログみたいの作りたい」
意義を感じられないとやる気
が出ないエンジニアもいます。
作ろうとしているサービスに価値を感じられない
と力を注げないエンジニアもいます。
「食べログみたいなのだったら食べログでいい
じゃん」と思ってしまうわけです。
作る事自体に喜びを感じるエン
ジニアもいます。要見極め。
作ることが楽しいというエンジニアにとっては問
題ないです。ただ、その場合は何を作りたいかを
明確に伝えてあげてください。
13年2月21日木曜日

83. 『危険ワード』のまとめ
「エンジニアを気持ちよくすれば
短時間ですごいの作ってくれる」
と、覚えておいてください。
13年2月21日木曜日

84. （１）自己紹介
（２）Puduleぶっちゃけ話
（３）エンジニアへの危険ワード
（４）ＬＩＶＥコーディング
13年2月21日木曜日

85. これ作ります
13年2月21日木曜日

86. 13年2月21日木曜日

87. 最後に宣伝
13年2月21日木曜日

88. いいねしてください！
http://partymegane.com
13年2月21日木曜日

89. ありがとうございました
13年2月21日木曜日