ベルリンのITスタートアップで働くジャバ・ザ・ハットリの日記

日本→シンガポール→ベルリンへと流れ着いたソフトウェアエンジニアのブログ

目標にお金を賭けて楽しく達成するウェブサイトを作った。その開発経緯とか

サイト名は「 mobet(モベット)」モは目標の「も」。ベットは「賭ける=懸ける」のbet。ドメインは語呂がよさげなので.gq(ジーキュー)にした。

www.mobet.gq

未達成の時だけ罰金が徴収される仕組み


ダイエット、語学習得、筋トレ、なんかは最初は「やるぞー」となっても3日坊主で終わるのが誰にでもある。そういう時はこのモベットに目標と懸けるお金を登録する。例えばこんなの。

目標の設定

ポイントは「不二子さんはダイエット目標に1000円を懸けて誓ってる」ところ。

で、期限日の12月31日までダイエットをがんばっていただく。

期限日が来ると。。。

期限日になると登録時に設定した判定者に向けてメールが送信される。判定者は友人とか家族とか、まー自分自身でもいいんだけど。例でいくとメールの内容はこんな感じ。


不二子のお母さまへ
今日がおたく不二子のダイエット目標の期限日です。ちゃんと目標は達成しましたか?
どちらかのリンクを押してください。

達成 未達成
お母さんが「達成」リンクを押した場合

よくやりましたね!罰金の引き落としはありません。

お母さんが「未達成」を押した場合

残念でした。賭け金の1000円が罰金として引き落とされる。


自分で決めた目標を自分の意思だけでやりとげる人なんてマレな訳ですよ。そんなに意思が強いわけじゃない。続けるには続くような仕組みが必要。そこでお金のパワーを使って、「今日もちゃんと英語の勉強しないと1ヶ月後に俺様の1万円が引き落とさせるじゃねーか!やらねばー!」とかすればいいでしょう、と。

1万円賭けたって大丈夫。あなたの硬い意思と目標達成によってお金が落ちることは無いはずだから。ポイントはこのサイトを使ってドキドキワクワクするような緊張感を演出すること。

使った技術

- Rails
- React + Redux
- GraphQL
- Stripe
- Netlify


もうこのところウェブアプリを作る時は全部このパターン。特にRails + GraphQL + React/Reduxの相性が良すぎてしばらく技術ポトフォリオはこのままでいいや、と思っている。

開発の経緯

ひとつ前に作ったのが「エンジニアの名言メーゲン
www.meigen.ga

ひとことで言えば、ツイッターカードを使ってこんなのを出すサイト。

このウェブサイト開発で学んだことと反省点が以下。

学んだこと

ツイッターカードの威力はスゲー。
ちょっとしたアプリでもそこにツイッターカードの拡散力を付加すれば思いの外、PVが稼げる。

反省点

儲からん。正直、公開する前から分かってたことだけど、改めて「儲からんなー」と感じた。
多少はPVがあってもエンジニア向けであったりするとそもそも広告はクリックされないし収益性は雀の涙。アドセンス広告を貼っておくってのはグーグル様の鵜飼いの”鵜”状態な訳で、それは決してグーグルが悪いのではなく、そんなプランしか考えてない自分が悪いんだな、と理解した。

そこで次のアプリは「ツイッターカードを使った課金アプリにしよう」と的を絞った。とにかく課金のノウハウが決定的に足りていなかったので強化することにした。

勤め先のスタートアップではインフラとバックエンドを担当しているので、イヤというほど課金周りを実装している。でもそういう会社のプロジェクトで実装して得られる知識って必ずしも個人開発に活かされる訳ではない。

当たり前だけど、会社で「課金システムを実装すること」と「個人でなにか課金できるウェブアプリをイチから考えて実装すること」は違う。

お金を払ってでも欲しいサービスって?

まずお金を払ってでも欲しいサービスを企画することが課題になった。
広告収益モデルにあるような「これは無料だから見てください。気が向いたら広告をクリック」とは明確に違う。で、mobetを作ったのだが、これが「お金を払ってでも欲しいレベル」に行き着いているのかは分からない。はっきりしているのは私は課金型アプリの経験をもっと積む必要があること。

値段の納得感

仮に課金サービスを思いついたとしても次の課題が値段になる。人は値段に納得しなければ買わない。さらに個人開発の場合は企業が提供するサービスと違って、そのプロダクトの質や値段設定について疑いの目で見られがちになる。
しかしmobetの値段設定に文句を言う人は居ないと思う。なぜならご自身で決めていただく値段だし、引き落としも目標に対する結果次第なのだから。

ウェブサイトから発するメッセージ

mobetのウェブサイトから発信するメッセージは100%ポジティブであることに努めた。サイトの収益モデル内容から「管理者のお前はユーザーの目標の未達成を望んでいるのか?」と聞かれても「いや、それは無い」と言い切れるようにした。

合理的な判断だと思っている。もし私が人の目標を応援せずに金儲けだけを考えるようなサイトにしてしまったら、そんなネガティブな発想を持つサイトには誰に寄り付かなくなる。ユーザーはウェブサイトから放たれるメッセージにとても敏感だ。無理にカッコつけていても、わずか数秒で見抜いてしまうぐらいにユーザーは敏感だしある意味、サイト作成者が気付かないことまで見抜く力がユーザーにはある。

