Clovaでﾀﾞｧ ｼｴﾘｲｪｽ

■参考
・Clova + Clova Extension Kit + IBM Cloud FoundryでClovaスキルをチョッパヤで作ってみる（前半）
　https://relativelayout.hatenablog.com/entry/2018/08/25/121842
・Clova + Clova Extension Kit + IBM Cloud FoundryでClovaスキルをチョッパヤで作ってみる（後半）
　https://relativelayout.hatenablog.com/entry/2018/08/25/135941
・Clova + Clova Extension Kit + enebular で京急の運行情報確認ができるClovaスキルを作る
　https://qiita.com/pokiiio/items/fc3dc55e52a7733dfa2a
・デモ動画
　https://www.instagram.com/p/Bm5yoydF56g/

Transcript

1. Clovaでﾀﾞｧ ｼｴﾘｲｪｽ
   ポキオ
   

   View Slide

2. ポキオ
   ● R&D園児にゃー
   ● Twitter/GitHub : @pokiiio
   ● Blog : Androidのメモとか
   (http://relativelayout.hatenablog.com/ )
   

   View Slide

3. ﾀﾞｧｼｴﾘｲｪｽ…？
   

   View Slide

4. View Slide

5. 京急は神
   *個人の感想です
   

   View Slide

6. 電車遅延って
   イヤですよね？
   

   View Slide

7. 電車遅延をエンターテイメントに！
   

   View Slide

8. 京急が遅延したら
   通知するガジェットを
   色々作ってきた
   

   View Slide

9. ﾀﾞｧ 初号機 ﾀﾞｧ 2号 ポキオ基板
   

   View Slide

10. 2000円位のWi-Fi機能付き
    マイコンボード
    

    View Slide

11. ﾀﾞｧ 3号
    Raspberry Pi
    + LEGO
    3色電子ペーパー
    運行情報を
    リアルタイムで
    遅延してそうな
    路線をハイライト
    

    View Slide

12. 京急線は平常通り
    運転しています。
    京急運行情報HPから
    運行情報の文字列を取得
    京急線は平常通り
    運転しています。
    PNG
    表示したい
    文字列を画像化
    画像を
    電子ペーパーに描画
    https://github.com/pokiiio/KeikyuMapOnEPaper
    

    View Slide

13. 今回はClovaスキル開発にチャレンジ
    

    View Slide

14. View Slide

15. View Slide

16. いろいろできる
    ● 無料で始められる
    ● IntentとSlotを使った対話モデル
    ● ビルド後、即実機（Clova）で確認できる
    

    View Slide

17. ただ、１つだけ罠が
    

    View Slide

18. https://relativelayout.hatenablog.com/entry/2018/08/25/121842
    

    View Slide

19. https://relativelayout.hatenablog.com/entry/2018/08/25/121842
    ここがない！
    

    View Slide

20. View Slide

21. でも、大丈夫なんだよ！
    

    View Slide

22. 世の中には良いツールがあった！
    

    View Slide

23. ①IBM Cloud Application Runtimes
    ②Enebular
    ③Node-RED on IBM Cloud
    

    View Slide

24. IBM Cloud アプリケーションランタイム
    ● IBM Cloud版のLambdaみたいなやつ（雑）
    ● クレジットカード不要のライトアカウントで利用できる
    ● パケ死（？）しなくて済むので初心者でも安心して使える
    

    View Slide

25. Node.jsで開発可能
    ● デプロイするとLambdaのように使える
    ● CEKでもNode.js向けのSDKが用意されているのでそれを使ってます
    ○ https://relativelayout.hatenablog.com/entry/2018/08/25/135941
    

    View Slide

26. enebular
    ● 無料で使えるサービス
    ● Node-REDベースで、グラフィカルなUIで処理を実装可能
    ○ https://qiita.com/pokiiio/items/fc3dc55e52a7733dfa2a
    

    View Slide

27. こんなUI @tseigoさん渾身のClova向けフローの
    テンプレも用意されているので
    簡単に開発をスタートできる！
    https://blog.enebular.com/line/line-cek-meets-enebular/
    

    View Slide

28. 実際に京急アプリを書いてみた
    フローはherokuに
    一旦デプロイされるので
    チョッパヤで動作確認可能
    

    View Slide

29. Node-RED on IBM Cloud
    ● Node-REDはIBM Cloudでも利用可能！
    ● 先程のテンプレをこっそりインポートすると簡単に開始できます
    ● こちらもライトアカウントで利用できます
    ○ https://relativelayout.hatenablog.com/entry/2018/09/18/000832
    

    View Slide

30. UIはさっきとほとんど同じ
    

    View Slide

31. で、できたものはこちら
    

    View Slide

32. https://www.instagram.com/p/Bm5yoydF56g/
    

    View Slide

33. サマリ
    

    View Slide

34. サマリ
    ● Clovaいいね
    ● スキル開発して即実機確認余裕でした
    ● 処理部分を書くソリューションもたくさん提案されている
    ● 怖くない！スキル開発！
    

    View Slide

35. Thank you!
    

    View Slide