増田速報βは増田の人気記事まとめです
つくりました。開発途中なのでタイトルの最後にβを付けてみました。
増田(はてな匿名ダイアリー)で話題の記事を2chまとめ風にまとめるウェブサービスです。
工夫したところ
僕は昔から僕が作ったものに対して「それについてレポートせよ」と命令されても何も書けないアホです。でも今日は頑張って書いてみます。
トップページから旬な記事をすぐに見れるように
正直、ブログのトップページってどれも見づらすぎです。タイトルとブクマ数だけあればいいのです。僕はそこしか見ていません。
そして増田のトップページは見づらさの頂点です。一人でもあれを利用している人がいるのかと疑問です。なので今まで僕は誰かが作った増田あんてなというJavaScriptで増田のfeedを引っ張ってきて表示するサイトを利用していました。
スマホでも見やすく
今まで作ったサービスの中でもうまくスマホに対応できた方だと思います。CSSとか苦手なので大変でした。Twitter Bootstrapを使って頑張りました。
Twitter Bootstrapは個人的に少し重いのです。しかし、他のCSS Frameworkを覚えて使うのは面倒だし、1から作るのはもっと面倒なので結局Bootstrapです。
iPhoneでトップページを開くとこんな感じ。
ちなみにiPhoneアプリの「2ch MATOME」という2chまとめのまとめアプリを大変に参考にして作りました。あれは良いアプリです。
増田速報βのロゴ
僕は字が下手です。しかし絵には自信があります。
2chまとめブログは大体優れたロゴを持っています。増田速報βはかなり2chまとめに近い存在です。なので優れたロゴを付けない訳にはいきません。
ロゴを書くにはペイントソフトが必要です。僕はmspaintの他にも2つフリーのソフトを知っていました。PixiaとGIMPです。どちらも前に使ったことがあります。イメージはどちらも共通です。
- 起動するのに30分くらいかかる
- ウィンドウが100個くらいある
- 絵が描けない
そこで絵を描きたい僕は他のフリーペイントソフトを当たることにしました。mspaintはペンタブの筆圧に対してなんの反応も示さないのでボツです。
Google先生に聞くとFireAlpacaというものを紹介してもらえました。
はてブ数もかなり多いし、紹介ページは綺麗だし、アニメとかの専門学校の名前が沢山あるし、アルパカ。これはFire Alpacaをインストールしても間違いではないということです。そして実際にそれは間違いではありませんでした。すぐに起動するし、ウィンドウもひとつしかないし、絵がかけます。PixiaとGIMPはどちらもuninstallさせていただきました。
できたロゴはこちら。
最高にはっぴー。
トラックバックと人気のブコメを同一ページに表示
元増田を見たら絶対トラバとブコメを見たくなってしまうものです。しかし公式はどうも見づらい。
トラックバックなんかタイトル横のちっさい矢印をぽちぽち押してロードを待ってポチポチ押してロードを待って...面倒くさすぎです。
更にはてブで一緒に付けられたコメントも見たいです。
そこで全てがスクロールで見えるようにしました。
記事の最後にははてブのページから人気コメントだけ持ってきてスター付きで表示しています。大抵のブコメに意味はありませんのでこれでいいのです。
トラックバックの表示の仕方
トラックバックは公式ではインデントで表示されています。Python！
しかしいざ実装してみるとかなり見づらくなってしまいました。なのでトラックバックにナンバーをつけて、2chでいう安価をつけることにしました。(だからビジュアルが2ch風なのです)
実はこのアイディア、はてなのまとめとかいうコンセプトが全く一緒のサイトからパクりました。しかしそのサイトはトラックバックに付けられたナンバーが元ページでの表示順であり、投稿時間順ではありません！
もう書くことない
タイトルに「速報」が含まれる多くの2chまとめブログと同様に何が「速報」なのかわからないサイトですね。
そのうちコメント機能とかも実装するかもしれません。