memo.xight.org

日々のメモ

Google Chromeで使っている拡張機能のメモ

Summary

Google Chromeで使っている拡張機能をメモしておく。
これだけあれば、ストレスなく利用できるはず。

AutoPagerize for Chrome[2009-12-08-2]

http://autopagerize.net/
https://chrome.google.com/extensions/detail/igiofjhpmpihnifddepnpngfjhkfenbp

Chrome Gestures

https://chrome.google.com/extensions/detail/jpkfjicglakibpenojifdiepckckakgk

Create Link[2009-12-16-1]

タイトルとURLをクリップボードにコピー。
カスタマイズ可能。
https://chrome.google.com/extensions/detail/gcmghdmnkfdbncmnmlkkglmnnhagajbm

Google Mail Checker

https://chrome.google.com/extensions/detail/mihcahmgecmbnbcchbopgniflfhgnkff

Google Quick Scroll

https://chrome.google.com/extensions/detail/okanipcmceoeemlbjnmnbdibhgpbllgc

Xmarks Bookmark Sync

Bookmark の同期。
https://chrome.google.com/extensions/detail/ajpgkpeckebdhofmmjfgcjjiiejpodla

Webpage screenshot

スクリーンショットを保存できる。
https://chrome.google.com/extensions/detail/ckibcdccnfeookdmbahgiakhnjcddpki

Reference

ASCII.jp:Chromeで使えるエクステンション厳選25本!
http://ascii.jp/elem/000/000/482/482116/

URAMAYU - Google Chrome の拡張機能を使えばFirefox には戻れない! 9つのお気に入り拡張機能
http://uramayu.typepad.jp/blog/2010/01/google-chrome-extensions.html

Drupalのテーマを UserAgent で変更したい

Summary

UserAgent ごとに Theme を切り替えたい。
Switchtheme モジュールで実現可能。

Switchtheme

モバイルサイト用のモジュール。
Browscapを使用して、UserAgentごとにThemeを切り替え可能。
キャリアごとにThemeを変更可能。

Mobile Theme

モバイルサイト用のモジュール。
Browscapを使用して、Themeを切り替え可能。
キャリアごとのTheme変更は不可。

Mobile

モバイルサイト用のシンプルなHTMLのテーマ。

iUI

iPhone風のテーマ。

Reference

DrupalスレまとめWiki - 携帯対応まとめ
http://www10.atwiki.jp/drupal/pages/92.html

Mario AI Championship - 人工知能でマリオをプレイするコンテスト

Summary

人工知能がマリオを操作し、自動生成されるコースを進んでいく。

Mario AI Competition 2009 で優勝した AI の動画



優勝したAIをマウスで追わせてみる。

敵に当たらない。穴に落ちそうになっても、這い上がる。


Reference

Mario AI Championship 2010 (Mario AI Championship 2010)
http://www.marioai.org/

via

人工知能にマリオを遊ばせるコンテスト-AIの華麗なテクを公開 | インサイド
http://www.inside-games.jp/article/2010/04/28/41819.html

プレゼンを成功させる15の秘訣

Summary

1. プレゼンは1人でする。

2. ストーリーを伝える。

3. 弱気な言葉は使わない。(~だと思う。~と考える。~しようとしている。は使わない)

4. 練習をする。

5. 常に時間の経過を追う。(制限時間を守る)

6. 簡潔にする。(複雑なことを伝えるには、他の機会を利用する)

7. ユーモアは難しい。(ジョークはギャンブル)

8. ギミックはもっと悪い。(小道具は無駄)

9. わかりきった質問を想定しておく。

10. 失敗があってもやり切る。

11. 振り返らない。(視線をスクリーンに向けない)

12. これから見るものについて説明する。

13. 最初に何をしているかを伝える。
    プレゼンテーションの最初の30秒以内に伝える。

14. 一番言いたいことを最後までとっておかない。
    聴衆が注意深く聞いてくれるのは、前半である。

15. しかし、最後は弱々しく終わらせない。
    最後は2,3のキーワード、メッセージを力説する。

Reference

15 Quick Pitch Tips for Kick Ass Presentations
http://www.instigatorblog.com/15-quick-pitch-tips/2009/04/20/

via

SEO Japan - プレゼンを成功させる15の秘訣
http://www.seojapan.com/blog/%E3%83%97%E3%83%AC%E3%82%BC%E3%83%B3%E3%82%92%E6%88%90%E5%8A%9F%E3%81%95%E3%81%9B%E3%82%8B15%E3%81%AE%E7%A7%98%E8%A8%A3

