社員ブログ

社内初領域に挑んだプロジェクト・地域公共交通のためのポータルサイト「MOBILITY UPDATE PORTAL」完成までの舞台裏！

Bit Beans
2026.06.03

インタビュー

先日、国土交通省が運営する地域公共交通のためのポータルサイト「MOBILITY UPDATE PORTAL」が本公開になりました。このサイトは、一般財団法人計量計画研究所（以下、IBS）との協働のもとで進められたプロジェクトで、Bit Beansはそのサイト制作を担当しています。

何もない状態から、いかにしてシステムとデザインを作り上げ、そしてチームとして成長を遂げたのか。今回は、そのプロジェクトの主要メンバーによる座談会の様子をお届けします！

＜参加者＞
Mさん：Bit Beans代表　（案件のリーダー）
Gさん：ディレクター　（フェーズ２から参加しプロマネ的存在で案件を加速）
Nさん：システムエンジニア　（スタート時から参加しシステム全体に関わる）
Aさん：システムエンジニア　（スタート時から参加し可視化ツールをメインにシステム全体に関わる）
Iさん：システムエンジニア　（スタート時から参加しスケジュール管理機能などを担当）
Kさん：デザイナー　（受注のきっかけ的な存在で、中核を担い案件を回す）
Yさん：デザイナー　（フェーズ２から参加し可視化ツールのデザインなどを担当）
Sさん：デザイナー　（スーパーヘルプとしてデザイン作りを支える）

始まりは、積み重ねた「信頼」から

── まずは立ち上げ時のストーリーから教えてください。
今回のプロジェクトはどういう経緯で受注に至ったのでしょうか。

Mさん
少し遡りますが、私とデザイナーのKさんで、IBSさんの別のプロジェクトを担当していて。そのIBSのご担当者から「国の事業として公募していたプロジェクトを受託したので、相談できますか？」とお声がけいただいたのがスタートでした。
プロジェクトの制作パートナーとしてBit Beansが参加することになったのが2023年ですね。

Kさん
IBSさんの案件でコンテンツの制作を担当していて4年目ですね。デザインや資料制作、あとは取材で都内のイベントに足を運んだり、年に1～2回は現地へ出向いたりしていました。

Mさん
Kさんの誠実な仕事ぶりを先方が認めてくださって、その積み上げてきた信頼が今回のご依頼に繋がったと思っています。

── それは嬉しいことですね。
とはいえ、これだけの膨大なデータを扱うポータルサイトを作るのは、Bit Beansとしても初めての試みですよね。

Mさん
ここまで大掛かりな規模のものは初めてでしたね。

Kさん
「規模が大きい」とは聞いていたんですが、最初はあまりピンときてなくて（笑）。蓋を開けてみてスケジュールを聞いた時は驚きました。何より「地域公共交通」というテーマ自体が初めてで、すごく幅広い概念を含む言葉ですし、どんなサイト構成にすればいいのか本当に悩みました。

Mさん
そもそも自治体の担当者の皆さんが地域交通計画をやりやすくするための「ガイドライン」を、国土交通省が初めて作っている段階だったんです。観光目的のものは世の中にありますが、ここまで広い概念で整備してリリースする事例は他になかったんじゃないかな。

── どのくらいの時間を要して完成したのでしょうか？

Mさん
まず地域公共交通計画の「アップデートガイダンス」を提供するという目的で、2025年にフェーズ１を公開しました。「国が出しているガイドラインを世の中に発信できるように整えた」という段階ですね。

そこからさらに、地図をベースとした「現状可視化ツール」や「地域公共交通計画を実施するためのスケジュール作成ツール」など、各機能を実装したフェーズ2を公開したのが今年の３月末です。運用フェーズとしては、今３年目に入ったところですね。

ゼロからのスタート。エンジニアが腹をくくった日。

── そもそも何も決まっていない中でのスタート、かつ社内でも前例のない取り組みということで、かなり大変だったのでは。

Aさん
システム面は、CMSの制約もあるし、地図系のシステムも作らねばいけないし、Python（パイソン）が必要だよね、という話になって……最初は外注する案も出ましたね。

Nさん
全体像やどれくらい大変なのかはじめは想像もつかなくて。エンジニア陣も、とにかくやるしかない、頑張ろう！という感じでした（笑）。

