インタラクティブなオフィスマップを作成する

過去数年間で、当社の従業員数はほぼ3倍になり、現在では300人に近づいています。 これには多くの組織上の問題が伴います。 特に、会社がビジネスセンターの多くの異なる施設を占有しているという事実により、オフィススペースでの従業員(特に新参者)のオリエンテーションの問題は深刻です。



毎日、「オフィスでVasyaを見つける方法」という問題に直面しています。逆に、「そのコーナーに座っている男の名前は?」という質問に苦しんでいます。 最終的に、2人の愛好家がこれに終止符を打つことにしました。 それで、私たちのオフィスのインタラクティブなマップを開発する物語が始まりました。 今日はこれについてお話します。



カードのアイデアは約1年前に生まれたもので、開発は断続的に行われます。これは主に数時間後に「純粋にファンのために」行われるためです。 ただし、このカードにより、オフィスでの生活がずっと楽になります。 現時点では、このように見えます。







開発者は当初、次のマップ使用シナリオを想定していました。



  1. 同僚の職場を見つける。 検索用の行があり、希望する同僚の名前が「追い込まれ」ます(名前で検索できますが、名前が多すぎるため)、職場の場所が地図に表示されます。
  2. 識別。 部屋で最近働いていて、隣人の名前をまだ学んでいない人は、地図で自分の部屋を見つけ、特定のテーブルをクリックして、その部屋にいる人の名前を見つけることができます。
  3. ナビゲーション オフィスのどこに座っているかを正確に説明するのは簡単なことではありません。 それを容易にするために、あなたの場所-http://portal.yourdomain.ru/map#usernameへのリンクを送信する機能を実現することになっています。 クリックすると、カードが目的のフロアと部屋にスクロールし、目的の職場が表示されます。


現在、3つのシナリオすべてが実装されています。



彼らは当初、Yandex.Maps APIを使用して地図を作成することにしました。 マップに必要なことはすべて、Yandex.Map APIで許可されました。画像をアップロードし、マップで基本的な作業(「ズーム」、移動)を行い、マップ上のオブジェクトで作業を実装します。 コードの変更が頻繁に行われないため、Dropboxはもともとプロジェクトでのコラボレーションの手段として選ばれました。 最初はバージョン管理システムが必要であるように見えましたが、後でそれはもはや必要ありませんでした。 今、開発は一人です。



その結果、カードは企業ポータルに配置されているはずです。



難しさ



しかし、すべては紙の上でのみスムーズに行われ、すでに地図開発の最初の段階で深刻な問題に遭遇しました。 1フロアのみのプランを取得することは可能でした。そのため、マップの最初のバージョンには彼だけがいました。 残りのフロアのスキームは、後で独立して描画する必要がありました。次のバージョンのマップに表示されます。



さらに、開発の開始後、人々が頻繁に場所から場所へ移動することが明らかになり、地図を最新の状態に保つことは容易ではありません。 新しいバージョンのマップでは、従業員の座標を更新するプロセスが容易になります。



開発



最初に、データは手動でマップに適用されました。 最初に、すべての従業員のリスト(計画があったフロアから)を含むExcelファイルが企業ポータルからダウンロードされ、必要なフィールド(従業員の姓、名、役職、電子メールアドレス)を含むCSVに変換されました。 その後、マップ上のテーブルの座標がCSVファイルに追加されました。 このファイルは、ユーザーデータを含むPythonスクリプトを使用してJavaScript配列が形成されるデータベースの役割を果たしました。



カードは静的バージョンで実装されているため、読み取り専用モードでのみ表示できます。 従業員をあちこち移動する可能性は当初考慮されていませんでした。



新しい地図



最初のバージョンがリリースされ、「ウィッシュリスト」の同僚を収集し始めた後、YandexはそのマッピングAPIを大幅に更新しました。 APIバージョン2.0に移行して、新しいバージョンを作成することにしました。







私は彼に対処し、マップの新しいバージョンを作成する必要がありました。 その結果、次の更新が実装されました。



  1. 不足しているフロアが追加されました。必要なフロアのダイアグラムを個別に描画した後、マップに追加しました。
  2. テーブルと従業員の作業を変更し、「従業員」と「テーブル」の概念を分離しました。 以前は、デスクと従業員の関係は厳しいものでした。2人の同僚を入れ替えるには、マップ上のテーブルを物理的に移動する必要がありました。 これで、他の人がテーブルに座っていることを示すだけで十分です。テーブルを移動する必要はありません。
  3. さらに、テーブルを操作するメカニズムが大幅に簡素化されました。静的マップを破棄し、単純なWebアプリケーションを作成しました。 これにより、テーブルの位置とテーブルでの同僚の位置を自動的に保存できました。
  4. 新しいAPIでは、カードの作業はドメインに関連付けられていないため、2つ(またはそれ以上)のドメイン( portal.yourdomain.ru/mapだけでなく、 portal / map )で作業を整理できます。


計画



マップの改善作業は止まらず、多くのアイデアがあります。 以下が最も興味深いものです。



  1. 新しいエンティティを追加します。 オフィスには多くの興味深いものがあります。食堂、コーヒーメーカー、「会議室」、スタンドアップミーティングの場所などです。これらすべてを地図に載せると便利です。
  2. カードをActive DirectoryおよびExchangeと統合すると、多くの便利な機能が提供されます。 Exchangeから従業員に関するデータ(たとえば、彼のスケジュール)をアップロードすると興味深いでしょう。 従業員の時刻表データと会議室の雇用スケジュールを組み合わせて、従業員の職場に関する情報を地図上に表示できます(その場所にいるかどうか、そうでない場合は、どの「交渉」で検索するか。これは特にマネージャーの場合に役立ちます)。


これは、社内の愛好家グループの興味深いサイドプロジェクトが、すべての従業員に役立つサービスに成長する方法です。 ちなみに、このプロジェクトは完全に移植可能でスケーラブルです。これは、新しいオフィスへの移転を見越して当社にとって特に重要です。 マップを新しい場所で開始するには、新しいフロアプランをアップロードし、従業員を再配置するだけです。



コメントでご質問にお答えいたします。 これがHabrasocietyにとって興味深い場合は、次の記事でプロジェクトの技術的な詳細を説明できます。



ちなみに、このカードの作成者と開発者はHabréにいます: MikeOzorninevgekon



All Articles