InfoVis - 視覚化のためのJavaScriptライブラリ

Summary

InfoVis は 視覚化のためのJavaScriptライブラリ。
データをJSONで入力すればインタラクティブなグラフが得られる。
BSDライセンスで配布。

RGraphHyperTreeSpaceTree
TreeMapBar Charts

RGraph
SpaceTree
Composing-Visualizations

RGraph 同心円状に配置
HyperTree 魚眼レンズのように配置。hyperbolic tree
SpaceTree 階層構造の軸を持つ配置。各ノードは末端のノードが等間隔になるように配置する。
TreeMap 面積と色で表現。包含関係も有る。

これらをパイチャート、棒グラフと組み合わせることができる。

Reference

JavaScript InfoVis Toolkit - Interactive Data Visualizations for the Web
http://thejit.org/

InfoVis Toolkit Demo
http://thejit.org/demos/

Wikipedia - hyperbolic tree
Wikipedia - Treemapping

SpaceTree
http://www.cs.umd.edu/hcil/spacetree/

via

データを視覚化できるjavascriptライブラリ「InfoVis」 | Web活メモ帳
http://blog.verygoodtown.com/2010/04/javascript-data-library-infovis/

新100ドル紙幣の偽造防止技術

Summary

中央の 3Dセキュリティ・リボン は、見る角度を変えるとグルグル回って見える。

ベンジャミン・フランクリン左隣にある銅色の鐘の入ったインク壺は、
紙幣を傾けると、鐘が緑色に変化


via

新しい100ドル紙幣の偽造を諦めたくなるワケ : ギズモード・ジャパン
http://www.gizmodo.jp/2010/04/why-you-dont-want-to-counterfeit-the-hideous-new-100-bill.html

Akihabara - ファミコン風ゲーム用 JavaScript ライブラリ

Summary

Akihabara は HTML5 のCanvasタグとJavaScriptを用いて開発されたゲーム用ライブラリ。
Akihabara を用いて開発したゲームも公開。
iPhoneから起動すると、画面下部にコントローラが表示される。

Leave Me Alone (アクション)

Leave Me Alone

Solitude (シューティング)

Solitude

The Legend Of Sadness (アクションRPG)

The Legend Of Sadness

T-Spin (テトリス)

T-Spin

Capman (パックマン)

Capman

Reference

kesiev's akihabara at master - GitHub
http://github.com/kesiev/akihabara

Kesiev Norimaki
http://www.kesiev.com/

Akihabara
http://www.kesiev.com/akihabara/

via

Publickey - 2010-04-27 - HTML5/JavaScriptの遊べるゲームライブラリ「Akihabara」、iPhone/Androidにも対応
http://www.publickey1.jp/blog/10/html5javascriptakihabaraiphoneandroid.html

MOONGIFT - HTML5で実現するファミコン風ゲーム「Akihabara」:オープンソースを毎日紹介
http://www.moongift.jp/2010/04/akihabara/

revisit - Twitter の視覚化

Summary

revisit は Twitter のつぶやきをリアルタイムに視覚化するプロジェクト。
ReTweet や @でのリプライにより、つぶやき同士を関連付け。

revisit

あるつぶやきに注目

revisit で、あるつぶやきに注目

reply, ReTweetによる関連付け

revisit で reply, ReTweetによる関連付け

Reference

moritz.stefaner.eu - revisit
http://moritz.stefaner.eu/projects/revisit-twitter-visualization/

moritz.stefaner.eu - revisit - demo
http://moritz.stefaner.eu/projects/revisit/

via

秋元@サイボウズラボ・プログラマー・ブログ : ツイッターの検索結果をリアルタイムで可視化する研究プロジェクトrevisit
http://developer.cybozu.co.jp/akky/2010/04/revisit-d19b.html

優れた文章を書くための11のポイント

Summary

 1. 何か言いたいことがあること
 2. 具体的に言う
 3. シンプルな言葉を選ぶ
 4. 短い文章を書く
 5. 能動態を使う
 6. 段落を短くする
 7. どうでもいい言葉は排除する
    強調 : とても、非常に
    程度 : 少し、ほとんど
 8. 手当たり次第に書かない
 9. 重複や繰り返しはやめる
10. 書きすぎない
11. 情け容赦なく編集する
    文章を書いた後、しばらくそのままにして、再度編集すると良い。

