考えすぎてしまう人のブログ

世の中の色んなことをいつも考えすぎてしまう僕の脳内を垂れ流します

【前編】「怖くないキラキラしてないInstagram」を目指して写真投稿SNS「Culon」を作ってみるまでの流れとユーザー獲得戦略について

どうもせせりです:)

「どうやって人を集めるの?」「実際に出来上がる流れを教えてほしい」「モチベーションの維持は?」というコメントを沢山貰ったのですが、作るサービスの種類や性質によってケースバイケースなので実際に一つサービスを作りそれを使って説明しようと思い立ちました

まず、僕がサービスを作る時にどういった流れで作り上げるのか6項目で説明しながら細かいところを解説し

次の記事で実際にどういうところに気をつけているのか書きます

1.サービスのアイデアを固めて「一言でイメージを説明する」

f:id:sesere:20171031085026p:plain

突然ですがみなさんInstagram好きですか?僕は好きです!ただ……

  • Instagramの仕組みは面白い
  • でも自撮りとかアップするのには抵抗があってご飯写真をひたすらアップするだけ or 見るだけ
  • キラキラしてないものを投稿しづらい
  • ゲームのスコアとか上手く行った動画とかサブカル系のものもアップしたい
  • ネット上の友達とかとも使いたい

こういう風に思っていて、もしそういうInstagramがあったら気兼ねなく使えるな

既にTwitterでやられていることなので、おそらく「Twitterで良くない?」と思う方が多いと思います。その意見はもっともなのですがInstagramの楽しさというのはズラッと並んだ写真にあり、あの気持ちよさやワクワク感はどうしても「写真だけ(+動画)」に特化しないと生み出せないと感じています

じゃあこういった事を解決したInstagramを作ればウケるのでは?

f:id:sesere:20171031091638p:plain

……と、こうやって上がってきたふわっとしたアイデアですが、このままでは他の人に説明できないためイメージを一言で共有できる「イラスト」もしくは「テーマ/スローガン」のようなものを用意します

キラキラしてない人向けのInstagram / Twitter寄りのInstagram

今回つけるとしたらこういうテーマになるでしょう、この記事タイトルでは「怖くないキラキラしてないInstagram」と書いていますがイメージを共有できるのであればなんでも良いと思います

f:id:sesere:20171031150212p:plain

テーマは機能、デザインの指標になるだけでなく、開発中の「やっぱり当たらない気がする」というネガティブ感情を減らす事にもなりますし、他の人に話した時にアドバイスが貰いやすいので確実に一番最初に決めておきましょう

あと、全く新規のサービスでない場合は実際のサービス名を入れることでお互いに誤解がなくなるのでサイト上に載せるかはともかく頭の中では実際のサービス名を入れた方が良いです

※イメージって意外とあてにならない

「天然で頭がいいし美人、活発でグイグイ来るタイプの女の子だけど基本的にはクール」よりも「涼宮ハルヒをクールにした感じ」の方が100倍伝わるのと一緒ですね

2.サイトに必要な機能を考える

f:id:sesere:20171031103113p:plain

今回はInstagramという参考元があるのでそれを参考に機能を考えますが……その前に覚えておいて欲しいことがあります

※真似することから逃げない

みんな真似をすることが不安なのか、どうにか真似と思われないようにサービスに独自色をつけようと頑張っているイメージがあります

「●●のパクリじゃん」と言われるのが不安なんだと思います

でも素人の考える独自色って田舎のラーメン屋のオリジナルラーメンくらい微妙なんです、色物なんです

mixiやfacebookがmyspaceのインスパイアであるように、世界は過去の偉大なシステムを真似て発展させることで進化してきました

Twitterなんて何千人が同じシステムを作っているかわかりません(最近流行りのMASTODONもそうですよね)

まずは全く同じサービスを作り、そこから+αもしくは-αをどうするか考えるようにしましょう

大事なのは「誤認させないこと」と「本物ぶらないこと」でありシステムを真似するのは良いがInstagramの派生サービスのように振る舞うのはアウトでそこだけは線引しなければなりません

今回であれば「リア充向け、Facebook(実名)文化」という部分を変更して「それ以外向け、Twitter(匿名)文化」という風に世界観を変えます

世界観が変われば当然デザインも変わってくるのでその程度でも充分独自色はでます

想定するページの機能とURLを出来るだけ書き出す

というわけで、今回必要な機能を実際にInstagramを使ってみて書き出しましょう

参考までにInstagramのフッターを貼っておきますがこれがメイン機能です。URLをここで決めておけば後で悩まずに済みますので出来るだけ決めましょう(ちなみにRESTfulは重視してません)

