Shopifyの有料テーマStreamlineを実際に使ってみた感想

shopify streamline

shopify(ショッピファイ)でネットショップを作ろうと思っている。有料テーマのStreamline(ストリームライン)はどんな特徴があるのか知りたい。

ネットで「おすすめテーマ○選!」とかの記事はあるけど、実際に使った感想が載っておらず、参考にならなくて困っている。

こんなことを考えている方へ。

この記事のポイントは以下です。

実際に使ってみて分かったStreamline(ストリームライン)の良い点、いまいちな点、このテーマを使うのにおすすめの人

この記事を書いている私は大阪在住のweb制作フリーランスです。

東証一部のEC企業で5年勤務した後、フリーランスに転向しました。現在はウェブサイトを作ったり、ECサイトを作ったり、サイト分析をしたり、ブログを書いたりして生活しています。

shopifyの有料テーマStreamlineを実際に使ってみた感想

shopify streamline

Streamline(ストリームライン)は$180の有料テーマです。ファーストビューに動画を設定できたりと、躍動感のあるデザインが特徴です。

良い点

Streamline(ストリームライン)の良い点は以下。

・ファーストビューに動画を入れることができる
・ファーストビューをPC画像、スマホ画像で分けれる
・動きのあるサイトをノーコードで構築できる
・FAQページ用のテンプレートがある
・全幅用のテンプレートもある

やはり有料テーマだけあって、色々と洗練されています。無料とは違いますね。

では順番に解説していきます。

Streamline(ストリームライン)ではファーストビューに全幅で動画を入れることができます。インパクトのあるファーストビューをつくれます。

これに対応しているテーマってあまりないんですよね。コーディングすれば実装できますが、ノーコードで実装できる点がありがたいです。

shopify streamline

サポート形式は、youtube、mp4、Vimeoです。URL埋め込みで簡単に実装できるのが最大のメリットです。

Supports YouTube, .MP4 and Vimeo. Not all features supported by Vimeo.

shopify streamline

ファーストビューは動画ではなく、画像に変えることもできます。そしてPC画像、スマホ画像で出し分けもできます。この機能も他のテーマにあまりないんですよね。

shopify streamline

ファーストビューの背景画像はobject-fit: cover; で切り取られますが、そうするとデバイス幅が狭くなった時に、表示範囲がおかしくなったりすることがあります。

管理画面からobject-positionの設定もできるので、ある程度はコントロールできますが、100%狙い通りの表示範囲にすることはできません。そんなときに、PCとスマホ画像の出し分けは重宝します。

動きのあるサイトをノーコードで構築できるのが、Streamline(ストリームライン)の最大のメリットでしょう。設定できるアニメーションの動きが激し目なので、スポーティな商材と相性がいいです。

たとえば、以下では、150pxのテキストを右から左へfastで(早く)動かす、というアニメーションを設定しています。

shopify streamline

また、FAQページ用のテンプレートも用意されています。アコーディオン形式でQAを記載できます。これを使えば、shopping guide も作成できます。もちろんノーコードで管理画面から編集可能です。

shopify streamline

画像を大きく見せたいときのために、全幅用のテンプレートも準備されています。

shopify streamline

新しいテンプレートくらいコーディングすればいいじゃないか・・・

と思うかもしれませんが、ノーコードでできるならそれに越したことはないです。サイト関係者が全員コーディングを理解できるわけではないですし。

イマイチな点

Streamline(ストリームライン)のイマイチな点は以下。

・万人受けするデザインではない
・メニューの位置に癖がある

順番に解説します。

まず、万人受けするデザインではないです。デザインを表すキーワードとしては「スポーティ」「動きがある」「激しい」「力強い」といった感じです。

化粧品とか”和”の商材には合わないでしょうね。どのテーマもデザインの特色があるので、商材とブランドコンセプトにあったテーマを選べば良いかと。

あと、メニューの位置に癖があります。

デフォルトでは、PC時にもヘッダーは追従せず左下にハンバーガーメニューが出現します。ただ、管理画面からのカスタマイズでヘッダーを固定に変えることができます。

