【個人開発】名刺代わりの10冊メイカーというサービスを作ったけど、恥ずかしくて宣伝してなかった

![Group 17.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/486345/589031be-aeda-9e44-fc32-279b1236f585.png)

## どんなサービス？

10 冊の書籍を画像付きのリンクと共にツイートできるサービス。
- [名刺代わりの10冊メイカー](https://www.tenbooksmaker.com/)

**投稿画面**
![localhost_3000_(iPhone_12_Pro)_(2).png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/486345/9b290035-253c-6b8b-b1da-b83734983a15.png)


**ツイート**
![%E3%82%B9%E3%82%AF%E3%83%AA%E3%83%BC%E3%83%B3%E3%82%B7%E3%83%A7%E3%83%83%E3%83%88_2022-08-13_15.40.00.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/486345/ae96226a-20d0-389d-98ba-02ababe5ac64.png)

## どうして作った？

twitter を徘徊していたら、「名刺代わりの小説10選」というハッシュタグが流れてきた。もともと小説が好きなので、「名刺代わりの小説10選」のハッシュタグを辿ってみると、なかなか活性のいいハッシュタグということがわかった。

ただどのツイートもテキストで小説のタイトルと著者名を羅列しているか、テキスト + 手持ちの書籍を写真でとって添付しているかだった。まず画像を添付するためだけに本棚あさるのはだるいだろうし、写真を撮りたい書籍が手元にない場合だってありそうだなと思って、次にこの紹介されている書籍の詳細をみたいとき、詳細ページへのリンクがあればもっと便利なのになと思った。

この両方の課題は、OGP を使えばいいかんじに解決できそうだなとなって、じゃあつくるか、ツイートからのリンク先にアフィリエイトリンクを設定しておけばマネタイズもできそうだし、活性の高いハッシュタグなので宣伝とかしないでも PV は稼げそう。

## 使用技術

- firebase (firestore, cloud storage, functions)
- vercel
- react/next.js
    - typescript
    - chakra-ui
    - swiper
    - sass

## 工夫、苦労した点

### chakra-ui はじめて使った

はじめて使ったけど、いい感じだった。自分みたいに css のセンスが迷子の人間からすれば、ある程度のレベルを担保してくれるので、とりあえず chakra-ui を入れておけば、見せれないデザインになることはなさそう。

Stack (HStack, VStack) コンポネントについては、実装後半で気づいたので、はじめから使っていればよかったなと思った。

chakra-ui でいちばんいいなと思ったのは、公式ドキュメントがめちゃめちゃ読みやすいこと。

### 楽天 API の網羅性が低いと勘違いしていた

書籍の検索に amazon の PA-API を使おうと思ったけど、なんか素振りの段階でエラーが返ってきて調べたら、「PA-API は amazon アソシエイトの売上がないと使えないよ」ということが書いてあって諦めた。で、楽天 API を使うことにしたのだけど、はじめ公式ドキュメントを読まずに雰囲気で使ってしまっていたため、クエリパラメタに outOfStockFlag を設定していなくて、取得できる書籍の網羅性がめちゃめちゃ低いと勘違いしてしまって頭を抱えていた。

しばらくして outOfStockFlag を設定していないせいで、品切れ商品と販売停止商品を取得できていないだけなのだと公式ドキュメントを読んでて気づいた。

書籍情報取得機能はアプリのコアな機能でもあるので、こういったコアな部分の機能に関わる外部ツールの公式ドキュメントは開発に入る前にちゃんと読むようにしようと反省した。

### デザイン

まだまだデザインダサいので、次またアプリをつくるまでには、すこしでもデザイン力を上げておきたい。何かしらこまめにデザイン関連のアウトプットもできればいいなと思ってる。

### マネタイズ

いちおうマネタイズの導線というのは考えていた。

- twitter で「名刺代わりの小説10選」というハッシュタグの活性がまあまあ良さそうなので、そのハッシュタグ経由で、ツイートの pv はあるていど担保される(想定)
- 「名刺代わりの小説10選」というハッシュタグで投稿されているツイートは、文章のみのものが多かったので、OGP でいい感じの画像を埋め込んでやれば、それなりに目を引いて、リンクを辿ってもらえる
- リンク先の個別ページから気になった本の amazon or 楽天リンクを踏んでくれる

ただこれはぜんぜん想定通りにはいかなかった。ツイートの PV はハッシュタグの恩恵を受けて 1000 pv くらいが担保されて、いいねも 10 - 50 くらいが担保される。でもなんか、いいねをつけているアカウントのほとんどが、このハッシュタグを監視している bot なんじゃないかって気がする。

素人考えで、あんまり深く考えず、とりあえずバズってるハッシュタグに関連するサービスつくればいい感じにバズってくれるだろうっておもってたけど、ぜんぜんそうじゃない。ハッシュタグ駆動で開発するのもびみょいんだなと思った。

## 反省点

### ペルソナをまったく考慮していなかった

今回、かなりハッシュタグ経由でサービスを使ってもらえるだろうというめちゃめちゃ浅い思考でサービスを作ってしまったのが最大の反省点だと思う。じゃあ何を考えてサービスを作ればいいのかということを調べていたら、デザイン思考という言葉で出てきて、なんかサービスを作る前にはペルソナという仮想ユーザを想定してつくるといいみたいなことがかいてあった。

- [デザイン思考とは？フレームワークの5つのプロセスを解説](https://liginc.co.jp/584104)

今回、ペルソナとかまったく考えず開発してしまったので、次はこのデザイン思考というのを組み込んでちゃんとペルソナを想定してサービスを開発したい。

### 宣伝しなかった

あと何かしらアプリの宣伝しないとな、と思ってはいたけれどツイートするだけで 77 人のフォロワーさんのタイムライン以外にこのアプリのリリースをアナウンスしなかったのは本当に怠慢だったとおもう。

せっかく作ったアプリなのだから、恥ずかしがらないでもっと宣伝するべきだった。その反省としていまこの qiita に投稿するための記事を書いてる。

ちゃんと宣伝しないとなという思考になったのはこの記事を読んだから。

- [個人開発者に告ぐ！「告知＝恥ずかしい」を脱却しよう～実例データから重要性を解説](https://zenn.dev/yamatake/articles/b93d87ed134f31)

この投稿を投稿することによってアプリを使ってくれるひとが何人出てくるのかわからないけれども、とりあえず実体験的な手応えとして、qiita に記事を書くとどういうレスポンスがあるのかを知ることができると思うので、えいやと投稿する。

## 終わり

反省すべき点山の如しだけど、作ったからこそ気づけたこともたくさんあったし、得たものもたくさんあったので結果つくってよかった。

リリース当初、ハッシュタグ経由で 10 名くらいの方が使ってくださったのだけれど 10 名が使ってくれただけでもとてもうれしかった。正直、最初の 3 人くらいが使ってくれたところで、つくってよかったーーーっておもった。

次もがんばります🔥