概要

ナショナル・オーストラリア銀行(NAB)は、オーストラリアおよびニュージーランドで最も顧客中心の企業になるという明確な目標を掲げました。エンタープライズ規模において、850万人以上の顧客と複数の部門にまたがる200人以上のデザイナーを抱えるNABは、65種類のオンボーディング経路、複数のコンポーネントライブラリ、そして1つの変更に数日を要する手作業の更新といった複雑さに直面していました。

規制要件によって一貫性とコントロールの基準も一段と高まり、NABはこれに対応するため、Figma上で統一されたデザインシステム「Elevate」を構築しました。これにより、チームは一度デザインすればどこでも再利用できるようになりました。

その結果、顧客にとってはよりシンプルなオンボーディング体験が実現し、NAB側では業務効率も向上しました。

• オンボーディングの簡素化によりサインアップが50%高速化
• フォーム項目を70%削減し、顧客の負担を軽減
• 公開済み・承認済みコンポーネントの活用により重複を排除
• Figmaを唯一の情報源として、デザインから開発へのハンドオフがよりスムーズに

課題: 成長がもたらす分断

NABのデザインチームがスケールするにつれ、プロダクト体験は分断されていきました。組織全体の各プロダクトチームが、同じ顧客課題をそれぞれ異なる方法で解決していたのです。たとえばクレジットカードの申請フォームも複数のバージョンが存在し、同じような質問をしているにもかかわらず、文言、順序、インタラクションがそれぞれ異なっていました。「これは大規模な企業ではよくある問題ですが、NABの目標はベストになることです。だからこそ、最もシンプルで顧客中心の体験を提供できたときに初めて満足できます」と、NABのデザイン責任者Daniel Fisherは語ります。

複数のコンポーネントライブラリが並行して使われており、その中には10年近く前のものもありました。小さな変更でさえ、複数のライブラリやファイルに影響することがありました。進捗インジケーターを複数画面にわたって更新し、そのすべてのバリエーションを追跡するだけでも数日かかることがありました。

複数のオンボーディング経路が一貫性の欠如とリスクの増大を引き起こし、コンプライアンスレビューや監査の複雑化につながっていました。従来のツールは、大規模でのセキュアなコラボレーションをサポートできていませんでした。ファイルはメール経由で共有され、ステークホルダーは文脈の中でレビューすることができず、アクセス制御もエンタープライズの要件に追いついていませんでした。

解決策: どこでも機能するデザインシステムの構築

NABは、チーフデザインオフィサーLance Thornswoodのシンプルな原則「1つのことには1つのやり方」に結集しました。その明確な方針が「Elevate」となり、Figmaエンタープライズ上に構築された統一デザインシステムとして、パターンを一度作ればどこでも再利用できる仕組みが実現しました。

「マシン」は、その再利用を大規模に成立させるための役割を担っています。これらのスマートで再利用可能なコンポーネントは、あらゆるバリエーションを想定して設計されています。それぞれにバリデーション、エラー状態、レスポンシブ対応のロジックが組み込まれており、あらゆるプロダクトにそのまま組み込める状態になっています。

Figmaの公開ライブラリは、このモデルを大規模に成立させています。チームがコアコンポーネントを更新すると、それを利用しているすべてのファイルにその変更が反映されます。直近1年間だけでも、これらのライブラリはNAB全体で10万回以上使用されました。

Figmaエンタープライズによるデザインの一貫性は、コンプライアンスリスクの低減にもつながります。Elevate内のすべてのインタラクションは、あらかじめ承認され、標準化され、プロダクトやブランドを横断して監査可能な状態になっています。ロールと権限によって機密性の高い作業は適切に管理されます。バージョン履歴とライブラリの公開機能により、何が・いつ・誰によって変更されたのかが明確に記録されます。

Figmaエンタープライズによるアトミックデザインの拡張

Brad Frostのアトミックデザイン手法に着想を得て、NABは再利用可能なビルディングブロックを用いて一貫した体験を構築し、それをさらに「マシン」「ファクトリー」と呼ばれるスマートで適応可能なコンポーネントの仕組みによって拡張しました。アトミックデザインはElevateの基盤として機能しました。しかしそれ単体では、事業全体にわたるすべての顧客インタラクションを統合するには不十分でした。チームは、外部・内部のユーザージャーニー、エラーパス、ブランドバリエーション、UIステートなど、あらゆるユースケースに適応できる機能的なコンポーネントを必要としていました。

