このストーリーズをInstagramのようなアプリを利用せずとも、ノーコードで簡単に作れてしまうのがMakeStoriesです。Webベースであるため、作成後に発行されるURLをホームページやECサイトに実装することもできますし、モバイルアプリに対してもWebviewの機能を用いて表示可能です。つまり、利用するシチュエーションを選びません。後半では実際に、弊社のプロダクトであるYappliで作ったアプリに表示した様子をお見せしますので、ぜひ最後までご覧ください！

MakeStoriesの紹介映像

MakeStoriesは、一言で表現するならば「ノーコードで簡単にデザイン・リリース・運用ができるストーリーズ特化クラウドサービス」です。ストーリーズを作るだけではなく、一般的なクラウドサービスと同様にクリックのみでリリースを完了させることができ、さらにアクセス解析も行うことができます。下記がサービスサイトに掲載されているほんの一例ですが、デザインに疎い私でもこのレベルの成果物を簡単に作ることが可能です。

2018年創業の比較的新しい企業ですが、既に多数の機能がリリースされており、細部の使い勝手の良さからは、プロダクトとしてのレベルの高さを感じます。ロレアルパリ、USA TODAY、フォードといった名だたるグローバル企業から信頼を獲得しており、実績は申し分ありません。

次に、利用開始からリリースの流れまでをフェーズに分けて説明していきます。

登録は非常に簡単で、googleアカウントやAppleアカウントを使い、無料登録が可能です。ボタンを押すと、ワークスペースを作成し、管理画面へ遷移することができます。登録の際には言語選択ができるため、日本語を選んでおくのが無難です。

初めは何もストーリーが作られていない初期画面からスタートします。この画面ではフォルダを用途別に作るなどして、整理を簡単に行うことができます。ノーコードプロダクトはコンテンツを大量に作った際に整理が難しくなるため、こういった機能は嬉しいですね。

編集画面に移るには、まず「新しいストーリーを作成する」ボタンをタップします。まずはストーリー名を入力し、作成開始です。

編集画面には、左手にメニュー、中央にスクリーン、右手に詳細設定が表示されます。スクリーンに対してデザインしていく要領で作り上げていくことができます。メニューからは背景設定やテンプレート、画像やイラストを選択してスクリーンに配置する方法とスクリーン右手のバーから配置する方法があります。いずれの方法も、リテラシーに関係なく、直感的に操作ができるかと思います。

画像や動画をアップロードすることで、スクリーンに配置することも可能です。仮にそれらがスクリーンの縦横比と合わなかったとしても、簡単にフィットしてくれるため余計なサイズ加工作業を行う必要がありません。なお、Instagramとの連携機能も備えているため、企業アカウントでログインすれば、過去にアップした画像や動画をMakeStoriesに保存して使いまわすことで工数を大幅に削減することができます。ストーリーズは画像、動画が基本的には背景となり、その後にメッセージや装飾を施していくこととなります。

装飾としては、次のようなものが配置できます。

• 文字列（リンク設定可）
• 丸、四角、星型などのブロック（リンク設定可）
• ロケーションタグ（googleマップへの遷移用）
• クイズ/サーベイ用のアドオン
• スクリーン下固定のリンクボタン

文字列は色やフォント、サイズの変更が可能で、ブロックも組み合わせることによりリッチなメッセージUIが作成されます。さらにリンク設定により、自社の企業サイト、ECサイトなどに遷移させることができるため、コンバージョン施策としても有効です。Instagramでは投稿画像やストーリーズ動画から商品購入に繋げるための導線が設けられている場合がありますよね。同様のアイデアをMakeStoriesにて実現することができるため、Instagramの成功事例をそのまま流用しても良いかもしれません。

他にもロケーションタグの埋め込みはイベントの告知に利用できたり、クイズ/サーベイを設定することでストーリーズから多数決が取れます。このように、考えられる機能はほとんど実装されているのではないか、と言っても過言ではないほどの機能が備わっています。
設定がある程度済んだ後はスクリーン下の再生ボタンにより簡単に動作確認ができるため、別設定に遷移するなど、途中で作業をストップする必要がありません。このような仕様を見ると、いかに作業者のことを思って設計されているかがわかりますね。

確認の結果、リリースに値する品質が担保されていれば、続けて「公開」ボタンをタップし、各種設定を行います。SEO設定、分析関連の設定など、丁寧に公開までのフローが組まれているのが好印象です。最後にドメインと公開するストーリーズのURLを設定すれば、簡単に本番公開まで辿り着くことができます。公開ボタンをタップしてから実際に公開されるまでのタイムラグは30秒ほどのため、全くストレスなく運用が可能です。

無料登録の範囲で1ストーリーズをリリースすることができるため、MakeStoriesで実際に作ったものをノーコードでアプリが開発・運用・分析できるYappliのWebview機能に載せてみました。その様子がこちらの動画です。

ご覧頂くとお分かりになるかと思いますが、ネイティブアプリと見間違うほどのクオリティです。画面を開いた際に一瞬読み込み時間があるものの、ほとんど気にならないかと思います。作成〜公開するまでには30分程度しか要しておらず、とても効率的に素人の私でもそこそこのコンテンツを作成できました。また、他にも別企業のお客様のクリエイティブを使って試作してみたのですが、アパレル、スポーツとの相性は抜群でした。ブランドイメージや躍動感の伝わり方が単なる画像や動画と比較し、より強くなっています。