なのでmobetはどこまでも「ユーザーがハラハラドキドキ楽しく目標に向かうにはどうすればいいのか?」を考え続けた。掲載する写真、キャッチコピー、サイト内にあるちょっとした文言、全てに対してこの考え方を中心にした。

公開前にご協力いただいた皆様へ

このアプリの公開前にユーザーテストやらアドバイスに多くの方に手伝っていただいた。とても重要なフィードバックやアドバイスをお送りいただいた。ほとんどは閉じた場でのアドバイスだったし、フィードバックも言いたい放題言って欲しかったので匿名性にした。なので**さんありがとー!ってできないけれど、皆さん感謝してます。


オレも入れたぁああああー!

開発した私も自分の目標を入れた。これ。

f:id:tango_ruby:20181127212538p:plain:w400

自分で作っといてなんだけど入れた瞬間「オレの5000円が。。。やべー!」となってしまった。普通に自分のクレジットカード番号を入れてるし、もう後戻りはできない。期限は12月31日まで。

ぜひ皆さんもよければご一緒にどうぞ。賭け金は100円から可能です。他の方が入れた目標への応援メッセージもじゃんじゃん入れてあげてください。

他にもmobetに関するご感想ご意見をお待ちしています。


www.mobet.gq

有名レストランである映画監督と出逢い、自信がいかに大切で今の私にはそれが無いことを痛感した

ポルトガルを旅行した際にとある有名レストランに行った。そこで偶然にある映画監督と席が隣になりいろいろ話して、自信というものがどれほど大切でカンタンには手に入らないかを思い知らされた。

ポルトガルはひとことで言って素晴らしい国だった。料理が旨く、街が美しく、男も女も愛想が良くてセクシーで、経済状況は悪いかもしれないが、誰もが人生を楽しんでいるようだった。美味いモノを食うことしか趣味の無い私は旅行前に入念に調べて、ある有名レストランを予約した。

f:id:tango_ruby:20181102025041j:plain


レストランに入った時から中央の席で食事をしていた男女のカップルがやたらとカッコいい2人で目についた。その男女はいい感じのレストランの中でもひときわ目立っていたからだ。ウエイターが案内してくれた私たち家族の席はその男女の隣のテーブルだった。

そこの料理はどれも素晴らしく、私はレストランの席でテンションが上がりまくっていた。隣の席に座っていた男女は英語で話をしていたので自然と私も彼らと会話を交わすようになった。するとその彼が映画監督であることが分かった。「おお、そうなんだ」と言いながら、なにげにiPhoneでググってチェックすると彼がベネチアやカンヌで賞を取っている世界的に活躍している映画監督であることが分かった。

「ちょっと今、ググってしまったんだけど、アンタ世界的に活躍してるみたいだね」と言うと彼と一緒に食事していた女優みたいなキレいな女性が笑って「そうよ。新しい彼の映画が先月、日本でも公開されたのよ」と言っていた。

料理は最高に美味いし、周りの人たちとの会話も楽しいし、何ひとつ文句の無い時間を過ごしたのだが、私にはひとつだけ気がかりなことがあった。

私が個人で作ったウェブアプリがあって「ホットチリレビューズ」と名付けた映画レビュー総合サイトだったのだ。今20万件ほどの映画レビューが入ったサイトになってる。当然ながら隣の席に座っていた映画監督のレビューもその場で「ホットチリレビューズ」でチェックした。

そしてiPhoneをその映画監督に見せながら「ねー。ちょっとこれ見てよ。この映画レビューサイト、オレが作ったんだ。20万件のレビューの中にあなたの映画のレビューもたくさん入ってるよ。いいレビューが入ってるよねー」

とは言ってない。

映画レビューサイトのことは一切言ってないし、言えなかった。

彼に出会う前は「個人開発のサイトとしてはまーまーいい線いってんじゃね? 収益も一生遊んで暮らせるほど出てる訳じゃないけど、まーまーいいんじゃね?」ぐらいの認識だった。しかし彼の映画監督として打ち立てた実績と自分のサイトの実績があまりにも違い過ぎて、言い出せなかった。それは心の奥底にある自信の無さでしかない。

世の中には誰にでも気軽に話しかけられる人も居る。例えばトム・クルーズみたいな映画スターに会っても躊躇することもなく「トム・クルーズさん!あなたの映画のファンです!サインください」みたいなことが平気で言える人。

しかしそれにはそこまで自信を必要としない。なぜならその図式はあくまで

トム・クルーズがプロデュースして出演した映画 => それを観るファン

であるだけだからだ。矢印の方向が一方向でしかない。

そんなファンが果たして矢印の方向を逆にしても堂々と同じテンションで言えるだろうか?例えばトム・クルーズに「これは私が書いた映画の脚本です。一度読んで出演を検討してもらえますか?」と言うようなことだ。

自分で書いた脚本 => トム・クルーズが読んで検討する

