【脱・5ステップ】kintoneの「詳細画面を開く手間」をゼロに!現場が泣いて喜ぶ「爆速編集プラグイン」開発記
どうも、拓海です。
kintone使ってて、こんな経験ないですか?
一覧画面でレコードを眺めながら「このステータス、進行中に変えなきゃ」と思った瞬間。やることは1つの値を変えるだけなのに——詳細画面を開いて、編集ボタン押して、値変えて、保存して、また一覧に戻る。気づいたら5ステップですよ、5ステップ。
10件、20件と繰り返してると、気づけば何十分もその「行き来」に消えてる。
「Excelならセルクリックして打ち替えるだけやんけ……」
この地味すぎる不満が、今回のプラグインを作るきっかけになりました。
ちなみに、僕はすでに同じ「一覧画面の編集」という課題に対して2本のプラグインを出品しています。ワンクリックトグルボタンとステータストグルボタンです。今回の「フィールド編集プラグイン」はその3本目。同じテーマで3本作った理由と、それぞれの使い分けについても後半で説明しますね。
AIと一緒に市場調査から始めた
プラグインを作ろうと決めて、まず最初にClaudeに聞いてみました。「kintoneで一覧から編集するJSカスタマイズ、もしくはプラグインは作成できる?」というシンプルな問いかけから、この開発はスタートしました。
Claudeからは3つのアプローチが提示されました。
インライン編集(セル直接編集):Excelに最も近い体験だが、kintoneのDOM構造に依存するため壊れやすい
モーダルポップアップ編集:安定性が高く実用的
一括編集:複数レコードを選択して一括更新
方向性を決める前に「最新情報を取得して、大手プラグインメーカーの販売状況を教えて」とも依頼してみました。
調査結果が面白かった。トヨクモの累計契約数14,000件突破、M-SOLUTIONSの25種類以上のサービス展開、rex0220さんという個人開発者がガントチャートプラグインを55万円で販売している事実——大手がひしめく市場に見えて、個人が勝てるすき間は確実に存在することがわかりました。
Claudeが出した結論はこうでした。
「AI連携 × 製造業特化 × 買い切り低価格」の三角形。これは大手が手を出しにくく、あなたの強みが全部重なる場所です。
さらに「ユーザーが何を望んでいるか」の調査でも重要な発見がありました。kintoneユーザーコミュニティ「キンコミ」では**「Excelのように一覧画面から直接編集できないか」**という声が根強く上がっていて、「現場のみんなも慣れてるエクセル風一覧画面。やはり需要は多いですよね」という生の声も確認できました。
そして決定的だったのが、2026年3月のkintoneアップデート情報。サイボウズがインライン編集のJavaScript APIを積極的に拡充中であることが判明。「一覧編集ニーズに対してkintone自身も動いている」という、これ以上ない追い風でした。
「堅牢なコード」への道のり
市場調査が終わり、いよいよ実装へ。最初に作ったバージョンで、ClaudeにひとつConfirmを取りました。「kintoneのアップデートに強い堅牢なコードになってる?」という確認です。
この一言が、プラグインの品質を大きく変えました。
Claudeの回答は正直なものでした。
「正直に言うと、一部リスクがあります」
問題のコードはこれでした。
// 危険なコード
const row = document.querySelector('tr[data-id="' + recordId + '"]');
kintoneのHTML構造の tr[data-id] という属性に依存したこのコード。一見動くように見えますが、kintoneがアップデートでHTML構造を変えた瞬間に予告なく壊れます。
実際、大手プラグインメーカーTISさんのサポートページにはこんな記録が残っていました。
「kintoneの仕様変更で対象DOM要素のクラス名に変更があり不具合が発生、修正した」
大手でも起きてるんですよ、これ。個人販売のプラグインでこのリスクを抱えるのはマズい。
Claudeが提案した解決策が「カスタムビュー方式」です。
kintone公式が提供する「カスタマイズ形式」の一覧ビューを使えば、一覧のHTMLを自分で構築するため、kintoneのDOM構造に一切依存しません。コードにするとたった1行の条件分岐です。
// これだけでDOM依存ゼロになる
if (event.viewType !== 'custom') return event;
たった1行。でもこの1行が、プラグインの安定性を根本から変えました。データの取得・更新もすべてkintone公式のREST APIとJavaScript APIのみ使用。kintoneがどんなアップデートをしても、この設計なら壊れません。
オプション戦略で収益を最大化する設計
技術的な堅牢性と同時に、販売戦略もClaudeと一緒に練りました。
僕が提案したのは「オプションで稼ぐ」モデル。
最初、Claudeが「編集フィールドを3個まで」という制限案を出してきたんですが、「なぜ3個?」と突っ込んだときの返答がこれでした。
「正直に言うと、なんとなく制限を設けました。これは人工的な制限で、ユーザーに見透かされやすいです」
AIがこういう正直な返しをするの、なかなか好きです😁
フィールド数で制限するのではなく、機能の質で差をつける方向に設計を変えました。
コア(買い切り低価格)
文字列・数値・ドロップダウン・ラジオボタンに対応
編集フィールド数は無制限
オプションA:フィールド拡張パック
日付・時刻・チェックボックス・ユーザー選択フィールドに対応
オプションB:一括更新パック
複数レコードを選択して一括で同じ値に更新
オプションC:権限制御パック
グループ・ステータス条件で編集ボタンの表示を制御
コアで「使える!」を体験してもらい、業務が深まるにつれてオプションが欲しくなる——この流れを設計に織り込みました。
3本のプラグイン、それぞれの役割
「一覧から編集できるプラグインを3本も出して、何が違うの?」ってなりますよね。これ、同じ課題に対する意図的なラインナップです。それぞれ「操作の手軽さ」と「編集の自由度」のバランスが違います。
ワンクリックトグルボタン
チェックボックスフィールドやON/OFF系のフラグを、ボタンひとつで切り替えるプラグインです。
「対応済み」「未対応」の2択を繰り返し切り替えるような場面に最適。モーダルも入力欄もなし。ボタンを押したら即座に値が反転して保存される、究極にシンプルな操作感です。
向いている用途: 対応済み/未対応のフラグ管理、公開/非公開の切り替え、チェック済み/未チェックの管理
操作ステップ:ボタンを1回押すだけ(1ステップ)
ステータストグルボタン
プロセス管理のステータスを、決まった順序で次へ進めるプラグインです。
「未着手 → 進行中 → 完了」のように、ワークフローが一方向に流れる業務に向いています。ワンクリックトグルとの違いは「2択の反転」ではなく「複数ステータスを順送り」できる点。これも1クリックで次のステータスに進みます。
向いている用途: タスク進捗の順送り(未着手→進行中→完了)、審査フローの前進、製造工程の進捗管理
操作ステップ:ボタンを1回押すだけ(1ステップ)
フィールド編集プラグイン(今回)
「変更後の値を自分で指定したい」「複数フィールドをまとめて変えたい」という場面に対応するプラグインです。
上の2本はボタン1つで動く反面、「どの値に変えるか」はあらかじめ決まっています。このプラグインはモーダルを開いて値を自由に入力・選択できるため、更新内容を都度自分で選べます。文字列・数値・ドロップダウン・ラジオボタンと複数のフィールドタイプに対応し、まとめて1回の操作で更新できます。
向いている用途: 担当者を特定の人に変更する、売上金額や数値を書き換える、ステータスを任意の値に変更する(順送りではなく直接指定)、複数フィールドをまとめて更新する
操作ステップ:ボタンクリック → モーダルで値を選択/入力 → 保存(3ステップ)
3本の使い分けまとめ
プラグイン 操作 向いている場面 ワンクリックトグルボタン 1クリック 2択フラグの反転(ON/OFF) ステータストグルボタン 1クリック 決まった順序でステータスを前進 フィールド編集プラグイン(今回) 3ステップ 値を自由に指定・複数フィールドを同時更新
操作の手軽さだけなら上の2本に軍配が上がります。一方、「どんな値に変えるか」を毎回選べる自由度は、フィールド編集プラグインだけが持つ強みです。
業務によっては3本を組み合わせるのが一番効果的です。「ステータスは順送りボタンで進め、担当者の変更は編集プラグインで行う」みたいな使い方もできます。1つのアプリに複数のプラグインを共存させることも可能です。
プラグインの機能詳細
一覧画面での動作
カスタマイズ形式の一覧ビューに切り替えると、設定したフィールドがテーブル形式で表示されます。各行の右端に「編集」ボタン(ラベルは自由に変更可能)が現れます。
モーダルでの編集
編集ボタンをクリックするとモーダルが開きます。表示されるのは設定したフィールドだけ。現在の値があらかじめ入力された状態で表示されるので、変更したい箇所だけ直して「保存」を押すだけです。保存後は自動でリロードされ、変更が即座に一覧に反映されます。
細かいこだわり
ESCキーで閉じる:キーボード操作派のために
背景クリックで閉じる:直感的な操作感
保存中の二重送信防止:連打しても安全
エラー時のメッセージ:何が起きたか分かりやすく表示
設定画面の柔軟性
編集可能にするフィールドは設定画面から自由に追加・削除できます。フィールドを選ぶだけで、モーダルでの表示名も自由に設定可能。「field_code」のような内部コードではなく「担当者」「ステータス」といった分かりやすい名前で表示できます。特定のカスタムビューだけに限定する「ビューID指定」機能も入れています。
対応フィールドタイプ(v1.0)
フィールドタイプ モーダルでの入力UI 文字列(1行) テキスト入力欄 数値 数値入力欄 ドロップダウン セレクトボックス(選択肢を自動取得) ラジオボタン セレクトボックス(選択肢を自動取得)
ドロップダウンとラジオボタンは、kintoneのフィールド設定から選択肢を自動で取得します。手動で選択肢を設定する手間はありません。
このプラグインが「優れている」3つの理由
1. kintoneアップデートで壊れない設計
これが一番の強みです。多くのkintoneカスタマイズやプラグインはkintoneのHTML構造(DOM)に依存した実装になっていて、アップデートのたびに壊れるリスクを抱えています。このプラグインはカスタムビュー方式でDOM依存をゼロにしました。サイボウズが公式にサポートするインターフェースのみを使っているので、kintoneがアップデートしても動き続けます。
2. 「触りたいフィールドだけ」を表示するシンプルさ
フル機能の編集画面を開く必要はありません。設定したフィールドだけがモーダルに表示されます。ステータスと担当者だけを変えたいなら、その2つだけ。余計な情報がないから操作ミスも起きにくい。シンプルさが使いやすさに直結しています。
3. 標準一覧ビューへの影響ゼロ
カスタマイズ形式のビューでのみ動作するので、標準の表形式一覧は完全にそのままです。既存の運用を崩さずに、新しいビューとして追加できます。
実際の業務シーン
案件管理 営業担当が毎朝、前日の商談結果をステータス更新する作業。1件ずつ詳細画面を行き来していたのが、一覧から次々とモーダルで更新できるようになります。ステータスが順送りでよい場面はステータストグルボタンと組み合わせるとさらに効率的です。
タスク管理 進捗確認MTGで、リーダーが画面共有しながらリアルタイムにステータス更新する場面。担当者変更が発生するケースでは、このプラグインが役立ちます。
在庫・数値管理 数値フィールドをその場で書き換えられるので、棚卸しや在庫調整の入力作業がスムーズになります。数値の自由入力はトグル系プラグインには対応できない、フィールド編集プラグインならではの用途です。
おわりに
「一覧から直接編集したい」という要望は、kintoneユーザーの間で長年語られてきた根強いニーズです。
僕はこの課題に対して3本のプラグインで応えています。ワンクリックで即反転するトグルボタン、順番にステータスを進めるステータストグル、そして今回の「値を自由に指定できるフィールド編集プラグイン」。操作の手軽さと編集の自由度、それぞれの場面に合ったツールを使い分けてもらえたら嬉しいです。
大手プラグインメーカーが提供するグリッドエディター型(Excel風)の製品もありますが、高価格かつ機能が重い。「ステータスだけ変えたい」「担当者だけ変えたい」というシンプルなニーズには、シンプルなツールで十分なはず。軽量・低価格・壊れにくい——kintoneをもっと使いやすくしたい現場の方に、ぜひ試してみてください。
CoconalaにてJSカスタマイズ・プラグインの出品もしています。業務に合わせたカスタマイズのご相談もお気軽にどうぞ。
それでは、また!
