Shopify ブログ

柔軟なEコマースを実現する「ヘッドレスコマース」とは? 事例やメリットを紹介

ヘッドレスコマースとは

ここでは、ブランドが魅力的な顧客体験をどこでも提供できるように、ヘッドレスコマースがいかにシステムのフロントエンドとバックエンドを切り離しているかを説明します。

  • ヘッドレスコマースが、破壊的な技術トレンドからあなたのブランドをどのように守るのかを見ていきます
  • 複合的なビジネスがヘッドレス化して、よりスマートにそして高速になったケースを紹介します
  • ヘッドレスコマースがあなたのビジネスに合うかどうか知るためのチェックリストを提供します
  •  

    最近よく聞くようになったヘッドレスコマース。ヘッドレスコマースが提供するのは、デザインや開発の制限なしにどこでも販売ができるようになる自由、つまり世界中があなたの店先になるということです。これを実現するには、見えない部分のアーキテクチャを再考する少しのクリエイティビティと意欲が必要となります。

    へッドレスという名前はやや大げさに宣伝されていますが、決して誰にでもフィットする万能な手段ではありません。皆さまのブランドにとってそれが最適な手段なのかどうかを知るには、まずはヘッドレスが意味するものをよく理解しましょう。

    ヘッドレスコマースとは何か

    ヘッドレスコマースは、ECソリューションを支えるアーキテクチャを指します。これは、フロントエンドの顧客体験と、バックエンドのインフラ技術を分離するものです。

    別の言い方をするなら、ヘッドレスコマースはデジタルなストアフロントとビジネスを推進させる根本的なシステムやエンジンを切り離します。テンプレートのフロントエンドに制限を感じているブランドは、高度にカスタマイズされた顧客体験を自由に提供できるようになります。

    従来のアーキテクチャに問題があるという話なのかというと、必ずしもそうではありません。ヘッドレスは人気になっていますが、これは顧客体験にコマース機能を組み込むという違った方向性をもつやり方なのです。カスタマージャーニーが複雑になってきているので、ヘッドレスはより多くの顧客ベースにリーチするために、新たなツールやオプションをブランドに提供します。

    従来のEコマースとヘッドレスの違い

    ヘッドレスコマースはフロントエンドとバックエンドの関係を断ち切ります。しかしこの切断においては、どちらのサイドも勝者となります。どちらか一方に変更を加えても、他方と切り離されているので両方をカスタマイズする必要がなくなります。これは時間の節約になり、あなたがさまざまな顧客セグメントに対して、より良いカスタマーエクスペリエンスを提供することを可能にします。

    フロントエンドとバックエンドの「離婚」により、ウェブサイト上でコンバージョンを生み出すため新たな施策を運用できます。もっとも一般的な活用例は、コンテンツをeEコマースのプラットフォームではなく、ブランドの既存のCMS(コンテンツマネジメントシステム)を使ってフロントエンドに送り出すことです。

    もし、フロントエンドに直結させているシステムが少ないなら、あなたの会社ではフロントとバックエンドがつながっているEコマースプラットフォームのほうが向いているかもしれません。

    店頭以外の場所でも販売する

    あなたの頭(ヘッド)に問題があるわけではありません!しかし、それを取り除くことによって新しい機会が生まれる可能性があります。基盤ツールによってコントロールできる顧客タッチポイントのネットワーク作りに制限を感じているなら、ヘッドレスへの転換を考えても良いでしょう。すでに確立したCMSを使っている大規模なブランドも、ユーザーへの直接販売を始めるにあたってフィットします。

    つねにオンラインでつながっている世界においては、従来のEコマースではリーチできない顧客タッチポイントが無数にあります。例えば、ボイスコントローできるホームスピーカー、スマート家電など様々なタッチポイントが存在します。ビジネスの将来を保証するには、コンテンツ、商品、決済機能を、ユーザーがいるすべての場所に埋め込むことになります。

    ヘッドレスの利点

    ヘッドレスコマースは、「どこでもコマース」であり、柔軟なEコマースです。コマースは急速に進化するものであり、どこであれコマースやテクノロジーが向かう先に、あなたをポジショニングすることを前提としています。

    ヘッドレスコマースは、下記の3要素をあなたが達成するのを助けます。

    1 市場へのスピード対応

    実験や変更を素早く実行できます。ヘッドレスシステムは、フロントエンドとバックエンドを連携して作業できないというデベロッパーの長年の問題を緩和します。ヘッドレスにより、顧客側に直接関わる作業は独立しておこなうことができ、バックエンド側の作業を待つ必要がありません。逆のパターンも同様です。つまり、コードのコピーを個別に分離させて、それぞれのチームはほかのチームの進捗を待つことなく、作業を進めることができるわけです。

    2 制御とスケールの高速化

    ヘッドレスは、みんなと仲良くできます。異なる言語で書かれた既存のシステムは、(顧客体験にネガティブな影響をもたらしている場合であっても)統合を妨げることがあります。強力なAPIによって、ヘッドレスはすべての既存システム(ERPPIMIMSなど)を統合し、あなたのプログラミング言語で購買体験を構築することを可能にします。ヘッドレスはテクノロジーの変容からあなたを守るだけではなく、あなたのペースで物事を進め、eコマースが変化する速度にも対応できる力をもたらすのです。

    3 自在なカスタマイズ

    ヘッドレスの環境においては、顧客行動があなたの指針となります。ブランドはカスタマー中心の購買体験を柔軟に構築することが可能となり、使っているデバイスの種類に影響されません。構築するモジュールのスプリットテストを即座におこなうことができるので、カスタマーエクスペリエンスとコンバージョン率を最適化できます。

    ヘッドレス化を選択することで、あなたのブランドは変容し続ける顧客獲得のトレンドに対応できるだけの敏捷性を得られるのです。

    事例:Koalaのヘッドレス化

    ここまでの話のほとんどは、システムがどれくらいフレキシブルに分離できるのかという話題、つまり皆さまに関する話でした。しかし、問題の中心は皆さまではなく、お客さまです。

    ここで事例として紹介したいのがKoalaです。この家具販売のブランドは、売上の一部を(会社の名前でもある)コアラの保護活動に寄付します。Koalaは、よりカスタマイズされた顧客体験を提供するために、システムのフロントエンドとバックエンドを分離しました。

    Koalaのヘッドレステクノロジーのインフラを図解すると以下のようになります。

    Koalaのヘッドレスの説明

    機能を分割したことで、Koalaの技術スタックには、下記の部分でそれぞれ異なるプロバイダーを含んでいます。

    • 顧客向けウェブサイト
    • コンテンツマネジメント
    • 割引とプロモーション
    • 決済(オンラインおよびオフライン)
    • 在庫
    • ロジスティクス(独自ソリューション)
    • 分析とレポート

    KoalaShopify PlusAPIを組み合わせ、サードパーティのCMSに依拠して顧客体験を調整し、カスタマイズしています。「以前は、コンテンツがソフトウェアエンジニアの背後に閉ざされていたので、コピーの変更を反映するためにHTMLを編集し、コードをコミットして、サイトをリリースする必要がありました」とKoalaの技術責任者であるRichard Bremnerは言います。「コンテンツをコードから切り離したことで、コンテンツはエンジニアから解放され、エンジニアはコードに、ライターはコンテンツにフォーカスできるようになりました」

    素早く集中的に動けるチームにより、世界レベルのカスタマーエクスペリエンスを提供するために、Koalaがヘッドレスアーキテクチャを活用している方法が、ここで正確に示されています。

    経験によるリーディング:Koalaのプログレッシブウェブアプリ(PWA

    オーストラリアの会社として最初に作成したプログレッシブウェブアプリ(PWA)によって、Koalaはより魅力的な体験を生み出しています。PWAは、追加機能をもったウェブサイトです。ユーザーがインターネットにつながっているかどうかに関係なく、高速で安定した没入感の高いカスタマーエクスペリエンスを実現できます。

    KoalaPWAは、あらゆるデバイスを使用しているさまざまな顧客セグメントに対して、適切なときに、適切な体験を提供します。同社のPWAは、ユーザーが直接触れるウェブの一部分を担っています。新しいウェブページ、商品、コンテンツのデプロイは、さらに高速化されます。分離されている一方で、PWACMSやショッピングカート、その他のミッションクリティカルなシステムと統合されていることに注目してください。

    KoalaのPWA

    PWAは一部がShopifyによって強化され、3つの重要な領域において、Koalaをユニークに差別化することに成功しています。

    差別化要素1:高速デプロイ

    従来的なオンラインストアではなくPWAを用いることによって、Koalaはフロントエンドとバックエンドを並行して作業する柔軟性を得ていると言います。Koalaのデベロッパーは、パフォーマンス向上などに関わる変更を、ライブサイトのダウンタイムなしに迅速にデプロイできるようになりました。

    同様に、ブランドを差別化するフロントエンド側のカスタマイズも、迅速にデプロイできます。この組み合わせにより、魅力的なコンテンツをかなり素早く配信できるのです。たとえばKoalaのヘッドレスアーキテクチャにより、同社は最近、新しいサステナビリティのページを記録的なスピードで構築し、配信できたとBremnerは言います。

    画像提供:Koala

    「わたしたちと同じスピードが得られるなら、ほかの企業は殺しでも何でもやるでしょう」とBremnerは説明します。「Koalaの開発チームのスピードは、構想からプロダクションレベルに至るまでのソリューションを、わたしがほかで見てきたどこのチームよりも3倍早く達成します。これは、よく考えられたデザインシステム、コンポーネントライブラリ、ページテンプレートジェネレーター、そしてCMSの合体によって実現しています。これらすべてがシームレスに統合され、最近のサステナビリティページのような新しいコンテンツを、簡単に生成できるのです。そのため、サステナビリティのマネージャーはコンテンツを書くことに専念でき、エンジニアやデザイナーの作業完了を待つ必要がありませんでした」

    差別化要素2:マイクロサービスのアプローチ

    オンラインのストアフロントを遅くし、カスタマーエクスペリエンスに悪影響を与えている不要な機能を取り除くこともヘッドレス化によって可能になった、という点は重要です。ヘッドレスは、APIの呼び出しをブランドのサーバーに転送することで、ユーザーのブラウザの負荷を軽減できます。バックエンドの機能をユーザー側から切り離し合理化すると、サイトのレスポンスタイムも短縮されます。

    Koalaはこれを、エンタープライズアーキテクチャに対するマイクロサービスアプローチと呼んでいます。マイクロサービスが解決する個々の問題は独自の環境下に分離され、ジョブを実行するのに必要な範囲内でのみ、ほかのサービスに公開されます。マイクロサービスはそこに依存するものから独立し、潜在的には独自のデータベースと継続的な統合パイプラインを通じて、動作します。別のチームが所有することもできます。

    たとえば、Koalaは最近、PWAの中でショッピングカートのマイクロサービスを構築し、ユーザーの割引利用や複数商品のバンドルをしやすくしました。

    「さまざまな割引やバンドル販売を処理するシナリオにおいて、われわれのPWAではクライアントサイドのロジックが多すぎることがわかりました」とBremnerは振り返ります。「コードが肥大化し、バグが多くなりました。技術的負債としてこれらが飽和点に達したとき、わたしたちはPWAShopifyの間で機能する単一のマイクロサービスを構築して、すべてのビジネスルールを処理させることを決めました。そのおかげでクライアントサイドのJavaScriptが大幅に削減でき、ページサイズの縮小と簡素化を実現しました」

    ショッピングカードのマイクロサービスにより、Koalaのユーザーが枕などのアクセサリーを簡単にバンドル購入できる点に注目してください。

    画像提供:Koala

    またマイクロサービスは、ブランドが依存関係の管理やサービスの再利用、メンテナンスの実施を、より簡単におこなえるようにしています。

    差別化要素3:カスタマイズされた体験

    Koalaはとくにヘルプページに自信をもっています。このページは説得を必要としているお客さまをコンバートするうえで重要です。使用されるデバイスによって、ユーザーエクスペリエンスが見た目において異なるだけでなく、機能も異なってきます。ヘッドレスのアーキテクチャがなければ、セグメントごとにカスタマイズされた体験をさまざまなデバイス全般において提供することは、より困難であるとKoalaは示唆しています。

    以下がデスクトップ画面です。

    画像提供:Koala

    こちらがモバイル版です。スリム化されたこちらのバージョンでは、個々の質問ではなくテーマを選択するようになっている点に注目してください。目的は、ユーザーが質問の答えを得る時間を短縮することです。

    画像提供:Koala

    「コンテンツは、デバイスに関係なく同一です」とBremnerは言います。「ヘッドレスだと、ターゲットを絞った体験を提供したり、同じページを見ている特定の層に異なるコンテンツを届けたりすることも、われわれが望めば可能なのです」

    PWAとは別に、Koalaがヘッドレスコマースに移行したことで、カスタムインフラストラクチャーを構築することも可能となりました。そこには下記のものが含まれます。

    ・一元化されたデータウェアハウスと顧客データプラットフォーム

    Koalaはすべてのタッチポイントにおいて顧客を追跡することができ、行動データを会社のマーケティングツールに直接プッシュします。これにより技術に詳しくないステークホルダーのアクセスが容易になり、素早い決断や、顧客コホートデータの詳細な分析に時間に回すことが、可能になります。

    ・マーケティングの技術スタック

    クロスチャネルに紐づくプラットフォームはデータウェアハウスと連携して機能します。そのためキャンペーンはインハウスで運用でき、リアルタイムの最適化が可能です。マーケティングプラットフォームがカスタマーサービスやロジスティクスと統合されているので、ネガティブな体験をしたお客さまに費やすマーケティング支出を削減できます。

    ・ロジスティクス

    このプラットフォームは、ビジネスプロセスをシステム全体で自動化し、マニュアルの作業負担を軽減します。さらに、Koalaはショッピングカートからラストマイルまでのフルフィルメントプロセスを管理できるため、いくつかの都市では4時間配達を保証しています。もちろんこれもブランドの差別化要素となります。

    ヘッドレス化のためのチェックリスト

    ヘッドレスコマースは、戦略的な選択肢としてますます重要になってきています。それがあなたにフィットするかどうか、どのように確認すれば良いのでしょうか?

    以下のチェックリストが参考になると思います。

    • 確立されたインフラをすでに持っていて、ほかのツールを既存のテクノロジーにプラットフォーム化するのが大変である
    • フロントエンドとバックエンドの調整が同時におこなえないため、ほかの競合企業よりも動きが遅くなっている気がする
    • ストアフロントの読み込み時間が長すぎる(ユーザーは読み込み完了前にしばしば離脱してしまう)
    • ストアフロントのテーマやテンプレートが思うようにカスタマイズできない仕様になっている
    • iOSAndroidのネイティブアプリがない(または自社のモバイルショッピングアプリが期待に沿うほどにユーザーフレンドリーではない)
    • 現在のECプラットフォームでは実現できないようなユニークなストアフロントを持ちたい(スマートミラー、スマートウォッチ、自動販売機など)

    確立されたインフラを持っている経験豊富な企業でも、またはエンタープライズアーキテクチャを構築している企業でも、上記のリストでいくつか当てはまる項目があるなら、ヘッドレスコマース化はあなたにとって適切といえるでしょう。

    同様に、ビジネスのオペレーションが複雑になってきていて、価格よりも経験で差別化して競争していきたいのであれば、ヘッドレスな未来はあなたのものです。

    さあ、頭を軽くする準備ができたら、今日からヘッドレスコマースを始めましょう!

    原文:Nick Winkler 翻訳:深津望


    ネットショップを開設しよう!

    14日間のShopify無料トライアルはこちら

     

    Shopifyについて、何かお困りのことはございませんか?

    サポートチームが日本語であなたのご質問にお答えいたします。

    support-jp@shopify.com

    トピック: