MPS世田谷やってみた祭り 第1回資料

1. MPS Setagaya 第11回 (2015/12/26) やってみた祭り第1回
インスタグラムなWebサービスをつくろう
金子純也
Morning Project Samurai 代表
MPS Setagaya 第11回 (2015/12/26) やってみた祭り第1回 (c) Junya Kaneko

2. 同年代人気者グラム
機能:
自分が興味のある、事柄、年代、性別を入力すると、
その条件下での Instagram における人気の写真を発見
用途:
- 同年代の人気者のファッションチェック
- 同年代の人気者のはじけ具合チェック
- 人気の写真の構図の共通点発見
- 特定のキーワードに関する年代分布調査
Instagram API, Azure Face API を使用MPS Setagaya 第11回 (2015/12/26) やってみた祭り第1回 (c) Junya Kaneko

3. MPS Setagaya 第11回 (2015/12/26) やってみた祭り第1回 (c) Junya Kaneko

4. Web API
• 提供元の持つデータを
HTTP を通して自身のプログラム中で利用する
ためのルール
• 提供元の開発した便利機能を
HTTP を通して自身のプログラム中で利用する
ためのルール
自分の持っていない、自分ではなかなか持てない
リソースを自身のプログラム中で利用可能！
MPS Setagaya 第11回 (2015/12/26) やってみた祭り第1回 (c) Junya Kaneko

5. Instagram API でできること
• タグによる写真の検索 (Tags)
• ユーザー情報の取得 (Users)
• コメントの取得 (Comments)
• いいねの取得 (Likes)
• 写真が撮られた場所の取得 (Locations)
• ユーザー同士の関連の取得 (Relations)
詳しくは https://www.instagram.com/developer/endpoints/MPS Setagaya 第11回 (2015/12/26) やってみた祭り第1回 (c) Junya Kaneko

6. Instagram API (Web API)
を利用した既存アプリ
• 美女スタグラム
• 猫スタグラム
• hellospot.tokyo
MPS Setagaya 第11回 (2015/12/26) やってみた祭り第1回 (c) Junya Kaneko

7. Azure Face API でできること
• 顔検出 (性別、年齢)
• 似た顔の検出
• 顔のグルーピング
MPS Setagaya 第11回 (2015/12/26) やってみた祭り第1回 (c) Junya Kaneko

8. MPS Setagaya 第11回 (2015/12/26) やってみた祭り第1回 (c) Junya Kaneko

9. この会の目的
Web API を用い自分で開発できるようになる下準備
- 最終目標:
やってみた祭り発表会での作品発表
- 本日の目標:
Web API に慣れる (登録、認証、制約の理解)
MPS Setagaya 第11回 (2015/12/26) やってみた祭り第1回 (c) Junya Kaneko

10. 同年代人気者グラム
機能:
自分が興味のある、事柄、年代、性別を入力すると、
その条件下での Instagram における人気の写真を発見
用途:
- 同年代の人気者のファッションチェック
- 同年代の人気者のはじけ具合チェック
- 人気の写真の構図の共通点発見
- 特定のキーワードに関する年代分布調査
MPS Setagaya 第11回 (2015/12/26) やってみた祭り第1回 (c) Junya Kaneko

11. 今回のシステム概要
Instagram API
やってみた祭り
システム
Django
python-
instagram
Azure Face API
WebAPI
WebAPI
ユーザー
プログラム
JavaScript
MPS Setagaya 第11回 (2015/12/26) やってみた祭り第1回 (c) Junya Kaneko

12. Instagram API の使用準備
1. Instagram に登録
2. Instagram Developer に登録 (Instagram API でググる)
3. Instagram Developer でクライアントを新たに作る
4. http://dmolsen.com/2013/04/05/generating-access-
tokens-for-instagram/ の指示に従いアクセストークンを
取得 (Instagram Access token でググる)
5. クライアントシークレットと
アクセストークンをメモ帳にとりあえずコピペ
MPS Setagaya 第11回 (2015/12/26) やってみた祭り第1回 (c) Junya Kaneko

13. https://www.instagram.com/developer/clients/manage/
MPS Setagaya 第11回 (2015/12/26) やってみた祭り第1回 (c) Junya Kaneko

14. MPS Setagaya 第11回 (2015/12/26) やってみた祭り第1回 (c) Junya Kaneko

15. Microsoft Azure Face API 使用準備
1. Microsoft Azure に登録
2. Microsoft Azure Marketplace で Face API を
探して登録
3. Primary key と Secondary key を取得し
メモ帳にメモ
MPS Setagaya 第11回 (2015/12/26) やってみた祭り第1回 (c) Junya Kaneko

16. やってみた祭りシステムへ登録
• https://mpsamurai.org/just_do_it/ にアクセスして
新規登録
• ログイン
• クレデンシャル登録で Instagarm API のアクセス
トークンとクライアントシークレット、Face API
の Primary key と Secondary key を登録
MPS Setagaya 第11回 (2015/12/26) やってみた祭り第1回 (c) Junya Kaneko

17. やってみた祭りシステムで
APIを動かしてみる (Step 1)
MPS Setagaya 第11回 (2015/12/26) やってみた祭り第1回 (c) Junya Kaneko

18. やってみた祭りシステムで
APIを動かしてみる (Step 2)
• Morning Project Samurai の GitHub
リポジトリにアクセス
• just_do_it_20151226 の Readme.md5 中の
html コードをコピー
• やってみた祭りシステムのエディタに
ペーストして保存
MPS Setagaya 第11回 (2015/12/26) やってみた祭り第1回 (c) Junya Kaneko

19. MPS Setagaya 第11回 (2015/12/26) やってみた祭り第1回 (c) Junya Kaneko

20. やってみた祭りシステムで
APIを動かしてみる (Step 3)
• やってみた祭りシステムのエディタメニュー
の「開く」を押す。
• ファイル名 index の隣の URL をクリック
するとアプリが使えるようになっている
MPS Setagaya 第11回 (2015/12/26) やってみた祭り第1回 (c) Junya Kaneko

21. 既存のものの寄せ集めの
難しい部分 (今回は WebAPI)
• WebAPIのレートリミット
• WebAPIの仕様変更
• WebAPIの消失
MPS Setagaya 第11回 (2015/12/26) やってみた祭り第1回 (c) Junya Kaneko

22. でも速攻で作るのは大事
時間とお金の無駄遣い！
形にしないと意味ある改善点が見えてこない！
- 無意味な批判 (from 自分 and 他人)
- 無意味な要求 (これもナイトあれもナイト)
MPS Setagaya 第11回 (2015/12/26) やってみた祭り第1回 (c) Junya Kaneko

23. 同年代人気者グラムの改良点を
考えてみよう!
• あったほうが良い情報は？
• 足りない情報は？
• 他の API をさらに組み合わせたら？
MPS Setagaya 第11回 (2015/12/26) やってみた祭り第1回 (c) Junya Kaneko