という図式にしても堂々とそれを出すには、その人に「私にはトム・クルーズが出演に値する脚本が書ける」という自信が必要になる。まともな神経の人なら、自信も実績も無いのに脚本を差し出さないはずだ。

レストランで出会ったその映画監督はなんのためらいも無く、ごくごく普通に自分の映画について話をしてくれた。彼の会話は知的でユーモアがあって、どんな人でも魅了されるだろう。素敵な会話と美味しい料理で見過ごされがちだか、私にとっては彼の心の奥底にある「いい映画を撮っているんだ」という静かな自信は今でも強烈な印象として残っている。そうした自信は内側から湧き出るものであって、偉い先生が「おい、君。自信を持ちたまえ」なんて言っても持てる訳がないし、作ったウェブアプリで**億PVに達したら自信が付きます、という基準も何も無い。

いろんな思いが重なって、私はあのポルトガルの素晴らしい料理と出会いをくれたレストランのことを一生忘れないだろう。

インターネットが出てきてどんなものでもネット上にアップすればそれは即「公開」になる。すると生身の人間を目の前にして「これが私の作ったモノなんです」と誰かに紹介する感覚が薄れてしまう。それはネット上に公開することと似ているようで、まったく違う。本当の意味で誰かに自分の創ったモノを紹介するには自信が必要になる。相手がいいモノを創っていたら、それに相応するぐらいの自信が無ければ難しくなる。

どんなに英語ができるようになっても、どんなに有名なレストランで食事をしても、たった一言「これ、私の作ったモノなんです」というのがどれほど大変か。
いつかあの映画監督のようにどんな人にも自分の創ったモノを紹介できるようになろう、と思った。

その映画監督のレビューリンクはここには貼らない。目の前に映画監督が居る時はなにも言えなかったのに、こんなブログでリンク貼って「この人ですー」ってあまりにもショボ過ぎる行為に自分で自分がイヤになる。オレの品性はそこまで落ちてねーぞ、ということで頑張って自信を付けて、いつかちゃんと紹介させてもらう。


f:id:tango_ruby:20181102025306j:plainf:id:tango_ruby:20181102025342j:plainf:id:tango_ruby:20181102025423j:plainf:id:tango_ruby:20181102025427j:plainf:id:tango_ruby:20181102025431j:plainf:id:tango_ruby:20181102224437j:plainf:id:tango_ruby:20181102025359j:plainf:id:tango_ruby:20181102025345j:plainf:id:tango_ruby:20181102025353j:plainf:id:tango_ruby:20181102025309j:plain
インスタグラムに命賭けてる人ならポルトガルはおすすめ。どこで写真撮っても絵になるし。



tango-ruby.hatenablog.com
tango-ruby.hatenablog.com
tango-ruby.hatenablog.com
tango-ruby.hatenablog.com
tango-ruby.hatenablog.com

プッとくる名言サイトを作った「プログラミングはセックスのようなもの。ひとつのミスに人生を捧げてサポートしなければならない」

いいこと言ってそうに見えるけどなんかプッとくるエンジニア向けの名言を集めたサイトを作った。
わりとこういうのが好きなので。

エンジニアの名言メーゲン
https://www.meigen.ga/

f:id:tango_ruby:20181101213757p:plain


バックグラウンドにきれいな景色の写真を入れて無駄に「いいこと言ってそう」な雰囲気にした。
名言は人気順ということでツイート数順に上から並べている。もし気に入ったのがあって、ツイッターで共有していただければ順位が上がりますよ、と。


f:id:tango_ruby:20181101213850p:plain


無料だから.gaでドメインを取った。「名言. ガー」とでも覚えてください。
https://www.meigen.ga/

ボタンひとつで英語版に切り替わるので英語の勉強にもどうぞ。(学習効果の保証は一切無し)

f:id:tango_ruby:20181101213942p:plain


松下幸之助語録みたいな真面目にありがたい感じのザ・名言みたいなのじゃなくて「いいこと言ってる風でプっとくる」ってのがポイント。

使った技術
ほとんど以前に作った個人開発アプリの使い回しなので実装は一瞬で終わった。

  • Ruby on Rails
  • Netlify
  • React + Redux
  • GraphQL
  • heroku

これ以上にこのウェブアプリに意味は無い。普段から「収益性を考えてないウェブアプリなんかやめてしまえー」とか言ってるわりにこのアプリに収益を得る戦略もなにもない。目的はただ、いいこと言ってそうなエンジニアの名言を集めたいだけ。

先にQiitaで告知したら、わりと反響あってツイッターカードの威力も絶大だし、まーまー勉強になった。このアプリのおかげで次のアプリの方向が定まった。実はこれはちょっとした試作品で最初は公開するつもりはなかった。でもやっぱり作ったモノを公開すると色々あるし、良かったなーと思っている。たとえ試作品でもローカルフォルダに入れっぱなしはもったいない。このアプリもそうだけど、全部無料で公開できてしまう時代なので、とにかく出してしまえばなんかある。

ということで最後はリーナス・トーバルズさんの名言メーゲン。

f:id:tango_ruby:20181101214103p:plain