phpconfuk 20170610 lt

2. 2017/05/27
株式会社Fusic 平田 哲
クイズを支える技術2017

3. Fusic Co., Ltd.
自己紹介
3
平田 哲（HIRATA, Satoshi）
id: debility
‘Kiban Unit’ as Fusic Co., Ltd.
http://fusic.co.jp/
Fukuoka.pm
Program, Server, Network, and “Nomikai”
icon: © mutsuking

4. Fusic Co., Ltd.
私事ですが
4

5. Fusic Co., Ltd.
私事ですが
5
本日5本目のLTです。

6. Fusic Co., Ltd.
注意
6
ところどころ聞こえにくい場面が
あると思いますが、大人の事情と
いうことで察してください。

7. Fusic Co., Ltd.
注意2
7
後日スライド公開しますが
検閲削除が入る可能性は
割とあります。

8. Fusic Co., Ltd.
注意3
8
映像OKで応募してますが
多分公開NGになると思います。
（権利的な意味で）

9. Fusic Co., Ltd.
注意4
9
会社の資産を使っていますが
個人の活動です。

10. Fusic Co., Ltd.
今日の話
10
クイズとかを作った話です。

11. Fusic Co., Ltd.
何の話か
11
結婚式の2次会の余興のシステムの話

12. Fusic Co., Ltd.
何の話か
12
結婚式の2次会の余興のシステムの話
・多人数参加型クイズ
・回答はスマホでやってもらう

13. Fusic Co., Ltd.
話すこと、話さないこと
13
プロジェクト全体の時間配分

14. Fusic Co., Ltd.
話すこと、話さないこと
14
プロジェクト全体の時間配分

15. Fusic Co., Ltd.
話すこと、話さないこと
15
プロジェクト全体の時間配分
題材検討
クイズフォーマット検討
モラトリアム

16. Fusic Co., Ltd.
話すこと、話さないこと
16
プロジェクト全体の時間配分
素材集め

17. Fusic Co., Ltd.
話すこと、話さないこと
17
プロジェクト全体の時間配分
実装

18. Fusic Co., Ltd.
話すこと、話さないこと
18
プロジェクト全体の時間配分
このへんを
話します

19. Fusic Co., Ltd.
過去作ったもの1
19
A B C D E
司会者
解答者

20. Fusic Co., Ltd.
過去作ったもの2
20
司会者
解答者
客
Internet
QRコード使って回答
回答結果を元に表示
（検閲削除）

21. Fusic Co., Ltd.
過去作ったもの3
21
司会者
解答者
客
Internet
スマホから回答
回答結果を元に表示
Amazon EC2
（検閲削除）

22. Fusic Co., Ltd.
うまくいかなかったこと
22
・そもそもキーボード操作系がオレ流すぎた
→ 慣れないとハードル高い
・画面作るところが分業できない
→ こだわりが説明できない
・当日バグ発生
→ 単純な実装ミス

23. Fusic Co., Ltd. 23
とりあえず
で

24. Fusic Co., Ltd.
Demo
24
第一問。

25. Fusic Co., Ltd.
前回の構成
25
Nginx
CakePHP
(Apache)
node.js
PostgreSQL
回答情報
全般

26. Fusic Co., Ltd.
今回の構成
26
Nginx
CakePHP
(Apache)
node.js
PostgreSQL
回答情報
回答者
管理操作系

27. Fusic Co., Ltd.
構成見直し
27
・回答者がアクセスする画面はCakePHP
➜ 認証周りとかをさっくり作るため、慣れてる
やつで実装
・他は全部Node.jsで実装
・キーボード操作系を、コントローラ実装する方
式に変更
・ISUCONでよくあるwarm-up方式を導入

28. Fusic Co., Ltd.
実装見直し
28
・イベント処理はSocket.IOに統一
→ 操作系と画面をある程度疎結合にできた
・負荷検証用のスクリプトを書く
・すぐに進行を巻き戻せるようにする
→ 開発テストとも楽になった
・集計はViewを作ることで、なるべく
PostgreSQLに寄せる（実装を減らす）

29. Fusic Co., Ltd.
（検閲削除）なので
29
大事なものがもうひとつ。

