アトランティック・レコードがデザインプロセスのスピードアップに Adobe XD を採用した理由 | アドビ UX 道場 #UXDojo

03-14-2022

音楽業界は変化の速い業界です。特に、音楽ファンのデジタルコンテンツとの関わり方は急速に進化しています。アーティストの存在を伝えるオンラインのプラットフォームやチャネルは多様化しており、アーティストのためのアセットを作成するデザイナーに要求される作業は大きく増加しました。かつてはアーティストの Web サイトやバナー広告を担当していたデザイナーが、今ではスプラッシュページ、ソーシャルメディアの投稿、e コマースキャンペーンなど、新規に増え続けるプロモーション素材を作成しています。そして、デザイナーは、一貫性を確保しつつ、アーティストの魅力に合ったデジタルアセットを迅速に作成しなければなりません。

このアーティストマーケティングの新しい世界には、アーティストの魅力を伝えるための多くの新しい機会があります。しかし、その一方で、デザインに関わる新しい課題も発生しています。米国の有力なレコード会社のアトランティック・レコードは、そうしたさまざまな課題に対応するため、Adobe XD を使用してより効率的なワークフローを実現しました。そして、アーティストとデザイナー双方にとってより良い結果を得ることができました。

https://player.vimeo.com/video/663128941

アトランティック・レコードがノア・キレルのために、Adobe XD と Anima プラグインを使用して作成したユーザー体験

課題：厳しい納期と頻繁なコミュニケーションへの対応

Dana Tandoi は、アトランティック・レコードのクリエイティブサービスチームの一部門であるインタラクティブデザイングループのディレクターです。彼女は、恒常的に厳しい納期に直面しています。最大の課題のひとつは、キャンペーン用のクリエイティブに関するコミュニケーションを素早く行なえるようにすることです。

アーティスト、プロダクトマネージャー、デジタルマーケティング担当者がデジタルプロジェクトのためのアイデアを思いついた場合、それが意味を持つ間に公開できるようにするために、迅速に実行しなければならないケースが一般的です。
伝統的にモックアップは Photoshop で作成されていて、ステークホルダーには、インタラクティブなクリエイティブの案を伝える場合でも、注釈の付いた静的な JPEG が渡されていました。それが、フィードバックを得るまでに時間がかかる理由の一つになっていました。
また、静的なカンプからは、デザイナーが実際にどのようなキャンペーンを考えているかを把握することがステークホルダーとアーティストにとって難しく、多くの行き違いが発生する原因になっていました。
開発者は会議の場に集められ、Photoshop のファイル、UI アセットのフォルダ、添付のメモを渡されて、その場で議論をしていました。
デザイナーはローカルに保存したテンプレートで作業していたため、テンプレートが変更されていても、それを見逃すことがありました。

解決策：素早いプロトタイピングとシームレスな開発との連携

こうした状況を改善するため、アトランティック・レコードのインタラクティブデザインチームは、Adobe XD と Anima プラグインを採用し、Web サイト、アプリ、ランディングページの、本物に非常に近いプロトタイプを作成し始めました。これによって、ステークホルダーや開発者に対して、容易にコンセプトを伝えられるようになりました。

まだ、チームは Adobe XD と Anima の使い方を学んでいる段階ですが、この組み合わせはすでにデザインプロセスの強化を実現しました。デザイナーは、ビジョンを伝えるために、より精密なプロトタイプを作成できるからです。
デザイナーは、単純にリンクを共有するだけで、自分のアイデアを明確に伝えられます。プロトタイプは Anima のサーバーに同期されるため、ステークホルダーや開発者はまるで実際の Web サイトであるかのように、ブラウザ上でプレビューして操作することができます。
XD を使うと、メール登録やソーシャルアイコンなどの再利用可能なコンポーネントを作成できます。また、Creative Cloud ライブラリにアセットを登録すると、そのアセットに対する更新が自動的に反映されるため、デザイナーは、アーティストごとに Creative Cloud ライブラリを設定して、関連する更新が自動的にチーム全員に通知されるようにしました。

結果：ステークホルダーの承認と、公開までの時間の短縮

デザイナーは、従来の静的なカンプでは表現できなかったインタラクティブな要素をプロトタイプに追加して、体験として提供できるようになりました。

プロトタイプにマイクロインタラクションを追加して、静的なデザインをよりスムーズで分かりやすい体験へと高めることが可能になったために、ステークホルダーが、キャンペーンに使われる個々の要素を全体的な視点から理解できるようになりました。
デザイナーは、ページ間の遷移や、ボタンがクリックされたときに起こることや、全体のストーリーを伝えられるようになりました。これは、音楽アーティスト達にビジョンを伝える際に、特に役立っています。
Anima のおかげで、デザイナーが考えたインタラクティブなプロトタイプと、最終的な成果物がほぼ同じになることが期待できます。というのは、開発者は Anima が生成したエフェクトをドラッグ & ドロップして利用できるからです。
Creative Cloud ライブラリは、アーティスト独自のブランディングを維持し、一貫性を確保しながら作業することを容易にします。デザイナーは、Creative Cloud ライブラリで作成した要素を、デザインに追加したり、カスタマイズすることができます。

ROI：生産性の向上、フラストレーションの軽減、クリエイティブな時間の増加

関係者が協調しながら進める新しいデザインワークフローは、刻々と状況が変わる環境において、大幅な時間短縮につながりました。そのおかげで、デザイナーはクリエイティブな作業に専念する時間をより多く持てるようになりました。

新しいワークフローでは、デザイナーが、デザインの目的を最新の状況に一致させつつ、思い描いたデザインを形にして試し、プロトタイプの見直しを繰り返し行なうことが可能です。
Creative Cloud ライブラリに整理されたアセットは、複数のプロジェクト、デバイス、チーム間で共有できます。ライブラリによるアーティストのアセット管理をはじめとする、Creative Cloud とのシームレスな統合は、非常に価値のあるものだと実証されています。

今後、音楽業界のデザイナーは、アーティストのオンラインプレゼンスを形成するさまざまな種類のキャンペーンのために、より多くのコンテンツを作成する必要に迫られるでしょう。こうした多様なデザイン作業を、素早く、かつ一貫性を確保しながら実行できることは、絶対に欠かせない能力です。アトランティック・レコードが、Adobe XD により実現した新しいワークフローは、まさにそれを達成しています。