新しいCanvasエディタでSidekickとチャットしながらShopifyストアをリデザインする方法

Sunlit boutique studio with pastel linen clothes on a wooden rack, a laptop on a stool and a potted plant against blush pink walls

1 min read

夜の9時。年末商戦向けのコレクションは金曜日に公開なのに、トップページにはまだ夏のバナーが残っています。Shopifyのテーマエディタを開き、ずらりと並んだセクションとブロックを眺めながら、あの見出しの文字サイズを決めているのはどれだろうと首をかしげる。そんな経験はありませんか?

Shopifyが出した答えがCanvasです。10月1日に発表された新しいデザインスペースで、Shopifyに組み込まれたAIアシスタント「Sidekick」とチャットするだけで、オンラインストアを作成・編集できます。設定パネルを探し回る代わりに、「メインビジュアルをもっと力強い印象にして」のように入力すれば、ページが変わっていく様子を確認できます。このガイドでは、現実的な初めてのリデザインを一歩ずつ解説し、避けるべき失敗もあわせて紹介します。

Canvasとは何か(そして、まだできないこと)

Shopifyの発表によると、Canvasはストアのすべてのページを横に並べて表示するため、ズームアウトして全体の雰囲気を確認し、ズームインして細部を調整できます。どの要素もクリックして自分で変更できるほか、チャットでSidekickに頼むこともできます。プレビューはモックアップではなくストアの実際のコードなので、アニメーションもそのまま動き、さまざまな画面サイズや商品で確認できます。

最初に知っておきたいポイントが2つあります。

  • Sidekickは実際のテーマファイルを編集します。スクリーンショットを撮って自分の作業をチェックし、仕上げてから渡してくれますが、変更は本物です。
  • Canvasはまだ従来のエディタの代わりにはなりません。Shopify自身が、まだ初期段階で埋めるべき穴があるとはっきり述べています。当面は両方のエディタが併存します。

Shopifyは段階的に提供を進めているため、今日管理画面にCanvasが見当たらなくても、数日後にもう一度確認してみてください。ご利用のプランで使えるかどうかは、公式のCanvasヘルプページで確認できます。

始める前に:安全のためのコピーを作る

ほとんどの人が飛ばしてしまう手順ですが、あとで一番感謝することになるステップです。Sidekickは公開中のテーマのファイルを編集するので、まずは「元に戻す」ボタンを用意しておきましょう。

  1. Shopify管理画面でオンラインストア、続いてテーマを開きます。
  2. 現在のテーマの横にあるアクションメニューを開き、複製を選びます。
  3. コピーの名前を「Canvas前のバックアップ、10月」のように、ひと目でわかるものに変更します。

さらに良いのは、Canvasでの試行錯誤を複製したテーマで行い、心から気に入ったときだけ公開することです。あなたが試している間も、お客様は以前のバージョンで買い物を続けられます。

ステップ別:初めてのCanvasリデザイン

ステップ1:全体を見渡し、気になる点を3つ書き出す

Canvasを開いて、すべてのページを一度に眺めましょう。まだ何も変更しないでください。問題点を3つメモするだけです。よくあるのは、トップページのバナーが季節外れになっている、商品ページがスマホで窮屈に見える、フッターがごちゃごちゃしている、といったものです。短いリストがあれば、あなたもSidekickも的を絞れます。

ステップ2:Sidekickには一度にひとつの仕事を

Sidekickはちょっとした調整からストア全体のリデザインまでこなしますが、1つのメッセージにつき明確な依頼を1つにした方が良い結果が得られます。次の2つのプロンプトを比べてみてください。

  • あいまい:「ホリデーシーズン向けにストアの見た目を良くして。」
  • 明確:「トップページのバナーの文章を、ギフトセットを紹介するホリデー向けのメッセージに差し替えて。背景には当店のダークグリーンを使い、ボタンのリンク先はギフトセットのコレクションのままにして。」

2つ目は、何を変えるか、どのブランドカラーを使うか、そして何を壊してはいけないかをSidekickに伝えています。Shopify自身が紹介したファッションブランドの例は「このメインビジュアルをもっと大胆で雑誌のような雰囲気にして」というごく短いものでしたが、ひとつのセクションに絞っているからこそうまくいくのです。

ステップ3:質問させてあげる