30. Fusic Co., Ltd.
ハット構成
30
・Macbook＋Arduino＋ボタン＋ハット

31. Fusic Co., Ltd.
ハット構成
31
・Macbook＋Arduino＋ボタン＋ハット
・ハットの制御は小型サーボモータ

32. Fusic Co., Ltd.
ハット構成
32
・Macbook＋Arduino＋ボタン＋ハット
・ハットの制御は小型サーボモータ
・音の再生やその他制御をMacbookで

33. Fusic Co., Ltd.
ハット構成
33
・Macbook＋Arduino＋ボタン＋ハット
・ハットの制御は小型サーボモータ
・音の再生やその他制御をMacbookで
画面表示は変わらずNodeでまかなう
→ 繋ぎ変えによる時間ロスの節約

34. Fusic Co., Ltd.
別の課題
34
（検閲削除）

35. Fusic Co., Ltd.
画像をめっちゃ拡大したい
35
・素材はあるが絵心がない
・A2印刷に必要な解像度の画像をどう用意
するか
・単に拡大するだけだと荒い。。。

36. Fusic Co., Ltd.
人工知能に頼る
36
https://www.e-vision.co.jp/wp-content/themes/site_e-vision/img/miraie_ai_1.png

37. Fusic Co., Ltd.
waifu2x
37
https://github.com/nagadomi/waifu2x

38. Fusic Co., Ltd.
waifu2x
38
https://github.com/nagadomi/waifu2x
ある程度の画像ならWebアプリで拡大できる
http://waifu2x.udp.jp/index.ja.html

39. Fusic Co., Ltd.
waifu2x
39
https://github.com/nagadomi/waifu2x
ある程度の画像ならWebアプリで拡大できる
http://waifu2x.udp.jp/index.ja.html
それ以上の場合はAMIが用意されているので、
GPUインスタンスを建てれば使える

40. Fusic Co., Ltd.
うまくいったこと
40
・分業でやれること（幅）が増えた

41. Fusic Co., Ltd.
うまくいったこと
41
・分業でやれること（幅）が増えた
・時間はかなり予定通りに収まった

42. Fusic Co., Ltd.
うまくいったこと
42
・分業でやれること（幅）が増えた
・時間はかなり予定通りに収まった
・余興マークアップにdisplay:flexが超便利

43. Fusic Co., Ltd.
うまくいったこと
43
・分業でやれること（幅）が増えた
・時間はかなり予定通りに収まった
・余興マークアップにdisplay:flexが超便利
・再利用しやすくなった

44. Fusic Co., Ltd.
うまくいったこと
44
・分業でやれること（幅）が増えた
・時間はかなり予定通りに収まった
・余興マークアップにdisplay:flexが超便利
・再利用しやすくなった
・管理画面ブービートラップをシャレで用意し
たら何人か踏んでた

45. Fusic Co., Ltd.
周りの感想
45
・会場の方から驚かれる
・「売れる」と言われる
→「著作権が。。。」と言うと押し黙る

46. Fusic Co., Ltd.
今後の課題
46
・素材（音・画像）集めが未だに分業できてい
ないしできる気がしない

47. Fusic Co., Ltd.
今後の課題
47
・素材（音・画像）集めが未だに分業できてい
ないしできる気がしない
・開発兼操作兼問題作成兼司会、という
SPOFが未だに解消できていないし解消でき
なさそう

48. Fusic Co., Ltd.
今後の課題
48
・素材（音・画像）集めが未だに分業できてい
ないしできる気がしない
・開発兼操作兼問題作成兼司会、という
SPOFが未だに解消できていないし解消でき
なさそう
・クイズフォーマットがいい加減尽きてきた

49. Fusic Co., Ltd.
今後の課題
49
・素材（音・画像）集めが未だに分業できてい
ないしできる気がしない
・開発兼操作兼問題作成兼司会、という
SPOFが未だに解消できていないし解消でき
なさそう
・クイズフォーマットがいい加減尽きてきた
・既に主要6局中3局を敵に回しているこわい

50. Fusic Co., Ltd.
ご清聴ありがとうございました。