たとえば、Figmaのバリアブル、モード、ネストされたインスタンスを使うことで、NABはあらゆるコンテキストに適応する電話番号コンポーネントを作成しました。25人のデザイナーがこのコンポーネントを再構築する代わりに再利用すれば、それは約25人日分の工数が削減されることになります。これを数十のコンポーネントに適用すれば、その削減効果は数百万ドル規模に達する可能性があります。

「すでに存在するものを再設計する時間に費やす代わりに、継続的に改善し、よりクリエイティブな仕事に集中できるようになりました」とDanielは語ります。

バリアブルによる大規模なテーマ設定とホワイトラベル対応

バリアブルは、作業を重複させることなく、Elevateをプロダクトやブランド全体へ拡張します。各「マシン」は、カラー、タイポグラフィ、角丸といった少数のトークンを参照するため、同一のフローをNAB、Kogan Money、Qantas Money、Bank of Queenslandといったブランド間で、トークンの差し替えだけで展開できます。チームはファイル内で変更をプレビューし、一度公開すれば、それを利用しているすべてのフローに変更が即時反映されます。

バリアブルが公開ライブラリ内に存在することで、ガバナンスが組み込まれています。ロールと権限によって、編集できるユーザーが管理されます。バージョン履歴によって、何が・いつ・誰によって変更されたのかが記録されます。デザインとエンジニアリングは同じトークンを同じ文脈でレビューできるため、やり取りの往復が減り、ホワイトラベルのリリースもスケジュール通りに進めやすくなります。

Dev Modeによるより高速でシンプルなオンボーディングの実現

Figma導入前は、デザインから開発へのハンドオフがチームのスピードを低下させていました。デザイナーはファイルをメール添付で共有し、仕様は別のドキュメントで管理されていました。エッジケースは見落とされやすい状態でした。チームのキャパシティの約50%が、ビルドがデザイン通りかを確認し、差分を記録する作業に費やされていました。

Figmaに移行した後は、エンドツーエンドのフロー用ファイルが唯一の情報源となり、最大80人が同時に作業することも可能になりました。開発者も同じファイルを開き、ブランチを確認しながら、文脈の中でフィードバックを残すことができます。Dev Modeでは、ホバー操作で余白、トークン、コンポーネントのプロパティを確認し、そのままコードに対応した値をコピーできます。エラー状態、エッジケース、条件分岐のパスもデザインと並んで管理され、作業の進行に合わせて常に最新の状態に保たれます。

これらの実践により、NABのカスタマージャーニーにおけるオンボーディングの再設計が可能になりました。現在のジャーニーは本人確認から始まります。パスポートや運転免許証のスキャンにより、信頼できる情報源からデータが自動入力され、顧客の入力負担が軽減されます。

たとえばビクトリア州の運転免許証にイニシャルしか記載されていない場合は、フォーム側でミドルネームのフル入力を求めます。共有コンポーネントにより、改善内容は即座に全体へ反映されます。たとえば国際電話番号のピッカーは、04から始まるローカル番号を認識し、自動的にフォーマットできます。

FigmaによりNABはオンボーディングを効率化し、チーム生産性を以下のように向上させました:

• フォーム項目を最大70%削減し、オンボーディング時間を最大50%短縮することで、より高速でシームレスな体験を実現
• 顔認証とIDスキャンによるセキュリティ強化により、スピードと安全性の両立を実現
• 事前承認済みコンポーネントの公開と再利用により重複を排除し、エンジニアが単一の情報源から構築できる体制を確立

顧客中心主義を推進するデザイン

NABのデザインシステムは進化し続けています。Code ConnectやFigma MCPといった機能を通じて、チームはデザインとエンジニアリングの橋渡しを行い、コンポーネントとコードを接続し、フィードバックループを効率化し、実際の顧客フィードバックに基づいた迅速なデリバリーを実現しています。また、Figma MakeやAI支援ツールを活用し、主要なフローにおける摩擦点の特定も行っています。

「ある体験について『摩擦を数えてほしい』とプロンプトするだけで、正確なスコアが返ってくるのは本当に素晴らしいことです」とDanielは語ります。「手作業だったタスクの自動化は非常に大きな価値があります。」

Figmaをプロセスの中心に組み込むことで、NABは構造と創造性が両立できることを示しています。信頼が重視される厳格な規制業界において、顧客中心主義の新しい基準を大規模に確立しつつあります。