line x obniz ハンズオン...アジェンダ 19:00~ はじめに line boot awards /...
TRANSCRIPT
![Page 1: LINE x obniz ハンズオン...アジェンダ 19:00~ はじめに LINE BOOT AWARDS / Clovaについて obnizについて 19:20~ ハンズオン 21:20~ もくもくタイム/質問タイム](https://reader035.vdocuments.site/reader035/viewer/2022081522/5f0271c87e708231d4044bb3/html5/thumbnails/1.jpg)
夏の終わりの駆け込みハンズオン
![Page 2: LINE x obniz ハンズオン...アジェンダ 19:00~ はじめに LINE BOOT AWARDS / Clovaについて obnizについて 19:20~ ハンズオン 21:20~ もくもくタイム/質問タイム](https://reader035.vdocuments.site/reader035/viewer/2022081522/5f0271c87e708231d4044bb3/html5/thumbnails/2.jpg)
アジェンダ19:00~ はじめに LINE BOOT AWARDS / Clovaについて obnizについて
19:20~ ハンズオン
21:20~ もくもくタイム/質問タイム
![Page 3: LINE x obniz ハンズオン...アジェンダ 19:00~ はじめに LINE BOOT AWARDS / Clovaについて obnizについて 19:20~ ハンズオン 21:20~ もくもくタイム/質問タイム](https://reader035.vdocuments.site/reader035/viewer/2022081522/5f0271c87e708231d4044bb3/html5/thumbnails/3.jpg)
はじめに
LINE BOOT AWARDS / Clova について
![Page 4: LINE x obniz ハンズオン...アジェンダ 19:00~ はじめに LINE BOOT AWARDS / Clovaについて obnizについて 19:20~ ハンズオン 21:20~ もくもくタイム/質問タイム](https://reader035.vdocuments.site/reader035/viewer/2022081522/5f0271c87e708231d4044bb3/html5/thumbnails/4.jpg)
obnizってなに?
![Page 5: LINE x obniz ハンズオン...アジェンダ 19:00~ はじめに LINE BOOT AWARDS / Clovaについて obnizについて 19:20~ ハンズオン 21:20~ もくもくタイム/質問タイム](https://reader035.vdocuments.site/reader035/viewer/2022081522/5f0271c87e708231d4044bb3/html5/thumbnails/5.jpg)
ハードウェア(電子回路)を ネットから操作することができる開発ボードです
ネットから操作できる = 音声スキルと相性が良いです
とはなにか
![Page 6: LINE x obniz ハンズオン...アジェンダ 19:00~ はじめに LINE BOOT AWARDS / Clovaについて obnizについて 19:20~ ハンズオン 21:20~ もくもくタイム/質問タイム](https://reader035.vdocuments.site/reader035/viewer/2022081522/5f0271c87e708231d4044bb3/html5/thumbnails/6.jpg)
とはなにか• 電気信号をAPIとして制御できるIoT開発ボード
wifiで常時接続
ユーザープログラムセンサ/モーター
![Page 7: LINE x obniz ハンズオン...アジェンダ 19:00~ はじめに LINE BOOT AWARDS / Clovaについて obnizについて 19:20~ ハンズオン 21:20~ もくもくタイム/質問タイム](https://reader035.vdocuments.site/reader035/viewer/2022081522/5f0271c87e708231d4044bb3/html5/thumbnails/7.jpg)
とはなにか• 電気信号をAPIとして制御できるIoT開発ボード
wifiで常時接続
ユーザープログラム
①APIでクラウドへコマンド送信
センサ/モーター
![Page 8: LINE x obniz ハンズオン...アジェンダ 19:00~ はじめに LINE BOOT AWARDS / Clovaについて obnizについて 19:20~ ハンズオン 21:20~ もくもくタイム/質問タイム](https://reader035.vdocuments.site/reader035/viewer/2022081522/5f0271c87e708231d4044bb3/html5/thumbnails/8.jpg)
とはなにか• 電気信号をAPIとして制御できるIoT開発ボード
wifiで常時接続
ユーザープログラム
①APIでクラウドへコマンド送信
センサ/モーター②コマンドに応じて センサ/モーターを制御
![Page 9: LINE x obniz ハンズオン...アジェンダ 19:00~ はじめに LINE BOOT AWARDS / Clovaについて obnizについて 19:20~ ハンズオン 21:20~ もくもくタイム/質問タイム](https://reader035.vdocuments.site/reader035/viewer/2022081522/5f0271c87e708231d4044bb3/html5/thumbnails/9.jpg)
とはなにか• 電気信号をAPIとして制御できるIoT開発ボード
wifiで常時接続
ユーザープログラム
①APIでクラウドへコマンド送信
③制御結果が 帰ってくる
センサ/モーター②コマンドに応じて センサ/モーターを制御
![Page 10: LINE x obniz ハンズオン...アジェンダ 19:00~ はじめに LINE BOOT AWARDS / Clovaについて obnizについて 19:20~ ハンズオン 21:20~ もくもくタイム/質問タイム](https://reader035.vdocuments.site/reader035/viewer/2022081522/5f0271c87e708231d4044bb3/html5/thumbnails/10.jpg)
とはなにか• 電気信号をAPIとして制御できるIoT開発ボード
• APIの知識とセンサ/モーターの知識だけでIoT製品を作ることができる
wifiで常時接続
ユーザープログラム
①APIでクラウドへコマンド送信
③制御結果が 帰ってくる
センサ/モーター②コマンドに応じて センサ/モーターを制御
![Page 11: LINE x obniz ハンズオン...アジェンダ 19:00~ はじめに LINE BOOT AWARDS / Clovaについて obnizについて 19:20~ ハンズオン 21:20~ もくもくタイム/質問タイム](https://reader035.vdocuments.site/reader035/viewer/2022081522/5f0271c87e708231d4044bb3/html5/thumbnails/11.jpg)
obnizとClovaを連携させると・・・
ハードウェアと音声でいろいろできちゃいます!
ねぇクローバ,ゴミ箱開けて
ねぇクローバ,トイレ誰か入ってる?
ねぇクローバ,カーテン開けて
ねぇクローバ,窓しまってる?
![Page 12: LINE x obniz ハンズオン...アジェンダ 19:00~ はじめに LINE BOOT AWARDS / Clovaについて obnizについて 19:20~ ハンズオン 21:20~ もくもくタイム/質問タイム](https://reader035.vdocuments.site/reader035/viewer/2022081522/5f0271c87e708231d4044bb3/html5/thumbnails/12.jpg)
ハンズオンに 入っていきましょう!
![Page 13: LINE x obniz ハンズオン...アジェンダ 19:00~ はじめに LINE BOOT AWARDS / Clovaについて obnizについて 19:20~ ハンズオン 21:20~ もくもくタイム/質問タイム](https://reader035.vdocuments.site/reader035/viewer/2022081522/5f0271c87e708231d4044bb3/html5/thumbnails/13.jpg)
最初に
• 振り返り/コピペ用にお使いください →このURLを見ましょう というのがたくさんあります
• 進行スピードは全員に合わせて進めます
• 先に進める人は,資料を見ながら先に進んでいただいて大丈夫です!
• ツイート大歓迎です #obniz #linebootawards
![Page 14: LINE x obniz ハンズオン...アジェンダ 19:00~ はじめに LINE BOOT AWARDS / Clovaについて obnizについて 19:20~ ハンズオン 21:20~ もくもくタイム/質問タイム](https://reader035.vdocuments.site/reader035/viewer/2022081522/5f0271c87e708231d4044bb3/html5/thumbnails/14.jpg)
今回作るもの
前へすすめ!うごきます
クローバーで動く車,クローバ・ラジコンを作ります
![Page 15: LINE x obniz ハンズオン...アジェンダ 19:00~ はじめに LINE BOOT AWARDS / Clovaについて obnizについて 19:20~ ハンズオン 21:20~ もくもくタイム/質問タイム](https://reader035.vdocuments.site/reader035/viewer/2022081522/5f0271c87e708231d4044bb3/html5/thumbnails/15.jpg)
今回作るもの
https://youtu.be/R0QyQ1rtzmc
![Page 16: LINE x obniz ハンズオン...アジェンダ 19:00~ はじめに LINE BOOT AWARDS / Clovaについて obnizについて 19:20~ ハンズオン 21:20~ もくもくタイム/質問タイム](https://reader035.vdocuments.site/reader035/viewer/2022081522/5f0271c87e708231d4044bb3/html5/thumbnails/16.jpg)
机の上にありますか?
• obniz
• LED
• モーター
• 距離センサ
• 板
• Clova
• 両面テープ
• モバイルバッテリー
• PC
• USBケーブル(Micro B端子)
レンタル/1人1個持ち物 レンタル/数人でシェア
※レンタル品は回収しますので,丁寧に扱ってください
![Page 17: LINE x obniz ハンズオン...アジェンダ 19:00~ はじめに LINE BOOT AWARDS / Clovaについて obnizについて 19:20~ ハンズオン 21:20~ もくもくタイム/質問タイム](https://reader035.vdocuments.site/reader035/viewer/2022081522/5f0271c87e708231d4044bb3/html5/thumbnails/17.jpg)
obnizを 触ってみよう!
![Page 18: LINE x obniz ハンズオン...アジェンダ 19:00~ はじめに LINE BOOT AWARDS / Clovaについて obnizについて 19:20~ ハンズオン 21:20~ もくもくタイム/質問タイム](https://reader035.vdocuments.site/reader035/viewer/2022081522/5f0271c87e708231d4044bb3/html5/thumbnails/18.jpg)
obnizのwifiを設定しよう• https://obniz.io/doc/quickstart のStep2をやります
• まずobnizの電源を入れ,wifiを選択します
• パスワードを1文字ずつ入力しますWIFI情報 SSID : PASSWORD : ※会場でのみ表示
![Page 19: LINE x obniz ハンズオン...アジェンダ 19:00~ はじめに LINE BOOT AWARDS / Clovaについて obnizについて 19:20~ ハンズオン 21:20~ もくもくタイム/質問タイム](https://reader035.vdocuments.site/reader035/viewer/2022081522/5f0271c87e708231d4044bb3/html5/thumbnails/19.jpg)
動作確認• QRコードが出たら,https://obniz.io/doc/quickstart の
Step3,天気予報を表示してみよう
![Page 20: LINE x obniz ハンズオン...アジェンダ 19:00~ はじめに LINE BOOT AWARDS / Clovaについて obnizについて 19:20~ ハンズオン 21:20~ もくもくタイム/質問タイム](https://reader035.vdocuments.site/reader035/viewer/2022081522/5f0271c87e708231d4044bb3/html5/thumbnails/20.jpg)
obnizのサンプルプログラムを試してみよう
• LEDチカをしてみよう https://obniz.io/doc/lessons_turning_on_led
• 距離センサーで遊んでみようhttps://obniz.io/sdk/parts/GP2Y0A21YK0F/https://obniz.io/explore/35
![Page 21: LINE x obniz ハンズオン...アジェンダ 19:00~ はじめに LINE BOOT AWARDS / Clovaについて obnizについて 19:20~ ハンズオン 21:20~ もくもくタイム/質問タイム](https://reader035.vdocuments.site/reader035/viewer/2022081522/5f0271c87e708231d4044bb3/html5/thumbnails/21.jpg)
node.jsから使ってみましょう
1. node.jsをダウンロード・インストール
2. 本番環境の構築
3. ローカルで作成・テスト
4. デプロイ
5. 本番環境で実行
![Page 22: LINE x obniz ハンズオン...アジェンダ 19:00~ はじめに LINE BOOT AWARDS / Clovaについて obnizについて 19:20~ ハンズオン 21:20~ もくもくタイム/質問タイム](https://reader035.vdocuments.site/reader035/viewer/2022081522/5f0271c87e708231d4044bb3/html5/thumbnails/22.jpg)
node.jsから使ってみましょう
1. node.jsをダウンロード・インストール
2. 本番環境の構築
3. ローカルで作成・テスト
4. デプロイ
5. 本番環境で実行
これら不要です
![Page 23: LINE x obniz ハンズオン...アジェンダ 19:00~ はじめに LINE BOOT AWARDS / Clovaについて obnizについて 19:20~ ハンズオン 21:20~ もくもくタイム/質問タイム](https://reader035.vdocuments.site/reader035/viewer/2022081522/5f0271c87e708231d4044bb3/html5/thumbnails/23.jpg)
node.jsから使ってみましょう
1. node.jsをダウンロード・インストール
2. 本番環境の構築
3. ローカルで作成・テスト
4. デプロイ
5. 本番環境で実行
これら不要ですRunkitで
ここだけやりますnode.jsだとしても環境構築不要でお手軽にやりましょう
![Page 24: LINE x obniz ハンズオン...アジェンダ 19:00~ はじめに LINE BOOT AWARDS / Clovaについて obnizについて 19:20~ ハンズオン 21:20~ もくもくタイム/質問タイム](https://reader035.vdocuments.site/reader035/viewer/2022081522/5f0271c87e708231d4044bb3/html5/thumbnails/24.jpg)
Runkitとは
Runkitはnode.jsをすぐにサーバーで動かせるサービスです.
• 環境構築済みなので,node.jsをちょこっとお試ししたいときに向いています.
• 簡単なアプリを作ることができます
• endpoint(HTTPSサーバー)も作ることができます
![Page 25: LINE x obniz ハンズオン...アジェンダ 19:00~ はじめに LINE BOOT AWARDS / Clovaについて obnizについて 19:20~ ハンズオン 21:20~ もくもくタイム/質問タイム](https://reader035.vdocuments.site/reader035/viewer/2022081522/5f0271c87e708231d4044bb3/html5/thumbnails/25.jpg)
Runkitで動かすときのフロー部品obniz
onユーザー
HTTPリクエスト送信
obnizと接続
接続完了
“motor move“を“io0 5V"に変換
コマンド受信
io0を5Vにする
動く
レスポンス返す
“io0 5V”を送信
レスポンス受領
![Page 26: LINE x obniz ハンズオン...アジェンダ 19:00~ はじめに LINE BOOT AWARDS / Clovaについて obnizについて 19:20~ ハンズオン 21:20~ もくもくタイム/質問タイム](https://reader035.vdocuments.site/reader035/viewer/2022081522/5f0271c87e708231d4044bb3/html5/thumbnails/26.jpg)
node.jsから使ってみましょう
https://runkit.com/ にログインします
※macのsafariだと日本語文字入力ができないことがあるので,Chrome, Firefox等をおすすめします
![Page 27: LINE x obniz ハンズオン...アジェンダ 19:00~ はじめに LINE BOOT AWARDS / Clovaについて obnizについて 19:20~ ハンズオン 21:20~ もくもくタイム/質問タイム](https://reader035.vdocuments.site/reader035/viewer/2022081522/5f0271c87e708231d4044bb3/html5/thumbnails/27.jpg)
node.jsから使ってみましょうこちらのコードをCloneしますhttps://runkit.com/9wick/obniz-express-base-code
![Page 28: LINE x obniz ハンズオン...アジェンダ 19:00~ はじめに LINE BOOT AWARDS / Clovaについて obnizについて 19:20~ ハンズオン 21:20~ もくもくタイム/質問タイム](https://reader035.vdocuments.site/reader035/viewer/2022081522/5f0271c87e708231d4044bb3/html5/thumbnails/28.jpg)
node.jsから使ってみましょうobniz idだけ書き換えて,endpointボタンを押します
![Page 29: LINE x obniz ハンズオン...アジェンダ 19:00~ はじめに LINE BOOT AWARDS / Clovaについて obnizについて 19:20~ ハンズオン 21:20~ もくもくタイム/質問タイム](https://reader035.vdocuments.site/reader035/viewer/2022081522/5f0271c87e708231d4044bb3/html5/thumbnails/29.jpg)
モーターをnode.jsから動かすタイヤとモーターをつなげて,obnizに刺します
0番pinと1番pinにつなぎます
![Page 30: LINE x obniz ハンズオン...アジェンダ 19:00~ はじめに LINE BOOT AWARDS / Clovaについて obnizについて 19:20~ ハンズオン 21:20~ もくもくタイム/質問タイム](https://reader035.vdocuments.site/reader035/viewer/2022081522/5f0271c87e708231d4044bb3/html5/thumbnails/30.jpg)
モーターをnode.jsから動かす
モーターを1秒だけ前に動かします
https://runkit.com/9wick/obniz-express-motor-code
![Page 31: LINE x obniz ハンズオン...アジェンダ 19:00~ はじめに LINE BOOT AWARDS / Clovaについて obnizについて 19:20~ ハンズオン 21:20~ もくもくタイム/質問タイム](https://reader035.vdocuments.site/reader035/viewer/2022081522/5f0271c87e708231d4044bb3/html5/thumbnails/31.jpg)
Clovaを 触ってみよう!
![Page 32: LINE x obniz ハンズオン...アジェンダ 19:00~ はじめに LINE BOOT AWARDS / Clovaについて obnizについて 19:20~ ハンズオン 21:20~ もくもくタイム/質問タイム](https://reader035.vdocuments.site/reader035/viewer/2022081522/5f0271c87e708231d4044bb3/html5/thumbnails/32.jpg)
Clova + Runkit+obnizのフローobniz
onClova
「前に進め」
obnizと接続
接続完了“motor move“を
“io0 5V"に変換
コマンド受信
io0を5Vにする
動くレスポンス返す
“io0 5V”を送信
「前に進みます」
デバイス
音声を解析してhttpリクエスト送信
デバイスに送信
HTTPリクエストを解析
部品
![Page 33: LINE x obniz ハンズオン...アジェンダ 19:00~ はじめに LINE BOOT AWARDS / Clovaについて obnizについて 19:20~ ハンズオン 21:20~ もくもくタイム/質問タイム](https://reader035.vdocuments.site/reader035/viewer/2022081522/5f0271c87e708231d4044bb3/html5/thumbnails/33.jpg)
clova + Runkit+obnizのフローobniz
onClova
「前に進め」
obnizと接続
接続完了“motor move“を
“io0 5V"に変換
コマンド受信
io0を5Vにする
動くレスポンス返す
“io0 5V”を送信
「前に進みます」
デバイス
音声を解析してhttpリクエスト送信
デバイスに送信
HTTPリクエストを解析これから作る部分
先程体験した部分
部品
![Page 34: LINE x obniz ハンズオン...アジェンダ 19:00~ はじめに LINE BOOT AWARDS / Clovaについて obnizについて 19:20~ ハンズオン 21:20~ もくもくタイム/質問タイム](https://reader035.vdocuments.site/reader035/viewer/2022081522/5f0271c87e708231d4044bb3/html5/thumbnails/34.jpg)
LINE Clovaの設定
起動しました
前にすすめ
前に進みます
クローバ・ラジコンを起動して
![Page 35: LINE x obniz ハンズオン...アジェンダ 19:00~ はじめに LINE BOOT AWARDS / Clovaについて obnizについて 19:20~ ハンズオン 21:20~ もくもくタイム/質問タイム](https://reader035.vdocuments.site/reader035/viewer/2022081522/5f0271c87e708231d4044bb3/html5/thumbnails/35.jpg)
LINE Clovaの設定
クローバ・ラジコンを起動してアプリ名
・スロット(任意単語の場所)
・スロットタイプ(どんな単語が入るか) 前/後ろ
インテント(文)起動しました
前にすすめ
前に進みます
上記をすべてWeb上で登録していきます
※返答はnode.jsで書いていきます
![Page 36: LINE x obniz ハンズオン...アジェンダ 19:00~ はじめに LINE BOOT AWARDS / Clovaについて obnizについて 19:20~ ハンズオン 21:20~ もくもくタイム/質問タイム](https://reader035.vdocuments.site/reader035/viewer/2022081522/5f0271c87e708231d4044bb3/html5/thumbnails/36.jpg)
LINE Clovaの設定(アプリの登録)アプリの登録をしましょう https://clova-developers.line.me/
![Page 37: LINE x obniz ハンズオン...アジェンダ 19:00~ はじめに LINE BOOT AWARDS / Clovaについて obnizについて 19:20~ ハンズオン 21:20~ もくもくタイム/質問タイム](https://reader035.vdocuments.site/reader035/viewer/2022081522/5f0271c87e708231d4044bb3/html5/thumbnails/37.jpg)
LINE Clovaの設定(アプリの登録)ログインします
![Page 38: LINE x obniz ハンズオン...アジェンダ 19:00~ はじめに LINE BOOT AWARDS / Clovaについて obnizについて 19:20~ ハンズオン 21:20~ もくもくタイム/質問タイム](https://reader035.vdocuments.site/reader035/viewer/2022081522/5f0271c87e708231d4044bb3/html5/thumbnails/38.jpg)
LINE Clovaの設定(アプリの登録)スキルチャネルを作成します
![Page 39: LINE x obniz ハンズオン...アジェンダ 19:00~ はじめに LINE BOOT AWARDS / Clovaについて obnizについて 19:20~ ハンズオン 21:20~ もくもくタイム/質問タイム](https://reader035.vdocuments.site/reader035/viewer/2022081522/5f0271c87e708231d4044bb3/html5/thumbnails/39.jpg)
LINE Clovaの設定(アプリの登録)プロバイダ(配布者)を選択/作成します
![Page 40: LINE x obniz ハンズオン...アジェンダ 19:00~ はじめに LINE BOOT AWARDS / Clovaについて obnizについて 19:20~ ハンズオン 21:20~ もくもくタイム/質問タイム](https://reader035.vdocuments.site/reader035/viewer/2022081522/5f0271c87e708231d4044bb3/html5/thumbnails/40.jpg)
LINE Clovaの設定(アプリの登録)チャネル名を指定して作成します チャネル名:クローバ・ラジコン
次の画面はそのままCreateします
![Page 41: LINE x obniz ハンズオン...アジェンダ 19:00~ はじめに LINE BOOT AWARDS / Clovaについて obnizについて 19:20~ ハンズオン 21:20~ もくもくタイム/質問タイム](https://reader035.vdocuments.site/reader035/viewer/2022081522/5f0271c87e708231d4044bb3/html5/thumbnails/41.jpg)
LINE Clovaの設定(アプリの登録)
チャネルの基本設定をします
作成ボタンを押して保存してください
タイプ カスタム
Extension IDドメインの逆順 (ex io.obniz.skil1)
スキル名 クローバ・ラジコン呼び出し名(メイン) クローバラジコン呼び出し名(サブ) ラジコンAudioPlayerの使用 いいえ提供者区分 個人提供者名 自分の名前担当者メールアドレス 自分のアドレスExtensionと連携するLINEのアカウント 選択しない
![Page 42: LINE x obniz ハンズオン...アジェンダ 19:00~ はじめに LINE BOOT AWARDS / Clovaについて obnizについて 19:20~ ハンズオン 21:20~ もくもくタイム/質問タイム](https://reader035.vdocuments.site/reader035/viewer/2022081522/5f0271c87e708231d4044bb3/html5/thumbnails/42.jpg)
LINE Clovaの設定(対話モデルの登録)
音声ワードの登録をします(ここからが本番!) 「スキル設定」ボタンを押します
![Page 43: LINE x obniz ハンズオン...アジェンダ 19:00~ はじめに LINE BOOT AWARDS / Clovaについて obnizについて 19:20~ ハンズオン 21:20~ もくもくタイム/質問タイム](https://reader035.vdocuments.site/reader035/viewer/2022081522/5f0271c87e708231d4044bb3/html5/thumbnails/43.jpg)
LINE Clovaの設定(対話モデルの登録)
対話モデルの修正を押します
![Page 44: LINE x obniz ハンズオン...アジェンダ 19:00~ はじめに LINE BOOT AWARDS / Clovaについて obnizについて 19:20~ ハンズオン 21:20~ もくもくタイム/質問タイム](https://reader035.vdocuments.site/reader035/viewer/2022081522/5f0271c87e708231d4044bb3/html5/thumbnails/44.jpg)
LINE Clovaの設定(対話モデルの登録)
対話モデルの編集画面が出てきます
![Page 45: LINE x obniz ハンズオン...アジェンダ 19:00~ はじめに LINE BOOT AWARDS / Clovaについて obnizについて 19:20~ ハンズオン 21:20~ もくもくタイム/質問タイム](https://reader035.vdocuments.site/reader035/viewer/2022081522/5f0271c87e708231d4044bb3/html5/thumbnails/45.jpg)
LINE Clovaの設定
アプリ名
・スロット(任意単語の場所)
・スロットタイプ(どんな単語が入るか) 前/後ろ
インテント(文)
インテントとスロットとスロットタイプで混乱しないように・・・
起動しました
前にすすめ
前に進みます
クローバ・ラジコンを起動して
![Page 46: LINE x obniz ハンズオン...アジェンダ 19:00~ はじめに LINE BOOT AWARDS / Clovaについて obnizについて 19:20~ ハンズオン 21:20~ もくもくタイム/質問タイム](https://reader035.vdocuments.site/reader035/viewer/2022081522/5f0271c87e708231d4044bb3/html5/thumbnails/46.jpg)
LINE Clovaの設定(対話モデルの登録)スロットの登録をしましょう
カスタムスロットタイプの追加ボタンを押します
・スロット(位置)
・スロットタイプ (単語)
インテント「前へすすめ」
![Page 47: LINE x obniz ハンズオン...アジェンダ 19:00~ はじめに LINE BOOT AWARDS / Clovaについて obnizについて 19:20~ ハンズオン 21:20~ もくもくタイム/質問タイム](https://reader035.vdocuments.site/reader035/viewer/2022081522/5f0271c87e708231d4044bb3/html5/thumbnails/47.jpg)
LINE Clovaの設定(対話モデルの登録)
名前をつけてスロットタイプを作成しますスロットタイプ名:DirectionSlotType
・スロット(位置)
・スロットタイプ (単語)
インテント「前へすすめ」
![Page 48: LINE x obniz ハンズオン...アジェンダ 19:00~ はじめに LINE BOOT AWARDS / Clovaについて obnizについて 19:20~ ハンズオン 21:20~ もくもくタイム/質問タイム](https://reader035.vdocuments.site/reader035/viewer/2022081522/5f0271c87e708231d4044bb3/html5/thumbnails/48.jpg)
LINE Clovaの設定(対話モデルの登録)
スロットタイプの単語を入力します前/後ろを入力しましょう
書き終わったら保存します
・スロット(位置)
・スロットタイプ (単語)
インテント「前へすすめ」
![Page 49: LINE x obniz ハンズオン...アジェンダ 19:00~ はじめに LINE BOOT AWARDS / Clovaについて obnizについて 19:20~ ハンズオン 21:20~ もくもくタイム/質問タイム](https://reader035.vdocuments.site/reader035/viewer/2022081522/5f0271c87e708231d4044bb3/html5/thumbnails/49.jpg)
LINE Clovaの設定インテントの登録をしましょう インテントの追加ボタンを押します
・スロット(位置)
・スロットタイプ (単語)
インテント「前へすすめ」
![Page 50: LINE x obniz ハンズオン...アジェンダ 19:00~ はじめに LINE BOOT AWARDS / Clovaについて obnizについて 19:20~ ハンズオン 21:20~ もくもくタイム/質問タイム](https://reader035.vdocuments.site/reader035/viewer/2022081522/5f0271c87e708231d4044bb3/html5/thumbnails/50.jpg)
LINE Clovaの設定名前をつけてカスタムインテントを作成します インテント名:MoveIntent
・スロット(位置)
・スロットタイプ (単語)
インテント「前へすすめ」
![Page 51: LINE x obniz ハンズオン...アジェンダ 19:00~ はじめに LINE BOOT AWARDS / Clovaについて obnizについて 19:20~ ハンズオン 21:20~ もくもくタイム/質問タイム](https://reader035.vdocuments.site/reader035/viewer/2022081522/5f0271c87e708231d4044bb3/html5/thumbnails/51.jpg)
LINE Clovaの設定サンプル対話リストに追加します 対話リスト:前へ動け
ラジコン
・スロット(位置)
・スロットタイプ (単語)
インテント「前へすすめ」
![Page 52: LINE x obniz ハンズオン...アジェンダ 19:00~ はじめに LINE BOOT AWARDS / Clovaについて obnizについて 19:20~ ハンズオン 21:20~ もくもくタイム/質問タイム](https://reader035.vdocuments.site/reader035/viewer/2022081522/5f0271c87e708231d4044bb3/html5/thumbnails/52.jpg)
LINE Clovaの設定対話リストの「前」の部分をドラッグして,スロット化します スロット名:DirectionSlot
・スロット(位置)
・スロットタイプ (単語)
インテント「前へすすめ」
![Page 53: LINE x obniz ハンズオン...アジェンダ 19:00~ はじめに LINE BOOT AWARDS / Clovaについて obnizについて 19:20~ ハンズオン 21:20~ もくもくタイム/質問タイム](https://reader035.vdocuments.site/reader035/viewer/2022081522/5f0271c87e708231d4044bb3/html5/thumbnails/53.jpg)
LINE Clovaの設定DirectionSlotのタイプをDirectionSlotTypeに設定します 設定したら保存ボタンを押します
・スロット(位置)
・スロットタイプ (単語)
インテント「前へすすめ」
![Page 54: LINE x obniz ハンズオン...アジェンダ 19:00~ はじめに LINE BOOT AWARDS / Clovaについて obnizについて 19:20~ ハンズオン 21:20~ もくもくタイム/質問タイム](https://reader035.vdocuments.site/reader035/viewer/2022081522/5f0271c87e708231d4044bb3/html5/thumbnails/54.jpg)
LINE Clovaの設定設定は完成です! ビルドボタンを押しましょう(注:結構時間かかります 15分ぐらい)
![Page 55: LINE x obniz ハンズオン...アジェンダ 19:00~ はじめに LINE BOOT AWARDS / Clovaについて obnizについて 19:20~ ハンズオン 21:20~ もくもくタイム/質問タイム](https://reader035.vdocuments.site/reader035/viewer/2022081522/5f0271c87e708231d4044bb3/html5/thumbnails/55.jpg)
ハードウェア製作ビルドしている間にハードウェアとnode.js側を作りましょう
タイヤとモーターをつなげて,obnizに刺します
![Page 56: LINE x obniz ハンズオン...アジェンダ 19:00~ はじめに LINE BOOT AWARDS / Clovaについて obnizについて 19:20~ ハンズオン 21:20~ もくもくタイム/質問タイム](https://reader035.vdocuments.site/reader035/viewer/2022081522/5f0271c87e708231d4044bb3/html5/thumbnails/56.jpg)
ハードウェア製作2つ目も同じように刺します
![Page 57: LINE x obniz ハンズオン...アジェンダ 19:00~ はじめに LINE BOOT AWARDS / Clovaについて obnizについて 19:20~ ハンズオン 21:20~ もくもくタイム/質問タイム](https://reader035.vdocuments.site/reader035/viewer/2022081522/5f0271c87e708231d4044bb3/html5/thumbnails/57.jpg)
ハードウェア製作両面テープで板に止めたら完成です obnizとケーブルも適当にとめてください
![Page 58: LINE x obniz ハンズオン...アジェンダ 19:00~ はじめに LINE BOOT AWARDS / Clovaについて obnizについて 19:20~ ハンズオン 21:20~ もくもくタイム/質問タイム](https://reader035.vdocuments.site/reader035/viewer/2022081522/5f0271c87e708231d4044bb3/html5/thumbnails/58.jpg)
node.jsの作成コードをクローンして,URLの発行/登録をしましょうhttps://runkit.com/9wick/obniz-x-line-clova-base-code
![Page 59: LINE x obniz ハンズオン...アジェンダ 19:00~ はじめに LINE BOOT AWARDS / Clovaについて obnizについて 19:20~ ハンズオン 21:20~ もくもくタイム/質問タイム](https://reader035.vdocuments.site/reader035/viewer/2022081522/5f0271c87e708231d4044bb3/html5/thumbnails/59.jpg)
LINE Clovaの設定RunkitでclovaExtensionIdとyourObnizIdを設定します
clovaExtensionIdは基本設定で設定したものです
![Page 60: LINE x obniz ハンズオン...アジェンダ 19:00~ はじめに LINE BOOT AWARDS / Clovaについて obnizについて 19:20~ ハンズオン 21:20~ もくもくタイム/質問タイム](https://reader035.vdocuments.site/reader035/viewer/2022081522/5f0271c87e708231d4044bb3/html5/thumbnails/60.jpg)
node.jsの作成ClovaにendpointのURLを登録します・endpointを押して,新しいタブでURLを開きます・URLをコピーします※「Cannot GET /」と出ますが,気にしなくて大丈夫です (ブラウザからの通常のリクエストに対応していないエラーです)
![Page 61: LINE x obniz ハンズオン...アジェンダ 19:00~ はじめに LINE BOOT AWARDS / Clovaについて obnizについて 19:20~ ハンズオン 21:20~ もくもくタイム/質問タイム](https://reader035.vdocuments.site/reader035/viewer/2022081522/5f0271c87e708231d4044bb3/html5/thumbnails/61.jpg)
LINE Clovaの設定アプリの基本情報を修正します
![Page 62: LINE x obniz ハンズオン...アジェンダ 19:00~ はじめに LINE BOOT AWARDS / Clovaについて obnizについて 19:20~ ハンズオン 21:20~ もくもくタイム/質問タイム](https://reader035.vdocuments.site/reader035/viewer/2022081522/5f0271c87e708231d4044bb3/html5/thumbnails/62.jpg)
LINE Clovaの設定サーバー設定をします
![Page 63: LINE x obniz ハンズオン...アジェンダ 19:00~ はじめに LINE BOOT AWARDS / Clovaについて obnizについて 19:20~ ハンズオン 21:20~ もくもくタイム/質問タイム](https://reader035.vdocuments.site/reader035/viewer/2022081522/5f0271c87e708231d4044bb3/html5/thumbnails/63.jpg)
LINE Clovaの設定ExtensionサーバーのURLを先程コピーしたURLにして保存します
![Page 64: LINE x obniz ハンズオン...アジェンダ 19:00~ はじめに LINE BOOT AWARDS / Clovaについて obnizについて 19:20~ ハンズオン 21:20~ もくもくタイム/質問タイム](https://reader035.vdocuments.site/reader035/viewer/2022081522/5f0271c87e708231d4044bb3/html5/thumbnails/64.jpg)
LINE Clovaの設定ビルドが終わるのを待ちましょう...
待ち時間で簡単にコードの解説します.
解説が終わってもビルドが終わってなかったら, 先にラジコンとして遊んでてください
https://obniz.io/explore/42
![Page 65: LINE x obniz ハンズオン...アジェンダ 19:00~ はじめに LINE BOOT AWARDS / Clovaについて obnizについて 19:20~ ハンズオン 21:20~ もくもくタイム/質問タイム](https://reader035.vdocuments.site/reader035/viewer/2022081522/5f0271c87e708231d4044bb3/html5/thumbnails/65.jpg)
LINE Clovaの設定テスト画面に行きます
![Page 66: LINE x obniz ハンズオン...アジェンダ 19:00~ はじめに LINE BOOT AWARDS / Clovaについて obnizについて 19:20~ ハンズオン 21:20~ もくもくタイム/質問タイム](https://reader035.vdocuments.site/reader035/viewer/2022081522/5f0271c87e708231d4044bb3/html5/thumbnails/66.jpg)
LINE Clovaの設定テスト文字を入力して,テストしましょうテスト文字列:前へ進め
ラジコン動きましたか?
![Page 67: LINE x obniz ハンズオン...アジェンダ 19:00~ はじめに LINE BOOT AWARDS / Clovaについて obnizについて 19:20~ ハンズオン 21:20~ もくもくタイム/質問タイム](https://reader035.vdocuments.site/reader035/viewer/2022081522/5f0271c87e708231d4044bb3/html5/thumbnails/67.jpg)
実機でテスト実機でテストしましょうClovaとスマホを紐づけて,Clovaアプリから動かします
右上の設定ボタンを選択
スキルストアを選択 クローバ・ラジコンを選択
利用開始を選択
![Page 68: LINE x obniz ハンズオン...アジェンダ 19:00~ はじめに LINE BOOT AWARDS / Clovaについて obnizについて 19:20~ ハンズオン 21:20~ もくもくタイム/質問タイム](https://reader035.vdocuments.site/reader035/viewer/2022081522/5f0271c87e708231d4044bb3/html5/thumbnails/68.jpg)
実機でテストClovaに声をかけてみましょう
ねぇクローバ,クローバラジコン起動して
前へすすめ
後ろへすすめ
![Page 69: LINE x obniz ハンズオン...アジェンダ 19:00~ はじめに LINE BOOT AWARDS / Clovaについて obnizについて 19:20~ ハンズオン 21:20~ もくもくタイム/質問タイム](https://reader035.vdocuments.site/reader035/viewer/2022081522/5f0271c87e708231d4044bb3/html5/thumbnails/69.jpg)
おつかれさまでした
![Page 70: LINE x obniz ハンズオン...アジェンダ 19:00~ はじめに LINE BOOT AWARDS / Clovaについて obnizについて 19:20~ ハンズオン 21:20~ もくもくタイム/質問タイム](https://reader035.vdocuments.site/reader035/viewer/2022081522/5f0271c87e708231d4044bb3/html5/thumbnails/70.jpg)
obniz x Clovaでできることサーボモータを使ったスイッチのオンオフ
温度センサを使った温度通知
赤外線リモコンとの連動
モーターで物理的なものを動かす
ねぇクローバ,部屋の電気消して
ねぇクローバ,部屋の温度教えて
ねぇクローバ,TVつけて
ねぇクローバ,お茶運んで
![Page 71: LINE x obniz ハンズオン...アジェンダ 19:00~ はじめに LINE BOOT AWARDS / Clovaについて obnizについて 19:20~ ハンズオン 21:20~ もくもくタイム/質問タイム](https://reader035.vdocuments.site/reader035/viewer/2022081522/5f0271c87e708231d4044bb3/html5/thumbnails/71.jpg)
もくもくタイム/質問タイム
• 自由にコードをいじってみたり,精読してみたりしてください
• 質問大歓迎です.周りのスタッフに聞いてください