gusuku Customineを使ったkintoneアプリのカスタマイズは、とても簡単です。思いついたことを試し、駄目だったらやり直し、何度でも試行錯誤することが出来ます。ここでは、カスタマインでのkintoneアプリのカスタマイズについての基本的な事柄をご説明します。


カスタマイズの手順

kintoneアプリのカスタマイズは、次のような手順で行います。

  1. まずkintoneアプリをだいたい完成させておく

  2. カスタマインでカスタマイズ、kintoneアプリに登録

  3. kintoneアプリで動作を試す


まずは、あらかじめkintoneアプリを程々の完成度で構いませんので、完成させておきます。必要になりそうなフィールドを配置し、フィールドコードは分かりやすいフィールドコードを付けておきます(可能であれば、フィールド名と同じフィールドコードをつけておくのがおすすめです)。


次に、カスタマインでそのアプリ向けにカスタマイズを作ってみます。少し設定したらkintoneアプリに登録してみましょう。


そしてkintoneアプリをリロードして、カスタマイズの動作を確認します。

思ったように動きましたか? 思ったように動かなかった場合や、もう少し機能を追加したい場合は、2. に戻って繰り返します。


必要があれば、1. に戻ってkintoneアプリに変更を加えることもあるでしょう。カスタマインでのカスタマイズは小さい変更を繰り返し、動かしながら確認していくのがコツで、このような流れで、カスタマイズを行っていきます。


アプリの準備

それでは、実際のカスタマイズの例を順を追ってご説明します。


今回の記事でカスタマイズするアプリは、kintoneアプリストアから「案件管理」を選びます。

案件管理 - kintone(キントーン)- すぐに使えるサンプルアプリ | サイボウズの業務改善プラットフォーム 


また、アプリを追加する際には「サンプルデータを含める」にチェックを入れて、ご自分のkintone環境にアプリを追加してください。


具体的なカスタマイズ

こちらの案件管理アプリには、案件の確度をA/B/Cで入力する機能があります。


今回は、この確度がAの案件を一覧画面で目立たせる、というカスタマイズをしてみましょう。


なお、公式サイトのデモ動画では、27秒目付近から、同じカスタマイズを実施していますので参考にしてください。


また、サインアップがまだの方はこちらを参考にサインアップし、ご利用中のkintoneとの接続設定を済ませておいてください。

【gusuku Customine】新規ユーザーのフリープラン サインアップ方法


新しくカスタマイズを始める

カスタマインにサインインした直後は、ドライブ画面が表示されます。

「新規のカスタマイズを作成」をクリックしてください。


すると、新規のカスタマイズをどの形式で作るかの選択がありますので、今回は「kintoneアプリのカスタマイズ」を選択します。


kintoneアプリのカスタマイズを選ぶと次のような画面が表示されますので、「登録アプリを追加」をクリックします。


すると次のような画面になりますので、先ほど追加した「案件管理」のアプリを「選択したアプリを登録」し、


追加したアプリを選択してください。

※この時、kintoneのアプリIDを上部の「キーワードで検索」欄に入力すると選択しやすいです


カスタマイズするアプリを選択すると、このような初期画面になります。メイン画面の詳しい見かた・使い方については次の記事も併せてご確認ください。
メイン画面の見かた

カスタマインの考え方

カスタマインでは「やること」と「条件」の組み合わせで、カスタマイズを実現していきます。

また、この「やること」と「条件」のセットを「アクション」と呼び、アクション同士の組み合わせを工夫していくことで、複雑なカスタマイズも簡単に構築することが出来るようになります。


各カスタマイズとkintoneアプリの関係は、以下のようになります。


「やること」を追加

アクション番号の1番の「やることを追加してください」という箇所をクリックして、やること一覧を開きます。カスタマインでは、設定すべきところは赤い文字で表示されていますので、そこをクリックしていきます。

「やること」はカテゴリーで分かれています。色々ありますがここでは、「その他のUI」カテゴリーを選択し、「フィールド背景色を変更する」を選択します。

右上の「キーワードで検索」に適当なキーワードを入れてEnterキーで確定すると、キーワード検索も可能ですのでお試しください。


選択すると、このような画面になります。条件には、自動的に「一覧画面を表示した時」が設定されています。多くの「やること」では、標準的な条件が自動的に設定されます。これは変更することも出来ますし、更に条件を加えることも出来ます。

ここでは条件については後で設定することにして、続いて背景色を変更したいフィールドと、色を選択してください。


まずは、やること「フィールド背景色を変更する」のパラメーター「フィールド」をクリックします。すると次のようなフィールド選択ダイアログが表示されます。

ダイアログではフィールドを複数選択できますので、一覧に表示されているフィールドの中からいくつか選択してください(この例では会社名、確度を選択しました)。


また同様に、やること「フィールド背景色を変更する」のパラメーター「色」をクリックします。すると次のような色の選択ダイアログが表示されます(この例では色のプリセットにある緑色を選択しました)。


色まで設定すると、次のような表示になります。


この状態で、kintoneに登録していただいても構いません!

結果がどうなるのか、是非試してみてください。


今回は更に「条件」を追加して、やりたかった「確度がAの案件を一覧画面で目立たせる」を実現します。

「条件を追加」をクリックして、「フィールド値が特定の値ならば」という追加条件を選択します。


すると、アクションはこのように表示されます。追加条件で設定された条件「フィールド値が特定の値ならば」のパラメータ「フィールド」には「確度」フィールドを、「条件」には「等しい」を、比較値には「A」をそれぞれ設定してください。


すると、最終的なアクションとその「やること」「条件」の設定はこのようになります。


また、この条件を削除するには右側の「X」で削除することが可能です。
その下の緑色の反転ボタン(矢印が回転しているボタン)は、この条件を反対にした条件を作りたい時にクリックします。クリックすると条件が変わるので、試してみてください。


これで一通りのカスタマイズは完成です。黄色の「kintoneアプリへ登録」をクリックしてください。
カスタマイズを変更してから、まだkintoneに登録していない場合には、「kintoneアプリへ登録」の右上に赤い丸が表示されていますので、これが表示されているときには忘れずに登録するようにしてください。


では、kintoneアプリに戻ってカスタマイズの動きを見てみましょう。登録ボタンの左にあるリンクアイコンが、カスタマイズしているkintoneアプリにリンクしており、クリックするとカスタマイズを行っているアプリを表示することができます。


実際にアプリを表示すると、案件一覧の確度Aのレコードが、一覧画面でしっかり目立って表示されている事がわかります!


おわりに

この記事では、はじめてのカスタマインでのkintoneアプリのカスタマイズについてご紹介しました。


カスタマインを使って、プログラミング無しで、kintoneのカスタマイズを実現するイメージを掴んで頂けましたでしょうか?


繰り返しとなりますが、カスタマインを用いたカスタマイズでは、小さい変更を繰り返し、動かしながら確認していくのがコツになります。


「条件」を変えてみたり、別の「やること」を追加したり、といった形で色々なカスタマイズをぜひお試しください。


また、もう少し噛み砕いた概要を知りたいという場合には、「初めての方へ:カスタマイズの考え方のヒント・ガイド」や、「カスタマインの歩き方」がありますので、これらの記事も併せてご確認ください!


ご不明な点がございましたら、チャットでお問い合わせください。

ドキュメントサポートページも、ぜひご活用ください!