俺に最強の Get Wild を Watson が選んでくれる:IBM Cloud Community Summit 2018

Yoshiki Hayama
Yoshiki Hayamaユーザーエクスペリエンス・デザイナー。インフォメーション・アーキテクト。アクセシビリティ・コンサルタント。Watson。
俺に最強の
Get Wild を Watson が選んでくれる
IBM Champion / HCD-Net認定 ⼈間中⼼設計専⾨家
⽻⼭ 祥樹 @storywriter
1	
2018年12⽉8⽇(⼟)
2	
Get Wild、好きですか?
アスファルト、タイヤを切りつけながら、
暗闇⾛り抜けてますか?
3	
TM NETWORK の アルバムに
「GET WILD 30th Anniversary Collection」
というのがあります。
収録曲が 36 曲あるのですが、
そのすべてが Get Wild のバージョン違い。
画像引⽤:http://amzn.asia/d/8jEfQoY
4	
2017年4⽉5⽇に、
「トップ100にチャートインしたCDアルバムに収録された
同じ曲のバージョン/リミックスの最多数」
で、ギネスに認定されました。
参考:https://www.oricon.co.jp/news/2107304/full/
5	
な...何を⾔っているのか、わからねーと思うので...
Get Wild のバージョン違い、聴いてみましょう。(5分)
引⽤:https://youtu.be/LgBxze0ye94
TM NETWORK - Get Wild
(“FINAL MISSION -START investigation-” Version)
6	
⾳楽ストリーミングサービス Spotify では、
「avex Edition」として、また異なるバージョン⼊り(!)の
22曲 版が配信されている。
(内7曲が新バージョン)
7	
avex Edition 収録曲:
M1:Get Wild (“Incubation Period” Version)
M2:Get Wild (“FINAL MISSION -START investigation-” Version)
M3:GET WILD (2013 SUMMER)
M4:Get Wild 2014
M5:Get Wild 2014 (“the beginning of the end” Version)
M6:Get Wild 2014 (“30th 1984〜 QUIT30” Version)
M7:Get Wild 2014 (“QUIT30 HUGE DATA” Version)
M8:Get Wild 2015 -HUGE DATA-
M9:Get Wild 2015 (“30th FINAL” Version)
M10:Get Wild / Dave Rodgers
M11:Get Wild (GET WILD MEETS TECHNO STYLE Version) / Dave Rodgers
参考:https://www.barks.jp/news/?id=1000141189
8	
avex Edition 収録曲:
M12:Get Wild / 桃井はるこ
M13:Get Wild / globe
M14:Get Wild / Purple Days
M15:GET WILD '89 / TETSUYA KOMURO
M16:Get Wild(Metal Machine mix)/ globe
M17:Get Wild (2016 Remode2) / globe
M18:GET WILD 2017 TK REMIX
M19:GET WILD (Takkyu Ishino Latino Acid Remix)
M20:GET WILD (SICK INDIVIDUALS Remix)
M21:GET WILD (Dave Rodgers Remix)
M22:GET WILD (Takkyu Ishino Latino Remix)
参考:https://www.barks.jp/news/?id=1000141189
9	
あなたは、どの Get Wild が好きですか?
10	
選べない。
これだけ Get Wild していると、まさに
ひとりでは解けない愛のパズルを抱いている状態。
11	
君はひとりじゃないよ
12	
そうだ、Watson がいるじゃないか。僕はひとりじゃない。
俺に最適な Get Wild を選んでもらおう!
⽻⼭ 祥樹 @storywriter
v  HCD-Net認定 ⼈間中⼼設計専⾨家
•  使いやすいWebサイトをつくる専⾨家
v  Web業界に20年くらい、Watsonは2年半ほど
•  IBM Champion for 2018
v  主な実績など
•  担当したWebサイトが、雑誌のWebユーザビリティランキングで
国内トップクラスの評価を受ける ほか実積多数
v 主な専⾨分野
•  ユーザーエクスペリエンス、⼈間中⼼設計、情報アーキテクチャ、
アクセシビリティ、ライター、NOREN、IBM Watson
13	
ユーザー⼼理を
つかむプロです
14	
メンタルモデル
ユーザーへの共感から⽣まれるUXデザイン戦略
Amazonで購⼊
http://amzn.asia/3cgueBZ
コンピュータ・IT > インターネット・Web開発 > Web開発 最⾼「1位」
コンピュータ・IT 総合 最⾼「9位」
15	
AI(⼈⼯知能)とのかかわり:
UXデザイナー および エンジニア として、
AIの実務をしています。主に IBM Watson。
リンクスタート!
16	
IBM Champion 2018
受賞しました
みなさまのおかげです。
本当にありがとうございます。
17	
マッチングに使う Watson の API といえば、
Personality Insights。
⼀定量のテキストから、その⼈の性格を分析して、
ビッグファイブと呼ばれる、
基本的な⼼理特性を判断してくれるというもの。
18	
Personality Insights:
引⽤:https://www.ibm.com/watson/services/personality-insights/
19	
Personality Insights でわかる値:
協調性
利他主義
協調性
謙虚さ
道徳
共感度
信⽤度
外向性
活発度
⾃⼰主張
明朗性
刺激希求性
友情
社交性
知的好奇⼼
⼤胆性
芸術的関⼼度
情動性
想像⼒
思考⼒
現状打破
ニーズ
⾃由
理想
愛
現実性
⾃⼰表現
安定
仕組
挑戦
親密さ
好奇⼼
興奮
調和
価値観
保守性
快楽主義
変化に対する許容性
⾃⼰⾼揚
⾃⼰超越
ビッグファイブ
誠実性
達成努⼒
注意深さ
忠実さ
秩序性
⾃制⼒
⾃⼰効⼒感
感情起伏
激情的
⼼配性
悲観的
利⼰的
⾃意識過剰
低ストレス耐性
消費傾向
(多数のため省略)
20	
Spotify の API からも、
じつは多彩な情報を得ることができる。
興味深いのは
「Get Audio Features for a Track」という、
曲の特徴を取得できる API。
21	
Spotify APIs:
引⽤:https://developer.spotify.com/documentation/
22	
Spotify の API で取得できる曲の特徴:
•  アコースティック性
•  トラックがアコースティックかどうかを⽰す0.0〜1.0の信頼度。1.0は、トラックがアコースティックであ
るという⾼い信頼性を表す。
•  ダンス性
•  テンポ、リズムの安定性、ビートの強さ、全体的な規則性などの⾳楽要素の組み合わせに基づいて、ダンス
のためのトラックの適性を記述します。0.0の値は、最もダンス的でなく、1.0は、最もダンス的である。
•  トラックの持続時間(ミリ秒)
•  エネルギー性
•  エネルギーは、0.0〜1.0の尺度であり、強度および活動の知覚的尺度を表す。典型的には、エネルギッシュ
なトラックは、速く、⼤きく、騒々しい感じがする。例えば、デスメタルは⾼いエネルギーを持っているが、
バッハのプレリュードは、このスケールでは低い得点になる。この属性に影響する知覚的特徴は、ダイナ
ミックレンジ、知覚できる⾳量の⼤きさ、⾳⾊、開始レート、および⼀般的なエントロピーを含む。
参考:https://developer.spotify.com/documentation/web-api/reference/tracks/get-audio-features/
23	
Spotify の API で取得できる曲の特徴:
•  インストゥメンタル性
•  トラックにボーカルがないかどうかを予測します。この⽂脈では、「オー」や「アー」の声は楽器として扱
われます。 ラップや話し⾔葉は明らかに「ボーカル」です。インストゥメンタル性の値が1.0に近いほど、
トラックにはボーカルが含まれていない可能性が⾼くなります。0.5を超える値は、インストゥメンタル曲
を表すことを意図していますが、値が1.0に近づくほど信頼度が⾼くなります。
•  ライブ性
•  録⾳中の聴衆の存在を検出します。ライブ性の値が⾼いほど、トラックがライブで実⾏された可能性が⾼く
なります。値が0.8を超えると、トラックがライブである可能性が⾼くなります。
•  ラウドネス
•  トラックの全体的なラウドネスをデシベル(dB)で表したものです。 ラウドネス値はトラック全体で平均
化され、トラックの相対的なラウドネスを⽐較するのに役⽴ちます。ラウドネスは、物理的強度(振幅)の
主要な⼼理的相関関係であるサウンドの品質です。値の典型的な範囲は-60〜0dbです。
参考:https://developer.spotify.com/documentation/web-api/reference/tracks/get-audio-features/
24	
Spotify の API で取得できる曲の特徴:
•  モード
•  モードは、曲の雰囲気(メジャーまたはマイナー)、その楽曲から導かれるスケールのタイプを⽰します。
メジャーは1、マイナーは0です。
•  スピーチ性
•  スピーチ性は、トラック内の話された単語の存在を検出します。録⾳(例えば、トークショー、オーディオ
ブック、詩)のような、より独占的な⾳声ほど、属性値に1.0に近くなります。0.66を超える値は、おそら
くは完全に発声された単語で構成されているトラックを表します。0.33と0.66の間の値は、ラップ⾳楽など
の場合を含む、セクションまたはレイヤーのいずれかで、⾳楽とスピーチの両⽅を含む可能性があるトラッ
クを表します。 0.33未満の値は、⾳楽やその他の⾮⾳声のようなトラックを表す可能性が最も⾼いです。
•  テンポ
•  ビート/分(BPM)でのトラックの全体的な推定テンポ。
参考:https://developer.spotify.com/documentation/web-api/reference/tracks/get-audio-features/
25	
Spotify の API で取得できる曲の特徴:
•  感情価
•  トラックによって伝えられる⾳楽的なポジションを表す0.0から1.0の値を測定します。 ⾼い感情価のトラッ
クはより陽性(例えば、幸せ、陽気、陶酔)であり、低い感情価のトラックはより陰性となる(例えば、悲
しい、落ち込んだ、怒る)。
参考:https://developer.spotify.com/documentation/web-api/reference/tracks/get-audio-features/
26	
Personality Insights で分析するテキスト:
Personality Insights で分析するテキストは、
いちばん⼿っ取り早いのは、Twitter の投稿。
システムコール!
27	
Twitter の投稿から、
Personality Insights で性格を分析して、
Spotify で取得した曲の情報と照らして、
いちばんオススメの Get Wild を教えてくれる。
というのはどうだろう。
28	
名づけて・・・
Get Wild Watson Version
powered by Spotify
29	
同じ Get Wild で特徴にどれくらい差があるのか:
そもそも、それぞれの Get Wild で、
Spotify から得られる情報にどれくらい差があるだろう。
同じ Get Wild なわけで。
差がなければ、マッチングもできない。
Spotify の実データを⾒てみよう。
30	
Spotify to JSON:
Spotify のアルバムIDを⼊れると、
アルバムに⼊っている楽曲の情報を、全曲取ってきて、
JSONとcsvに落としてくれる Python を書いた。
GitHubにあげました。SpotifyToJSON:
https://github.com/storywriter/SpotifyToJSON
引⽤:https://spotipy.readthedocs.io/en/latest/
31	
Spotify の API を使う:
Spotipyというライブラリがある。
実⾏環境に Spotipy をインストール。
32	
Spotify の API を使う:
まず Spotify のアプリ登録をする。
33	
Spotify の API を使う:
引⽤:https://developer.spotify.com/dashboard/
34	
Spotify の API を使う:
引⽤:https://developer.spotify.com/dashboard/
35	
Spotify の API を使う:
引⽤:https://developer.spotify.com/dashboard/
36	
Spotify の API を使う:
引⽤:https://developer.spotify.com/dashboard/
Client ID と Client Secret
を⼿元にメモ
Spotify の API を使う:
引⽤:https://developer.spotify.com/dashboard/
37
Spotify の API を使う:
引⽤:https://developer.spotify.com/dashboard/
38	
Redirect URIs を⼊⼒
39	
Spotify の API を使う:
アプリのダッシュボードの EDIT SETTINGS から、
Redirect URIs に、認証後にリダイレクト表⽰するページ
のURLを記⼊。
かつてはどんなURLでもよかったらしいのですが、今は、実在するページでな
いとエラーになる。また localhost はダメ?で、Spotify 側からアクセスでき
るページである必要があるようす。
なんでもよいので、ダミーページを1枚⽤意する。
40	
Spotify のアルバムIDを調べる:
Spotify のアプリなどで、該当のアルバムで
「シェアする」→「リンクをコピー」
すると、IDがわかる。
例 https://open.spotify.com/album/
6SHOYTaWp1ChOO4UhJquhA?si=FfBdBz7PS6eFTFCcRwyVWQ
この 6SHOYTaWp1ChOO4UhJquhA がアルバムID。
41	
Spotify の API を使う:
バッチプログラムをテキストエディタで開き、
必要事項を記⼊して実⾏。
42	
Spotify の API を使う:
Spotify の API は認証まわりが Watson に⽐べると厳密で、
SDK の使いかたを理解するのに⼿間取った。
43	
Spotify の API を使う:
途中、認証で「Enter the URL you were redirected to:」
というメッセージが出て、ブラウザが開くので、
ブラウザのURLを、そのままコピーして、
コンソールに貼り付けてエンターキーで進みます。
http://example.com/?code=... の
「 http://example.com/?code= 」部分も含めて
コピーすること。
44	
Spotify の API を使う:
ブラウザでの認証が
必要です
認証キーを含むURLを
⼊⼒してください
45	
Spotify の API を使う:
46	
Spotify の API を使う:
47	
Spotify の API を使う:
認証キーを含むURL
ここを丸ごとコピー
48	
Spotify の API を使う:
認証キーを含むURLを
コピペ
49	
Spotify の API を使う:
JSONデータが保存される。
整形⽤バッチ(GitHubに同梱)を
使って、データを整形。
50	
Spotify to JSON:
22曲のcsvを並べると次のようになる。
51	
値の正規化をする:
Spotify の情報は、
基本的には 0(その特徴にあてはまらない)から
1(その特徴にあてはまる)の範囲の数字で返ってくる。
ただし、「テンポ」や「曲の収録時間」、
「ラウドネス」という項⽬は、絶対値で返ってくる。
52	
値の正規化をする:
スケールが異なるとわかりづらいのと、
将来に Personality Insights と突合させることを考えると、
すべての項⽬が 0 から 1 の範囲にあるほうが助かる。
これらの項⽬については、アルバム内で数字を⽐較して、
0 から 1 の範囲になるように変換する。
これを「正規化」という。
0 1
53	
値の正規化をする:
正規化は、次の式で求められる。
x ­ min( x )
max( x ) ­ min( x )
x′ =
54	
値の正規化をする:
正規化すると、強制的に、最⼤値をもつ1曲が 1 になり、
最⼩値をもつ1曲が 0 になる。
アルバム内の曲の、絶対値の分布の偏りを、
正しく表現しない懸念がある。
55	
値の正規化をする:
20
100
40
60
80
0
60-90の範囲で正規化 0-100の範囲で正規化
0.8
0.7
0.9 0.85
0.6
0.67
0.33
1.0 0.83
0
絶対値が⾼めに偏っていることを
表現できていない
56	
値の正規化をする:
絶対値の項⽬については、アルバム内の値を⾒て、
上限と下限を指定することにした・・・のだが。
テンポ
曲の収録時間
ラウドネス
60 〜 200
-60 〜 0
0 〜 2000000
X JAPAN / Stab Me In The Back を参考に・・・
57	
値の正規化をする:
今度は、曲ごとの差がなくなりすぎて、
⼤半のマッチングが、
電気グルーヴ ⽯野卓球 リミックスバージョン
に吸い込まれるようになってしまった。
上限下限を指定せず、正規化するだけにした。
坂本教授も
⼩室哲哉も
持ってねえ
Spotify to JSON:
結論として、グラフにするとこんな感じ。
58
59	
同じ Get Wild で特徴にどれくらい差があるのか:
レーダーチャートで分散しているということは、
ちゃんと差がありそうだ。これならマッチングできる。
同じ Get Wild なのに、けっこう差があって驚いた。
60	
Personality Insights と Spotify をつなぐ:
Personality Insights と Spotify をつないで、
アプリケーションにしよう。
61	
どの性格特性と、曲のどの特徴を対応させるか:
そもそも、Personality Insights で、
どの性格特性が⾼ければ、どの曲が好み、
と判断すればよいのか。
62	
どの性格特性と、曲のどの特徴を対応させるか:
過去の論⽂も漁ってみたが、ビッグファイブと⾳楽の嗜好
の関連性などという論⽂は⾒つからなかった。
というか、ビッグファイブでは、ざっくりしすぎていて、
⾳楽の嗜好との相関性など、ないのでは。
そうだよね。ふつうに考えて、例えば、外向性が⾼いから
クラシックが好き、とか、そんな単純な関係じゃないよね。
63	
どの性格特性と、曲のどの特徴を対応させるか:
とすると、ここはもう決めの問題。
64	
どの性格特性と、曲のどの特徴を対応させるか:
Personality Insights で得られる値を、
次のように割り当てることにした。
Spotify の楽曲の特徴 Personality Insights の性格特性
65	
どの性格特性と、曲のどの特徴を対応させるか:
モードは0か1の値しか出ないため、極端に振れるので、利⽤することを⽌めた。
アコースティック性 安定性 Stability
ダンス性 好奇⼼ Curiosity
トラックの持続時間(ミリ秒) ⾃由主義 Liberty
エネルギー性 外向性 Extraversion
インストゥメンタル性 協調性 Agreeableness
ライブ性 誠実性 Conscientiousness
ラウドネス 理想 Ideal
スピーチ性 知的好奇⼼ Openness
テンポ 興奮 Excitement
感情価 感情起伏 Emotional range
66	
どの性格特性と、曲のどの特徴を対応させるか:
Personality Insights は、⾳楽の好みも抽出できる。
値が0、0.5、1とざっくりなので、補正値として利⽤。
Spotify の楽曲の特徴 Personality Insights の性格特性
67	
どの性格特性と、曲のどの特徴を対応させるか:
アコースティック性 consumption_preferences_music_country
ダンス性 consumption_preferences_music_r_b
consumption_preferences_music_hip_hop
エネルギー性 consumption_preferences_music_latin
インストゥメンタル性 consumption_preferences_music_classical
ライブ性 consumption_preferences_music_live_event
ラウドネス consumption_preferences_music_rock
スピーチ性 consumption_preferences_music_rap
テンポ consumption_preferences_music_playing
68	
Twitter アプリの登録:
Twitter に連携するので、
Twitter アプリの登録も必要。
Twitter Developer Platform で登録する。
69	
Twitter アプリの登録:
引⽤:https://developer.twitter.com/
ドロップダウンから
Apps を選ぶ
70	
Twitter アプリの登録:
引⽤:https://developer.twitter.com/
71	
Twitter アプリの登録:
引⽤:https://developer.twitter.com/
Callback URLs を
正しく⼊⼒する
72	
Twitter アプリの登録:
Callback URLs は
サンプルコードのままであれば
https://xxx.mybluemix.net/auth/twitter/callback
になるはず。
73	
アプリケーションの開発:
あとはアプリケーションをつくるだけ・・・!
74	
アプリケーションの開発:
Personality Insights のサンプルコードをフォークして
つくろうと思った。
カンタンかと思ったら、依存ライブラリが多くて、
ひとりでは解けない愛のパズルかと思った、本気で。
引⽤:https://github.com/storywriter/personality-insights-nodejs
75	
アプリケーションの開発:
GitHubのサンプルコードをフォークします。
76	
アプリケーションの開発:
サンプルは Node.js のアプリケーション。
サンプルは思いのほか多機能なので、
いろいろ⼊り組んでいる。
(あと、今はもう使っていないコードとか残ってる)
•  ejs: テンプレートエンジン
•  express: Express フレームワーク
•  i18n: 多⾔語化
•  object.pick: 計算を楽にするユーティリティ
•  passport: Twitterの認証のため
•  personality-*: Personality Insights の SDK
•  twitter: Twitter の SDK
•  watson-developer-cloud: Watson の SDK
77	
アプリケーションの開発:
主な依存ライブラリ:
サーバーサイド:
•  Modernizr: ポリフィル
•  jQuery: jQuery
•  Underscore.js: Underscore.js
•  markdown-it: Markdownのパーサー
•  highlight.js: シンタックスハイライター
•  Q: ⾮同期通信の拡張
•  tab-panels.js: タブの実装
•  personality-*: Personality Insights の SDK
•  sunburst.js: サンバーストチャート
•  demo.js: サンプルプログラム本体
•  consumption-preferences-*: 診断結果のソート
•  analytics.js: IBMのアクセス解析?
フロントエンド:
78	
アプリケーションの開発:
サーバーサイドはわりとライブラリにお任せ。
相性判定の処理はフロントエンドでされている。
がりがり読み解いて、がりがり実装。
79	
アプリケーションの開発:
フロントエンドが jQuery ベースなのだが
DOM と JavaScript が密結合すぎて
チープなスリルに⾝をまかせている感じだった。
80	
アプリケーションの開発:
せっかくなので、Personality Insights を
できたばかりの東京リージョンに⽴ててみたが、
とくに速くなった感じはしなかった。
Personality Insights の処理速度のボトルネックは
レイテンシーではなく、データ解析時間らしい。
81	
アプリケーションの開発:
つくったものはGitHubにあげています。
https://github.com/storywriter/personality-insights-nodejs
82	
ついにできた・・・!
83	
俺に最強の Get Wild を Watson が選んでくれる
https://getwild.mybluemix.net/
84
85	
俺に最強の Get Wild は・・・
86
87
88	
俺に最強の Get Wild は・・・
#3	GET	WILD	-	2013	SUMMER	
TM	NETWORK
89	
#3 GET WILD - 2013 SUMMER
TM NETWORK
引⽤:https://open.spotify.com/track/2KS8ATNMmHVSMK1MMJGQqb
90	
AメロBメロがなくて、いきなりサビという超展開バージョン。
俺は結論を急ぐタイプということか・・・。
#3 GET WILD - 2013 SUMMER
TM NETWORK
91	
他の⼈だとどう?:
妻で試した結果。
92	
神秘的なリミックス。
妻には何か隠された秘密が・・・!?
#18 GET WILD - 2017 TK REMIX
Tetsuya Komuro
引⽤:https://open.spotify.com/track/1JYBcw4VOc4wvPTiBllvXY
93	
俺に最強の Get Wild を Watson が選んでくれる
https://getwild.mybluemix.net/
シェアしてね
94	
まとめ:
1.  Personality Insights の真価は、ほかのサービスや
システムとつなぐことで発揮される。
2.  性格特性と曲の好みは、理論で結ぶのは無理だった。
Personality Insights のマッチングは、理論背景が命。
3.  みんな⼤好き Get Wild。
95	
傷ついた夢を取り戻すよ・・・!
96	
ありがとうございました。
⽻⼭ 祥樹
Twitter: @storywriter
Facebook: storywriter.jp
Facebook、ぜひ、つながってください!
⽻⼭のプレゼンのアレ が、
  スタンプになりました!
スタンプ名:ハーミィ(CSS編) 作者名:⽻⼭ 祥樹
https://store.line.me/stickershop/product/1228201/ja
Web・CSSネタ
全40種類
98	
ベストスピーカーの投票
ぜひ、お願いします!
http://bit.ly/iccs2018best
1 of 98

More Related Content

More from Yoshiki Hayama(20)

俺に最強の Get Wild を Watson が選んでくれる:IBM Cloud Community Summit 2018