Reference

Copyblogger - 11 Smart Tips for Brilliant Writing
http://www.copyblogger.com/brilliant-writing-tips/

Consequences of erudite vernacular utilized irrespective of necessity: problems with using long words needlessly. Daniel M. Oppenheimer. 2005; Applied Cognitive Psychology - Wiley InterScience
http://www3.interscience.wiley.com/journal/112137622/abstract?CRETRY=1&SRETRY=0

via

SEO Japan - 2010-04-20 - 優れた文章を書くための11の賢いヒント
http://www.seojapan.com/blog/%E5%84%AA%E3%82%8C%E3%81%9F%E6%96%87%E7%AB%A0%E3%82%92%E6%9B%B8%E3%81%8F%E3%81%9F%E3%82%81%E3%81%AE11%E3%81%AE%E8%B3%A2%E3%81%84%E3%83%92%E3%83%B3%E3%83%88

GmailをTwitterクライアントにする方法

Summary

Gmailにガジェットを追加することにより、
GmailをTwitterクライアントとして利用可能。

Gmailの設定 - labs - 「URLでガジェットを追加」を追加し、
URLに以下を設定。
https://twittergadget.appspot.com/gadget-gmail.xml

Twitter の OAuth認証画面で許可し、リロード。

Reference

Twitgether - social twitter client
https://twittergadget.appspot.com/

via

普段使っているGmailを簡単にフル機能のtwitterクライアントにしてしまう方法 | ついーたーTweeter.jp
http://tweeter.jp/2010/04/20/twitter-2165.html

Google Places - 地域ビジネス向けサービス

Summary

元々、「ローカル ビジネス センター」であったサービスが、
Google Places としてリニューアル。

  - ローカル検索
  - Google Mapsへの掲載
  - リアルタイム更新
  - QRコードの生成
  - 割引クーポンの発行
  - 店舗の写真撮影サービス

利用方法

1. 以下、URLから情報を入力する。
http://www.google.com/local/add/lookup?hl=ja&gl=JP

2. 電話、または郵送でGoogleからの確認を行う。
郵送だと、2~3週間かかるとのこと。

3. PINの入力
確認情報と共にPINが送られるので、
Google アカウントの「ローカル ビジネス センター」から入力。

Reference

Welcome to Google Places
http://www.google.com/local/add/analyticsSplashPage?gl=JP&hl=ja

via

TechCrunch Japan - 2010-04-21 - 位置情報戦争、激化へ―Google、地域ビジネス向け新サービス、Google Placesを発表
http://jp.techcrunch.com/archives/20100420google-places/

目の錯覚を利用して待ち時間を10%短く感じさせる方法

Summary

プログレスバーがアニメーションすることで実際よりも10%程度速く感じさせることができる。
波模様は右から左に動いたほうが良い。
5秒から15秒程度であれば、目の錯覚はかなりの効果があるだろう、とのこと。

カーネギーメロン大学のVhris Harrison, Zhiquan Yeo, Scott Hudson らの発表。



Reference

Now you see it: Best visual illusions of 2009 - New Scientist
http://www.newscientist.com/special/best-new-visual-illusions

via

Gizmodo - Visual Tricks Can Make Downloads Seem Quicker
http://gizmodo.com/5513404/visual-tricks-can-make-downloads-seem-quicker

ギズモード・ジャパン - 2010-04-14 - 目の錯覚でダウンロードの待ち時間が短く...なった気がする
http://www.gizmodo.jp/2010/04/post_6990.html

iPadのUserAgent

Summary

iPadのUserAgent。
リビジョンは変わりそうだが、とりあえずメモ。

Mozilla/5.0 (iPad; U; CPU OS 3_2 like Mac OS X; en-us) AppleWebKit/531.21.10 (KHTML, like Gecko) Version/4.0.4 Mobile/7B334b Safari/531.21.10

mod_rewriteの例

HTTP_USER_AGENTに "iPad" が含まれていたら、http://ipad.example.com に 301 リダイレクト

RewriteCond %{HTTP_USER_AGENT} ^.*iPad.*$
RewriteRule ^(.*)$ http://ipad.example.com [R=301]

Reference

David Walsh Blog - 2010-04-07 - iPad Detection Using JavaScript or PHP
http://davidwalsh.name/detect-ipad

via

