スプレッドシートの工程表をWeb化して、もっと見やすく・使いやすく
はじめに
こんにちは、小滝建設工業 IT事業部です。
今回は以前紹介した
【DX】スプレッドシートで現場管理を効率化!現場と事務をつなぐツール作成
を、さらに使いやすく、見やすくするために進めている「WEB化」についてご紹介します。
以前作成した工程表・出面表は、Googleスプレッドシート*1を中心に運用していました。
スプレッドシートには、複数人で編集しやすく、現場の変更をすぐに入力できるという大きなメリットがあります。
一方で、実際に使っていく中で「入力するための画面」と「見るための画面」では、求められる使いやすさが少し違うことも分かってきました。
特に、スマートフォンや社内の大型モニターなどで工程を確認する場合には、次のような課題がありました。
- 「セルや項目が多く、自分が確認したい場所を探すのに時間がかかる」
- 「スマートフォンでは文字が小さくなり、拡大しながら確認する必要がある」
- 「入力用の情報も表示されるため、確認だけしたい人には情報量が多い」
- 「社名などが略称で表示されていると、新しく入った社員には分かりにくい」
- 「複数の工程表に情報が分かれているため、全体を確認するには複数のシートを見る必要がある」
そこで今回は、これまで使ってきた「編集しやすいスプレッドシート」はそのまま残し、閲覧専用のWEBページを新たに作成しました。
スプレッドシートをWEBページに置き換えるのではなく、
「入力はスプレッドシート」「確認はWEB」と役割を分けることで、それぞれの良いところを活かす仕組みです。
今回は、現在開発を進めているWEB版の工程表についてご紹介します。
*1:Googleが提供する、複数人でリアルタイムに編集・共有できるクラウド型の表計算ソフト
スマートフォン・PC・大型モニターでも見やすい画面へ
WEB化でまず重視したのが、「どの端末から見ても分かりやすいこと」です。

スプレッドシートは入力や細かな管理には非常に便利ですが、スマートフォンでは横に長い表を何度もスクロールする必要があります。
WEB版では、表示する情報を整理し、工程を確認する人が必要な内容をできるだけ見つけやすい画面にしています。
- スマートフォンから確認:外出先や現場からでも、ブラウザを開いて工程を確認できます。
- PCから確認:事務所では大きな画面を使って、全体の予定を確認できます。
- 大型モニターで表示:社内の共有モニターなどに表示し、当日の予定を複数人で確認することもできます。
- 閲覧に必要な情報を整理:入力用の項目をそのまま表示するのではなく、「見る人」に必要な情報を中心に表示します。
同じ情報でも、入力する画面と確認する画面を分けることで、これまでより素早く予定を確認できるようにすることが目的です。
複数の工程表を自動でひとつにまとめる
今回のWEB化では、単純にスプレッドシートの内容をそのままWEBページに表示しているわけではありません。
社内では複数の工程表を使用しているため、それぞれの工程表から必要な情報を自動で読み取り、WEB表示用のデータとしてまとめています。
イメージとしては、次のような流れです。
各工程表に予定を入力
↓
必要な情報を自動で読み取る
↓
現場・担当者・人数などの情報を整理する
↓
WEBページで見やすく表示する
これまで複数のシートを開いて確認していた情報を、WEB側でまとめて確認できるようにしています。
- 現場情報をまとめて表示:複数の工程表に分かれている予定を、一つの画面から確認できます。
- 担当者や人数を整理:工程表に入力された情報から、WEB表示に必要な内容だけを取り出します。
- 定期的に自動更新:元となる工程表の変更を確認し、新しい情報があればWEB表示用のデータも更新します。
- 入力方法はこれまで通り:社員は使い慣れたスプレッドシートへ入力できるため、入力方法を大きく変更する必要がありません。
裏側ではGAS(Google Apps Script)*2などを利用して、スプレッドシートからWEB表示用のデータを作成しています。
*2:Googleが提供する、スプレッドシートなどのGoogleサービスを自動で操作したり、複数のサービスを連携させたりできる仕組み
社内用と協力会社用で表示する内容を分ける
今回のシステムでは、社内で見る画面だけではなく、協力会社向けの表示も考えています。
社内では全体の工程を確認する必要がありますが、協力会社の場合はすべての情報を見る必要はありません。
そこで、WEB側では利用する人に合わせて表示する情報を分けています。
- 社内向け:複数の現場や会社を含めた全体の工程を確認
- 協力会社向け:その会社に関係する予定を中心に表示
これにより、協力会社の方も自社に必要な予定を確認しやすくなり、社内側でも個別に工程表を作成して渡す手間を減らすことができます。

