位置情報特定機能のリリースを終えて
こんにちは。セーフィー株式会社(以下「セーフィー」)でWebディレクターをしている大貫です。
私の簡単な経歴として、民放キー局のニュースサイトや番組サイト、総合ポータルサイトなど主にC向けのサイトなどを担当し、サイト制作やCMSの開発・運用ディレクション、GAを活用した数値分析・改善業務を経験してきた今年で9年目のWebディレクターです。
セーフィーでは主に、既存プロダクトの新機能開発に関わるUI/UXデザインのディレクターを担当しています。私が2021年4月に入社してから約半年間で関わったセーフィーのプロダクト開発の中で、Safie Pocket2の「位置情報特定機能」について振り返りたいと思います。
位置情報特定機能の開発経緯
位置情報特定機能は、Safie Pocket2をご利用いただいているお客様の課題・要望から始まった機能開発になります。
目的
建設現場や土木現場、パトロール業務などで位置情報を利用し場所や状況の把握に役立て顧客の業務効率改善につなげる
ターゲット
建設現場や土木現場でのパトロール業務
解決する課題
・マップで作業者の位置を明らかにすることで、今まで文字や音声で行っていたコミニケーション時間短縮させ、指示効率を改善させる
・位置情報とLIVE・録画映像の紐づけを容易にし、問題箇所や行動履歴の日報提出業務などを改善・効率化する
実際にリリースされた機能
Safie Viewer内の「Safie Apps」に「マップビューワー」が追加され、同じSafie Viewer内の「ダッシュボード」に「マップウィジェット」が追加されました。
Safie Pocket2を利用いただいているお客様であれば、誰でも無料で利用できるサービスとなっています。是非ご活用ください!
デザイン制作を進めていくうえで注意したこと
まず、私はデザイナーではないため、デザイナーがデザイン制作をするために必要な情報や要件をまとめることが私の役割だと考えました。
そのうえで一番初めに行ったことは、デザインを考える前に要件仕様書を元に想定されるユースケースを考え、そのユースケースを元に要件仕様書には書かれていない気になった所や機能要件を整理しました。
具体的には、位置情報特定機能を利用されるお客様の
解決したい課題
その課題の原因
解決方法
想定される利用方法
気になった所(要件仕様書だけでは判断できない仕様)
を数社考え、ユースケースを洗い出しを行いました。
ユースケースを考えることで、要件仕様書では整理しきれていない箇所や漏れが発見できたので、デザイン制作をする前に行えたことは良かったと思います。
次に行ったことは、デザインが必要な画面の洗い出しです。
位置情報特定は新機能と言っても、すでにある「Safie Viewer」のダッシュボード機能やSafie Appsに追加される機能であったため、新たにデザインが必要な画面はどこか、または、デザインせずとも対応できる画面はどこかを整理しワイヤーフレームを作成しました。
その後、企画・開発担当とミーティングを行い、ワイヤーフレームの説明と作成するデザインのすり合わせを行い、事前に認識相違が発生しないよう工夫しました。ここまで整理を行ってからデザイン制作に入りました。
今回、デザイナーにデザイン制作を進めてもらううえで意識したポイントは以下の3点です。
地図はGoogleMapの利用が想定されていたため、Google Maps Platformを使ってどこまでデザインできるのか意識すること。
GoogleMapのUIがベースになるため、追加するデザインが浮かないようにすること。
Viewer内の機能になるため、Viewer内のUIと統一できる所は統一すること。
その他は上がってくるデザインに対して、デザインを考えるうえでよく言われる「整列」「近接」「強弱」「反復」の基本を意識し、デザイン制作を進めてもらいました。
振り返り
まず、新機能を大きな遅延なくスケジュール通りにリリース出来たのは良かったと思います。
事前に開発前に想定できるデザインや要件整理は行うものの、開発案件では開発を進めて行く中で新たに判明する課題や問題が発生するものだと思います。そういった時にSlackですぐチームメンバーにコミュニケーションを取り、スピード感を持ってデザイン制作や開発を進められたことは良かったと思います。
また、開発環境から本番リリースまでの間、開発メンバーが主体的に不具合やバグを修正され、逐一チームメンバーに共有されていたため、他メンバーも進捗状況を把握しやすい状況が作られていました。
反省点として、想定よりも要件整理後のワイヤーフレームの制作に時間がかかってしまいました。
初めはイラストに起こせばすぐに伝わることもワイヤーフレームを作成し、デザイン依頼や指示を行っていたため時間がかかってしまっていました。途中からやり方を変え、書き起こすワイヤーフレームは最低限にし、デザイナーとのオンラインでのコミュニケーションをこまめに取ることで認識齟齬を極力なくし、デザイン制作の効率を上げるための工夫ができたのは良かったと思います。
まとめ
位置情報特定機能は、セーフィーに入社して初めての開発案件となりました。
CMS開発やWebサービスのディレクション経験はあったものの、初めて自社プロダクトが絡む開発に携わりました。進行の仕方や考えなければいけないポイントなどは、Webやアプリ開発と大きな違いはないかと思います。
ただ、通常はiPhoneやAndroidなど世に出回っているデバイスの性能や機能を意識しながら開発を行いますが、それに加え、自社プロダクトを利用して開発をする場合、独自の機能や性能に制限があるため、できる事・できない事が発生します。その点さえ理解していれば、そこまでのギャップは感じませんでした。むしろ、iPhoneやAndroid端末の機能や性能が如何に優れているか改めて知らされました。
また、セーフィーのプロダクト開発の特徴として、エンジニアが主体的に発言・行動し開発を行っている印象を受けました。
要件通りに開発を行うエンジニアもいる中で、企画段階から懸念やもっとこうした方が良いんじゃないかと意見を言ったり、一度作り上げた後も目に見えない裏側の仕組みや、フロントの操作性の改善をリリースギリギリまでアップデートしていく姿勢はとても良いと感じました。部署関係なくプロダクトに関わるメンバーが自分の意見をしっかり言い合え、その意見を受け入れられる環境が整っていると思います。
最近上場はしたもののセーフィーはまだまだスタートアップ企業です。
ルールが決まっていないことやデザインの統一が必要な所など課題は山積みです。
プロダクトの課題から主体的に考え、仕事を進めて行きたい人にはとても良い環境になっていると思います。ご興味のある方は是非応募してみてください!