SlideShare a Scribd company logo
1 of 34
【製作発表】
仮面ライダー変身システム
第14回まどべんよっかいち
2016-02-27
山嵜茂(@yamasaki1972)
今日は『仮面ライダー555』に変身します
『仮面ライダー555』は、2003年1月26日から2004年1月18日までテ
レビ朝日系列で毎週日曜8:00 - 8:30に放映された特撮テレビドラマ
作品、および作中で主人公が変身するヒーローの名称。仮面ライダーシ
リーズ初の地上デジタル放送でもある。 「平成仮面ライダーシリーズ」第4
作目に当たる。
ウィキペディア
2
変身の流れ(その1) 3
1.スタンディンバイ 2.へんしん
変身の流れ(その2) 4
3.ガチャッ 4.コンプリート
変身の流れ(その2) 5
3.ガチャッ 4.コンプリート
本日のお話し 6
ベルトアプリ
装着部品
マスクアプリ
ツイッターにアプリ登録
使用材料
ツイート
ツイートの受信 変身
NFCタグ読取
前準備
最後に 実演
本日のお話し 7
ベルトアプリ
装着部品
マスクアプリ
ツイッターにアプリ登録
使用材料
ツイート
ツイートの受信 変身
NFCタグ読取
前準備
最後に 実演
ツイッターにアプリ登録:1
apps.twitter.com
8
ツイッターにアプリ登録:2
以下の4項目を登録
• Name
• Description
• Website
• Callback URL
9
ツイッターにアプリ登録:3
API Key と API Secret を取得
各アプリの
しかるべきところに記述
10
本日のお話し 11
ベルトアプリ
装着部品
マスクアプリ
ツイッターにアプリ登録
使用材料
ツイート
ツイートの受信 変身
NFCタグ読取
前準備
最後に 実演
ベルトアプリの開発環境
Android Studio
12
NFCタグ読取:AndroidManifest.xml 13
NFCの読み取り許可
NFCを読んだときに
反応するようになる
NFCタグ読取:MainActivity (1) 14
NFCタグ読取:MainActivity (2) 15
メッセージ取得
本日のお話し 16
ベルトアプリ
装着部品
マスクアプリ
ツイッターにアプリ登録
使用材料
ツイート
ツイートの受信 変身
NFCタグ読取
前準備
最後に 実演
ツイート:使用するライブラリ 17
Twitter4J
ツイート: Twitter4Jを使えるようにする 18
ここに
こう書く
ツイート:下記サイトより、然るべきコードをコピペする 19
Android再入門 - Twitterクライアントを作ってみよう
http://qiita.com/gabu/items/70689560618f8e67e726
しかるべきコードたち
ツイート: MainActivity (1) 20
ツイート: MainActivity (2) 21
private void tweet(String str) {
AsyncTask<String, Void, Boolean> task = new AsyncTask<String, Void, Boolean>() {
@Override
protected Boolean doInBackground(String... params) {
try {
mTwitter.updateStatus(params[0]);
return true;
} catch (TwitterException e) {
e.printStackTrace();
showToast(e.toString());
return false;
}
}
@Override
protected void onPostExecute(Boolean result) {
if (result) {
showToast("complete");
} else {
showToast("failed");
}
}
};
task.execute(str);
}
ツイート:MainActivity (3) 22
本日のお話し 23
ベルトアプリ
装着部品
マスクアプリ
ツイッターにアプリ登録
使用材料
ツイート
ツイートの受信 変身
NFCタグ読取
前準備
最後に 実演
マスクアプリの開発環境
Visual Studio 2013
24
ツイートの受信:使用するライブラリ 25
CoreTweet
https://github.com/CoreTweet/CoreTweet/wiki/Home(%E6%97%A5%E6%9C%AC%E8%AA%9E)
ツイートの受信:ライブラリの追加 26
ツイートの受信:認証
「なか日記」よりコピペ
http://nakaji.hatenablog.com/entry/2014/11/02/022416
27
ツイートの受信:ストリーミングAPI 28
「らこらこブログ」よりコピペ
http://laco0416.hatenablog.com/entry/2014/03/25/201839
本日のお話し 29
ベルトアプリ
装着部品
マスクアプリ
ツイッターにアプリ登録
使用材料
ツイート
ツイートの受信 変身
NFCタグ読取
前準備
最後に 実演
変身
変身前の
画像
ツイート受信 画面が変化
変身後の
画像
30
⇑
画面がだんだん白くなるという無難なものに落ち着きました
本日のお話し 31
ベルトアプリ
装着部品
マスクアプリ
ツイッターにアプリ登録
使用材料
ツイート
ツイートの受信 変身
NFCタグ読取
前準備
最後に 実演
使用材料:ベルト
• ナイロンベルト
• 工作材
• 金具
• 蝶番金具
• NFCタグ
32
使用材料:マスク
• 工作材
• キャッチャーマスクのバンド
• 結束バンド
• ビニールひも
33
本日のお話し 34
ベルトアプリ
装着部品
マスクアプリ
ツイッターにアプリ登録
使用材料
ツイート
ツイートの受信 変身
NFCタグ読取
前準備
最後に 実演

