【事例紹介】爆速で検証を回すためのNotionプロトタイピング
“誰もが気軽に居場所をもてる世の中へ”というミッションを掲げてレンタルスペースサービスikonas(イコナス)を立ち上げ中のArchiTechの伊藤拓也です。
2022年になってから少しずつ検証を進めながら情報を小出しにしてきたikonasですが、GW明けからはいよいよ(プロトタイプのままではありますが)サービスをオープンにして皆さんに使っていただけるようになります！
さて、今月のエントリは"Notionを用いた爆速プロトタイピング"です。
今回ikonasの検証を回していくに当たって弊社ではNotionを使ってプロトタイプを作成したのですが、これがかなり手軽かつスピーディー、アップデートも楽ということで非常に良い感じに仕上がったかなと思うので
立ち上げからその後の改善の流れ
どんなサードパーティーサービスを組み合わせたのか
などシェアしてみようと思います！
スタートアップでプロトタイプの作り方に悩んでいる方や、Notion好きな方に読んでいただけたら嬉しいです。
この記事の中にサービスへのリンクを置いておくので、このエントリを読んでいただいた方は先行してサービスにアクセスしてみてください！！🎉
ikonasはこちらのリンクから！→https://ikonas.jp/
ikonasってどんなサービス？
まずは今ぼくたちが立ち上げようとしているikonasというサービスについて簡単に紹介させてください。
ikonasは"やりたいこと"で仲間を集めてお得に借りれるレンタルスペースサービスです。(以下テキストでの説明も挟みますが、基本的には画像に載ってる情報とほぼ重複するので画像だけスイスイ見ていってもらえばOKです)
特徴としては大きく3つで、
"やりたいこと"を叶えるスペースに出会える！
"やりたいこと"に共感してくれる仲間に出会える！
みんなで借りると安くなる！
特に2つ目の新たな仲間やコミュニティとの出会いが生まれやすい、というところが一番の特徴になります。
利用の流れは大きく3ステップになっていて、
"スペース"と"やりたいこと"を決めて、募集ページを作成
募集ページURLを友だちにシェア
目標人数を集めたらレンタル成立！
従来のレンタルスペースサービスのように、幹事がみんなを代表してすべてを手配するのではなく、幹事はあくまで"言い出しっぺ"でそれにみんなが乗っかることでレンタルを成立させる、という今までになかった借り方になっています。
2月下旬~4月にかけてクローズドで検証を回していく中で、下記のような利用事例がありました。使っていただいた皆さん、ありがとうございました！！
読書会 / 料理 / 交流会 / もくもく会 / ダンス練習 / 写真撮影 / スポーツ観戦 / 映画鑑賞 / 勉強会 / …
この期間中、ぼく自身も自ら企画をしたり、人の企画に参加したり、というのをしまくってきたのですが、
今までよりも企画することに対するハードルがかなり下がりつつ、企画そのものや新しい人との出会いを楽しむことができていてだいぶ気軽に使えるサービスになってきたんじゃないかなと感じてます！！
(プロトタイプなので、まだまだ不便なところもあるのですが、、、)
ikonasはこちらのリンクから！→https://ikonas.jp/
プロトタイプの立ち上げと改善のプロセス
さて、そんなikonasのサービスですが構想がまとまってプロトタイプを作ろう、となったのが1月の下旬です。
既に社内でnotionを使い慣れていたことや、この後に紹介する外部サービスのいくつかはもとから知っていたこともあってnotionでプロトタイプを作ることに決めました。
まずざっくりと手書きでこんな感じのページ構成やどんなデータベースが必要かを整理するのに1日。
構想をもとにNotion上にページを作成していって運用方法含め検討するのに3日くらい、同時にNotion APIを使ってウィジェットを作成したい部分があったのでそこだけエンジニアにお願いをして同じく3日くらい。
最後に細かな調整をラスト1日で行って5日で完成、くらいのスピード感でした。
ちなみに後で紹介する外部サービスのうち、最初の最初から使っていたのはChilipepperとNotion APIの2つになります。
その後は社内でのテスト利用を通して運用目線、利用者目線ですぐに改善できそうな部分がないかをざっくりチェックして即反映。
(Notionでやっていると、この"即反映"がエンジニアに頼む必要もないし、ややこしいデプロイフローを踏む必要もないのが最高ですね！爆速！！)
以降は外部のテストユーザーさんに使ってもらいつつ都度ヒアリングを通してフィードバックをいただき、サービスに取り入れると判断したものは同じく即反映、を繰り返していって少しずつ改善を進めていって今に至ります。
プロトタイプにNotionを選んで良かった点をまとめると、
初期開発および都度のアップデートが爆速でできること
その際に(ほとんど)エンジニアのリソースを使うことなく進められること
の2点かなと感じています。
使った外部サービス
2022年4月末時点でikonasのプロトタイプの開発や運用にあたって利用している(していた)外部サービスは下記の通りです。順に解説します。
サイトの外部公開、カスタマイズ
参加者用のフォーム
ユーザーへのメルマガ配信
運用フローの自動化
参加状況の可視化
Wraptas
一番初期には使っていなかったけど、今となっては一番重要性を感じているツールで、Notionのページを外部に公開しやすいwebサイト化する時に重宝します。(運営がペライチさんと知った時はだいぶびっくりw)
Notionのページに対して独自ドメインの設定やヘッダーの付与、更にはカスタムCSSを割り当ててゴリゴリにデザインをカスタマイズしたり、htmlの追記もできるのでコンテンツを追加したり、<script>タグを埋め込んでアナリティクスを仕込んだりといったこともできます。
https://ikonas.jp/ ←こちらにアクセスした際に最初に表示されるLPもこんな感じの良く分かんないNotionページをひたすらCSS上書きで無理やり作ってますw
Wraptasを教えてくれたブイクックの工藤くんには感謝🙇♂️
Wraptasのサイトはこちらから→https://wraptas.com/
Chilipepper
こちらはNotionのDBと連携させたフォームを作成するためのサービスです。
ぼくたちの場合は、「募集ページから参加者が参加フォームに回答することで参加が完了する」というフローの中心にChilipepperのフォームを据えています。
NotionのDBと接続設定をすることで、フォームへの回答があると自動でNotionのDBに新しいアイテムが作成されて送信内容に基づいて各種プロパティに値が自動入力される、というものなのですがNotionの該当DBをSlack連携させておくことで
フォーム回答→Notion DBのアップデート→Slackへの回答通知
までが手軽に自動化できます。オススメです。
Chilipepperのサイトはこちらから→https://chilipepper.io/
NoCodeLetters
お次はメルマガの配信ツールです。なんとこれもNotionでいけちゃいます。(ただ後述の問題があり、今は利用を控えています。。)
NotionのDBと接続設定をすると、Notionページとして作成したコンテンツがそのままhtmlメールになって指定した日時に一斉送信されます。
こんな感じです。
ただぼくたちが試してみた感じだと受信者によっては迷惑メールに振り分けられてしまったり、Gmailの受信トレイの中でもプロモーションタブに振り分けられちゃったりということが発生したので今は利用を断念しています。
どなたか良い解決方法を知っていましたらぜひ教えてください！🙇♂️
Notionで完結できたほうが絶対に楽なので、この問題が解決されたらすぐにでも利用再開したい。。
NoCodeLettersのサイトはこちらから→https://www.nocodeletters.com/
Zapier
4つ目はZapierです。
このサービスはなにもNotionに限った話ではなく様々なサービス同士を連携させて任意の自動化フローを組める超すぐれものです。
これの紹介だけで記事複数本書けそう。
ぼくたちがプロトタイプを回すにあたって、実はまだまだ裏側でのアナログなオペレーションが大量にあります。
検証回数が増すにつれて、そうしたオペレーション工数にかなりリソースを圧迫されてきたのでいくつかのフローの自動化のために導入しました。
Zapierでできることは簡単に言うと、
トリガーを設定→トリガー発火時の動作の設定
の2つだけです。トリガーと動作の間に更に条件式を組み込むこともできます。
例えばうちだと下記のような部分を自動化しています。
目標人数に到達してレンタルが成立したタイミングでSlackに通知
トリガー=参加者DBに新しいアイテムが作成される
条件式=DBのデータ数が該当募集の目標人数と等しい
動作=Slackに通知する
フォームに回答があると自動返信メールを送信する
トリガー=参加者DBに新しいアイテムが作成される
動作=自動返信メールを送信する
募集締め切りのタイミングでSlackに通知
トリガー=毎朝10時
条件式=今日の日付が募集締め切りの日付と等しい
動作=Slackに通知する
Zapierを導入してかなりオペレーションが楽になりました。
めちゃめちゃオススメですし、ぼくらもまだまだこのツールには可能性を感じています。
Zapierのサイトはこちらから→https://zapier.com/
Notion API
唯一エンジニアの手を借りてしまったので僕からはあまり詳しく書けないのですが、NotionとAPI連携することで任意のDBの情報を自由に抽出・加工できるようになるのでそれを使って好き放題やれちゃいます。(ただしそれなりの開発スキルを要します。。)
僕らがやっているのは下図にあるような募集状況をリアルタイム表示するためのウィジェットの作成です。
実装したウィジェットは別途外部のwebサーバー上でホスティングしていて、そのウィジェットをNotionに埋め込み直す、という形になっているので一連の流れを整理すると、
NotionからAPIを通してデータを抽出→外部サイト上に抽出したデータを利用したウィジェットを作成→作成したウィジェット(=webページ)をNotionに埋め込む
という感じになっています。
正直このNotion APIを自由自在に扱えるようになると、ここまで紹介してきたような他の外部サービスでやっていることも独自に実装できちゃうくらい破壊力があると思っています。
が、そこを追求するくらいなら既にサービス化してくれているものを使うほうが時間も節約できるし動作も安定しているしで、うまく使っていく方が吉ですね。
やりたいことがあって、でもどうしても既存のサードパーティーサービスでは実現できそうにない、という時に頼る最終手段的な位置づけで良いと思います。
Notion APIのサイトはこちらから→https://developers.notion.com/
最後に
技術的な要素が入る記事は気づくと文字数が増えちゃいますね。5,000文字くらいのエントリになっていて自分でもびっくり👀
今回はNotionを使ったプロトタイプの作り方について、自分たちのユースケースに即して紹介をしてきました。この内容がどなたかにとって参考になる情報であったなら嬉しいです。
最後に宣伝になりますが、今日ご紹介したレンタルスペースサービスikonasは下記よりアクセスいただけます。
ikonasはこちらのリンクから！→https://ikonas.jp/
レンタルスペースに興味のある方、共通の趣味をもつ知り合いに出会いたい方、仕事において横のつながりを欲している方など、幅広く使っていただけるサービスなので、ぜひ覗いてみてください！！
サイトに募集事例も載せているので、それを見ていただくともっと利用イメージがつくと思います！！
現時点ではプロトタイプにつき、
利用可能なスペースが少ない、かつ関西圏に限られること
ユーザーさんに自由に募集ページを作成していただくことができないので、募集希望者向けのフォームに回答してもらってぼくらのサポートのもと募集ページを作成するフローになっていること
この２点だけご了承いただけたら嬉しいです。
皆さんからの幅広い利用、心からお待ちしています！！
サービスについてとか、会社についてとか気になっていただいた方いたらぼくのTwitterへのDMもお待ちしてます✨
それでは👋
この記事が気に入ったらサポートをしてみませんか？