ここまでは、特にMakeStoriesというプロダクトを中心にご紹介をしてきましたが、Webストーリーズの具体的な活用事例についてもお伝えできればと思います。
他社様がまとめられた調査結果がいくつかあったため、その一つをご紹介させて頂きます。

ここではスポーツ、旅行、ビジネスの事例が掲載されていますが、単なる画像には表現しきれない情報量とインパクトを感じ取れるかと思います。特にアニメーションにより強弱を付けることができるため、飽き対策になるのも新しい発見でした。
海外の事例として、こちらもご覧頂くと面白いと思います。

世界の名だたる企業でもこのようにWebストーリーズにトライしており、明らかに受け手の体験が上がることを実感できるかと思います。個人的に一番気に入っているのはUSA Todayのビヨンセのストーリーズです。ストーリーズ以前にクリエイティブの質が高いのですが、ここまでの質を担保することで、ストーリーズ全体の体験も大きく向上できる良い事例かと思います。ぜこちらもご覧ください。

特に海外ではレガシーな新聞社や雑誌社がオンラインのサブスクリプションサービスに移行しているため、体験の質を向上させるための施策として実施しているという背景があるかもしれません。
ただ皆さんは、なぜここまでWebストーリーズが浸透し始めているかお分かりになるでしょうか。

Webストーリーズは、Googleが推進しているAMP Frameworkを使って作ることができます。つまり、一からコーディングする必要はなく、Googleの推進する仕組みに則って実装ができるわけです。ネイティブアプリのストーリーズとは異なり検索やURLでの共有もできます。つまりは、Googleを中心にWebに特化したストーリーズの仕組みを作ってくれているからこそ、ここまで企業が使うまでになった、ということになります。実際MakeStoriesもAMP Frameworkを裏で利用しているようです。

ノーコード総研を運営する株式会社ヤプリの提供する「Yappli」では、アパレル、スポーツ、教育、行政、ヘルスケアなどあらゆる業界のお客様にご利用頂いており、いわゆるバーティカルSaaSとしてカテゴライズすることができます。このように、広く複数のユースケースが存在するプロダクトにおいては、それぞれに適用可能な汎用性の高い機能が必要です。

また、運用者が事業部門に所属していることが多いため、通常業務と並行して運用ができる程度の簡易な設定が求められます。私は、ストーリーズがこれら両方の条件を持っていると考えています。上述したように、アパレル、スポーツとの相性は抜群、さらに他の業界であっても商品紹介や情報発信への活用は容易に想像できます。運用についても、企業様であれば自社の魅力的なコンテンツを既にお持ちのはずなので、それらを載せて文字で少し装飾するだけで十分です。企業様の多くがSNSでの発信をされているため、それらのコンテンツを使いまわすこともできます。使い回してアプリ用のストーリーズに載せるだけでも十分効果を発揮するのではないでしょうか。

このような考えから、私はMakeStoriesを用いてYappliのお客様のコンテンツでWebストーリーズを作成し、アプリに設定した上で、ヤプリ社内のヒアリングを行ってみました。基本的にはポジティブな声が多く聞かれたものの、MakeStoriesでは忙しいお客様が使ってくれるイメージが湧かない、という意見も多く頂きました。

確かに使い方を覚えるにはある程度時間がかかるのですが、そもそもお客様は魅力的なコンテンツを既にお持ちのため、ストーリーズ特化のデザインに力を入れすぎる必要はありません。そのギャップを埋めれないかと悶々としていたところ、ある日、ヤプリのフロントエンドエンジニアであるこんさんがデモを見せてくれました。

そのデモは、AMP frameworkを用いたWebストーリーズと、ストーリーズに特化したYappliの管理画面でした。こんさんとは元からWebストーリーズについて情報共有をしていたため、空いた時間に実装してくれた、というわけです。最低限必要なストーリーズ自体の機能と管理画面の設定項目で、まさにこれだ、というものでした。昨年末にはこんさんが技術周りについてブログにまとめてくれたため、

ご興味ある方はぜひご覧ください（https://tech.yappli.io/entry/web-stories）

2023年に入ってからも実装は進捗しているようなので、正式に機能としてプラットフォームに組み込まれるかもしれませんね。楽しみに待っていようと思います！

今回は、MakeStoriesというプロダクト、AMP Frameworkの紹介、YappliとWebストーリーズとの可能性について言及しました。Instagramを中心としてストーリーズ機能はあらゆるモバイルアプリで取り入れられている表現ではあるものの、ノーコードで作れてしまうというのは驚きだったのではないでしょうか。今後も面白いノーコードプロダクトの情報を、ヤプリならではの視点で発信して参りますので、お楽しみに！

そこで私たちは、気軽にノーコードで問題解決したい人が集まり情報交換できる場を作りたいと思い、初めてのイベント「ノーコードMeet up」を2月に開催いたします！

お申し込み方法など詳細はこちら
です！皆様のご参加をお待ちしております。