ついにここまで来た！Smart at AIでkintoneにオリジナルダッシュボードを作成する方法

最新のAI技術を活用することで、これまで専門知識が必要だったkintoneのカスタマイズが簡単にできるようになりました。今回は、業務アプリプラットフォームのkintoneとAIツールのSmart at AIを使って、コーディング不要でオリジナルダッシュボードを作成する方法をご紹介します。データの可視化がこれほど簡単になるとは、まさに「ついにここまで来た！」と言える革新的な手法です。ぜひご覧ください。

kintoneとは

kintoneはサイボウズ株式会社が提供するクラウド型の業務アプリプラットフォームです。プログラミングの知識がなくても、ドラッグ&ドロップの簡単な操作でビジネスアプリを作成できるのが特徴です。顧客管理、プロジェクト管理、経費精算など、業務に必要なアプリケーションを自社の業務フローに合わせてカスタマイズできます。また、APIやプラグインを使うことで外部サービスとの連携も可能で、業務効率化を実現するプラットフォームとして多くの企業に導入されています。

Smart at AIとは？

Smart at AI for kintone Powered by GPT（以下、Smart at AI）は、M-SOLUTIONS株式会社が提供するkintone連携サービスです。kintone内でChatGPTなどの生成AIを簡単かつ安全に利用でき、ノーコードでAIを活用した業務自動化を実現します。プラグイン設定のみで使え、フィールド値を利用したプロンプト作成が容易です。APIを使うため、生成AIがデータを学習せず、安全面も確保されています。

モデルの進化でオリジナル画面を実現

kintoneにはグラフやスペース機能があり、集計データをある程度視覚化できます。しかし、さらなるカスタマイズにはJavaScriptやHTMLの知識が必要でした。最新のAIモデルの登場により、Smart at AIを使えばプロンプトを設定するだけで、オリジナルダッシュボードを簡単に作成できるようになりました。

特にClaude Sonnet 3.7はコード生成に優れており、オリジナルの画面を作成するためのコードも作成できます。また、データ分析を得意とする推論モデルのo1やo3-miniと組み合わせることで、分析からビジュアル化までを一貫して自動化できるようになりました。

作成できる画面

Smart at AIを利用すると次のような画面を作成できます。

営業ダッシュボード

営業が利用するダッシュボードを作成できるようになります。売上や見込み確度、提案商品の状況などの集計データをわかりやすく確認できます。

作成方法

営業ダッシュボードの生成の仕組みは次の画像のとおりです。

①案件管理アプリに一覧を作成
集計したい案件情報を管理しているアプリにAIで分析してもらうための一覧を作成します。

②ダッシュボードアプリの作成

次にダッシュボードを表示するためのアプリを作成します。フィールドは最低3つあればOKです。

• 分析情報入力：文字列複数行フィールド
• プロンプト出力：文字列複数行フィールド
• HTML出力：スペースフィールド

ダッシュボードアプリにSmart at AIを設定します。

1つ目は案件管理アプリの一覧データを分析するプロンプトです。分析には、論理的思考が得意なo1やo3-miniを利用します。

2つ目は、o1モデルで集計した情報をもとにダッシュボードを作成するプロンプトです。コーディングが得意なClaude Sonet3.7を利用します。

以上の設定を行い、分析→ダッシュボード生成のプロンプトを動かせば営業ダッシュボードが完成します。

組織図

kintoneで管理している社員名簿アプリの情報を元にSmart at AIを使うことで組織図を作成が可能です。見やすいデザインの組織図を作成可能です。PDFなどで別途作っている企業では作成作業が不要になったり、リアルタイムの更新が可能になります。

作成方法

①社員名簿アプリに一覧を作成

社員名簿アプリにAIで分析してもらうための一覧を作成します。

②組織図アプリの作成

次に組織図を表示するためのアプリを作成します。準備するフィールドは営業ダッシュボードアプリと同じですので、同じアプリを使っても問題はありません。

• 分析情報入力：文字列複数行フィールド
• プロンプト出力：文字列複数行フィールド
• HTML出力：スペースフィールド

組織図アプリにSmart at AIを設定します。設定は社員名簿の一覧情報をSmart at AIのRAG機能で取得して、それをClaude Sonet3.7のモデルによって生成をします。

設定を行い、アプリの画面で生成ボタンをクリックすれば社員情報が組織図として表示されます。

ドキュメントビュー

kintoneのレコード詳細の情報をドキュメント（書類）形式の見たにすることが可能です。kintoneのレコード情報を整理された情報で見たい場合は便利です。例えば、見積書や注文書の形式にデータを加工して表示が可能です。

作成方法

①ドキュメント形式にしたいアプリにスペースフィールドを設定

HTML形式で表示するためドキュメント形式にしたいアプリにスペースフィールドを設定します。

②Smart at AIを設定する

Smart at AIを設定し、レコードの情報をドキュメントビューにする設定を行います。

以上の通り設定が可能です。

まとめ

AIモデルの進化により、精度が高いHTML/CSSのコード生成が可能になりました。その結果、Smart at AIとの組み合わせで、業務で使える幅が広まってきました。今回は営業ダッシュボード、組織図、ドキュメントビューを紹介しましたが、それ以外の画面も工夫次第で作成ができると思います。

ぜひ、色々と試してみていただければと思います。Smart at AIは無料で利用することも可能ですので、ぜひお気軽に申し込んでみてください。

Smart at | kintoneの機能拡張､システム開発､iPad受付システム

kintone×AIはどのプランが最適？Smart at AIのプランを比較解説