Mercedes-AMG PETRONAS Formula One Team は、モータースポーツの頂点に立つ FIA Formula One World Championship に参戦しています。7年連続でドライバーズチャンピオンシップとコンストラクターズチャンピオンシップの2冠を獲得し、コンストラクターズチャンピオンシップのタイトルを8年連続で獲得した同チームは、F1 スポーツ史上最強のチームのひとつです。オフィシャルファンサイトにアクセスする忠実なサポーターたちに、Lewis Hamilton の夢のマシンを操縦するかのごとく、高速かつ信頼性の高いエクスペリエンスを提供することは、同チームにとって非常に重要です。
mercedesamgf1.com
業界 : スポーツ/自動車
本拠地 : 英国ノーサンプトンシャー州、ブラックリー
利用開始 : 2022年
主な利用機能
ネットワークサービス (CDN)
Image Optimizer
スピード、信頼性、スケーラビリティ。Webサイトとフォーミュラ1世界の制覇に欠かせないあらゆる要素。戦う操縦士の反射神経、驚異的なハイテク、一流のチームワーク、これらを結集するスポーツは他にありません。5大陸で開催され、激しい競争が繰り広げられる20を超えるレースで勝ち続けるには、もちろんスタミナも必要不可欠です。このような厳しい環境にもかかわらず、Mercedes-AMG PETRONAS F1 Team は、8年連続でコンストラクターズチャンピオンシップのタイトルを獲得するという前代未聞の快挙を成し遂げました。
従って、同チームがファン専用サイトを作成するにあたり、あたかもドライバーシートに座っているかのように、豊富な画像を駆使して超高速かつ非常にイマーシブなユーザーエクスペリエンスを忠実なサポーターたちに提供したいと考えたのは当然のことでした。そこで Fastly の Image Optimizer を採用したところ、サイトの平均速度指標が__61.5%改善__しました。これは、Lewis Hamilton が2020年のイタリアグランプリで達成した最速平均ラップタイムの時速262.362キロを時速423.715キロにさらに加速させるようなものです。しかし、スピードだけでは最先端の Web を実現することはできません。
「スピードと信頼性は F1 レースの土台であり、ファンは最高のものを求めます。そのため、私たちのデジタルプラットフォームのユーザーエクスペリエンスが F1 スポーツの高いパフォーマンス基準にマッチし、ファンを魅了し続け、サイトを再訪問してもらえるようにする必要がありました」
Michael Taylor、Mercedes-AMG PETRONAS F1 Team、IT Director
以下では将来の成功を見据え、高速かつ安定したサイトの土台が構築された経緯をご紹介します。
「私たちのブランドにマッチする、高いパフォーマンスと安全性、可用性を兼ね備えたデジタルプラットフォームが必要でした。Fastly は、これらの各ポイントを実現してくれました」
Michael Taylor、Mercedes-AMG PETRONAS F1 Team、IT Director
F1 は感覚を刺激し、神経を高揚させます。
そこで当然 Mercedes-AMG PETRONAS F1 Team は、同じレベルのWebサイトエクスペリエンスをファンのために構築したいと考えたのでした。
目を見張るような画像、レース週末のリアルタイム統計、チームの最新情報、ドライバー情報のページに加え、コクピットから見た各シーズンの困難なシケインや表彰台のシャンパンファイトの映像を通じてファンに臨場感をもたらしています。
ファンにチームの内部を見せ(それを継続させる) のは容易なタスクではありません。進化し続けるサイトの機能が、サイト利用者の増大やエクスペリエンスを妨げることがあってはなりません。パフォーマンスやスピードの低下がサイトの利用時間の短縮や直帰率の増加、リピーターの減少につながることをチームは懸念していました。また、__SEO への影響__も考慮すべき要因のひとつです。読み込み時間が遅くなると Google ランキングがあっという間に下がることがあります。
Mercedes-AMG PETRONAS F1 Team にとって、懸念を早急に払しょくできることが非常に重要であったため、堅牢で柔軟性の高いプラットフォーム上に新しいサイトを構築することで、ライブ環境への移行における主な問題を未然に解決しました。
「Fastly とパートナーを組む前は、標準的なインフラストラクチャに頼って、より静的なバージョンのサイトのパフォーマンスを維持していました」と、Chris Church 氏は語ります。「しかしサイトがより複雑化し、画像の使用が増えるのに伴い、未来のユーザーエクスペリエンスを目指す私たちの高い志を実現するには、最高クラスの最適化ツールによる効果的なサポートが欠かせないことに気付いたのです」(Church 氏)
こうした認識の下、チームは信頼できるテクノロジーパートナーの発掘に乗り出したのでした。
Mercedes-AMG PETRONAS F1 チームは、新しいテクノロジーの導入において、複数の重要な要件を抱えていました。
パフォーマンスの向上と既存インフラへの統合のしやすさが重要な指標でした。AMG と Petronas が微調整と優れた燃料や潤滑油の提供を通じて Mercedes の F1 カーの性能を強化しているように、ファンサイトも最良のベンダーを組み合わせて継続的な改良を重ね、独自のユーザーエクスペリエンスを生み出す必要があるためです。
「Webサイトは当初、Netlify がホストする Next.js ベースのWebサイトとして開発、公開されましたが、後に Contentful をコンテンツ管理のバックエンドとして導入しました。Netlify と Contentful は共に、ページやデータ、画像アセットの配信向けに CDN のオプションを提供しています」と、Penny Harrison 氏は説明しています。
Fastly は、これら両方のサービスのフロントエンド CDN として使用され、Mercedes-AMG PETRONAS F1 Team ドメインのページやデータ、画像アセットをキャッシュし、これらのドメインは Fastly のサービスを通じて Netlify と Contentful の CDN URL にマッピングされています。
Webサイトの主要 KPI は、ファンにとっての読み込み体験です。現在このページは www.mercedesamgf1.com サブドメインで Netlify によって配信されるコンテンツと images.ctfassets.net サブドメインで Contentful によって配信される画像で構成されています。
ページの読み込み時間をテストし、エンドユーザーのエクスペリエンスを向上させるため、Fastly はサイトのデモバージョンを新しい URL (画像向けの Contentful サブドメインを Fastly がコントロールするサブドメインに置き換えたもの) にパブリッシュしてから数日以内に迅速にテストを実施しました。その後、Fastly はこのサブドメインへのリクエストを Contentful サブドメインにマッピングし、配信の際に動的な画像最適化が適用されるようキャッシュ機能をセットアップしました。
これにより、「Netlify ページ + Fastly 画像」とライブサイト (Netlify ページ + Contentful 画像) の比較を容易に行うことができました。
また、「Fastly ページ + Fastly 画像」のパフォーマンスをテストして上記2つのケースと比較するため、メインサイト URL の前面に別のサブドメインをセットアップしました。これにより、ページコンテンツに関して Fastly のキャッシュ機能と Netlify のキャッシュ機能の間に、サイトのコンテンツ更新をパブリッシュするスピードに影響を及ぼす可能性がある何らかの問題が存在しないかどうかをテストできる環境を構築できました。幸い、そのようなケースは発生しませんでした。
Fastly がサポートする Mercedes-AMG PETRONAS F1 チームのファンサイトは、2023年9月6日にライブ環境に移行したばかりですが、すでに以下を含む重要な指標において優れた結果を生み出しています。
壁紙ページに最も多くのコンテンツが含まれているので、このページで確認された最も重要なパフォーマンス改善の結果を見てみましょう。
Largest Contentful Paint の平均値が2万9,000ミリ秒から6,000 - 8,000ミリ秒に減少
Visually Complete の平均値が5万ミリ秒から5,000 - 1万ミリ秒に減少
Speed Index の平均値が1万8,000からわずか4,000に改善 (4分の1以下)
壁紙ページに関するこれらの結果から、明らかなパフォーマンスの向上が確認できます。また、パフォーマンスの大幅な改善がサイト全体に見られました。例えば、ホームページの Speed Index の平均値は1万8,000からわずか4,200に減り、驚異的な61.5%のスピード改善が確認されました。
また、平均合計バイト数が10%減少しました。通常、バイト数の減少は視覚的な品質の低下に関連しますが、このケースでは異なります。理由は、Fastly の Image Optimizer が画質に関して人間の目で判別可能なことと、このように画像が豊富で非常にイマーシブなサイトに含まれる大量の詳細なデータの間で最適なポイントを特定し、画像を最適化するためです。
Penny Harrison 氏は、Fastly が実現するパフォーマンス改善によって、視覚的な品質が目に見えて低下することはないと断言しています。
「画質がきわめて重要な壁紙ページを例にとると、大きな画面で表示してもまったく問題が見られません。画像は高解像度表示され、非常にシャープで素晴らしいです」(Harrison 氏)
確固たるスピードと信頼性を手に入れた Mercedes-AMG PETRONAS F1 Team のファンサイトは、Fastly という頑丈かつ柔軟性の高いエンジンを使用して今後もパフォーマンスを強化し続けるでしょう。
優れたエクスペリエンスへとつながる道をクリアにすることで、ファンは (実際に F1 カーを操縦することなく) 現場のアクションに限りなく近い体験が得られるようになります。
今後の展望
Fastly の Compute と CDN 動画ストリーミングソリューションにより、さらに優れたインタラクションが可能になるため、将来的に Mercedes-AMG PETRONAS F1 Team とのコラボレーションが拡大する可能性が常に開かれています。
今後、新たな共同プロジェクトにゴーサインが出るかどうかは別にして、このように素晴らしいチームとパートナーを組んで仕事ができることを私たちは誇りに思います。
「Mercedes F1 のファンは最高を求めています。そのため、サイトが複雑化して画像が増えるなか、サイトをよりユーザーフレンドリーにすることも非常に重要です」
Penny Harrison 氏
Mercedes AMG PETRONAS F1 Team、Head of Digital
「サイトで最も多くの画像が使用され、質が高く、急速に変化する壁紙ページなどのページに関する詳細な統計データが得られます」
Chris Church 氏
Mercedes AMG PETRONAS F1 Team、Global Partnerships & VP Partnerships APAC
「このサイトにあらゆるものを詰め込みたいと考えています。つまり、数年後にはゲームやパーソナライゼーションを含む包括的なサービスを提供し、フル機能を備えたサイトへと成長するでしょう。Fastly を導入することで、揺るぐことのないベースラインを確立することができました。ユーザーエクスペリエンスを損ねたり、ファンに不快な思いをさせたりすることなく、サイトを改良し続けることができます。ファンのエンゲージメントとエクスペリエンスの継続的な向上は、私たちにとって非常に重要です」
Penny Harrison 氏
Mercedes AMG PETRONAS F1 Team、Head of Digital