Successfully reported this slideshow.
We use your LinkedIn profile and activity data to personalize ads and to show you more relevant ads. You can change your ad preferences anytime.
デブサミ2017
45分で早分かり!
kintoneの基本とカスタマイズ
16-F-1 17-F-1
2017/2/16,17 サイボウズ 三宅、李
タイムテーブル
11:05~11:30 kintoneの基本
11:30~11:50 kintoneカスタマイズ (サイボウズ 三宅)
(サイボウズ 李)
kintoneの基本
自己紹介
おんちゃん 韓・中・日 嵐
嵐
サイボウズ紹介
kintoneとは?
kintoneのデモ
知っ得情報
kintoneの事例
目次
サイボウズ紹介
サイボウズ紹介-会社概要
サイボウズ紹介-オフィス
コンセプト「Big Hub for Teamwork」
サイボウズ紹介-製品
2002~ 2010~
スケジュール共有,施設予約,掲示板…
1997~
5万社~
190万
ユーザー~
160万
ユーザー~
グループウェア ”“
サイボウズ紹介-製品
2002~ 2010~
スケジュール共有,施設予約,掲示板…
1997~
5万社~
190万
ユーザー~
160万
ユーザー~
グループウェア ”“
サイボウズ =
スケジュール中心
グループウェア
そんなことありません。
サイボウズには、
サイボウズOffice kintone
分類
形態
提供
自由度
(フォーム)
グループウェア
情報共有
パッケージ/クラウド
なし
プラットフォーム
業務遂行
クラウド
あり
kintoneとofficeの違いは?
kintoneとは?
kintoneとは?- kintoneの3要素
データベース
必要な情報を
蓄積・共有する
プロセス管理
簡単にプロセスを
回したり、承認する
コミュニケーション
連絡・補足・相談を
する
kintoneの3要素 – データベース
②Excel/CSV
ファイルから作成
①アプリストア
から選ぶ
③はじめから作成
アプリ
kintoneの3要素 – データベース
ドラッグ&ドロップで
ファーストに
フォームを作成する
ことができる!
フォームの設定
kintoneの3要素 – データベース
一覧画面 詳細画面 グラフ
データを蓄積したり、蓄積されたデータを利用して
簡単に集計をとることが可能に!
kintoneの3要素 – データベース
一つの場所にデータ・メンバー間の
やり取りなどが集約できる!
スペース ゲスト
スペース
kintoneの3要素 – プロセス管理
申請する 承認する
完了
差し戻す
kintoneの3要素 – コミュニケーション
各データに対する
相談や質問、
アドバイスなどが
可能
レコードのコメント欄
kintone デモ
kintone 事例
kintone事例 - 株式会社バルス 様
・タイムリーな情報共有が
できない。
・CC、定型文 などが面倒くさい。
商社
購
買
担
当
者
導入前
・作業、進行状況の管理が
属人化されて引き継ぎが難しい。
kintone事例 - 株式会社バルス 様
・作業、進行状況が共有されて
いるため、担当者が不在時も
遅延せずに対応できる!
商社
・コメントや、スレッド機能で
簡単に、スピーディーに
コミュニケーションできる!
購
買
担
当
者
導入後
・...
導入前
迷子が見つかった
“ ”
FAXがある
案内所まで
案内する
インフォ
メーション
センターに
FAXを送付
FAXに
気がつくと
案内放送をする
kintone事例 - 日本空港ビルデング株式会社 様
迷子の
プロフィールを
FAX用...
導入前
迷子が見つかった
“ ”
FAXがある案内所まで
移動するのに時間がかかる
kintone事例 - 日本空港ビルデング株式会社 様
紙の台帳の管理が大変
(データ管理、更新管理など)
迷子が見つかった
“ ”
導入前
kintone事例 - 日本空港ビルデング株式会社 様
FAX送信のあと、受信までタイムラグがある
迷子が見つかった
“ ”
導入前
kintone事例 - 日本空港ビルデング株式会社 様
迷子が見つかった
“ ”
FAX受信に気付くまで時間がかかる
導入前
kintone事例 - 日本空港ビルデング株式会社 様
その場で
子供の写真を撮る
プロフィールを登録
kintoneと連動した
パトランプが点灯
確実に通知
導入後
迷子が見つかった
“ ”
kintone事例 - 日本空港ビルデング株式会社 様
導入後
迷子が見つかった
“ ”
kintone事例 - 日本空港ビルデング株式会社 様
FAXがある案内所までの移動時間を削減
導入後
迷子が見つかった
“ ”
kintone事例 - 日本空港ビルデング株式会社 様
紙の台帳の更新時間を削減
導入後
迷子が見つかった
“ ”
kintone事例 - 日本空港ビルデング株式会社 様
FAX送信の後、受信までのタイムラグ、
館内放送までの時間を削減
kintone事例サイト
https://kintone-sol.cybozu.co.jp/cases/
知っ得情報
知っ得情報
kintone
hive online
kintone
ヘルプ&FAQ
kintone
ガイドブック
http://kintone-blog.cybozu.co.jp/
https://help.cybozu.com/ja/k/
h...
『kintoneの基本』の次は…
kintoneカスタマイズについてです!
趣味はサイクリング
岡山 ➡ 京都 ➡ 東京へ
三宅 智子(Mike)です
仕事はイベントの運営・カスタマイズ
エンジニア修行中です!
目次
kintoneカスタマイズの基本
フロントエンドとバックエンド利用
デモ
イベント情報
kintoneカスタマイズの基本
標準機能で足りない部分を補う
kintoneカスタマイズ
画 面 開 発 ・ 機 能 追 加
( J a v a S c r i p t A P I ・ H T M L ・ C S S )
ガ ン ト チ ャ ー ト M a p 表 示
シ ス...
2種類のAPI
他システムとデータ連携できるようになります。
kintoneのデータを他システムに渡したり、他シ
ステムのデータをkintoneに取り込むことができ
ます。
画面をカスタマイズすることで、標準搭載されて
いない機能を利用できるよ...
フロントエンドとバックエンド利用
フロントエンド利用
条件書式
ガントチャート
住所から地図表示
入力値チェック
カスタマイズビュー表示
Twilio連携で電話やSMS連絡
SendGrid連携でメール送信
SendGrid: https://cybozudev.zendesk.com/hc/ja/articles/206584633
Twilio: https://cybozu...
Chart.jsでダッシュボード作成
https://cybozudev.zendesk.com/hc/ja/articles/214479043
kintoneの標準機能では、こんな
グラフは作れないので、ライブラ
リを利用して作成します!
AWSにある大規模データをkintoneで
グラフ化
サマリーを登録
POS、売上明細など
の大量データ想定
AWS S3 AWS Lambda
+
kintone
コマンドラインツール
拠点A
拠点B
拠点…
大量データの扱いは苦手なので、
...
バックエンド利用(データベースとして)
REST API
kintone上のデータの印刷
標準機能では綺麗
に印刷できない
印刷したくない項目
も印刷されてしまう
②外部サービス
(プリントクリエイ
ターやRepotone Uなど)
①JavaScript
カスタマイズ
モバイルアプリ開発のバックエンドとし
て(Monaca連携)
1 来場者管理アプリ
2 陳列場所確認アプリ
3 集荷状況確認アプリ
QRコードをスキャン
して、来場者情報を
kintoneに送る
商品バーコードスキャン
でkintone DBを...
ついにWebhook機能が登場!
• アプリのレコード追加、編集、ステータスの更新
を外部サービスに通知可能に
ノンコーディングで連携可能に
中間はZapier/Microsoft Flow/IFTTT/Mulesoft
などでデータの型変換!...
もっとこんなサービスとも連携可能!
Webhooks logo
The MIT License
(https://github.com/logo/webhooks)
Copyright © 2014 <friends@segment.io>
まとめると…
苦手な部分もあるけど、
• 大量データ(100万リクエスト/アプリ)
クラウドDB
• 定期実行処理
SDK
• 帳票出力
ソリューション
• モバイルカスタマイズ
Android SDK, iOS, SDK,
Monaca, C...
デモ
kintoneからSlackに通知を送る
• kintoneでレコード登録したらその内容をSlackに送信
(参考)kintone → Gmail:
https://cybozudev.zendesk.com/hc/ja/articles/11...
デモへLet’s go!
カスタマイズの動きを見れるデモサイト!
developer networkにアカウント登録するとデモ環境に入れます
➡https://dev-demo.cybozu.com/k/
API仕様やカスタマイズ情報は
cybozu developer network
• 2014年10月 公開のサイボウ
ズのクラウド製品における、
技術者向けサイト
• 現在、メンバー登録数
6,000アカウント突破!
検索はこちら⇓⇓⇓
ht...
★メンバー登録特典★
• 5ユーザー、1年間無償のkintone開発者ライセンスを
申し込むことができます。
• コミュニティに投稿やコメントしたり、Tips に質問で
きます。
• API のアップデート情報の通知を受け取ることができ
ます。...
イベント情報
kintone Café
kintone Caféとは?
kintone Caféは、まだkintoneに触れたことの無い
方から、より高度なカスタマイズを行いたいと考
えているプロフェッショナルの方まで幅広い層を
対象に、 楽しく学び・教え合...
kintone hive
https://kintone.cybozu.com/jp/event/hive2016/05/index.html
kintone hiveとは?
kintoneの活用のヒントやkintoneへの期待を膨らませる
k...
kintone devCamp
http://kintonedevcamp.connpass.com/
kintone devCampとは?
kintone devCamp とは kintone界隈のdeveloper同士で
会場に出向き、ki...
kintone devCamp Vol.11
@Tokyo & @Osaka
2017/3/1(水) 14:00~
サイボウズ東京オフィス27F
サイボウズ大阪梅田オフィス
&
※現在キャンセル待ち
Thank you
Upcoming SlideShare
Loading in …5
×

【デブサミ2017】45分で早わかり!kintoneの基本とカスタマイズ

1,402 views

Published on

【デブサミ2017】45分で早わかり!kintoneの基本とカスタマイズ

Published in: Technology
  • Be the first to comment

【デブサミ2017】45分で早わかり!kintoneの基本とカスタマイズ

  1. 1. デブサミ2017 45分で早分かり! kintoneの基本とカスタマイズ 16-F-1 17-F-1 2017/2/16,17 サイボウズ 三宅、李
  2. 2. タイムテーブル 11:05~11:30 kintoneの基本 11:30~11:50 kintoneカスタマイズ (サイボウズ 三宅) (サイボウズ 李)
  3. 3. kintoneの基本
  4. 4. 自己紹介 おんちゃん 韓・中・日 嵐 嵐
  5. 5. サイボウズ紹介 kintoneとは? kintoneのデモ 知っ得情報 kintoneの事例 目次
  6. 6. サイボウズ紹介
  7. 7. サイボウズ紹介-会社概要
  8. 8. サイボウズ紹介-オフィス コンセプト「Big Hub for Teamwork」
  9. 9. サイボウズ紹介-製品 2002~ 2010~ スケジュール共有,施設予約,掲示板… 1997~ 5万社~ 190万 ユーザー~ 160万 ユーザー~ グループウェア ”“
  10. 10. サイボウズ紹介-製品 2002~ 2010~ スケジュール共有,施設予約,掲示板… 1997~ 5万社~ 190万 ユーザー~ 160万 ユーザー~ グループウェア ”“ サイボウズ = スケジュール中心 グループウェア
  11. 11. そんなことありません。
  12. 12. サイボウズには、
  13. 13. サイボウズOffice kintone 分類 形態 提供 自由度 (フォーム) グループウェア 情報共有 パッケージ/クラウド なし プラットフォーム 業務遂行 クラウド あり kintoneとofficeの違いは?
  14. 14. kintoneとは?
  15. 15. kintoneとは?- kintoneの3要素 データベース 必要な情報を 蓄積・共有する プロセス管理 簡単にプロセスを 回したり、承認する コミュニケーション 連絡・補足・相談を する
  16. 16. kintoneの3要素 – データベース ②Excel/CSV ファイルから作成 ①アプリストア から選ぶ ③はじめから作成 アプリ
  17. 17. kintoneの3要素 – データベース ドラッグ&ドロップで ファーストに フォームを作成する ことができる! フォームの設定
  18. 18. kintoneの3要素 – データベース 一覧画面 詳細画面 グラフ データを蓄積したり、蓄積されたデータを利用して 簡単に集計をとることが可能に!
  19. 19. kintoneの3要素 – データベース 一つの場所にデータ・メンバー間の やり取りなどが集約できる! スペース ゲスト スペース
  20. 20. kintoneの3要素 – プロセス管理 申請する 承認する 完了 差し戻す
  21. 21. kintoneの3要素 – コミュニケーション 各データに対する 相談や質問、 アドバイスなどが 可能 レコードのコメント欄
  22. 22. kintone デモ
  23. 23. kintone 事例
  24. 24. kintone事例 - 株式会社バルス 様 ・タイムリーな情報共有が できない。 ・CC、定型文 などが面倒くさい。 商社 購 買 担 当 者 導入前 ・作業、進行状況の管理が 属人化されて引き継ぎが難しい。
  25. 25. kintone事例 - 株式会社バルス 様 ・作業、進行状況が共有されて いるため、担当者が不在時も 遅延せずに対応できる! 商社 ・コメントや、スレッド機能で 簡単に、スピーディーに コミュニケーションできる! 購 買 担 当 者 導入後 ・リアルタイムで納期や発注状況 が把握できる! 基幹 システム
  26. 26. 導入前 迷子が見つかった “ ” FAXがある 案内所まで 案内する インフォ メーション センターに FAXを送付 FAXに 気がつくと 案内放送をする kintone事例 - 日本空港ビルデング株式会社 様 迷子の プロフィールを FAX用紙に 記載する
  27. 27. 導入前 迷子が見つかった “ ” FAXがある案内所まで 移動するのに時間がかかる kintone事例 - 日本空港ビルデング株式会社 様
  28. 28. 紙の台帳の管理が大変 (データ管理、更新管理など) 迷子が見つかった “ ” 導入前 kintone事例 - 日本空港ビルデング株式会社 様
  29. 29. FAX送信のあと、受信までタイムラグがある 迷子が見つかった “ ” 導入前 kintone事例 - 日本空港ビルデング株式会社 様
  30. 30. 迷子が見つかった “ ” FAX受信に気付くまで時間がかかる 導入前 kintone事例 - 日本空港ビルデング株式会社 様
  31. 31. その場で 子供の写真を撮る プロフィールを登録 kintoneと連動した パトランプが点灯 確実に通知 導入後 迷子が見つかった “ ” kintone事例 - 日本空港ビルデング株式会社 様
  32. 32. 導入後 迷子が見つかった “ ” kintone事例 - 日本空港ビルデング株式会社 様 FAXがある案内所までの移動時間を削減
  33. 33. 導入後 迷子が見つかった “ ” kintone事例 - 日本空港ビルデング株式会社 様 紙の台帳の更新時間を削減
  34. 34. 導入後 迷子が見つかった “ ” kintone事例 - 日本空港ビルデング株式会社 様 FAX送信の後、受信までのタイムラグ、 館内放送までの時間を削減
  35. 35. kintone事例サイト https://kintone-sol.cybozu.co.jp/cases/
  36. 36. 知っ得情報
  37. 37. 知っ得情報 kintone hive online kintone ヘルプ&FAQ kintone ガイドブック http://kintone-blog.cybozu.co.jp/ https://help.cybozu.com/ja/k/ https://kintone.cybozu.com/jp/feature/date.html
  38. 38. 『kintoneの基本』の次は… kintoneカスタマイズについてです!
  39. 39. 趣味はサイクリング 岡山 ➡ 京都 ➡ 東京へ 三宅 智子(Mike)です 仕事はイベントの運営・カスタマイズ エンジニア修行中です!
  40. 40. 目次 kintoneカスタマイズの基本 フロントエンドとバックエンド利用 デモ イベント情報
  41. 41. kintoneカスタマイズの基本
  42. 42. 標準機能で足りない部分を補う kintoneカスタマイズ 画 面 開 発 ・ 機 能 追 加 ( J a v a S c r i p t A P I ・ H T M L ・ C S S ) ガ ン ト チ ャ ー ト M a p 表 示 シ ス テ ム デ ー タ 連 携 ( R E S T A P I ) 基幹システムと連携センサーと連携 プラグイン(機能追加パッケージ)
  43. 43. 2種類のAPI 他システムとデータ連携できるようになります。 kintoneのデータを他システムに渡したり、他シ ステムのデータをkintoneに取り込むことができ ます。 画面をカスタマイズすることで、標準搭載されて いない機能を利用できるようになります。 REST API JavaScript API
  44. 44. フロントエンドとバックエンド利用
  45. 45. フロントエンド利用 条件書式 ガントチャート 住所から地図表示 入力値チェック カスタマイズビュー表示
  46. 46. Twilio連携で電話やSMS連絡 SendGrid連携でメール送信 SendGrid: https://cybozudev.zendesk.com/hc/ja/articles/206584633 Twilio: https://cybozudev.zendesk.com/hc/ja/articles/213588883 データを貯めるのは得 意だけれど、送るのは ちょっと… そんな時はサービス連 携で解決!
  47. 47. Chart.jsでダッシュボード作成 https://cybozudev.zendesk.com/hc/ja/articles/214479043 kintoneの標準機能では、こんな グラフは作れないので、ライブラ リを利用して作成します!
  48. 48. AWSにある大規模データをkintoneで グラフ化 サマリーを登録 POS、売上明細など の大量データ想定 AWS S3 AWS Lambda + kintone コマンドラインツール 拠点A 拠点B 拠点… 大量データの扱いは苦手なので、 クラウドDBに任せる!
  49. 49. バックエンド利用(データベースとして) REST API
  50. 50. kintone上のデータの印刷 標準機能では綺麗 に印刷できない 印刷したくない項目 も印刷されてしまう ②外部サービス (プリントクリエイ ターやRepotone Uなど) ①JavaScript カスタマイズ
  51. 51. モバイルアプリ開発のバックエンドとし て(Monaca連携) 1 来場者管理アプリ 2 陳列場所確認アプリ 3 集荷状況確認アプリ QRコードをスキャン して、来場者情報を kintoneに送る 商品バーコードスキャン でkintone DBを検索し て陳列場所表示 QRコードスキャンで、 商品情報&現在地情報を kintoneに登録 https://cybozudev.zendesk.com/hc/ja/search?utf8=%E2%9C%9 3&query=Monaca&commit=%E6%A4%9C%E7%B4%A2
  52. 52. ついにWebhook機能が登場! • アプリのレコード追加、編集、ステータスの更新 を外部サービスに通知可能に ノンコーディングで連携可能に 中間はZapier/Microsoft Flow/IFTTT/Mulesoft などでデータの型変換! Webhookイメージ by ダン吉
  53. 53. もっとこんなサービスとも連携可能! Webhooks logo The MIT License (https://github.com/logo/webhooks) Copyright © 2014 <friends@segment.io>
  54. 54. まとめると… 苦手な部分もあるけど、 • 大量データ(100万リクエスト/アプリ) クラウドDB • 定期実行処理 SDK • 帳票出力 ソリューション • モバイルカスタマイズ Android SDK, iOS, SDK, Monaca, Cordova 他サービス連携で実現!
  55. 55. デモ
  56. 56. kintoneからSlackに通知を送る • kintoneでレコード登録したらその内容をSlackに送信 (参考)kintone → Gmail: https://cybozudev.zendesk.com/hc/ja/articles/115000299143 中間にはZapier
  57. 57. デモへLet’s go!
  58. 58. カスタマイズの動きを見れるデモサイト! developer networkにアカウント登録するとデモ環境に入れます ➡https://dev-demo.cybozu.com/k/
  59. 59. API仕様やカスタマイズ情報は cybozu developer network • 2014年10月 公開のサイボウ ズのクラウド製品における、 技術者向けサイト • 現在、メンバー登録数 6,000アカウント突破! 検索はこちら⇓⇓⇓ https://cybozudev.zendesk.com/hc/ja
  60. 60. ★メンバー登録特典★ • 5ユーザー、1年間無償のkintone開発者ライセンスを 申し込むことができます。 • コミュニティに投稿やコメントしたり、Tips に質問で きます。 • API のアップデート情報の通知を受け取ることができ ます。 • Tipsやサンプルのkintone デモサイトを利用できます。 • 気になるユーザーをフォローすることができます。 • kintone専用のHTTPクライアントツールを利用できます。
  61. 61. イベント情報
  62. 62. kintone Café kintone Caféとは? kintone Caféは、まだkintoneに触れたことの無い 方から、より高度なカスタマイズを行いたいと考 えているプロフェッショナルの方まで幅広い層を 対象に、 楽しく学び・教え合うことで、kintone の魅力や活用法をみんなで共有するための勉強会 コミュニティです。 http://kintonecafe.com/
  63. 63. kintone hive https://kintone.cybozu.com/jp/event/hive2016/05/index.html kintone hiveとは? kintoneの活用のヒントやkintoneへの期待を膨らませる kintoneユーザーのための場です。 4/14 名古屋 4/19 福岡 5/19 東京 6/16 大阪 にて開催!
  64. 64. kintone devCamp http://kintonedevcamp.connpass.com/ kintone devCampとは? kintone devCamp とは kintone界隈のdeveloper同士で 会場に出向き、kintoneに触れあい、共に学んでいく Cybozu主催のdeveloper向け勉強会です。 kintoneカス タマイズ初心者~上級者の方向けにdeveloper network 内のコンテンツを中心としたテーマで開催していきます。
  65. 65. kintone devCamp Vol.11 @Tokyo & @Osaka 2017/3/1(水) 14:00~ サイボウズ東京オフィス27F サイボウズ大阪梅田オフィス & ※現在キャンセル待ち
  66. 66. Thank you

×