Aさん
リモートワークが多いので、よく通話状態にしながら作業してましたよね。

Mさん
フェーズ１の最初の頃って、今ほど生成AIを活用していなかったから、その点でも手間がかかったよね。管理画面を作って、ユーザーのID・パスワードの発行機能も作って……という状況で。エンジニアのみんなには本当に「腹をくくってもらった」という感じです。

参考サイトがない中で作る、デザインUI/UX

── デザインする上ではどうでしたか？

Kさん
国のツールなので、まずデザインを作る前に「デジタル庁のデザインシステム」を全員で確認しました。ただ、デザインを考えようにも参考になるサイトや似たようなサービスサイトが無い状態からのスタートだったので苦労しましたね。IBSさんや国土交通省のご担当者に都度ご提案しながら方向性を決めていったのですが、サイトのご提案だけでも回数を重ねて１ヶ月ほどお時間をいただきました。

Sさん
色一つ決めるのも時間をかけたよね。最初は色の持つ印象を踏まえてグリーン系で提案したけれど「国のデータを扱う」という観点から「誠実さやデータ感を出したい」というご意向をいただいて、最終的に「青」ベースのデザインに落ち着いたんだよね。

Yさん
タイトルのロゴデザインも40パターンくらい作りましたよね（笑）。

Sさん：そうだったね。そもそも、この「MOBILITY UPDATE PORTAL」という名称も社内で考えて提案したんだよね。はじめは漢字が並んだ固い印象の名前だった。

Kさん
それに大前提として「地方自治体のご担当者」という多様なITリテラシーの方々がユーザーである、という点への配慮が必要でした。誰が見ても分かりやすく使いやすいサイトであることはもちろん、ノートパソコンを使う方が多いので、画面のアスペクト比や縦幅に配慮して情報をコンパクトにまとめる、なんて工夫もしましたね。飾りの英語などは極力排除して、標準的なフォントを使い、アニメーションも最低限に抑えて負荷がかからないようにしよう、とか。

ワークフローの変革「コンポーネント化」と「AIプロトタイプ」

── システムエンジニアとデザイナーの連携という点で、これまでのサイト制作とプロセスが違ったところや、工夫した点はありますか？

Iさん
デザイナーチーム側からあがってきたものを見て、すごく考えて練られたデザインだなと思いましたね。あとは、私たちがその「行間」を読み取りながら作っていくわけですが。

Yさん
行間の読み取りありがとうございます（笑）。心地よい動きになっているかといった確認も、オンラインで繋いで、作りかけの段階を見せてもらいながら進めましたね。
あと、パーツの制作フェーズを挟んだことですね。コンポーネント化してデザインを全部パーツに分解し、それを組み合わせて作っていく、いわゆる「デザインシステム」を作るやり方を取り入れました。これまでのBit Beansとしてはあまりやってこなかった、新しい挑戦でしたね。

Gさん
コンポーネント化したことで、管理画面系など、後のフェーズでも共通パーツを使い回せたので、エンジニアとしてはすごく工数の削減になったと思いますね。

Mさん
今回は、一般的なサイト制作だけの場合と作り方が全然違っていて。サイト制作に加えてアプリケーションの開発や組み込みもあるし、さらに利用者がログインして使えるようなシステムも必要だし。世の中のWebサイトにおいて「作らなければいけないもの」がひととおり入った案件だったかもしれない。

各担当者が語る、一番の「壁」

── この案件の長いプロセスの中で、それぞれ「一番苦労した点」を教えてください。

Aさん
「現状可視化ツール」ですね。このツールの特徴は、一般的なWebサイトとは異なり、人口や施設、交通といったGISデータ（地理情報システムデータ）を扱っている点です。私自身も当初はGISデータのフォーマットや扱い方に馴染みがなかったので、まずはそこを学ぶところから始めました。さらに、全国規模のデータを扱っているため、データによってはインポートだけで丸1日かかるものもありました。

一方で、地域によってデータ量や内容にかなり差があるため、取り込んだ後の扱いにも想像以上に苦労しました。その中で、位置情報やエリア形状を効率よく管理し、必要なデータを地図表示に合わせて抽出できるようにするためにPostGISを採用して、安定したデータ運用や性能改善につなげました。地図上の見た目を整えるだけでなく、裏側のデータ整備まで含めて作り込んだことが、特に印象に残っています。

