SaaS型プラットフォーム開発協力！UI／UXデザイン～フロントエンド実装協力

ニューロマジックは"Experience Agency"として、体験デザインの提供を幅広く行っています。

今回は、スクラム開発におけるUI／UXデザイン～フロントエンド実装の協力に携わった事例をご紹介いたします！

あしたのチーム様にて、社員情報の管理や組織図などをオンラインで管理・サポートするSaaS型のプラットフォーム機能拡張プロジェクトに、弊社メンバーが半常駐するというかたちでジョインしました。

■Project
「あしたのチーム」SaaS型プラットフォーム開発協力

■Clients / Agency
株式会社あしたのチーム

■Released
2020.6

■Services
サービスデザイン、エンジニアリング
UI/UXデザイン、情報設計、、フロントエンド、Vue.js

■Project Overview
人事評価や社員情報の管理、組織図の作成といった企業の経営者や総務担当者の業務をオンラインで管理・サポートするSaaS型のプラットフォーム「あしたのクラウド」の機能拡張プロジェクトです。

他社エンジニアやデザイナーと協業するスクラム開発体制でUI／UXデザイン～フロントエンド実装担当として参加しました。

■Challenge
ユーザー調査・分析によって提起された課題からの、ニーズに対応する社員情報の管理機能の追加開発およびUI改善。

■Process

要件定義

本プロジェクトはアジャイル型で、スクラム開発体制で参画しています。
新しい機能実装が多いため結合する既存の複雑な基幹システムを正しく理解し、その仕様を前提とした要件定義や仕様策定に時間をかけました。

UXデザイン

新機能の組織図アプリケーション設計・実装に際して、インタビューを実施し、ペルソナとカスタマージャーニーマップを作成、
これをもとにユースケース図やUML図を作成、既存仕様といかに折り合いをつけて要求を達成するかの設計に取り組みました。

UIデザイン

今回の機能拡張のタイミングで、兼ねてから導入が検討されていたアトミックデザインが採用され、Vue.jsを使用した実装レベルのコンポーネント管理を前提としたUIをデザインすることになりました。既存仕様と採用するライブラリの制約を踏まえたUIデザインに取り組みました。

また、以降の運用で参加するデザイナーやエンジニアたちがパフォーマンスを発揮しやすいように、UX原則やUI原則に言及したデザインガイドを弊社デザイナーが作成しました。

開発

最終的なシステムとインターフェースの完成に至る途中で、動的なデータを扱う共通モジュールの大量作成・管理が必要でした。

設計と実装には通常のフロントエンド開発よりも配慮や工夫が必要とされ、ソースコードのレビューと修正はかなり入念に実施されることになりました。

■Team
スーパーバイザー
木村隆二

UXディレクター
飯川光明

UI／UXデザイナー
平澤那央子

エンジニア
田崎一成、鳥光信樹、三岳智美、藤原篤史、野村政行（フリーランス）

ニューロマジックには優秀なUXディレクターやUI/UXデザイナー、エンジニアが在籍しているので、UX原則やUI原則に言及したデザインガイドの作成からフロントエンド開発まで幅広いサービスを提供しております。

型にハマらない柔軟な環境で様々な体験デザインの提供に関わりたい方、ニューロマジックで一緒に働きませんか？

カジュアル面談も実施していますので、お気軽にご連絡ください！