インスタグラムやフェイスブックでは、もはや定番の「ストーリーズ」。
AMPページのストーリーズが2018年に発表されてから、作成方法の記事などを見てきましたが、テンプレートがあるとはいえ、ただただ面倒くさそう。
そんなネガティブなイメージを持っていたAMPストーリーズですが、ワードプレスのプラグインで簡単にできました。
AMP Storiesとは
簡単に言えば、ビデオやアニメーションを使って、WEB上で表示する紙芝居的なスライドページです。
スライド式なので、順を追って観ていくのが、インスタグラムよりも、「ストーリー」って感じがしますね。
参考AMP Storiesページ ビヨンセと宇宙のページ。

スマホ等の場合はフルスクリーンで表示され、AMPの機能を使ってるので表示速度も速く表示されるはず。
AMPについて詳しくはこちら
AMP対応は必要か?メリットなど実際に1年以上運用して感じたこと
ストーリーズという名前ですが、先に有名なインスタグラムとは違い、AMP Storiesは24時間で消えません。
おそらく、AMP Storiesは動画とブログの間のような、動画を観るのも、ブログや記事を読むのもしんどいなぁという時間のない現代人にピッタリなところのコンテンツを狙ってるのだろうなと思います。
インスタグラムは「今」を共有する用途で、そういう部分では似てるようでまったく別物ですね。
2018年の2月に発表されてから1年以上経ってますが、まだまだテスト段階な感じなので、仕様はこれから変わるかもしれませんし、最悪なくなる!?って事もあるかもしれません。
ワードプレスのプラグインで簡単導入
AMP公式のプラグインをインストールします。

それとAMP Storiesの機能を使うには最新のグーテンベルグのプラグインも必要です。

上記をインストールして、AMP設定画面を開き、「Stories」にチェックを入れて保存で設定完了です。

AMP Stories作成方法
Storiesの設定をオンにするとサイドメニューに「Stories」が追加されます。

投稿の新規作成と同じようにタイトル入力して、タイトルを押すとURLの変更ができます。
ページ内に要素を追加するときは上部のアイコンから選んで追加する形です。
基本的にドラッグアンドドロップでテキストや画像の、位置や大きさ等、要素を変更できます。

Background Color
背景の色の設定
Background Media
背景に設定する画像や動画の設定
Page Settings
次のページへ切り替わるのを手動か自動で切り替わるかの設定
- Manual 手動
- Automatic 全体の長さに合わして自動切換え
- After a certain time 指定した時間の後、切り替え
- After media has played 再生が終わったら切り替え

スタイル
角を丸角にするか。画像も同じように丸角にするか設定できます。
Text Settings
フォントや見出しタグの設定
Animation
表示した際のアニメーションの設定ができます。画像も同じように設定できます。
という感じで、視覚的に作成でき、普段からワードプレスのブロックエディタを触ってる方なら、すぐにわかるはずです。
Beta版は、日本語対応はされていませんが、クロームの翻訳で十分理解できる内容です。
AMP Storiesプラグイン気になったところ
デザイン性が薄い
現状、デザインに関してパワーポイントレベルのクオリティという感じです。
(パワーポイントもすごいのはすごいと思います!)
写真や動画をメインで見せるのであれば問題ないかなと思いますが、テキストボックスの余白を自由に調整できるとか、あるとまだマシかな思います。
正直、デザイン性はありませんが、2019年7月現在、まだBeta版なので、今後のアップデートや正式版ではデザイン性も良くなるかもしれません。
フォント・スタンプがない
フォントも変更できますが、おそらく見た限りでは日本語フォントがありません。
あと、スタンプなんかもあると、使い勝手がだいぶよくなるのではないかなと思います。
AMP Storiesの一覧ページはない
そもそも、AMP Storiesにそういう一覧ページとかという概念があるかわからないですが、一覧を表示するには自作で作るか、テーマの対応を待つしかないという感じですかね。
なので、作成したら「はい終わり」ではなく、インデックスされるようにページに張り付けたりサーチコンソールに登録したりする必要がありそうです。
プラグイン以外でAMP Storiesを作る
プラグイン以外にもブラウザ上で作成できるMakeStoriesというサービスもあります。
こちらはデザイン性も良く、テンプレートもあるので便利なのですが、少し重たい印象。
操作中にサクサク動かず、モタついてイライラするのと、なんとなく雰囲気でわかりますが翻訳されてないのもあり、全体的に使いにくい印象でした。
AMP Storiesプラグイン導入まとめ
AMP対応ワードプレスのテーマ(ライオンブログ、Cocoon)を使い始めてから、ワードプレスのAMPプラグインなんて、デザインも固定されるし、使えないイメージがあり、ぜんぜん使ってませんでした。
たまたま、AMP対応していないテーマを触っているときに、プラグインでAMPを実装しようとしたら、設定に「AMP Stories」の文字。
実際に使ってみて、めちゃくちゃ簡単・シンプルで使いやすかったので紹介しました。
視覚的に操作できるから早い
プラグインなしでソースを直接、作成する方法も、冒頭で「面倒くさそう」と書きましたが、テンプレがあるので、さほど難しくはありません。
ですが、ビジュアル的要素の強いAMP Stories、視覚的に作成できるのは圧倒的に楽にです。
自己紹介のプレゼンに
まだまだ、いろいろ試す段階だとは思いますが、自己紹介等は圧倒的にAMP Storiesを使った方がわかりやすいと思います。
SEOの対策かもしれませんが、たまーにめちゃくちゃ長いプロフィールページのブログを見ると、結果見ないですもんね。。。
流行れば、ページ作成でビジネスの幅が広がると思うので、覚えといて損はなさそうですね。
コメント