IDEA*IDEA - 2010-04-14 - JavaScript、PHP、htaccessでiPadを識別する方法
http://www.ideaxidea.com/archives/2010/04/ipad_detection.html

PIXELS - すべてが8ビットになる動画

Summary

Patrick Jean さんによる作品。

インベーダー、パックマン、ドンキーコング、テトリス、ブロック崩しなどが
ニューヨークに降り立ち、総攻撃をしかけてきます。



Reference

One More Production
http://www.onemoreproduction.com/

via

ギズモード・ジャパン - 8ビットキャラクターが地球を侵略する動画
http://www.gizmodo.jp/2010/04/post_6970.html

議論のルール

Summary

フィンランドの5年生が作った議論のルール。

議論のルール

1. 他人の発言をさえぎらない
2. 話すときは、だらだらとしゃべらない
3. 話すときに、怒ったり泣いたりしない
4. わからないことがあったら、すぐに質問する
5. 話を聞くときは、話している人の目を見る
6. 話を聞くときは、他のことをしない
7. 最後まで、きちんと話を聞く
8. 議論が台無しになるようなことを言わない
9. どのような意見であっても、間違いと決めつけない
10. 議論が終わったら、議論の内容の話はしない

via

フィンランドの5年生が作った議論のルール - 負けまいとする心でしょう!
http://kd1.blog103.fc2.com/blog-entry-200.html

blogs.com - フィンランドの小学生が作った「議論のルール」が大人顔負けの凄さ!
http://jp.blogs.com/2010/04/schoolchild-debate-rule.html

Twitter "Follow" Badge for your site/blog - Twitter のバッジ

Summary

Twitter へのリンクを表示する JavaScript。
左右に吸着する。

Source

<script src='http://files.go2web20.net/twitterbadge/1.0/badge.js' type='text/javascript'></script><script type='text/javascript' charset='utf-8'><!--
tfb.account = 'xight';
tfb.label = 'follow-me';
tfb.color = '#00aeef';
tfb.side = 'r';
tfb.top = 400;
tfb.showbadge();
--></script>

Reference

Twitter "Follow" Badge for your site / blog
http://www.go2web20.net/twitterFollowBadge/

vimlike-smooziee - Google Chrome で vim ライクな操作が行えるようになる拡張

Summary

Firefox で言うところの Vimperator。
Vimperatorのうち、よく使う機能に絞った簡易版とのこと。

Reference

vimlike-smooziee - Project Hosting on Google Code
http://code.google.com/p/vimlike-smooziee/

Silent Power - 2009-09-11 - ChromeをVim風にキーボード操作する拡張
http://silentpower2.blogspot.com/2009/09/chromevim.html

Manifesto for Agile Software Development - アジャイルソフトウェア開発宣言

Summary

アジャイル開発手法の精神ともいえる内容を宣言した
「Manifesto for Agile Software Development」 (アジャイルソフトウェア開発宣言)の
公式な日本語版が、英語版が公開された2001年から約10年たって、公開された。

原文

Manifesto for Agile Software Development

We are uncovering better ways of developing
software by doing it and helping others do it.
Through this work we have come to value:

Individuals and interactions over processes and tools
Working software over comprehensive documentation
Customer collaboration over contract negotiation
Responding to change over following a plan

That is, while there is value in the items on
the right, we value the items on the left more.

Kent Beck, Mike Beedle, Arie van Bennekum, Alistair Cockburn, Ward Cunningham, Martin Fowler, James Grenning, Jim Highsmith, Andrew Hunt, Ron Jeffries, Jon Kern, Brian Marick, Robert C. Martin, Steve Mellor, Ken Schwaber, Jeff Sutherland, Dave Thomas

(c) 2001, the above authors
this declaration may be freely copied in any form,
but only in its entirety through this notice.

日本語訳

アジャイルソフトウェア開発宣言

私たちは、ソフトウェア開発の実践
あるいは実践を手助けをする活動を通じて、
よりよい開発方法を見つけだそうとしている。
この活動を通して、私たちは以下の価値に至った。

プロセスやツールよりも個人と対話を、
包括的なドキュメントよりも動くソフトウェアを、
契約交渉よりも顧客との協調を、
計画に従うことよりも変化への対応を、

価値とする。すなわち、左記のことがらに価値があることを
認めながらも、私たちは右記のことがらにより価値をおく。

