Twitterにシェアできる「あ」占いを作った話。【個人開発】
こんにちは、かしわ(@kasiwa9494)と申します。
1年前ほどからプログラミングを勉強し始めて、一人でwebサービス作ってます。
今回、新しいサービスを作りました。
何を作ったのか?
「あ」占い
名前を入れるだけで、自分に適した「あ」を診断できるWebサービスです。
なぜ、作ったのか?
最近、幽遊白書という漫画にハマっています。
中学の頃はバトルシーンが好きだったのですが、
今読み返すと、海藤VS蔵馬の言葉遊びの頭脳バトルにめちゃくちゃ興奮しました。
そこから、言葉遊びのWebサービスを作ってみたいと考え、参考になる動画を探していました。
そこで、ダウンタウンのあ研究家という漫才を見つけました。
この動画自体はかなり古いのですが、めちゃくちゃ面白かったです。
よって、あ研究家をかるた風にWebサービスとして体験できたらいいなと考え、
今回、「あ」占いを作りました。
どうやって、作ったのか?
作った技術
Nuxt.js
Netlify上でホスティングしています。
SPAで作っています。
Netlify
SPAで動的ページのOGPを使えるようにするために
Netlifyのプレレンダリング機能を活用しています。
毎度毎度、お世話になっている便利な機能です👏👏👏
TypeScript
コンポーネント間のデータの受け渡しで
どういう型か判断でき、コードが見やすいです。
みんな大好きいらすとや
今回利用させていただいたフリー素材サイトは
毎度お世話になりまくりのいらすとや
いつもありがとうございます🙏
Twitterにシェアしたらどう見えるのか
以前、作ったお菓子センス診断というWebサービスがあるのですが、
診断結果をTwitterに共有すると、
これは、正直、文字が見えにくいです。
作っているときに、配色にはこだわっていたのですが、
共有したときに 「SNSで目立たせる」 ことを意識していませんでした、、、
ですので、「あ」占いは 「シェアしたときに目立たせる」 ことを心がけて、作りました!
タイムラインでこのツイートが回ってくれば、少なくとも、
めちゃくちゃでかいサイズの「あ」は第三者の目をひくきっかけになると思います。
さらに、配色も白黒のおかげで、多少、文字が小さくても視認しやすいようにしています。
どのくらいの期間で作ったのか?
3日で作れました!!!
作業時間としては、10~20時間ぐらいだと思います。
簡単に実装できる診断系サービスですが、効率よく実装できて良かったです!!!
今後の展望は?
診断系サービスを作るのは楽しいですが、ユーザーがやれることの自由度が少ないと感じてます。
一人が面白いものを作ったら、サービスに共有して、みんなが簡単に使える。
自由度が高く、面白いものを大人数で楽しむサービスを作りたいです。
あなたに適した「あ」は???
ぜひ、占ってみてください
今回の振り返り
診断系サービスは一度作れば、基本的に同じ構造なので効率よく制作できました(笑)
今回作った「あ」占いで、合計4つのサービスを作ることができました!!!
何より、サービスをリリースする度、
使ってくれる人に感謝を忘れずにこれからも精進していきます🙏
ここまで読んでくれた方へ
以上、Twitterにシェアできる「あ」占いを作った話でした。
ここまで読んでくださりありがとうございました。
いいねやコメント、SNSでの共有等をしてくださると、めちゃくちゃ嬉しいです。
良かったら、ツイッター(@kasiwa9494)フォローしてください。
Discussion