More Related Content

Featured

Content Methodology: A Best Practices Report (Webinar)
Content Methodology: A Best Practices Report (Webinar)Content Methodology: A Best Practices Report (Webinar)
Content Methodology: A Best Practices Report (Webinar)contently
 
How to Prepare For a Successful Job Search for 2024
How to Prepare For a Successful Job Search for 2024How to Prepare For a Successful Job Search for 2024
How to Prepare For a Successful Job Search for 2024Albert Qian
 
Social Media Marketing Trends 2024 // The Global Indie Insights
Social Media Marketing Trends 2024 // The Global Indie InsightsSocial Media Marketing Trends 2024 // The Global Indie Insights
Social Media Marketing Trends 2024 // The Global Indie InsightsKurio // The Social Media Age(ncy)
 
Trends In Paid Search: Navigating The Digital Landscape In 2024
Trends In Paid Search: Navigating The Digital Landscape In 2024Trends In Paid Search: Navigating The Digital Landscape In 2024
Trends In Paid Search: Navigating The Digital Landscape In 2024Search Engine Journal
 
5 Public speaking tips from TED - Visualized summary
5 Public speaking tips from TED - Visualized summary5 Public speaking tips from TED - Visualized summary
5 Public speaking tips from TED - Visualized summarySpeakerHub
 
ChatGPT and the Future of Work - Clark Boyd
ChatGPT and the Future of Work - Clark Boyd ChatGPT and the Future of Work - Clark Boyd
ChatGPT and the Future of Work - Clark Boyd Clark Boyd
 
Getting into the tech field. what next
Getting into the tech field. what next Getting into the tech field. what next
Getting into the tech field. what next Tessa Mero
 
Google's Just Not That Into You: Understanding Core Updates & Search Intent
Google's Just Not That Into You: Understanding Core Updates & Search IntentGoogle's Just Not That Into You: Understanding Core Updates & Search Intent
Google's Just Not That Into You: Understanding Core Updates & Search IntentLily Ray
 
Time Management & Productivity - Best Practices
Time Management & Productivity -  Best PracticesTime Management & Productivity -  Best Practices
Time Management & Productivity - Best PracticesVit Horky
 
The six step guide to practical project management
The six step guide to practical project managementThe six step guide to practical project management
The six step guide to practical project managementMindGenius
 
Beginners Guide to TikTok for Search - Rachel Pearson - We are Tilt __ Bright...
Beginners Guide to TikTok for Search - Rachel Pearson - We are Tilt __ Bright...Beginners Guide to TikTok for Search - Rachel Pearson - We are Tilt __ Bright...
Beginners Guide to TikTok for Search - Rachel Pearson - We are Tilt __ Bright...RachelPearson36
 
Unlocking the Power of ChatGPT and AI in Testing - A Real-World Look, present...
Unlocking the Power of ChatGPT and AI in Testing - A Real-World Look, present...Unlocking the Power of ChatGPT and AI in Testing - A Real-World Look, present...
Unlocking the Power of ChatGPT and AI in Testing - A Real-World Look, present...Applitools
 
12 Ways to Increase Your Influence at Work
12 Ways to Increase Your Influence at Work12 Ways to Increase Your Influence at Work
12 Ways to Increase Your Influence at WorkGetSmarter
 