shopify streamline

スマホ時は画面下にメニューが出現します。日本のサイトではスマホ時のメニューは右上か左上にあることが多いと思います。この辺はトリッキーです。

shopify streamline

Streamline(ストリームライン)がオススメな人

shopifyの有料テーマStreamline(ストリームライン)がおすすめなのは以下の人です。

・スポーツ系や躍動感のあるサイトを作りたい
・結構激しい動きのあるサイトが好き
・ノーコードで完結させたい

Streamline(ストリームライン)はサイトに動きを付けたい人におすすめのテーマです。ノーコードで設定できるアニメーションの種類も多いし、アニメーションのスピードも編集できます。

スポーツ商材と相性がいいですね。

どのくらいカスタマイズしたか?

Streamline(ストリームライン)はスポーツ系のアパレルECで使用しました。ノーコードで一通り構築をして、そのあとデザイナーさんによる調整という形で進みました。

Atlantic(アトランティック)同様に、ノーコードで構築しても十分洗練されたデザインになっています。

この案件では、カスタムフィールドをたくさん使って、オリジナルのページをいくつか作りました。デザイン性を担保しながらもユーザー更新を簡単に行えるようにしています。

外部のアプリを使うことで、shopifyでもカスタムフィールドを使うことができます。使い方はほぼワードプレスのカスタムフィールドと同様です。

デザイン性の高いページをユーザー更新可能な形で実装するときに重宝します。shopify案件では、ほぼ毎回使用しています。

私がよく使うのは以下のカスタムフィールドアプリです。無料で使えるので嬉しいです。

この案件では、結構多くのアプリを導入しました。北米での配送アプリ、チャットアプリ、ポイントプログラムのアプリなどです。なお、クライアントは海外の会社だったので、日本語非対応アプリがほとんどでした。

導入したアプリの一部は以下。

Shopifyでのサイト構築を学ぶのにオススメな教材

私も買いましたが「shopifyとは?」という導入から、実際のストア構築方法に至るまで網羅的に情報が掲載されています。

私も買いましたが、Shopifyでのサイト構築からオーナー権譲渡までを一通り知ることができます。

shopifyは日本語のリファレンスが少なく、独学しようとすると大変です。

ネットで調べたり、Shopifyサポートに直接質問したりして学ぶこともできますが、知識にムラが出たり、そもそも正しい情報でなかったり、というリスクもあります。

今回紹介したのは、両方とも日本語の教材です。

内容も初心者向けなので、

これからshopifyに関わってみたい!

shopify一通り分かっているけれど、抜けてる部分がないか確認したい!

といった方にはとてもおすすめです。

Shopifyで14日間の無料体験をはじめる

・登録にあたってはクレジットカードは不要
・必要なのはメールアドレスだけ
・14日間を過ぎたらサイトは凍結。自動で請求は発生しない
・無料体験中に構築したサイトは本契約後もそのまま使用可能
・無料体験期間中に正式契約しても、無料体験期間が終了するまで月額料金が請求されることはない

まとめ

この記事のポイントをまとめます。

Streamline(ストリームライン)の良い点は以下です。

・ファーストビューに動画を入れることができる
・ファーストビューをPC画像、スマホ画像で分けれる
・動きのあるサイトをノーコードで構築できる
・FAQページ用のテンプレートがある
・全幅用のテンプレートもある

Streamline(ストリームライン)のイマイチな点は以下。

・万人受けするデザインではない
・メニューの位置に癖がある

Streamline(ストリームライン)がおすすめなのは以下の人です。

・スポーツ系や躍動感のあるサイトを作りたい
・結構激しい動きのあるサイトが好き
・ノーコードで完結させたい

今回の記事はここまでです。

この記事を書いた人

hiro

美味しいご飯とお酒と一人旅が好き。EC企業に5年▶︎web制作フリーランスへ。ECサイト制作、デザイン、コーディング、サイト分析、CVR改善、ブログ書いたりして生活しています。

旅行ブログ「アジアをひとりで旅してみたら」も運営中。