Creazy!

WEBエンジニア・ヤガーのテック・ガジェットブログ

WebService 開発実績

「TwitGIF」TwitterのつぶやきをアニメーションGIF画像にしてくれるジェネレーター

投稿日:


TwitGIF
TwitGIF という Twitter Badge Generator を作りましたので公開します。
TwitGIF : Generate a GIF Animation Image Badge From Your Tweets.
※というかTwitterでつぶやいておいたら、もうブックマークされていましたね。
 ありがとうございます
TwitGIF は、Twitterのユーザー名を入力するだけであなたのつぶやきを簡単にアニメーションGIF形式のbadge(ブログパーツ)に変換してくれるジェネレーターです。
最大10件までのつぶやきを表示できますが、アニメーション形式でローテーションさせて表示させるため小さいスペースにも利用できます。また、出力されるコードはIMGタグなのでJavaScriptやFlashが使えないブログにも貼り付ける事ができます。
Twitter / yager
こんなのができます
ログインなどは不要です。最低限Twitterユーザー名を入力してボタンさえ押せば作成できますので試しにやってみて下さい。


使い方は簡単だと思うので特に細かく説明する事もないですね。
ここでは、ちょっと横道にそれた話し等を書こうかと思います。

開発の経緯

実はかなり前にtwignatureというTwitter用署名画像ジェネレーターを作っていて、更にJavaScriptのBadge(ブログパーツ)についての説明エントリーも書いていたので「Twitterのつぶやきを画像化」というアイデア自体は1年前くらいからありました。
で、実際サンプルも作ってみて最新のつぶやきを拾って画像化っていうのは簡単にできたんだけど良いデザインが思い付かなくてお蔵入りさせてました。デザインの自由度で言えばJavaScriptで何とでもなっちゃうし。
そんなこんなで完全に存在を忘れていた頃に百式にこんなエントリーがでてて(Twitsig)、「日本語化けるし、見た目が・・・」とガックリきつつ自分のサンプルを思い出したんだけど、自分のも今ひとつパンチがなく公開するまでには盛り上がらず。
更に、こんなBadgeも見つけて「やっぱり何件かのつぶやきをスライドして表示させるのはいいなぁ。でもFlashかぁ」とここでも煮え切らず。
少し、もんもんと考えてみて「省スペースに複数のつぶやきが表示できて、なるべく多くの環境に対応できる形式」を満たすのはアニメーションGIFなんじゃないかと思い付いた。
アニメーションGIFなんて、すでに枯れた技術で忘れ去られているかもしれないけど、枯れているからこそ色んな環境で有効だと思い実装に移ったというわけ。

仕組みについて

ちょっと技術的なトピックも書いてみる。たいそうな事じゃないけど。

  • JSON APIから呟きデータを取得
    • http://twitter.com/statuses/user_timeline/{ Twitter ID }.json?count=10
    • Twitterの公式JavaScript Badgeで使用されているAPIで公開されているものなので回数制限はないはず。
    • このJSON形式をパースして利用します。
  • Twitterの負荷対策とキャッシュ
    • Twitterは良く(落ちている|重い)のでJSON APIから10秒待ってもレスポンスが無い場合は処理を終了します。
    • データの取得にはcURLを使ったんだけどCURLOPT_TIMEOUTというオプションで最大実行時間を指定できます。
    • こんな感じ→curl_setopt($ch, CURLOPT_TIMEOUT, 10);
    • JSONの取得に失敗した時に、すでにBadgeが生成済みであれば使い回します。
    • データは10分間キャッシュしています。これはTwitterへのアクセスを減らすのと、レンサバの負荷を減らすのと両方が目的です。
  • PHPでアニメーションGIF生成

その他

既存のBadgeがいまいちだったので公開してみたんだけど、見た目はまだまだって感じですね。
やろうと思えばもっと細かいカスタマイズ指定ができるようにもできるんだけど、形、角、色を指定するだけでも十分かなと。入力欄に数字を直接入力するようなインターフェイスだとTwitter日本語化でようやく始めましたって人には敷居が高くなっちゃうかなと思ってやめました。
そう、一応最低限のカスタマイズ性をもちつつターゲットユーザーは「ライトユーザー」って事にしたかったんだよね。
冒頭に書いたけど、Twitterでつぶやいただけだったんだけど結構な数のBadgeが生成されているみたいです。
めずらしいのか、細長いOneLiner(横:468px、縦:30px)が人気のようです。
ブログのタイトル下にちょろっと表示するのに便利かなと思います。
背景色をブログのものと合わせれば上手い事なじむと思うのでやってみて下さい。
最後に、(ご意見|ご要望|バグ報告)などドシドシお寄せ下さい。
コメントとか、yager[ at ]creazy.netとか、@yagerまでヨロシクどうぞ。

-WebService, 開発実績

執筆者:


  1. snowWhite より:

    TwitGIFを使わせていただきます。
    Twitterも初めて使うのですが、TwitGIFのアイディアといい、使いやすさもステキだと思います。
    実はこちらを先に見つけてTwitterしました。
    ありがとうございます!

comment

メールアドレスが公開されることはありません。

関連記事

Youtube Downloader 更新&Bookmarkletバージョン公開

YouTubeの視聴画面で、HD(720p)/高画質FLV/iPod用MP4など存在する形式だけダウンロードリンクを表示してくれるGreaseMonkey「Youtube Downloader」を更新 …

Twitter公式の「共有ブックマーク」をクリッピング用Bookmarkletに改造

・Twitterブログ: ツイートボタンのブックマークレット: どのページからでもリンクを共有 去る9月27日、Twitterから公式のブックマークレットが公開されました。ブックマークレットの設定は下 …

no image

Gmailを固定ピッチの等幅フォント(MonoSpace)で表示する方法(新Gmail対応)

[追記:2009/03/04] GMailが内部HTMLを更新したようで、このエントリーで紹介したスクリプトは古くなりました。 最新版は下記エントリーで紹介していますのでご参考ください。 Gmailを …

YouTube HD Suite更新(YouTube仕様変更対応、WebM対応、カスタムファイル名)

8月に入ってすぐくらいに行われた、YouTube側の仕様変更により、YouTube HD Suiteが動かなくなっておりましたが、遅ればせながら修正を行いましたのでちゃんと動くようになりました。以下、 …

YouTube HD Suite更新(7/22YouTube変更対応、4k対応、html5対応)

【2010/08/02:追記】 YouTube HD Suite 公式ページができました。 7/22くらいにYouTube側で変更があったらしく正常にダウンロードできなくなっていたので、YouTube …

スポンサードリンク

スポンサードリンク