スタートアップのヒヨッコデザイナー、M&Aでfreeeの中の人になる
この記事は freee Designers Advent Calendar の19日目です。
こんにちは！
freee株式会社で「freeeサイン」という電子契約プロダクトのデザインを担当している tanaami です。最近はホットクックの手動メニューで作るレシピを考えることにハマってます。
さて、私はもともとfreee社とは別の会社に在籍していたのですが、M&Aによって今年7月にfreeeの一員になりました。
会社がfreeeグループにジョイン → freee社に出向 → freee社に転籍してfreee社の社員になるという、面接を受ける等の通常の入社プロセスを経ずに社員になった、社内ではちょっと珍しいタイプのプロダクトデザイナーです。
グループジョイン直前からfreeeの一員になって半年が経つ今日まで、約2年半。そのあいだ、特に職務内容、仕事の進め方、環境についてはかなり大きな変化がありました。
本記事ではその2年半を振り返りつつ、M&Aでfreeeにジョインしたデザイナーの仕事や意識の変化について書こうと思います。
なお、私はWebデザイナーを9年やっていて、プロダクトデザインをやるようになったのは3年前にfreeeサインのプロダクトデザイナーになってからなので、プロダクトデザイン歴は3年です。ということで、M&Aでfreeeグループにジョインした段階でも、プロダクトデザイナーとしてヒヨッコな状態でした。
この記事はそんな経歴の人が書いてるんだな〜を前提に読んでいただけると嬉しいです。
グループジョイン前
「freeeサイン」というプロダクトは、もともと株式会社サイトビジットが運営する「NINJA SIGN」という名前のサービスでした。そして、私はそのサイトビジット社の社員でした。
NINJA SIGN時代のデザイナーの仕事は、主にプロダクトデザインとコミュニケーションデザイン、社内向け制作物のデザインの3つでした。プロダクトデザイン領域ではプロダクトマネージャーが書いた要件定義書を読んで画面を作ったり、コミュニケーションデザイン領域では広告バナーや印刷物を作ったり、社内外向けデザイン業務だと各種資料の見た目を整えるなど、つまり社内で発生する「いい感じのビジュアルにしたい！！」を全部拾っていくデザイン何でも屋さんでした。
当時NINJA SIGNには複数のデザイナーがいたのですが、当時のデザインチームのメンバーは、広告などのビジュアルデザインの経験はあってもプロダクトデザイン領域の経験が浅く、わからないことだらけ。
渡された仕様をUIにするだけでいいのか？プロダクトのためにデザイナーがもっと積極的に入ってできることがあるのでは？と漠然としたモヤモヤがありました。
プロダクトデザインの基礎を学ぶために良いと言われている本を読んでみたり、UIやUXに関する社外のワークショップに参加したりして各々がインプットを試みますが、その内容を抽象化して自分たちの業務や開発フローに落とし込めていませんでした。
グループジョイン1年目（2021年）
2021年4月、サイトビジットがfreeeグループにジョインし、サイトビジット社の社員はfreeeグループの人になります。
それに合わせてプロダクトの名前も「NINJA SIGN」から「NINJA SIGN by freee」に変更されました。
当時の NINJA SIGN by freee は競合サービスに負けないために新規機能を中心に開発していくことになります。
デザインチームはそれと並行して、freeeブランドの看板を掲げるためにサービスの見た目をfreeeプロダクトに揃える必要がありました。
当時、NINJA SIGN by freee とfreeeでそれぞれデザインシステムがあり、freeeのデザインシステムをNINJA SIGN by freeeに適用できれば良かったのですが、それをやると全ページを大きく変える必要があり、コストと事業上の優先度の問題でデザインシステムの乗り換えは見送ることになりました。
ただ、デザインシステムの乗り換えが難しいので何もしないということではなく、少しでも「freeeのプロダクトっぽさ」を作るために、まずはカラースキーム（※色の組み合わせ）をfreeeのブランドカラーで設定されている色に入れ替え、メニュー等で使われているアイコンを、freeeのプロダクトで使われているものに差し替えました。
また、デザインに使用するツールが会社によって違ったりしますが、サイトビジット社とfreee社でもツールが異なっていたため、今後の本格的な連携にそなえ、UIデザインツールを Adobe XD から、freeeが使用する Figma に変更することを決めました。
デザインシステムの乗り換えをしていないのでfreeeのUI財産はまだ使えないのですが、その段階で環境を整えたのは、freeeプロダクトのコンポーネントの構造や設計方法を取り入れる準備を始めたかったんですね。
ちなみに当時、Adobe XDからFigmaにレイヤーデータごとインポートする機能がなかったので、主要なコンポーネントと画面をゼロから作成しました。（手が空いた時にやっていたけどたぶん3ヶ月はかかりました）
デザインツールの変更と同時に、NINJA SIGN by freee 独自のデザインルールを策定することにしました。
もちろんNINJA SIGN 時代からデザインルールは存在していたのですが、明文化されておらず、属人化した知識が存在していたりデザイナーによってルールのインプットにばらつきがある状態に課題感があったため、標準化を目的に明文化しました。
グループジョイン2年目（2022年）
会社がfreeeグループにジョインしてほぼ1年が経った2022年3月、ついに「NINJA SIGN by freee」だったプロダクト名が現在の「freeeサイン」へ変更されます。
社名も株式会社サイトビジットからfreeeサイン株式会社に変更され、オフィスは神保町から大崎に移転しました。
freee社と同じ大崎オフィスに引っ越したことでfreee社のプロダクトデザイナーやプロダクトマネージャーと直接に交流しやすくなりました。
そしてこのタイミングで、freeeのプロダクトマネージャーの方がfreeeサインの企画チームに参画してくれました。ここからfreeeサイン社（旧サイトビジット社）でのプロダクトの作り方が大きく変わります。
まずプロダクトOKRが導入されました。
freee社におけるプロダクトOKRとは、プロダクトのビジョン（目指す提供価値や解決する課題）の実現のために達成すべきゴールと達成条件のことを指します。
プロダクトOKRによってプロジェクトにおける各種の判断軸がクリアになり、プロダクトマネージャーとデザイナーは、タスクに優先順位をつけて効率的に進められるようになりました。
さらにいちデザイナーとして嬉しかったのは、「この施策はプロダクトマネージャーがやるって言ってるからデザイナーも対応しましょう」みたいなことが起こりにくくなったことです。多数決でなんとなく決める、プロダクトマネージャーがやると決めたからデザイナーも動く、ではなく、「この施策はプロダクトOKRに貢献するか？」という明確な軸を使って自分たちデザイナーも判断ができるようになり、プロダクトマネージャーの判断に頼りきらなくても動けるようになりました。（モチベーションが向上したことをおぼえています。）
同時に、freee式の要件定義書テンプレートが導入されました。
今までは「何を売りたい = 作りたいのか（what）」、「どうやってやるのか（how）」を中心に書かれていた要件定義書は、「どんなユーザーに、どんな価値を提供するのか（why）」を中心に書くものに変わりました。
サイトビジット社に入る前にやっていた受託制作のWebデザイン仕事に置き換えて考えてみると、たしかに納得できる視点に思えました。
たとえばクライアントから「こういうものを作ってください」「ここは派手な色にしてください」などを指定され、そのオーダー通りにデザインを作るよりも、「この広告を見た人にこういう気持ちになってもらって、こういう行動を起こしてほしいです（why）」という、「何を作るか」「どうやって作るか」よりもずっと前段の話を詳しくしてもらったほうが、結果の出るものを作ることができる。プロダクトデザインもそうなのだろうと感じました。
また、プロダクトOKR、freee式の要件定義書テンプレートのほかに、リサーチを取り入れることになりました。
デザイナーが真っ先に輸入したのはユーザビリティテストです。
いままでの機能改善は、「ここって使いにくそうじゃない？」「おそらくユーザーはこう思うのでは？」と、いわばサービス提供側が考えるユーザー像をたよりに施策が走り出す方法がメインでした。
ユーザビリティテストで実際のユーザーに直接お話を聞けることで、今までぼんやりしていたユーザー像の解像度が爆発的に上がった手応えがありました。
一連の手法の導入によって、「なんとなく感覚でだけど多分こうでは？」ではなく、多分これでいける！！という裏付けによる自信をもって開発にあたれるようになりました。
グループジョイン3年目（2023年現在）
グループジョインも3年目になり、旧サイトビジット社のメンバーたちの働き方が大きく変わります。
旧サイトビジット社のデザインチームは、freeeサイン株式会社に所属したまま、3ヶ月のあいだ出向というかたちでfreee社で働いたあと、今年7月に転籍してfreee社の一員になりました。
グループジョインしてから2年間、目標の立て方、リサーチの方法など、freee社のメンバーから多くのことを学んだおかげでプロダクトデザイナーとしてのユーザーの業務に対する理解度が深まり、業務プロセスの改善ポイントを見つける鼻が（ほんの少し）利くようになってきました。
業務プロセスの改善ポイントとは、たとえば直近だと「ワイヤーフレームを引く」タイミングについてです。
freeeサイン社では、ある程度「何を作るか（what）」が決まった段階で開発チーム（プロダクトマネージャー、デザイナー、エンジニアで成る）で要件定義書の読み合わせをします。
読み合わせ後のデザイナーのアクションは、要件定義書を読み込んで画面の構成を考えワイヤーフレームに起こすことなのですが、要件定義書だけを頼りにワイヤーフレームを引くと結果的に手戻りが起きやすいな、という課題感を持っていました。
要件定義書だけを頼りにワイヤーフレームを引こうとすると、デザイナーは画面の構成を検討しつつも「要件定義書の “何を作るか（what）” には書いてなかったけど、想定ユーザーを考えるとこういう機能も追加したほうがいいんじゃないか？」という考えが浮かんできます。（これはデザイナーだけでなく開発中のエンジニアにもあると思います。）
デザイナーはワイヤーフレームを描きながら足りない what を埋めようと試みるのですが、ワイヤーフレームはビジュアルとしては最低限の情報しか持たないものの「⚪︎⚪︎という場所に、⚪︎⚪︎を操作可能な、⚪︎⚪︎のパーツを置く（どうやってやるか = how）」まで決めてしまう方法です。
つまり、ワイヤーフレームの手戻りが多い理由は、「何を作るか（what）」がぼんやりしている状態でシステムの設計（how）を始めてしまうせいじゃないか、と考えました。
さらに、システム設計（how）の段階で「何をつくるか（what）」の話が頻発すると、提案があるたびにプロダクトマネージャーは判断する必要がありますし、たびたび議論が発生します。
議論はプロダクトマネージャー・デザイナー間、プロダクトマネージャー・エンジニア間などさまざまな組み合わせで行われるため、議論のたびに前提条件を話す必要がでてきます。
そのためリリースまでの全体を通して会議は長く複雑になり、スピードが落ちている実感がありました。
このような課題感をプロダクトマネージャーと共有しあったところ、freee社内のその道のプロに依頼し、ワークショップ形式でユーザーストーリーマッピングとモデリングを導入してみよう、という流れになりました。
ユーザーストーリーマッピングではユーザーの業務フロー全体が整理され、「ユーザーがどんな仕事を達成できる機能を開発するか」の認識が揃いました。やることとやらないことが明確に決められたので、考慮漏れや追加提案、それにともなう会議時間の短縮などが期待されます。（ユーザーストーリーマッピングを試した開発はこれから走り出す予定）
モデリングはこれから取り入れる予定ですが、ユーザーストーリーマッピングで決まったMVPを実現するために「何をつくるのか（what）= ユーザーは業務で何が達成できたら価値を感じられるか」の認識をチーム全員で揃えられている状態にし、デザイナーは「いまの段階ではこれしかない！！これでいける！！！」と言い切れるワイヤーフレームを爆速で作り、開発スピードを上げていけるようにしたいと考えています。
まとめ
スタートアップのヒヨッコプロダクトデザイナーが、2年半のあいだいろいろ試行錯誤しつつ周りに助けてもらいながら成長するみたいな、ちょっと恥ずかしい内容になりました。（しかも長い）
会社がfreeeグループにジョイン → freee社に出向 → freee社に転籍してfreee社の社員になる中で、組織の体制やメンバーも大きく変わり、戸惑うことが少しもなかったとは言えません。
でも、自分たちはどうしたらプロダクトの価値を高められるか、どうしたらユーザーに価値を提供できるのかを本気で考え、助け合い、試行錯誤できる環境はとても楽しく、ありがたく、「freeeの中の人になれてよかった！！！！」と思っています。
freeeにはさまざまな分野のデザインのプロが在籍しており、それだけでびっくりなのですが、さらに所属チームや担当プロダクトを超えて積極的に協力してもらえるカルチャーもあるため、ハイレベルな知見を惜しみなく使わせてもらうことができます。
また、「私はこういうところにぼんやり課題感をおぼえてるんだよね。良さそうな手法があるらしいんだけどうちのチームでも取り入れてみない？」と提案したときに「やろうやろう！」と応えてくれる素晴らしいメンバーもたくさんいます。
少しでも気になった方、話を聞いてみたいなと思われたら、ぜひカジュアル面談へご応募ください！
freee Designers Advent Calendar 2023 の明日（12/20）の担当は reo さんです。
お楽しみに！
この記事が気に入ったらサポートをしてみませんか？