Kent Beck, Mike Beedle, Arie van Bennekum, Alistair Cockburn, Ward Cunningham, Martin Fowler, James Grenning, Jim Highsmith, Andrew Hunt, Ron Jeffries, Jon Kern, Brian Marick, Robert C. Martin, Steve Mellor, Ken Schwaber, Jeff Sutherland, Dave Thomas

(c) 2001, 上記の著者たち
この宣言は、この注意書きも含めた形で全文を含めることを条件に自由にコピーしてよい。

Reference

Manifesto for Agile Software Development
http://agilemanifesto.org/iso/en/

アジャイルソフトウェア開発宣言
http://agilemanifesto.org/iso/ja/

via

Publickey - 2010-04-05 - 「アジャイルソフトウェア開発宣言」公式日本語版が公開
http://www.publickey1.jp/blog/10/post_103.html

PHPでTwitter APIのOAuthを使う方法 - twitteroauth版

Summary

PEARの HTTP_OAuthを利用すると、ソースがゴチャゴチャしていたので、
twitteroauth.php を利用してみる。

Access Token, Access Token Secret を取得

http://www.sdn-project.net/ups/oauth_test.txt
$consumer_key と $consumer_secret を変更してブラウザから実行。

例えば、このようなURLで実行。
http://example.com/oauth_test.php

数字が表示されたらNG。
Twitter アプリケーションの設定を見直す。(http://twitter.com/apps)
Twitter の 「あなたの招待状」を「ブラウザアプリケーション」にしておくこと。
Callback URL に oauth_test.php へのURL (http://example.com/path/to/opauth_test.php) を記載。

Twitterへの投稿

<?php
require_once("path/to/twitteroauth.php");
require_once("path/to/conf.inc.php");

$to = new TwitterOAuth($consumer_key,$consumer_secret,$access_token,$access_token_secret);

$mes = "投稿するメッセージ";

// TwitterへPOSTする。パラメーターは配列に格納する。
// http://apiwiki.twitter.com/Twitter-REST-API-Method:-statuses%C2%A0update
// 他の操作はTwitter APIを参照。
$req = $to->OAuthRequest("https://twitter.com/statuses/update.xml","POST",array("status"=>$mes));

header("Content-Type: application/xml");
echo $req;
?>


conf.inc.php

$consumer_key = "consumer_key";
$consumer_secret = "consumer_secret";
$access_token = "access_token";
$access_token_secret = "access_token_secret";

Reference

GitHub - twitteroauth at master from abraham's twitteroauth
http://github.com/abraham/twitteroauth/tree/master/twitteroauth/

Twitter API Wiki / Twitter API Documentation
http://apiwiki.twitter.com/Twitter-API-Documentation

via

twitterのbotなどでOAuthを使う方法(PHPバージョン) | 星光のつれづれ日記
http://www.hosimitu.com/2009/11/2020-1358.php

PHP+OAuthでTwitter - SDN Project
http://www.sdn-project.net/labo/oauth.html

GWT Quake II Port - HTML5 + JavaScript で Quake II

Summary

HTML5 + JavaScript で Quake II を動作。
ノートPCで 30 fpsとのこと。



ムービーでは、以下のURLにて動作しているが、
現在のところ、 Google Code にリダイレクトされる。
http://quake2-gwt-port.appspot.com/

Reference

Google Code - GWT Quake II Port
http://code.google.com/p/quake2-gwt-port/

via

ギズモード・ジャパン - これがHTML5の実力! フル3Dゲーム「Quake」をブラウザ上でプレイしてみた(動画)
http://www.gizmodo.jp/2010/04/html53dquake.html?utm_source=atom&utm_medium=rss

Publickey - HTML5、WebGL、WebSockets、JavaScriptを駆使して、ゲーム「QuakeII」をブラウザに移植中
http://www.publickey1.jp/blog/10/html5webglwebsocketsjavascriptquakeii.html

元ネタさがし - マンガ、アニメ、書籍、音楽などの元ネタを投稿するサイト

Summary

元ネタ探し「FFFFFF.jp」は「このシーンの元ネタを知っていれば、もっと映画が楽しめるのに」とか「この曲のトラックを知っていればもっと好きになれるのに」などもっと多くの人に知ってほしい情報を集めて公開していきます。


Reference

元ネタを見つけて、さらに深くものをみよう 「元ネタさがし」
http://www.ffffff.jp/

via

WordPressをブログ以外で使っているサイトいろいろ・国内編 - かちびと.net
http://kachibito.net/wordpress/16-amazing-japanese-site.html