視覚的な進捗管理を実現！kintoneの標準機能でProgressBarを作成する方法
こんにちは！Kentarouです！
2021/11/09 に「kintoneでProgressBarを表示させてみました！」という投稿をしたところ、「作成方法を知りたい！」というお声を頂いたので、作成方法やデザインアイデアをまとめてみました！
ProgressBarを使って進捗状況を可視化
ProgressBarとは？
Progress Bar（プログレスバー）とは、タスクの進捗状況を、視覚的・直感的にどの程度完了しているかを示すものです。
ProgressBarを表示させてみた
確度の数値に対応したProgressBarを表示させてみました。ProgressBarを表示させることで、確度という数値データを視覚的・直感的に確認できます。
作成方法
1. [数値]フィールドと[文字列(1行)]フィールドをフォームに追加
[数値]フィールド（確度）と[文字列(1行)]フィールド（確度_Progress Bar）をフォームにドラッグアンドドロップします。
2. [数値]フィールドを設定
[数値]フィールドを下記画像のように設定します。
3. [文字列(1行)]フィールドを設定
[文字列(1行)]フィールドを下記画像のように設定します。
自動計算の計算式には、下記内容を入力します。
IF(確度=100,"░░░░░░░░░░",IF(AND(確度<100,確度>=90),"░░░░░░░░░▒",IF(AND(確度<90,確度>=80),"░░░░░░░░▒▒",IF(AND(確度<80,確度>=70),"░░░░░░░▒▒▒",IF(AND(確度<70,確度>=60),"░░░░░░▒▒▒▒",IF(AND(確度<60,確度>=50),"░░░░░▒▒▒▒▒",IF(AND(確度<50,確度>=40),"░░░░▒▒▒▒▒▒",IF(AND(確度<40,確度>=30),"░░░▒▒▒▒▒▒▒",IF(AND(確度<30,確度>=20),"░░▒▒▒▒▒▒▒▒",IF(AND(確度<20,確度>=10),"░▒▒▒▒▒▒▒▒▒","▒▒▒▒▒▒▒▒▒▒"))))))))))4. 完成！！
あとは、[アプリ更新]を押せば完成です。
自分好みのProgressBarを作ってみよう！
計算式の条件や使用する文字（絵文字）を変えれば、自分好みのProgressBarを作ることができます。この記事では、デザイン例を4つご紹介します。
1. シンプル ①
白黒の四角を使ったシンプルなデザイン。
使用する文字: ░▒
2. シンプル ②
白黒の星とハートを使ったシンプルなデザイン。
使用する文字: ☆★♥
3. カラフル
色のついた四角を使ったカラフルなデザイン。
使用する文字: ⬜🟥🟧🟨🟩🟦
4. エモい
なかじ@業務改善職 さんが紹介していたエモいProgressBar。どこか懐かしい感じがあって可愛く、計算式もシンプルでわかりやすいデザインです。
参考投稿:
なかじ@業務改善職さんの投稿（2021/11/11）
最後に
ProgressBar（プログレスバー）を表示させることで、タスクの進捗状況などを視覚的に可視化することができます。計算式の条件や使う文字（絵文字）を変えて、自分好みのProgressBarを作ってみてください。
株式会社Crena（クレナ）では、中小企業様を中心に、低コスト&短納期でのkintone導入構築を支援しております。業務の洗い出しから課題の抽出、最適な業務フローの構築までサポートいたしますので、まずはお気軽にご相談ください。
- お問い合わせ:お問い合わせ・ご相談はこちら
- TEL: 043-388-8819
- 設立: 2020年8月
- 代表取締役: 平野 賢太郎（Hirano Kentaro）
- 会社URL: https://crena-plugin.com/
