📲

SNSからWeb漫画ランキングを自動生成したら、話題の漫画が集まった【個人開発】

2022/04/17に公開約2,800字

はじめに

Web漫画のランキングサービスをリリースしました。
SNSで話題になっている漫画を探すのに便利です。

http://bookle.work/

サービス概要

はてなブックマークやTwitterからWeb漫画のブックマーク数やツイート数などを収集し、漫画の人気度をスコア化してランキング表示するサービスです

  • 特徴
    • 手間をかけずに人気の漫画を発見できる
    • 広く情報収集して自動判定するため、特定のサービスや個人の嗜好の影響を受けにくい

サービス概要

なぜ開発したのか?

いろいろなサイトでWeb漫画が公開されていますが、私自身は時々SNSで話題になったものを読む程度で、あまり積極的に読んでいませんでした。一番の理由は、多数の漫画の中から読む漫画を選ぶのが面倒だからです。
そのような読み方をしていると、面白い漫画を見つけたときに、なんでもっと早く気付かなかったんだ!とか、もう無料公開終わっちゃってるじゃん!と後悔することがあります
また、良い漫画が多くの人に読まれなかったら、大変もったいないですよね。

そんな漠然とした不満を感じつつも、仕方ないと諦めていましたが、ソーシャルブックマークやSNSから漫画ランキングを作れば解決できると考え、bookleを開発しました。

仕様

アーキテクチャ

アーキテクチャ

  • インフラ:AWS(S3、EC2、Elastic Beanstalk、Route 53)
  • フロントエンド:Bootstrap
  • Webアプリケーションフレームワーク:Django(Python)
  • DB:Elasticsearch

重要なのは漫画をスコア化なので、それ以外はできるだけ手間を省き効率的に開発を進めます。

インフラの構築や管理はAWSを活用。スコア化処理とDBは一つのEC2インスタンスに同居させます。WebサーバはAWSのElastic Beanstalkを利用することで、構築と管理の手間を減らします。Elastic Beanstalkは自由度と管理しやすさのバランスが良いので、個人的に気に入っているサービスです。

開発効率を高めるため、開発言語は普段から使っているPythonに統一します。また、Clean Architectureをベースとします。

Webアプリケーションフレームワークは、管理機能など備えたDjangoを採用。また、将来に検索機能などを追加する可能性があるため、DBは全文検索が高速なElasticsearch

フロントエンドはあまり得意でないため、Bootstrapによるシンプルな静的ページとします

開発のポイント

話題のWeb漫画を提示する

人気ランキング

漫画の順位付けに使うスコアを、以下の値の重み付き和により算出します。例えばtweetと、もっと気軽にできるlikeの数を同じ重みで扱うのは不公平なので、tweet数の方がスコアへの影響度が高くなるように重みを付けます。

  • はてなブックマークのブックマーク
  • Twitterのtweet、retweet、reply、like、quote

また、過去にバズった漫画が常に上位に表示されると新しい漫画が探しにくいので、スコアの伸び率なども考慮してランキング表示します。

新着ランキング

前述の人気ランキングは、すでに多くの人に注目されている漫画を見つけるのには非常に有用ですが、まだ少数にしか注目されていないけれど将来人気になりそうな漫画は上位になりません。そのため、スコアが閾値以上の漫画を新着順に表示する新着ランキングも用意します。SNSなどを手作業で巡回するよりも広く効率的に漫画を探すことができます。

効率的に開発する

フロントエンドについては、オリジナルのCSSはほとんどなく、ほぼすべてBootstrapで組みます。アイコンはフリー素材を利用。WebサーバはElastic Beanstalkに構築や管理を任せ、フロントエンドまわりはかなり工数を削減できました

開発言語をPythonに統一したのも効果的でした。過去に異なる言語でフロントエンド(Dart)とバックエンド(Python)を個人開発していたときと比べると、頭の切り替えがいらないので精神的な負荷がかなり減りますし、ライブラリの共有も容易です。
Elasticsearchについては、多数の検索結果の取得(scroll)や集計(Aggs)の使い方にはじめは戸惑いましたが、公式ドキュメントが非常に充実しているため、すぐに慣れました。

低コストで高パフォーマンス

低コストに関しては、序盤は開発効率を優先して余裕のあるスペックで開発を進め、中盤以降で安定的に動作するようになってからコスト削減を進めました。はじめからコスト削減を意識してしまうと開発効率が落ちますし、局所的なコスト削減になってしまうので、この進め方はよかったと思います。削減前の維持費は約12,000円/月程度で、そもそもそこまで高くはないのですが、削減後は1/10程度に維持費を圧縮することができました。(削減方法については、別途投稿します。)

高パフォーマンスに関しては、スコア化や集計などはすべてバッチ処理してDBに保存し、Webサーバから要求があったときはそれを読み出すだけにすることで実現しました。ハイスペックなインスタンスを使っているわけではありませんが、ストレスを感じることなくUI表示できています。

最後に

実はWebサービスの個人開発は今回が初めてなのですが、毎日使いたくなるような便利なサービスができたと思います。また、開発にあたって、はてなブックマーク、Twitter、各漫画サイトに大変感謝いたします。引き続き、Web漫画の発展に貢献できるようなサービスとなるよう改良を続けていきたいと思います。

Discussion

ログインするとコメントできます