Ride the Storm: Navigating Through Unstable Periods / Katerina Rudko (Belka G...
Ride the Storm: Navigating Through Unstable Periods / Katerina Rudko (Belka G...Ride the Storm: Navigating Through Unstable Periods / Katerina Rudko (Belka G...
Ride the Storm: Navigating Through Unstable Periods / Katerina Rudko (Belka G...DevGAMM Conference
 
Barbie - Brand Strategy Presentation
Barbie - Brand Strategy PresentationBarbie - Brand Strategy Presentation
Barbie - Brand Strategy PresentationErica Santiago
 
Good Stuff Happens in 1:1 Meetings: Why you need them and how to do them well
Good Stuff Happens in 1:1 Meetings: Why you need them and how to do them wellGood Stuff Happens in 1:1 Meetings: Why you need them and how to do them well
Good Stuff Happens in 1:1 Meetings: Why you need them and how to do them wellSaba Software
 

Featured (20)

Content Methodology: A Best Practices Report (Webinar)
Content Methodology: A Best Practices Report (Webinar)Content Methodology: A Best Practices Report (Webinar)
Content Methodology: A Best Practices Report (Webinar)
 
How to Prepare For a Successful Job Search for 2024
How to Prepare For a Successful Job Search for 2024How to Prepare For a Successful Job Search for 2024
How to Prepare For a Successful Job Search for 2024
 
Social Media Marketing Trends 2024 // The Global Indie Insights
Social Media Marketing Trends 2024 // The Global Indie InsightsSocial Media Marketing Trends 2024 // The Global Indie Insights
Social Media Marketing Trends 2024 // The Global Indie Insights
 
Trends In Paid Search: Navigating The Digital Landscape In 2024
Trends In Paid Search: Navigating The Digital Landscape In 2024Trends In Paid Search: Navigating The Digital Landscape In 2024
Trends In Paid Search: Navigating The Digital Landscape In 2024
 
5 Public speaking tips from TED - Visualized summary
5 Public speaking tips from TED - Visualized summary5 Public speaking tips from TED - Visualized summary
5 Public speaking tips from TED - Visualized summary
 
ChatGPT and the Future of Work - Clark Boyd
ChatGPT and the Future of Work - Clark Boyd ChatGPT and the Future of Work - Clark Boyd
ChatGPT and the Future of Work - Clark Boyd
 
Getting into the tech field. what next
Getting into the tech field. what next Getting into the tech field. what next
Getting into the tech field. what next
 
Google's Just Not That Into You: Understanding Core Updates & Search Intent
Google's Just Not That Into You: Understanding Core Updates & Search IntentGoogle's Just Not That Into You: Understanding Core Updates & Search Intent
Google's Just Not That Into You: Understanding Core Updates & Search Intent
 
How to have difficult conversations
How to have difficult conversations How to have difficult conversations
How to have difficult conversations
 
Introduction to Data Science
Introduction to Data ScienceIntroduction to Data Science
Introduction to Data Science
 
Time Management & Productivity - Best Practices
Time Management & Productivity -  Best PracticesTime Management & Productivity -  Best Practices
Time Management & Productivity - Best Practices
 
The six step guide to practical project management
The six step guide to practical project managementThe six step guide to practical project management
The six step guide to practical project management
 
Beginners Guide to TikTok for Search - Rachel Pearson - We are Tilt __ Bright...
Beginners Guide to TikTok for Search - Rachel Pearson - We are Tilt __ Bright...Beginners Guide to TikTok for Search - Rachel Pearson - We are Tilt __ Bright...
Beginners Guide to TikTok for Search - Rachel Pearson - We are Tilt __ Bright...
 
Unlocking the Power of ChatGPT and AI in Testing - A Real-World Look, present...
Unlocking the Power of ChatGPT and AI in Testing - A Real-World Look, present...Unlocking the Power of ChatGPT and AI in Testing - A Real-World Look, present...
Unlocking the Power of ChatGPT and AI in Testing - A Real-World Look, present...
 
12 Ways to Increase Your Influence at Work
12 Ways to Increase Your Influence at Work12 Ways to Increase Your Influence at Work
12 Ways to Increase Your Influence at Work
 
ChatGPT webinar slides
ChatGPT webinar slidesChatGPT webinar slides
ChatGPT webinar slides
 
More than Just Lines on a Map: Best Practices for U.S Bike Routes
More than Just Lines on a Map: Best Practices for U.S Bike RoutesMore than Just Lines on a Map: Best Practices for U.S Bike Routes
More than Just Lines on a Map: Best Practices for U.S Bike Routes
 
Ride the Storm: Navigating Through Unstable Periods / Katerina Rudko (Belka G...
Ride the Storm: Navigating Through Unstable Periods / Katerina Rudko (Belka G...Ride the Storm: Navigating Through Unstable Periods / Katerina Rudko (Belka G...
Ride the Storm: Navigating Through Unstable Periods / Katerina Rudko (Belka G...
 
Barbie - Brand Strategy Presentation
Barbie - Brand Strategy PresentationBarbie - Brand Strategy Presentation
Barbie - Brand Strategy Presentation
 
Good Stuff Happens in 1:1 Meetings: Why you need them and how to do them well
Good Stuff Happens in 1:1 Meetings: Why you need them and how to do them wellGood Stuff Happens in 1:1 Meetings: Why you need them and how to do them well
Good Stuff Happens in 1:1 Meetings: Why you need them and how to do them well
 

【製作発表】 仮面ライダー変身システム

Editor's Notes

  1. 山嵜茂と申します。どうぞよろしくお願いいたします。 私が初めてこの会に参加したのが2013年7月13日の第六回まどべんよっかいちです。実は私はアプリ開発の素人で、VB6を少し触ったことがあるという程度だったのですが、別の勉強会でTechbeeさんに誘われて、声をかけてもらってうれしかったものですから、初めて参加したのです。 そんな状態で参加したものですから、むずかしくてよくわからない部分も多かったです。 それでも何回か、予習復習しながら参加しているうちに、アプリも作れるようになりました。 今日発表させていただく「仮面ライダー変身システム」はその集大成です。この「まどべん」で教わったことです。「まどべんよっかいち」があったから今の自分がいます。 どうぞよろしくお願いします。 一言に仮面ライダーといってもいろいろあるのですが・・・
  2. 【スライドを読み上げる】 今から12~13年前ですね。幼稚園から小学校低学年くらいまでがターゲット層らしいので、今ハタチ前後の方は小さいころに見ていたかもしれませんね。 仮面ライダーファイズをご存じない方もいらっしゃると思いますので、簡単に変身の流れをご説明いたします。
  3. 仮面ライダーファイズは携帯電話で変身します。 1.まず初めに携帯をピコピコと「スタンディンバイ」します 2.次に形態を高く掲げて「変身」と言います
  4. 3.そしておもむろに手に持った携帯電話をベルトに「ガチャ」っと装着します 4.そして「コンプリート」、変身完了です 「スタンディンバイ」「変身」「ガチャ」「コンプリート」、 これが変身の流れとなります。 そして 【アニメ1】ここを 【アニメ2】こう表現するのが本日の趣向でございます ・「ガチャッ」のところでベルトに仕込んだNFCタグを読みとります。 ・ベルト側からマスクのアカウントにツイッターのメンションを飛ばします。 ・メンションを受け取ったマスクアプリが変身アクションを起こします つまり、ツイッターを変身インフラとして使うのですね
  5. 作った手順をお話ししたいと思います
  6. まずはツイッターにアプリを登録するところから
  7. 自分のアカウントでログインして「ツイッターあっぷす」というところから登録します。
  8. 登録する項目の内、Name, Description, Websiteが必須、 CallbackURLは必須ではないのですが、これを入れておかないと認証時にPINコードが要求されます
  9. API KEY と API Secret を取得します 
  10. では、ベルト側のアプリからお話しします このベルト側の開発環境は・・・
  11. こちら、Android Studioというものを使います
  12. マニフェストファイルにインテントフィルターを書きます
  13. NFC関連のクラスをインポートします
  14. メッセージ取得の部分ですね
  15. ベルトからツイートする部分です
  16. Twitter4Jというライブラリを使います
  17. ビルドグレイドルと言うとこに書いとくと、自然にええふうにしてくれるんですね。 古い情報だとファイルをダウンロードしてどこかに置くとかいうのもあります
  18. このサイトに全部書いてありますので、コピペだけで簡単にできてしまいます
  19. クラスをインポートします
  20. tweetの部分ですが、ここもコピペでOKです
  21. ここが実際にツイートしている部分ですが、何度も同じメッセージを送信しているとエラーになるんですね。 そこでカレントタイムミリというメソッドで時刻を付けてツイートしています
  22. 次にマスクアプリの開発環境ですが・・・
  23. お待たせしました、Visual Studioです
  24. コアツイートというのを使います このURLに日本語で使い方が丁寧に書いてあります
  25. nugetで検索すると出てきます 二つありますが、上段のStreamingReactiveというのが非同期処理が簡単に書ける拡張ライブラリだそうです このスライドを書いていて気付いたのですが、今回は返信するだけなので非同期でなく同期処理でも良かったかなあと思って居ります。
  26. 認証の部分ですが、PINコード使わずに認証するのがうまくいかなくて、「なかじ」さんのブログからコピペしました。
  27. 受信にはストリーミングAPIを使用します
  28. 変身ギミックの所ですが、いろいろ試したのですが、結局は画面がだんだん白くなるという無難なものに落ち着きました
  29. では装着部品のご紹介をいたします