こんにちは、マネーフォワードの大橋@デザイナーです。
みなさんはプロトタイピングツールの「 InVision 」をご存知でしょうか。 Evernoteをはじめ、様々な企業で導入されているサービスです。 http://www.invisionapp.com/ マネーフォワードでもInVisionを活用して、エンジニア・デザイナーをはじめチーム内のコミュニケーション円滑化を図っています。
そこで今回は、InVisionを導入して良かった点を紹介させていただきます。
InVisionの主な機能
- プロトタイピングツール
- デザイン共有
- LiveShare (リアルタイムなミーティング機能)
- コメント機能
1. コミュニケーションが円滑になった
- エンジニア・デザイナーだけでなく、マーケターや意思決定者を含めた、プロジェクトメンバー全員が各画面を見ながら議論できる。
- コメント機能によって様々な観点での意見を集約でき、意思決定が早くなった。
- 「ここのワーディング、ちょっと違和感あるかも」とか
- 「エンジニア的な観点から、ここは△△した方がいいんじゃない?!」とか
- 「グロースハック結果から、ここは□□の方針で」とか
2. コメント機能で、非効率なコミュニケーションを減った
- コメント機能にて会話のログを残すことで、議論した点や質問事項を記録できる。
- InVision上に記録が残っているため、チーム内で共有できるとともに、直感的に思い出しながら修正できる。
- その結果、非効率な聞き直しや、重複した議論を回避することができる。
3. プロトタイプでのチェックにより手戻りが減った
- プロトタイプを関係者がチェックできる。
- プロトタイプで仕様や遷移導線を共有できるため、デザイナー・エンジニア間での認識の相違が減った。
- 早期にワーディング・仕様の深い議論に入れるため、実装フェーズからの手戻りが減った。
4. Desktop Sync機能で、最新データをInVision上で共有できる
- これが一番オススメ機能!
- Desktop Sync機能により、常に最新のSketchデータ・PhotoshopデータをInVision上に共有できる。
- InVisionにあるものをマスタデータとしてエンジニアの方に共有できる。
- 一度作った画面を更新するとInVision上に反映され、プロトタイピングをやり直さなくていい。
- 画面単位で書きだしてくれるため、一度SketchでExportしてから一枚一枚アップロードするという作業が減らせる。
5.おまけ
Adobe Photoshop CC 2015 リリースで、Sketchライクなアートボードが追加されました。 これにより、Photoshop派の人もよりアプリのデザインがしやすくなるかも♪ https://helpx.adobe.com/jp/photoshop/using/artboards.html
また、InVisionもサポートしてるそうです。 http://blog.invisionapp.com/adobe-invision-team-up-to-support-photoshop-artboards/
Historyの時間がアメリカ時間っぽかったり、更新状態に多少タイムラグがあったり、たまに落ちたり、まだまだ使いこなせてなかったり、、、、 色々課題はありつつも、InVisionを使い始めたことによりコミュニケーションが改善して、仕事の効率UPできました。
最後に
マネーフォワードでは、良いものを積極的に取り入れていくデザイナーを募集しています。 ご応募お待ちしております!
【採用サイト】 ■『マネーフォワード採用サイト』 https://recruit.moneyforward.com/ ■『Wantedly』 https://www.wantedly.com/companies/moneyforward
【公開カレンダー】 ■マネーフォワード公開カレンダー
【プロダクト一覧】 ■家計簿アプリ・クラウド家計簿ソフト『マネーフォワード』 https://moneyforward.com/ ■家計簿アプリ・クラウド家計簿ソフト『マネーフォワード』 iPhone,iPad ■家計簿アプリ・クラウド家計簿ソフト『マネーフォワード』 Android ■クラウド型会計ソフト『MFクラウド会計』 https://biz.moneyforward.com/ ■クラウド型請求書管理ソフト『MFクラウド請求書』 https://invoice.moneyforward.com/ ■クラウド型給与計算ソフト『MFクラウド給与』 https://payroll.moneyforward.com/