エンジニアが披露宴の余興を頼まれたら

先日、知人の結婚披露宴にて初めて余興というものを依頼され、なんとか乗り切ったのでその時のこと。

# どうしよう
なにか持ちネタがあるわけでもない。
歌や踊りが達者なわけでもない。
ムービーは多少作れるけど、新婦側の余興でやるらしい。。
：
プログラミングしかない！！


# やったこと
**『HAPPINESS SCOUTER（ハピネス スカウター）』**

LINEで写真を送ると、写っている人の表情を認識して**『幸せ戦闘力』**を測定します！！というもの。
（[前回の記事](https://qiita.com/keeey999/items/3f3975770bba1ce19817)で書いた、Amazon Rekognitionを使用したLINE BOTの延長です）
<img width="600" alt="説明.png" src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/309745/d9d041d1-589e-06d3-9cfb-cd7281355969.png">
送ってもらった写真の一覧と詳細を見れるページも作成し、
一覧ページでは幸せ戦闘力のランキング形式で表示するようにしました。


【LINEの画面】
<img width="400" alt="57899.jpg" src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/309745/42493e18-e791-15f9-5d78-473d0788c1cf.jpeg">

【詳細ページ】
<img width="400" alt="57897.jpg" src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/309745/9aa25ba8-6d44-f7de-093d-70f7d68f27a5.jpeg">

【一覧ページ】
<img width="400" alt="HappinessScouterSP.png" src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/309745/3a720e64-5312-9c89-5f0f-94398e9c252b.png">


# 用意したもの
- LINEアカウントと一覧ページのQRコード

名刺サイズのカードを人数分用意して、当日挙式と披露宴の間に各テーブルに配っていただきました。

デザイン：[Canva](https://www.canva.com/)
印刷：[名刺ショップドットコム](https://www.meishishop.com/index.html) → pngでの入稿に対応、当日発送、初回500ptもらえるので100枚で660円と格安でした！
<img width="500" alt="AKQ2HK9xPq3szO81574075166_1574075324.png" src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/309745/2932627c-ad47-76ca-8711-f21a8bdbbd84.png">




- 説明用のスライド

Googleスライドで作成しました。実際は最初に簡単な自己紹介なども入れています。
[ぱくたそ](https://www.pakutaso.com/)さんの写真には非常にお世話になっています笑
<img width="800" alt="TkZbyjd3jHklQ4o1574075430_1574075474.png" src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/309745/60380033-0958-2476-b1dd-270fc0da6bea.png">

- 景品

1位の方にはLINEのプリペイドカード1000円分を差し上げました。
※LINEの社員ではありません:wink:


# 余興の流れと結果
- スクリーンにスライドを映しながら簡単な自己紹介と説明。
- 5分間時間を計り、その場で撮影した写真を測定してもらう。スクリーンには一覧ページを映して実況。
- 最後に結果を確認し、幸せ戦闘力1位の写真を撮影した方に景品。
- 余興のあとも自由に使えるようにしておく。（二次会の間も）

LINEのアカウントと友だちになっていただく必要があるので自由参加としましたが、
ゲスト66名中48名が参加してくれました。

写真の枚数は、余興の5分間で約80枚、最終的に150枚集めることができました。
関係ない写真も集まりましたが...笑
<img width="800" alt="HappinessScouterPC3.png" src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/309745/2b96c117-539e-32df-b20c-05a4be24e436.png">


# 技術的なこと
言語はPython、顔認証の部分はAmazon Rekognitionを使用し、以下のような構成にしました。
いろいろと見様見真似です。。
<img width="800" alt="happiness_scouter.png" src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/309745/16dc7aed-9471-8d55-3c9d-16a882422594.png">

一覧・詳細ページはFlaskフレームワーク、一覧ページの写真の配置にはMasonry.jsを使用しています。


# 改善が必要なところ
- スコアの付け方
「幸せ」と「穏やか」以外の感情をマイナスで計算するようにしたせいで、結果がマイナスになる場合が多かった。
披露宴という場なので、もう少しちゃんと考えるべきでした。。


- 対象とする顔の精度
下のように、全く関係のない後ろのほうの人まで認識されスコアに影響してしまった。
境界ボックスのサイズで対象を絞れそう？
<img width="800" alt="mfKbugvOT9OEpRn1574077382_1574077410.png" src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/309745/5f6b2379-6f38-b28b-bd34-1d71afa8d3f5.png">

# 参考
[画像処理ライブラリ「Pillow」をAWS Lambdaで使ってみる](http://developer.wonderpla.net/entry/blog/engineer/Lambda_Python_Pillow/)
[境界ボックスの表示](https://docs.aws.amazon.com/ja_jp/rekognition/latest/dg/images-displaying-bounding-boxes.html)
[DynamoDBをPython（boto3）を使って試してみた](https://qiita.com/estaro/items/b329deafdfef790aa355)

[Jinja2の使い方がわかるとFlaskを用いた開発がよりスマートになる](https://qiita.com/bookun/items/7ae5de21307d101b4759)
[Bootstrap4のCardsとMasonry.jsの相性が最強だった件](https://qiita.com/UNKCHAN/items/4cedc00501f7757ed173)