うれしい工夫のひとつが、Sidekickが推測で進めるのではなく、確認の質問をしたり選択肢を提案したりできる点です。「ギフトセットはグリッドとスライダー、どちらで表示しますか?」と聞かれたら、答えてあげましょう。Shopifyによると、Sidekickはあなたの好みや過去のデザインの選択を覚えているので、今いくつか的確に答えておくと、その後の依頼がスムーズになります。

ステップ4:喜ぶ前にスマホ表示を確認する

小規模ストアのアクセスの大半はスマホからです。Canvasでプレビューをモバイルの画面サイズに切り替え、変更したばかりのページをスクロールしてみましょう。不自然に改行されている文字、小さすぎてタップしにくいボタン、商品が切れてしまっている画像がないかをチェックします。おかしな点があれば、そのままSidekickに伝えましょう。「モバイルでは、バナー画像で商品が切れています。小さい画面では商品全体を表示して。」

ステップ5:実際の商品でプレビューする

Canvasでは、主要なページをさまざまな商品やコレクションでプレビューできます。一番の売れ筋商品と、名前が一番長い商品を選びましょう。その2つがきれいに表示されれば、ほかの商品もほぼ問題ありません。

ステップ6:公開して、1週間様子を見る

複製したテーマに満足したら、公開しましょう。その後1週間、Shopifyのストア分析で2つの数字に注目します。コンバージョン率(購入した訪問者の割合)とカート追加率です。どちらかが目に見えて下がったら、バックアップのテーマにワンクリックで戻せます。

そのまま使える5つのプロンプト

小さなストアの出発点としてぴったりです。細かい部分はご自身の内容に置き換えてください。

  1. 「トップページのバナーの下に、短い『当店が選ばれる理由』セクションを追加して。ポイントは3つ:少量ずつ手作り、返品無料、2日以内に発送。」
  2. 「モバイルで商品ページの写真を大きくして、価格を商品名のすぐ下に移動して。」
  3. 「フッターを4つのリンクに絞って:配送、返品、お問い合わせ、Instagram。」
  4. 「ギフトセットのコレクションを使ってホリデー向けのギフトガイドページを作成して。ブランドカラーに合わせつつ、温かく居心地のよい雰囲気にして。」
  5. 「すべてのページで、背景に対して読みにくい文字がないか確認し、コントラストを修正して。」

レイアウトよりも、質の高い商品写真の方が今でも重要です。写真に改善の余地があるなら、小規模セラー向けの新しいAI商品写真ツールキットに関するガイドが、Canvasでのリニューアルと相性抜群です。

避けたいよくある失敗

  • すべてを一度にリデザインする。売上が変化しても、どの編集が原因なのかわからなくなります。変更は週に1か所にしましょう。
  • テーマの複製を省く。Sidekickは慎重ですが、「慎重」は「元に戻せる」と同じではありません。
  • AIに商品説明を一括で書き直させる。レイアウトの手助けはリスクが低いものです。しかし素材、サイズ、配送日数に関する記載を変えるのは別の話なので、公開前に一語一語読んで確認しましょう。
  • チェックアウトまでの流れを忘れる。大きな変更をしたあとは、スマホからテスト注文をして、購入の流れが壊れていないか確かめましょう。

Canvasは今すぐ試す価値がある?

はい、テーマの複製という安全網があれば。ひとりで運営するショップにとって、ストアのリデザインで一番大きなコストはお金ではなく、設定を探し回って失われる夜の時間でした。Canvasはそれを会話に変えてくれます。まだ初期段階でShopifyも不足があることを認めていますが、季節ごとのリニューアルやちょっとしたレイアウトの修正なら、すでに確実に時間を節約できます。Shopifyによると、Sidekickは2026年上半期に2500万回以上のテーマ編集を行ったそうです。つまり、ストアの顔を任せるのはあなたが初めてではありません。

さらに一歩進んで、今後AIショッピングアシスタントがどのようにあなたのストアを閲覧するのかを考えたい方は、小規模セラーがAIチェックアウトエージェントに備える前に基本を整えるべき理由についての記事もご覧ください。

今夜さっそく、上のリストからひとつプロンプトを選んで複製したテーマで試し、Sidekickが一発でうまくやってくれたことをコメントで教えてください。

関連記事

コメントする

上部へスクロール