元のスプレッドシートはそのまま活用
今回のWEB化で大切にしたのは、今までの仕組みをすべて作り直さないことです。
現場や事務所ではすでにスプレッドシートを使った入力方法が定着しています。
そこで、入力方法そのものを新しいシステムへ変更するのではなく、これまでの工程表を「元データ」としてそのまま利用しています。
役割を簡単に分けると、次のようになります。
- スプレッドシート:予定を入力・編集する場所
- WEBページ:入力された予定を見やすく確認する場所
この方法なら、現場側はこれまで通りの方法で入力でき、閲覧する人だけがより見やすいWEB画面を利用できます。
新しいシステムを導入するときに、全員の作業方法を一度に変更してしまうと、かえって使いにくくなることもあります。
そのため今回は、「今ある便利な部分は残し、不便な部分だけを改善する」という考え方で開発しています。
更新処理もできるだけ自動化
WEBページを便利にするためには、元の工程表が変更されたときに、WEB側の情報も更新される必要があります。
今回のシステムでは、一定間隔で工程表の状態を確認し、変更があった場合にはWEB表示用のデータを自動で更新する仕組みを作っています。
また、複数の工程表をまとめて処理しているため、一部のデータで問題が発生した場合でも、できるだけ他の正常なデータまで止めないような仕組みも取り入れています。
例えば、ある協力会社の工程表の読み取りに時間がかかっている場合でも、正常に処理できた他の会社の情報は先に更新できるよう、現在も改善を進めています。
普段WEBページを見る人からは見えない部分ですが、「できるだけ新しい情報を安定して表示すること」も今回の開発で大切にしているポイントです。
「入力しやすさ」と「見やすさ」の両立を目指して
今回WEB化を進めてみて改めて感じたのは、すべてを一つのツールで行う必要はないということです。
スプレッドシートには、
「簡単に編集できる」「複数人で共有できる」
という良さがあります。
一方、WEBページには、
「情報を整理して表示できる」「スマートフォンでも見やすい」「見る人に合わせて画面を変えられる」
という良さがあります。
そこで、どちらか一方に統一するのではなく、それぞれの特徴を活かして組み合わせることにしました。
スプレッドシートで入力
↓
自動でデータをまとめる
↓
WEBで分かりやすく確認
という流れにすることで、これまでの使いやすさを残しながら、情報を見る側の負担を減らすことを目指しています。
まとめ:身近な仕組みを少しずつ使いやすく
「DX」*3と聞くと、大きなシステムを導入したり、すべての業務を一度にデジタル化したりするイメージがあるかもしれません。
しかし私たちは、今まで使ってきたスプレッドシートをすべて捨てて新しいシステムへ移行するのではなく、現在の良いところを残しながら、不便な部分を少しずつ改善していくこともDXの一つだと考えています。
今回のWEB化もその一例です。
現場や事務所ではこれまで通りスプレッドシートへ予定を入力し、その情報を自動で整理して、社内や協力会社の方が見やすい形でWEB表示する。
こうした小さな改善を積み重ねることで、確認にかかる時間や連絡の手間を減らし、本来の業務に使える時間を少しずつ増やしていきたいと考えています。
現在も、より早く・安定して最新の情報を表示できるよう改善を続けています。
IT事業部では、これからもこうした「現場のちょっとした困りごと」を、身近なIT技術を使って解決する取り組みを発信していきます。
「こんな作業もデジタル化できるのでは?」と思ったら、ぜひお気軽にご相談ください!
*3:デジタル技術を活用して、仕事の進め方やサービスなどをより良いものへ変えていく取り組み