f:id:sesere:20171031101247p:plain

◆メイン

  • / タイムライン
  • /search 検索
    • /search/category/:category
    • /search/tag/:tag
    • /search/keyword/:keyword
    • /search/user/:name
  • /upload 投稿
  • /alerts 通知
  • /user/:id ユーザーページ
    • /user/:id/follow
    • /user/:id/follower
    • /user/:id/favorite

◆その他

  • /access ログイン/ログアウト
  • /settings 設定

◆ドキュメント

  • /terms 利用規約
  • /privacy プライバシーポリシー

◆それ以外の機能

  • ユーザーをフォローできる
  • 写真には☆favoriteできる
  • 写真にはコメントできる
  • Twitterでログインできる
  • イイね、コメントされた時の通知はメールで送る
  • プロフィールを編集できる

これくらいで良いと思います

完全にやろうと思うと疲れるので出来るだけで十分です

3.ワイヤーフレームを作る

f:id:sesere:20171031095916p:plain

色々なサイトを見て回りどういうサービスにするか考えます

大事なのはいきなり全て実装しようと思わず「出来る限りシンプルに」することです。サービスの特徴を一言で表した時に「写真(+ 動画)を共有するSNS」となるのでその機能を中心にしてそれ以外の機能は流行ってから実装すればいいという気持ちでとにかく見通しを良くしましょう

以下が完成したフレームワークです

f:id:sesere:20171031123532j:plainf:id:sesere:20171031123520j:plainf:id:sesere:20171031123508j:plainf:id:sesere:20171031123515j:plainf:id:sesere:20171031123512j:plainf:id:sesere:20171031123524j:plain

見ての通り作ったのはメイン機能だけです、どうせ作っている間に色々気になって変わるのでざっくりで構いませんが

全く完成形がイメージ出来ていないのに作り出すのだけはNGです、よく「とりあえず仮置きしてあとでデザイン乗せれば良いや」という人が居ますが個人開発の場合それは非常に悪手です

完成形が見えていないとページごとにデザインがブレッブレになるのでTwitterBootstrapなどを使っていても全体的に「素人感」がすごく出ます

個人サービスのデザインは本当に「最低限不快にならないレベル」ならなんでもいいと思っていますがブレるとそれにひっかかります

4.ドメインを決めて必要なサイトに登録する

f:id:sesere:20171031124820p:plain

サービスを作る前にドメインを決めて取りましょう。やる気の維持に必須です

今回は「culon.net」というドメインにしました、意味はとくにありません響きの可愛さです

ドメインと機能が決まれば必要な外部サイトが決まるので作業のペースを落とさないように予め登録しておきます

  • メール送信 sendgrid
  • Twitterログイン twitter
  • 画像などのデータ Amazon S3
  • サーバー類 Conoha
  • パフォーマンス監視 Newrelic
  • アクセス解析 Google Analytics

本番のサーバーの用意もこの段階でしてしまい出来る限り早くURLでアクセスできるようにする

f:id:sesere:20171031123940p:plain

他人に見せたり、外出時のちょっとした時間にテストしたり、モチベーションの維持だったり

とにかくすぐにサーバーにアクセスできるようにしています

「早く作らないとお金が無駄にかかる……」と言うのも自分の追い込みになります:)

5.作る

f:id:sesere:20171031125720p:plain

今回技術的な話には触れませんがRails+riot.jsを使って作ります

6.公開のタイミング

f:id:sesere:20171031132454p:plain

サイトの公開ですが僕はドメインをとった瞬間にツイートしてしまいます

まだ繋がらなくても、バグがあってもいいのでとにかく公開してしまいます

「完成度を高めてから見せたい」という気持ちはわかりますがそう考え出すときりがないですし自分がどれだけ良いものだと思っていてもユーザーさんから100倍良いアイデアがポロっともたらされたりします

普段はおおよそ1ヶ月程度を「αテスト期間」と称して公開しながら開発を行っています

不完全なサイトを垂れ流しているのはメンタルをゴリゴリ削るので追い込みにもなりますし、サイトを気に入ってくれた人や試しに使ってくれた人が少しでもいるだけでやる気がぐんぐん出てきます

まとめ

webサービスが出来上がるまではこんな感じの流れです

「事前準備がどれだけできるか」が非常に大切であり「作りながら考えれば良いや」はエターなる(一生出来ない)可能性が非常に高くなります

サービスができるまでの流れはわかったと思いますので次の記事では「どうやってユーザーを獲得するか?」について考えていることを書く予定です

土曜日くらいに公開するつもりなのでよかったら読んで下さい:)