この記事は、「BASE Advent Calendar 2018」の7日目の記事です。
こんにちは、BASEのデザインチームに所属している北村（@naomi_kun）です。 BASEのデザイン管理ツールに「Abstract」を導入してちょうど1年が経ったので、導入する前を振り返りながら、良かったところの所感をまとめたいと思います。
はじめに
突然ですが、デザインデータの管理ってみなさんどうしていますか？
共有するのが大変だったり、バージョン管理のルールを厳格にしておかないとメンテがしづらかったりと、デザインデータの管理って非常に面倒ですよね。
BASEもGoogleDriveやDropboxを用いてデータ共有していたものの、ファイルの置き場が煩雑になったり、新しいデータがどれなのか毎回他のデザイナーに確認しなければならないなど、多くの課題を抱えていました。
デザインデータもGit管理したかった！
デザインデータもGit管理したい、と当時同じプロジェクトを進めていたエンジニアさんに相談したところ「Abstractってツールが良いらしいよ！」と教えていただいたので、まずはそのプロジェクト内で1ヶ月試験導入してみました。
Abstract導入前の課題と問題点
- データの管理が全くされていない😱
- 誰がどのデータを持っているのかすら分からない😱
- 複数人でデータを共有できる体制になっていない😱
- UIコンポーネントも管理されていなかったので、人によってデザインが違う😱
この他にも、デザインレビューの際に毎回GitHubにissueを建てなければならず、アプリなど短期間で細かな改修を行うプロジェクトではデザイナーの負担が大きかったので、デザイン画面上にレビュー出来るシステムが欲しかったという背景もあります。
導入して１年、現在の状況
現在はネットショップ作成サービス「BASE」、ショッピングアプリ「BASE」含む全てのプロジェクトをAbstract上で管理しています。 無料アカウントでもコメント機能が使えるので、ディレクターさん、エンジニアさんも含めると既に約40人規模での運用になっています。
Abstract導入後の改善点
- データのバージョン管理ができる🤗
- 複数人で同一データ編集・共有できる体制になった🤗
- 誰がどのデータを触ったのか分かるようになった🤗
- デザインシステムのおかげで統一されたUIでデザインされるようになった🤗
導入してみて変化したところ
実際の開発フロー
- 新規開発タスクが発生次第、MasterからFeastureブランチを切る
- ブランチ名は機能ベースの名前にする
- こまめにコミット
- Abstract上でデザインレビューする
- デザインがFixしたら完成形をZeplinへアップする
- デザイン作業終了後、Masterへマージ
diffの確認がとても楽
Gitのように前回のコミットとの差分が分かるので、作業内容の確認がとても楽になりました。 エンジニアさんにお願いするときの共有方法も楽ちんです。
レビューがAbstract上で出来るようになった
今までのデザインレビューはGitHubのissueに画面に直接コメントできるので、 コミュニケーションコストも、作業効率も劇的に改善されました。
Abstract使っていてもツライことがある
Abstractでの管理体制が整ってきているものの、Abstractだけでの運用ではまだまだかゆいところに手が届かない状況です。 複数人のデザイナーが同時に作業するので頻繁にコンクリフトしたり、マージするとアートボードが重なってしまったり…。
先日のAdobeMAX Japanで、XDもバージョン管理機能が出来るようになると発表があったので、今後もウォッチしたいです。
まとめ
Abstractを導入して1年が経ちましたが、デザインチーム内での意識改善はもちろん、エンジニアも巻き込んでのAbstract運用フローが根付きつつあると思います。
チーム内の作業効率も格段に上がったので、Abstractを導入していないチームは是非検討してみてはいかがでしょうか。
明日は id:match_1 さんです。お楽しみに！
