WOFFの紹介

LINE WORKSミニアプリフレームワーク「WOFF」正式リリース！早わかり勉強会！
https://lwugdev.connpass.com/event/283964/

切磋琢磨（LINE WORKSミニアプリフレームワーク「WOFF」早わかり勉強会）＠LWTT大阪
https://lwugdev.connpass.com/event/284432/

LWTT名古屋 #3 LINE WORKS ミニアプリフレームワーク「WOFF」勉強会 & LT
https://lwugdev.connpass.com/event/288069/

Transcript

1. ⓒ WORKS MOBILE Japan Corp. WOFF (WORKS Front-end Framework) の紹介 WORKS MOBILE JAPAN Corp. Shintaro Yamasaki
2. LINE WORKS の紹介
3. LINE WORKS とは︖ LINE WORKSは、LINEの使いやすさはそのままに、 各機能をビジネスに特化させたコミュニケーションアプリです。 4 ⼀般ユーザー向け モバイルメッセンジャー プラットフォーム ビジネス向け コミュニケーション&コラボレーション プラットフォーム LINE LINE WORKS
4. LINE WORKS 最⼤の特徴 LINEのように、だれでも使えて教育の時間がほとんど必要ありません。 管理機能により、コミュニケーションの活性化と安⼼なビジネス環境を両⽴します。 5 プライベート モバイルメッセンジャー プラットフォーム 教育コスト不要 ITリテラシーを問わず だれでも使えるサービス 社内だけでなく、お客様とお取引先との コミュニケーションも LINE WORKSひとつで完結 ⾦融機関も認める セキュリティをご提供 お客様の⼤切な情報を守ります 国内利⽤ 450万⼈ LINEとつながる 唯⼀のビジネスチャット 管理もできて 安⼼なセキュリティ
5. LINE WORKS でできること 6 トーク トーク フォルダ機能 ・ファイル共有 ・ペーパレス ・帳票管理 ・BCP対策 ・リンク共有 アンケート ・意⾒収集 ・集計の⾃動化 ・従業員満⾜度向上 ・安否確認 ・社外アンケート 掲⽰板 ・社内情報展開/周知 ・社内ポータルの構築 ・情報の⼀⻫配信 ・⽇報/業務報告 ・ファイル共有 ・マニュアル/ガイドライン 展開 カレンダー ・スケジュール管理 ・社内共有 ・プロジェクト管理 連携サービス ・勤怠管理 ・ワークフロー ・顧客管理 ・⼈事管理 ・バックオフィス系 さまざまな業務を、LINE WORKSで効率的に LINE、外部LINE WORKS と連携して 外部連携 ・社内コミュニケーション ・⾳声/ビデオ通話 ・ファイルの共有 ・オンライン会議 ・プロジェクト管理 ・⽇報/業務報告 ・BCP（緊急時の連絡網） ※ LINEとは⾳声/ビデオ通話を⾏うことはできません。 ・社外コミュニケーション ・⾳声、ビデオ通話も可
6. アプリ連携 7 • 外部サービスと連携する「アプリ」を簡単に導⼊できる仕組み。 • 管理画⾯から簡単に追加。 さまざまなアプリを⽤意。 ネットプリント コラボフロー fondesk チャットで勤怠 (freee勤怠管理) Mail2Link 宅急便を送る 奉⾏クラウド らくしふ など New アルキラーNEX 熱中症アラート (β版) New New New
7. LINE WORKS Developersの紹介
8. LINE WORKS Developers 9 普段のLINE WORKSに+αするための連携機能。 社内システム 外部サービス LINE WORKS Developers LINE WORKSを通してさまざまなシステムと接続 → フロントエンドがLINE WORKSに集約。利便性アップ。 Bot API WOFF SSO
9. 活⽤例 10 業務に合わせたBotを開発し、ご活⽤いただいてます。 中森農産株式会社 様 業種: 農林畜産 時報Bot • 農作業者への注意喚起と安否確認のためのBot • 全従業員に定時連絡を⾃動化。 • 既読がつくことが安否確認にもなる。 業務活動管理Bot パナソニック ホームズ株式会社 様 業種: 不動産・住宅 参考: https://line.worksmobile.com/jp/cases/nai-organic/ 参考: https://line.worksmobile.com/jp/cases/homes-panasonic • トーク画⾯から会話形式で活動内容を記録。 • 感覚で項⽬を選択することができるため、負担なく作業を⾏える
10. 活⽤例 11 https://line.worksmobile.com/jp/cases/ [業務⾃動化・Bot] [連携ツール] を選択 導⼊事例ページを参照ください
11. LINE WORKS Developers の主な機能 12 WOFF LINE WORKS上で動くミニアプリを 開発 今⽇はこちらを紹介 Bot LINE WORKSのトークルームで 使⽤できるチャットボット API LINE WORKS との連携アプリを開 発するための Web API SSO シングルサインオンを使って、 1 つのログイン情報で複数の サービスへログイン。
12. WOFF (WORKS Front-end Framework) の紹介
13. WOFFとは WORKS Front-end Framework（WOFF）は、LINE WORKS上で動くWeb アプリを実装できる開発プラットフォームです。 このWOFFで作られた Web アプリ（= WOFFアプリ）は、トークメッセージなどからシームレスに⽴ち上がるミニアプリとして、幅 広い連携を実現します。
14. WOFFの特徴 ü LINE WORKSアプリ上からすぐにサービスを利⽤で きる ü サービスの利⽤のために個別のアプリインストールが 不要 ü Webアプリ/モバイルアプリと同様の使⽤感 ユーザー視点のメリット ü LINE WORKSを、サービス提供のためのプラット フォームとして活⽤できる ü WOFF SDKを通して、LINE WORKSの機能やユー ザー情報との連携が可能 ü Webアプリと同様の⽅式で開発 開発者・サービス提供者視点のメリット WOFFの最⼤の特徴としては、LINE WORKS上でさまざまなアプリを利⽤できるようになること。 LINE WORKSというアプリの上で動くミニアプリとして、さまざまなサービスをLINE WORKSを通して提供できる。
15. WOFFの機能 WOFF SDKを通してさまざまな機能が提供されている。基本的な機能は以下の通り。 • ユーザーIDの取得 • トークへメッセージの送信 • QRコードのスキャン
16. Bot と WOFF アプリの違い Bot も WOFF アプリも、LINE WORKS を通してさまざまな業務ツールを利⽤可能にする開発者機能。 Room reservation Room A Room B Room C Room D Bot WOFFアプリ トークルーム上でやりとりする会話形式のUIを提 供。 ユーザーとのトークと同じような体験を提供でき るユーザーフレンドリーな機能。 # インターフェース n Bot APIを通して提供されているなさまざま なメッセージタイプやメニューを使って設計。 # その他 n トークルームを開いてアクセス。 n プッシュ通知あり。 # 使い所 n 会話形式にやりとりするもの(⼀問⼀答)。 n FAQチャットボットや、簡易な⼊⼒のみで ⼗分な場合。 Webアプリとして、ブラウザを通したグラフィ カルなUIを提供する。 WOFFブラウザ上に⾃由なレイアウトで情報を 表⽰。 # インターフェース n Webアプリとして、ボタンやフォーム⼊⼒ 等を実装し、複数項⽬の⼀括⼊⼒・表⽰など を⾃由に設計可能。 # その他 n WOFF URLを開いて起動。 # 使い所 n 複雑な⼊⼒やグラフィカルな表⽰を必要とす る場合。 それぞれの特徴を踏まえて、組み合わせて利⽤する。
17. 使い所 想定される活⽤として主に3種類 1.複数項⽬を⼊⼒させたい時 2.情報検索や複雑な情報の表⽰をしたい時 3.グラフィカルなUI/UXを提供したい時
18. 使い所 1. 複数項⽬を⼊⼒させたい時 • 複数の情報を⼀度に⼊⼒し、フォーム送信 (e.g. 実績登録、予約登録など) 例. アプリ連携 > 宅急便を送る アプリ 届け先住所の登録で利⽤。 • 取得したユーザーIDを使って、⼊⼒した ユーザーの特定も可能。
19. 使い所 2.情報検索や複雑な情報の表⽰をしたい時 • 情報の検索や表⽰をするケース。 (e.g. 在庫管理、ファイル検索など) • テーブル表⽰やエクスプローラー機能をWOFFアプリで実現。 例. アプリ連携 > Dropbox アプリ ファイルを検索し、ファイルリンクのトークへの共有 • メッセージ送信機能でトークルームへ 共有も可能。 • QRコードのスキャン機能でQRコード から検索することも可能。
20. 使い所 3.グラフィカルなUI/UXを提供したい時 • グラフィカルなUIを表⽰させて、⾃由度の⾼い体験を実装したいケース。(e.g. 実績表⽰、使⽤量表⽰、分析結果表⽰など) • Webベースなので、リッチなUIを実現可能。 • 取得したユーザーIDを使って、⼊⼒した ユーザーの特定も可能。
21. 利⽤要件 lプラン l フリープランから利⽤可能 l環境 l モバイル版・PC版・Web版で利⽤可能 l システム要件 に則る l アプリバージョン: バージョン3.6以上推奨 (v3.6未満の場合、⼀部利⽤できない機能があります。)
22. 補⾜ LINE の「LIFF」も WOFF と同様に、LINE アプリ上に Web アプリを実装できる開発者向け機能。 同じようにユーザー連携やメッセージ送信などの基本機能を持つが、異なる点も多い。LIFF にはあって WOFF にはない機能も多くある (liff.shareTargetPicker(), liff.getIDToken()など)。 なので、LIFFのコードをそのまま転⽤するということはできない (SDKも異なる) 違いがあることを認識して、「WOFF」のドキュメントを参照して開発する。 「LIFF」と⽐べて
23. デモ Qiitaの記事に沿って紹介します https://qiita.com/mmclsntr/items/ab3987938da6ecd8d9b1
24. ドキュメント APIリファレンスは「LINE WORKS Developers」のドキュメントにあります。 LINE WORKS developer https://developers.worksmobile.com/jp
25. ドキュメント 26 QiitaにTipsが多く投稿されています。こちらも参考ください。 「LINEWORKS」タグで検索 「ワークスモバイルジャパン株式会社」Organizationもあります。
26. コミュニティ 疑問点などありましたら、コミュニティもぜひご活⽤ください。 https://forum.worksmobile.com/jp/
27. ありがとうございました