Gさん
地図ツールはWeb系の言語とは違う処理が必要なんですよね。情報をデータベースから引っ張ってくることに加えて、地点などの描画を高速化させる部分が独特で。

── あの地図を何も無いところから作ったと聞いた時は衝撃でした。

Aさん
初めてのチャレンジでしたが、作り上げることができて良かったです。

Iさん
僕は「スケジュール管理機能」を主にフロントエンドで担当したのですが、アプリケーション的な細かいパーツがすごく多くて。ホバー（マウスをのせる動き）したら動きが変わるなど、デザイナーさんがすごく深く考えて設計してくれていたんです。最初は間に合うか不安でしたが、生成AIも活用して複雑なコーディングを効率化し、なんとか間に合わせることができました。

Gさん
私はフェーズ2から加わったのですが、ワイヤーフレームを整理するところが一番きつかったかな。色々決まっていない部分を握っているうちに「いや、これは間に合わないな」と。そんな中で活路を見出したのが、生成AIで各ツールのプロトタイプを作るという進め方でした。5割程度は動く状態にしたものを渡して、参考にしてもらいながら提案することで、関係者間でやりたいことを把握しやすくなったし、クライアント側でも視覚的に分かりやすかったと思います。

Nさん
私はそもそもバックエンドの作業にガッツリ入るのが初めてだったのですが、連携させないといけないことが多かったので、一つ直すと別のところも直す、といった作業が大変でした。

Yさん
私はフェーズ２から加わって「可視化ツール」などを担当したのですが、最初のキャッチアップがとにかく大変でした。機能の意味をしっかり把握しないと使いやすいデザインが作れないので、KさんやGさんに質問しまくったら、何百ページもの資料を共有されて（笑）。膨大な資料をAIで紐解きながら、がんばりました。
あと、Gさんが用意してくれたプロトタイプにはすごく助けられましたね。実際に動く画面を見せてもらえるのは、イメージしやすくてやりやすかったです。

Mさん
そういえば、簡易的なものにしようという話が、いつの間にか機能面も盛りだくさんなデザイン提案になっていたよね。クライアント側も「これ大丈夫ですか？」って心配するくらい。

Yさん
整理していく中で「こうした方がわかりやすいだろうな」と考えながらデザインしていたら、どんどん提案したいことが増えて、つい盛り込んでしまいました（笑）。デザイナーとしてはすごく楽しかったです！

Iさん
最終的には、全部実装したしね！

Kさん
私はデザインを作るだけでなく、メンバーの間に入って整理整頓をしながら色々お願いをしないといけない役割だったのですが、そのために全ページのワイヤーフレームを読み込んで精査して、各デザイナーに共有して、自分の作業もしながらチェックもする……というマルチタスク状態になっていたので、それが大変でした。デザイナー視点だからこそ判断がつくことでもあったので、自分がやるしかないな、と。

そもそも「自治体担当者向けのページを作る」という要件しか決まっていない状況で、ワイヤーフレームをゼロからわかりやすく作るのは途方もない作業でしたね。ワイヤーフレームとは名ばかりで、関係者に見てもらうためには、実質的にページの内容をすべて作り込まなければならないような状況でした。ただ、このデザインチームはすごく優秀で、締め切りをしっかり守ってくれるので救われました。困難なことをやっているのに、滞ることが一切なかったので。

── 規模の割には関わっている人数が少ない印象だったのですが、スケジュール通りに完成できた理由としてそういう働きがあったんですね。

Sさん
私はフェーズ１の立ち上げ期にヘルプ的に入ったので、苦労というよりは楽しく関わらせてもらいました。Kさんがしっかりリードしてくれて、トーン提案のイラスト選びなどの方向性をたくさん出してくれたので、私はそれをクライアントのような視点で「これがいいですね」とピックアップしていく感じで。心強かったです。

Mさん
何も決まっていない状態だけど、解決しなきゃいけないことだけは明確に決まっていて。ゼロから形を作っていく、産みの苦しみが一番大変だったかな。

信頼で結ばれた、クライアントとの関係性

── クライアントとの関係という点ではいかがでしたか？

