Successfully reported this slideshow.
Your SlideShare is downloading. ×

kintone 未解決超鉄板ニーズに準最適解を与える! - kintone hack 2022 予選

Ad
Ad
Ad
Ad
Ad
Ad
Ad
Ad
Ad
Ad
Ad

Check these out next

1 of 36 Ad

More Related Content

More from Ryu Yamashita (20)

Recently uploaded (20)

Advertisement

kintone 未解決超鉄板ニーズに準最適解を与える! - kintone hack 2022 予選

  1. 1. kintone 未解決超鉄板ニーズに 準最適解を与える! Ryu Yamashita Kintone Corporation ありそうでなかった アイディアで kintone hack 2022 予選
  2. 2. Ryu Yamashita (Yamaroo) 80 年代ロックスター風 40 歳 男性 元ジョイゾーの人 ※ 1 回目の kintone 転職先 好きな kintone の機能 • JavaScript カスタマイズ • テーブル Kintone Corp. サンフランシスコ勤務 kintone hack 2018 チャンプ ※ 2020 予選敗退w
  3. 3. 太陽光IoT (2013.4) 承認・通知 (2015.10) 電源スイッチ (2015.11) 顔認証チェックイン (2018.8) チャット/音声UI (2014.12/2016.11) IoTメガネ (2016.6)
  4. 4. 太陽光IoT (2013.4) 承認・通知 (2015.10) 電源スイッチ (2015.11) 顔認証チェックイン (2018.8) チャット/音声UI (2014.12/2016.11) IoTメガネ (2016.6) ドローン + エッジコンピューティングAI (2018.11) 先進トレンドとの組合せで kintone の未来の活用を見せる
  5. 5. ほぼ全てと言っていい 他サービス連携なし、 ありそうでなかったアイディアで実現する! 多くのユーザーが欲し続けてきた鉄板ニーズを
  6. 6. ほぼ全てと言っていい 他サービス連携なし、 ありそうでなかったアイディアで実現する! しっくりくる解が長年見出されてない・・・ kintone 最大の強みのひとつ JavaScript カスタマイズのみで実現! 難問! 多くのユーザーが欲し続けてきた鉄板ニーズを
  7. 7. ほぼ全てと言っていい 他サービス連携なし、 ありそうでなかったアイディアで実現する! しっくりくる解が長年見出されてない・・・ Kintone 最大の強みのひとつ JavaScript カスタマイズのみで実現! 難しい! 多くのユーザーが欲し続けてきた鉄板ニーズを うぉー、きたキタ北!やっと来た!! これは今すぐ使いたい!! もっと詳しいこと聞きたい!! なるほど、真似してみよw
  8. 8. 部分一致検索 今回のテーマ Cy Cybozu Cybozu Kintone Cybozu Groupware Cybozu Teamwork Cybozu Days 2022 キーワード入力に追従して 都度候補表示する
  9. 9. クイックデモ
  10. 10. ※公開スライド用にデモ内容の説明 モバイル対応をさりげなくアピール ① この Jeffy さんを探し当てるてい ② 愛称 Jeff っぽいので、”jeff” で検索する ③ 部分一致したレコードが表示される マッチングに寄与したフィールドと マッチング部分を表示 他サービス連携なしなので、 通信も発生していない
  11. 11. 仕組みの解説 従来手法のおさらいから
  12. 12. 従来の kintone 検索カスタマイズ #1 ①検索フレーズ を入力 ③検索結果のレコードあるいは一覧を返却 ④検索結果を(一覧)表示 ②検索フレーズを含むクエリを送信 Cy 検索
  13. 13. 従来の kintone 検索カスタマイズ手法 #1 ①検索フレーズ を入力 ③検索結果のレコードあるいは一覧を返却 ④検索結果を(一覧)表示 ②検索フレーズを含むクエリを送信 Cy Cybozu Cybozu Kintone Cybozu Groupware Cybozu Teamwork Cybozu Days 2022 シンプルで実現性が高い kintone の検索にヒットさせる工夫が必要 kintone
  14. 14. 従来の kintone 検索カスタマイズ手法 #2 ④検索結果を表示 ①検索フレーズ を入力 ②検索フレーズと 検索条件を送信 ③条件合致した索引を返却 (インデックス) Cy Cybozu Cybozu Kintone Cybozu Groupware Cybozu Teamwork Cybozu Days 2022 検索サービス ユーザー インターフェース
  15. 15. 従来の kintone 検索カスタマイズ手法 #2 ④検索結果を(一覧)表示 ①検索フレーズ を入力 ②検索フレーズと 検索条件を送信 ③条件合致した索引を返却 (インデックス) Cy Cybozu Cybozu Kintone Cybozu Groupware Cybozu Teamwork Cybozu Days 2022 検索サービス ユーザー インターフェース 代表的な検索サービス
  16. 16. 従来の kintone 検索カスタマイズ手法 #2 ④検索結果を(一覧)表示 ①検索フレーズ を入力 ②検索フレーズと 検索条件を送信 ③条件合致した索引を返却返却 (インデックス) Cy Cybozu Cybozu Kintone Cybozu Groupware Cybozu Teamwork Cybozu Days 2022 検索サービス ユーザー インターフェース オートコンプリートを含め、高速で自由度が高い検索機能 を独自に構築できる kintone の負担がない 従量課金の他サービスの利用が必要になる
  17. 17. 検索サービス IndexedDB ユーザー インターフェース 検索に必要な要素を kintone 検索カスタマイズ
  18. 18. ④検索結果を表示 ①検索フレーズ を入力 IndexedDB ②検索フレーズを ③条件合致した レコードを返却 Cy Cybozu Cybozu Kintone Cybozu Groupware Cybozu Teamwork Cybozu Days 2022 kintone 検索カスタマイズ
  19. 19. ④検索結果を表示 ①検索フレーズ を入力 IndexedDB ②検索フレーズを 全データと照合 ③条件合致した レコードを返却 Cy Cybozu Cybozu Kintone Cybozu Groupware Cybozu Teamwork Cybozu Days 2022 s 1 万レコードに対する検索所要時間が 500 ミリ秒程度 低速通信環境(オフライン含む)でも検索速度が落ちない 他サービスなしで、kintone への負担もない データの集中管理が難しい アクセス権変更前のデータがデバイスに残る期間が生じる kintone 検索カスタマイズ
  20. 20. kintone 検索カスタマイズの性能検証 25 50120 200 450 900 1,200 2,500 5,300 0 1,000 2,000 3,000 4,000 5,000 6,000 0 10,000 20,000 30,000 40,000 50,000 60,000 70,000 80,000 90,000 100,000 500 1,000 3,000 5,000 10,000 20,000 30,000 50,000 100,000 インデックスデータサイズ [MB] 0.7 0.8 1.3 1.8 2.3 3.6 4.6 9 27 [ms] 25 50 120 200 450 900 1,200 2,500 5,300 検索レコード数 57 109 343 514 974 1,782 2,384 4,381 8,762 [ms] *インデックス対象、検索対象フィールドは 3 フィールド 2 万レコードで 1 秒未満(悪くない) 無限スクロールの 併用で緩和できる
  21. 21. IndexedDB とは • ブラウザ内にデータを永続的に保存するための方法 • 各ドメイン単位アクセス (同一オリジンポリシー、別のドメインからのアクセス不可) • オフラインでも動作 • Key-Value 形式 • トランザクション対応 ※よく見ると多くのサービスで自然に使われているので、知らぬ間に使わされてます
  22. 22. IndexedDB を利用している代表的サービス (メッセージング) (タスク管理) (ソースコード管理)
  23. 23. 現在実装済み機能 前方一致 後方一致 マッチング条件 部分一致 OR フィールド内 AND レコード内 AND レコード内 OR 複数フレーズ検索 緩い 厳しい AND AND フィールド設定 インデックス対象 検索対象 検索優先順位 タイトル (切替選択) (切替選択)
  24. 24. デモンストレーション
  25. 25. ※公開スライド用にデモ内容の説明 IndexedDB のデータ更新・削除機能 レコード内 OR での検索 検索に寄与したカウント デモ映えのためにデバッグ用のスピードメーターを残置
  26. 26. ほぼ全てと言っていい 他サービス連携なし、 ありそうでなかったアイディアで実現する! しっくりくる解が長年見出されてない・・・ Kintone 最大の強みのひとつ JavaScript カスタマイズのみで実現! 難しい! 多くのユーザーが欲し続けてきた鉄板ニーズを 欲しかった部分一致検索 カスタマイズ、これですよね?
  27. 27. セキュリティに関する考察 ※本トピックに限らず、サービス導入時には所属組織のセキュリティポリシーと 照らし合わせながら、リスク・対策を想定・検討して導入を進めましょう!
  28. 28. セキュリティに関する考察の前提 PC の の 隠しフォルダに の 一部として保存される Ryu Ryu IndexedDB のデータ保存場所 前提 IndexedDB のデータ取得 同一オリジンからの JavaScript による操作 /Users/yamaroo/Library/Application Support/Google/Chrome/Default/IndexedDB (Mac/Chrome の場合)
  29. 29. リスク想定と対策検討のステップ 1. 利用可能にする人の限定方法を考える! 2. 保存情報を他の意図しない人が閲覧出来てしまう可能性を潰す! 3. 保存情報を閲覧・取得されたことを想定した対策を考えておく!
  30. 30. 利用可能にする人の限定方法を考える! kintone の閲覧権限と同レベルの情報が PC のユーザーフォルダ内に保存される CSV を 利用可能にするのが妥当そう CSV Ryu Ryu CSV ファイルがダウンロード 保存された状態と等価
  31. 31. 保存情報を他の意図しない人が閲覧出来てしまう可能性を潰す! CSV Ryu Ryu Tora Tora 他の PC アカウントがあるケース 共用箇所に コピー CSV Ryu Ryu Guest(共用アカウント) Tora PC 共用アカウントを使うケース
  32. 32. 保存情報を閲覧・取得されたことを想定した対策を考えておく! Tora • IndexedDB のパスワード設定 • データ暗号化 $id Name 1 %E9%9D%92%E9%87%8E 2 %E6%85%B6%E4%B9%85 3 %E8%AA%A0 パスワードやキーはデータと分離して 保存可能だが、同レベルの保存方法のため 取得される可能性があり、万全ではない パスワード設定やデータ暗号化自体が 抑止力にはなるので、ないよりマシ? (アイディア) ※ kintone の CSV 書き出しも暗号化対応等はないので今回は実装見送り
  33. 33. まとめ • IndexedDB を用いる アイディアの カスタマイズを紹介 • デバイスオフロードによるkintone に負担ない自由度の高いカスタマイズ • ユーザー単位の個別最適化が容易 • モバイルやテーブルにもキッチリ対応済み • もっとワクワクしてもらいたいので、本戦にはもう一味加えますw 所感 • 検索カスタマイズは用途に応じた個別最適なカスタマイズ アプローチが良さそう • IndexedDB は検索以外でもオフラインアプリへの利用等 kintone の活用の幅を広げてくれる可能性がある
  34. 34. ほぼ全てと言っていい 他サービス連携なし、 ありそうでなかったアイディアで実現する! しっくりくる解が長年見出されてない・・・ Kintone 最大の強みのひとつ JavaScript カスタマイズのみで実現! 難しい! 多くのユーザーが欲し続けてきた鉄板ニーズを みなさん楽しんで頂けましたか?
  35. 35. 快適で楽しい kintone 活用を!
  36. 36. ご清聴 ありがとうございました!

×