「ページ編集」から「ストア全体の設計」へ Shopify Canvasで変わるECサイト制作

こんにちは、GDX株式会社でAIリサーチを担当しているMia Sato(佐藤ミア)です。
最近、Shopifyでオンラインストアを触る機会があり、そこで気になったのが2026年10月1日に発表された新しいデザイン環境「Canvas」です。
最初は「AIを使ってECサイトのUIを簡単に編集する機能なのかな」と思いました。Shopifyにはすでにテーマ編集画面(Theme Editor)があり、Sidekick(ShopifyのAIアシスタント)に「ボタンを丸くして」「文字を大きくして」と依頼してテーマを変更することもできます。
それなら、Canvasは何が新しいのだろう、と気になりました。
調べてみると、私が面白いと感じたのは「AIでデザインできる」という点より、ECサイトを編集するときの「見る範囲」が変わることでした。
これまでは1つのページや一部分を見ながら修正することが多かったのに対し、Canvasでは複数のページ構成を並べ、Sidekickと一緒にストア全体を見ながら変更できます。
今回は、Canvasで制作と運用がどう変わるのかを、ECの視点から考えてみました。
1. Canvas前後で変わるのは「AIの有無」ではなく、編集する単位
Canvasの前から、ShopifyではSidekickを使ってテーマの設定やブロックを編集できました。
つまり、「AIでテーマを変える」こと自体がCanvasで初めてできるようになったわけではありません。
私が感じた違いを簡単に整理すると、次のようになります。
| 観点 | これまで | Canvas |
|---|---|---|
| 編集する単位 | ページやパーツごと | 複数ページを含むストア全体 |
| AIへの伝え方 | 修正内容を細かく分解して伝える | デザインの方向性を伝え、複数ページを見ながら調整 |
| 見る範囲 | そのページがどう見えるか | ページ間のつながりや購買体験まで見る |
例えば、秋冬キャンペーンで「サイト全体をもう少しプレミアムな印象にしたい」という要望があったとします。
これまでは、トップページのメインビジュアル、文字の見せ方、商品一覧ページ、商品詳細ページの購入ボタンなど、抽象的な要望をページやパーツごとの修正指示に分解する必要がありました。
Canvasでは、Sidekickに方向性を伝えながら、複数のページ構成を見比べて調整できます。
ここで減るのは、単なるコーディング時間だけではありません。
「こう見せたい」という意図を、ページごとの細かな修正指示に分解する作業自体が減る。
ここにCanvasの大きなメリットを感じました。
さらに、「ストア全体を見る」ということは、単に複数のページをまとめて編集することではありません。
例えばキャンペーンの場合、トップページで商品に興味を持ってもらい、商品一覧で比較し、商品詳細ページで内容を確認し、最後に購入へ進みます。
商品を知る → 比較する → 詳しく見る → 購入する
Canvasでは複数のページを見比べながら調整できるため、「このページを見た人が次にどこへ進むのか」まで考えやすくなります。
トップページだけをきれいにするのではなく、一連の購買体験をつなげて考えられることに、ストア全体を設計する価値があるのではないかと思いました。
2.「作れるストア」と「売れるストア」は同じではない
AIが複数のページをまたいだ変更案を短時間で作れるようになると、「まず形にして、見ながら決める」という制作方法が取りやすくなります。
例えば、「もう少しミニマルにしたい」と伝えれば、AIに案を作ってもらい、ストア全体を見ながら気になる部分だけ調整するといった進め方ができます。
ただ、ここで大事なのは、AIがストアを作れることと、売れるストアを設計できることは別だということです。
商品画像を大きく見せたほうがよいブランドもあれば、商品の特徴やストーリーを丁寧に伝えたほうが購入につながるブランドもあります。
同じデザインでも、ターゲットとなる顧客、商品の価格帯、ブランドとして何を伝えたいかによって結果は変わります。
Sidekickが複数の案を出してくれたとしても、「どの案が自分たちの顧客に合っているのか」「どこを強く見せるべきか」を判断するのは企業側です。
私は、Canvasによって人の仕事がなくなるというより、細かな制作作業から、「誰に、何を、どの順番で見せるか」を考える仕事へ移っていくのではないかと思いました。
3. Canvasを使える=何でも変えてよい、ではない
レイアウトや余白、文字の大きさ、画像の見せ方などは、比較的AIに任せやすい部分かもしれません。
一方で、購入ボタンの文言、商品情報、価格、割引条件、返品ルール、法律上必要な表示などは、同じように自由に変えてよいものではありません。
現時点のCanvasでは、こうした細かな変更ルールをそのまま設定できるわけではありません。
ShopifyではCanvasを使える人を権限で管理できますが、「その人が何をどこまで変更してよいか」までは会社側で決める必要があります。
私なら、例えば次のように分けます。
| 変更内容 | 運用イメージ |
|---|---|
| レイアウト、余白、画像の見せ方 | 比較的自由に変更 |
| 購入ボタンやキャンペーンの文言 | 公開前に確認 |
| 価格、商品情報、重要な販売条件 | 別途承認が必要 |
Canvasを導入するときは、「誰に使ってもらうか」だけではなく、「何をどこまで任せるか」まで決めておくことが大切です。
4. 意外と大事なのは「どれが最新版か」
さらに、もう1つ気になったのが、「どれを最新版として扱うか」という点です。
Canvasでは、元のデザインとCanvasで編集するデザインが別々に管理されるため、一方の変更がもう一方へ自動で反映されるわけではありません。
そのため私は、次のような流れを先に決めておいたほうがよいと思います。
現在公開しているサイト → Canvasで変更 → 内容を確認 → 本番公開
大事なのは、「今どの状態を正しい最新版として扱うのか」をチームで共有しておくことです。
5. サイト全体を変えるなら、確認もサイト全体で見る
Canvasでは、トップページや商品詳細ページなどを並べて確認したり、表示する商品や画面サイズを変えながら確認したりできます。
複数のページをまとめて変更できるようになると、確認も1ページだけでは十分ではありません。
例えば、トップページでは問題がなくても、商品詳細ページでは購入ボタンの位置がずれているかもしれません。
パソコンではきれいに見えていても、スマートフォンでは画像と文字が重なっている可能性もあります。
トップページ
→ 商品一覧ページ
→ 商品詳細ページ
→ メニュー
→ パソコン/スマートフォン
→ 複数の商品
サイト全体を変更するなら、確認もサイト全体で行う。
作る範囲が広がるなら、確認する範囲も一緒に広げる必要があります。
6. Canvasだけですべての運用ができるわけではない
もちろん、CanvasだけでShopifyのすべてを管理できるわけではありません。
商品情報や価格、在庫などは、これまで通りShopifyの管理画面で扱います。
そのため、「どこまでをCanvasで変更するのか」「どの作業は別の画面で管理するのか」「誰が最後に公開するのか」は、導入前に整理しておく必要があります。
「Canvasで何ができるか」だけではなく、今あるEC運用の中でCanvasをどこに組み込むかを考えることが大切だと思います。
7.「ページを直す」から「購買体験を設計する」へ
Canvasを調べる前、私は「ShopifyがAIでサイトをもっと簡単に編集できるようにした」というアップデートだと思っていました。
でも、調べていく中で一番面白いと感じたのは、AIがデザインを作れることそのものではありませんでした。
これまでページごとに考えていたECサイト制作を、商品を知ってから購入するまでの流れとして、ストア全体で考えやすくなることです。
一方で、AIが複数の案をすぐに作れるようになっても、「どの構成なら売れるのか」まで自動的に決まるわけではありません。
ターゲットとなる顧客、商品の特徴、価格帯、ブランドとして何を伝えたいかを踏まえて、最終的な方向性を決める必要があります。
AIに変更案を作ってもらう
→ ストア全体で確認する
→ 顧客がどの順番で情報を見るかを考える
→ 自分たちの顧客に合う構成を選ぶ
→ 必要な確認をしたうえで公開する
こうした流れまで含めて考えることで、Canvasの「早く作れる」というメリットを、実際の売上や購買体験の改善につなげやすくなると思います。
AIが「どう作るか」を支援するほど、人には「誰に、何を、どう見せれば購入につながるのか」を設計する力が求められる。
私は、Canvasは単なる新しいデザインツールではなく、EC担当者の仕事を「ページを直す」ことから、顧客の購買体験をストア全体で設計することへ広げていく機能なのではないかと感じました。
参考文献
- 参考(公式):Shopify ヘルプセンター「Canvas」/ Shopify ヘルプセンター
- 参考(公式):Shopify ヘルプセンター「Sidekick によるヘルプとガイダンスの取得」/ Shopify ヘルプセンター
- 参考(公式):Shopify Editions「26年冬」/ Shopify Editions
- 参考(公式):Shopify「Introducing Canvas: Opening the aperture on online store design」/ Shopify公式
※本文の一部はAIの支援を受けて作成し、筆者が内容を確認したうえで加筆・修正しています。内容は筆者個人の見解であり、GDX株式会社の公式見解・声明を示すものではありません。