Mさん
大変なことが多かった中で、救いだったのは、国土交通省のご担当者がこちらの話をしっかり聞いてくださって、ほぼ、こちらの主導で進めさせてくれたことですね。間に入っているIBSさんも、私たちの提案を遮るようなことされず、国土交通省のご担当者と直接ディスカッションして決められる関係性を作ってくれました。とても信用していただけていたのかなと。

Gさん
ご担当者が時間帯や休日問わず、やり取りしてくださって。形式的な発注者・受注者の関係ではなく、一緒に悩んで作ってくれる「ひとつのチーム的な存在」として関わってくれたことを、本当に感謝しています。

プロジェクトを通じて鍛えられた、それぞれの「筋肉」

── 最後に、この大きなプロジェクトを通じて、自分自身が変わったことや気づき、今後挑戦したいことを教えてください。

Aさん
以前からシステム案件をやりたいとずっと言っていたのですが、最初に話を振られた時は「いや、大きすぎるだろ」と（笑）。でも、これだけのプロジェクトをやり切れたことで自信がついたなと思います。最近また新しいシステム案件が来ているので、どんどん挑戦していきたいです！

Nさん
本当にできるのか、終わるギリギリまで不安はあったのですが、終わってみて「本当にやって良かったな」と思ってます。やってみて楽しかったので、また挑戦したいですね。

Iさん
システムの裏側というか、バックエンドへの理解が深まりました。フロントエンドだけでなく、アプリケーション全体がどう動いているかへの興味が湧いて、視野が広がったと思います。大変でしたが、やっていてすごく面白かったので、僕もまたシステム案件をやりたいですね。

Gさん
各メンバーが高い負荷で動いてくれているのはわかっていたので、プロジェクトマネジメントオフィス的な側面をもっと高めて、リスクを事前に潰していかないといけなかったなという反省があります。
ただ、ウォーターフォール（計画通り進める手法）でもアジャイル（柔軟に進める手法）でもなく、その中間をいく臨機応変な開発手法をチームで実践できたのは大きな成長でした。今後はもっとユニークな、世の中にないものを作る案件に挑んでいきたいですね。

Yさん
以前からUI/UXのデザインには興味があったのですが、今回、部分的にではなく初めてイチからサービスデザインに携われたのが楽しかったです。UI/UXデザインは、これからは標準スキルになっていくと思うのですが、「自分に向いているかも」という気づきもありました。メンバーの高いスキルに触れて、もっと勉強したいとも思いました。

Kさん
今回一番感じたのは「デザインとして考えるべき領域は広い」ということです。ペルソナを立てて、カスタマージャーニーを引いて、情報設計から考えてコンポーネントに落とし込む……という、ひとつのサービスが形になっていくプロセス全体を行き来しながら、サービス全体をデザインするというか。デザイナーが考えねばならない要素も多く、デザインが必要とされる幅がこれからもっと広くなるのを実感しました。あと、生成AIをフル活用することで制作効率が格段に上がったことも大きな収穫でした。

Sさん
UI/UXデザインに本格的に関わったのは初めてだったのですが、この経験が会社全体の経験値として活かしていけるといいなと思いました。

全部盛りの天丼を食べ終えて

Mさん
例えるなら「全部盛りの天丼」のような案件だったわけですが（笑）、これをペロリと平らげた今、色々な案件を受ける自信がついたんじゃないかな。メンバー全員が、ひとつ先のことを気にかけながら進行できるようになったと思います。

そしてどんなサイト制作にも必ず存在する「情報設計」というプロセス。今回は、その大切さについてもあらためて深く噛み締めた案件だったなと。デザインも仕組みも、確かな設計があってこそ成り立つという、他のプロジェクトにも派生させられるたくさんの学びが詰まっていました。

今回つけた筋肉を、次のプロジェクトでも活かしていきましょう。
まだ運用は続きますが、まずは本当にお疲れさまでした！

「MOBILITY UPDATE PORTAL by 国土交通省」
　制作実績紹介はこちら
　プレスリリースはこちら（外部サイト）
　実際のサイトはこちら（外部サイト）

「MOBILITY UPDATE PORTAL」の運用は、これからも続きます。

今回のプロジェクトを通じて私たちが得たのは、システムやデザインの知見だけではなく、未知の領域であっても臆せずチームで力を合わせれば形にできるという確かな手応えでした。

これからもBit Beansは、前例のないテーマや難易度の高い課題にも前向きに取り組み、新しい価値を生み出す挑戦を続けていきます。