面倒解決エンジニアの森田ユウゴです。
台湾からお届けする「#kintone100日チャレンジ」の66日目。
CODEXやClaudecodeの使用量がリセットされて、さらには通常の週次リセットも重なり、トークン消費に励んでいる金曜日。
最近はこの使用量に合わせて仕事や予定を立てている気がします。AIに支配されたフリーランスの私です。
本日は、新入社員・中途入社者向けの「用語定義ヒント（略語・用語ツールチッププラグイン）」を開発しました！
「用語定義ヒント（略語・用語ツールチッププラグイン）」について
🎯 なぜ開発したか？（現場の課題とベネフィット）
現場の「不」: どの会社にも「入社して半年は暗号にしか見えない言葉」があります。社内略語、製品の型番、業界用語など、レコードを開くたびに意味を調べたり先輩に聞いたりする手間が発生し、そのまま意味を取り違えて入力ミスにつながるなど、新人にも教える側にも見えないコストが積み上がっています。
導入後の世界（ベネフィット）: 用語辞書を一度登録しておくだけで、レコード詳細・一覧・作成・編集の各画面で登録用語に自動で下線が付きます。マウスを乗せるだけで定義がふわっと表示され、画面を離れずにその場で意味が分かるため、「聞く・調べる・取り違える」がゼロになり、新人のオンボーディング期間そのものを大幅に短縮できます！
✨ これで出来ること（機能概要）
まずはこちらをご覧ください。
登録用語に動で下線とホバーで定義表示: 設定画面で「略語」と「定義」をペアで登録するだけ。各画面の表示テキストから登録用語を見つけ出し、下線を付けてホバーやフォーカスでツールチップを表示します。外部ライブラリは一切使わず素のCSSだけで実装しているため、動作も軽快です。
賢いマッチング: 英数字の略語は単語として独立しているときだけヒットします。別の単語の途中で誤って下線が付くことはありません。複数の類似語を登録した場合は長い語を優先し、日本語や記号を含む用語は部分一致で賢く拾います。
レコードを汚さない・色も自由: 画面表示のテキストを装飾するだけで、レコードの値や更新には一切影響しません。下線の色は自由に変更でき、定義にHTML文字列を入れてもそのまま文字列として表示する安全な設計です。
課題
現時点では下記のような課題が残っています。
kintone標準APIだけでは「表示テキストの一部装飾」ができず、DOM置換に踏み込んだ点
kintoneには「フィールド要素は取得できる」APIはあっても、「表示テキストの中の特定の単語だけに下線を付ける」APIは存在しません。そのため今回は、標準APIから取得したフィールド要素を起点にしつつ、内部のテキストを走査して装飾要素へ置換しています。コーディングガイドラインの「APIで提供されていない箇所のDOM操作・内部DOMへの依存は避ける」という観点からはグレーですが、機能実現のためにやむを得ず一歩踏み込んだ形です。
再描画対策のMutationObserverによる重さ・競合リスク
kintone側の再描画で装飾が消えるのを防ぐため、画面全体を監視して変化があれば再適用する処理を入れています。描画が安定する一方、監視範囲が広いぶん描画頻度の高い画面では負荷になりえたり、別のDOM操作プラグインと競合して見た目が前後する可能性があります。また、現状はPC画面専用でモバイルには非対応という割り切りもしています。
さいごに
#kintone100日チャレンジ として、2026年4月から毎日プラグインをバイブコーディングしています。明日もお楽しみに！
私森田ユウゴはココナラでkintoneに関する各種サービスを出品しております。
SIerの中でもインフラSEとして約10年、特に「運用保守」にはベンダーとして深く携わってきました。
作りっぱなしにしない導入やカスタマイズのご提案が可能です。
お気軽にご相談をくださいませ
→森田ユウゴのプロフィールはこちら👇
