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

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

関連記事

Gmailを等幅フォントで表示する「Gmail MonoSpace Font」がChrome拡張&UserScriptで復活

昔作ったGreasemonkeyスクリプトの焼き直しを連休中にまとめて対応したりします。TweetTheMinutesに続いて、要望の多かった「Gmail MonoSpace Font」のVersio …

YouTube HD Suite v3.5.5(YouTube仕様変更対応)

YouTubeが大幅なデザインリニューアルを行ったのに伴い、YouTube HD Suiteが動作しない状態になっていたためアップデートを行いました。 本日、YouTube のチャンネルや動画を、更に …

よく使うサイトに色々情報を追加するGreasemonkey「More Info」シリーズ

昨晩の悲劇に耐えながらもエントリー書いてみますよ。 Google ChromeでUserscriptが動く、Greasemetalなんかが出てきているので、自分がFirefoxで使っているGrease …

Facebook10周年記念、過去3年間の自分を振り返る「LookBack」と早速動画ダウンロードの方法

Facebookが10周年らしいのですが、それを記念してこんなURLが公開されていました。 https://www.facebook.com/lookback ログインしている自分の3年間の投稿を自動 …

やまざきメソッド ジェネレーターを作りました

先日、社内SNSの日報に一際目を引く所感が書かれていました。 それは、デザイナーやまざきさんの日報だったのですが、下記のようなものでした。 コレを見た自分は驚愕しました。 「超見やすいじゃん!」 コレ …

スポンサードリンク

スポンサードリンク