tools-osxはMac OSX用の便利なコマンド群です。 Mac OSXはUnixベースなので多様なコマンドが用意されていますが、さらに小粒ながらも便利なコマンドを追加してくれるのがtools-osxです。 インストールします。 qlコマンドはQuickLookを立ち上げます。 trashコマンドはrmとは異なりファイルをゴミ箱に入れます。 tools-osxではclipcat（クリップボードの出力）、dict（辞書検索）、eject（ボリュームの取り出し）、ql（QuickLookでの表示）、swuser（ユーザスイッチ）、trash（ゴミ箱に移動）、with（アプリケーションで開く）が用意されています。どれも便利なコマンドになるでしょう。 tools-osxはMac OSX用、MIT Licenseのオープンソース・ソフトウェアです。 MOONGIFTはこう見る ターミナル上で入力

MD5-Password-Cracker.jsはJavaScriptを使ってMD5のハッシュ値から元テキストを検索するソフトウェアです。 パスワードをハッシュ化して保存しておくのは基本と思われますが、その際によく使われるのがMD5ではないでしょうか。SHA-1/SHA-2のが良いと思うのですが、それをまざまざと知らしめてくれるのがMD5-Password-Cracker.jsです。 パスワードクラック開始！Web Workersが8つ使われています。 パスワードはheyaでした。1ワーカーあたり1秒間に約7万の解析が行われています。4文字のパスワードに対して23秒で解析されました。 網羅的に文字列を試しているので時間は要しますが、4文字程度のパスワードであればあっという間に解析されてしまうというのが分かるかと思います。パスワードの取り扱いについてはくれぐれもご注意を。 MD5-Passwo

BirdfontはWindowsやLinuxで動作するフォントエディターです。 フォントを作るというのは大変な労力を要すると思われますが、その手助けになりそうなソフトウェアがBirdfontです。 メイン画面です。 プレビューです。 フォントを書く画面です。 作成したフォントがここに入っていきます。 英語圏のフォント向けになるようですが、ベクターグラフィックスを使って奇麗な文字が作成できます。作成されたフォントはTrueTypeやEmbedded OpenType、SVGでフォントの出力が可能です。 BirdfontはWindows/Linux用のオープンソース・ソフトウェア（GPL）です。 MOONGIFTはこう見る フォントというのは一つの世界であり、体系的な作品と言えます。一つ一つの文字を考える上で、全体のバランスや個々の形状について一つの世界観をもって行われます。英字フォントはもち

doT.jsはWebブラウザ、node.jsの両方で使えるJavaScriptテンプレートエンジンです。 Webアプリケーションを開発していると必ずJavaScriptでHTMLを出力する必要性が出てきます。そのような時に使いたいのがテンプレートエンジンです。今回はWebブラウザ、node.jsの両方で使えるdoT.jsを紹介します。 テンプレートとJSONデータを組み合わせてHTMLを出力します。 繰り返しも対応。 パーシャルも使えます。 条件分け。 配列。 エンコード表示も可能です。 特徴としては外部ライブラリの依存性がないこと、高速であること、パーシャルサポート、イテレータなどがあります。ストリーミングのようにデータが随時追加されていく場合も想定されています。ifではなく、?を使うのがユニークです。 doT.jsはnode.js/JavaScript製のオープンソース・ソフトウェア（

imgAreaSelectは画像の切り抜きに役立つ範囲選択機能を提供するjQueryライブラリです。 ユーザにアップロードされた画像の一部を切り出してアイコンに使うと言ったような操作はよくあります。そんなUIをjQueryを使って実現するのがimgAreaSelectです。 一例です。 選択されていない場所はグレーになるので分かりやすいです。 各ポイントの数値が取れます。 imgAreaSelectではユーザが縦、横の長さを自由に変更できる他、比率固定でサイズを変更したり、あらかじめ決められた場所に選択範囲を置くと言った指定ができます。切り抜く箇所や大きさの値が受け取れるので、後はサーバサイドで切り抜き処理を行えば良いでしょう。 imgAreaSelectはjQuery/JavaScript製のオープンソース・ソフトウェア（GPL/MIT License）です。 MOONGIFTはこう見る

jQuery.Shapeshiftは自分でドラッグ&ドロップできるグリッドライブラリです。 最近増えたのがPinterestのように高さの異なるボックスを並べて表示するUIです。そしてさらに自分で並び替えまでできるようにしたのがjQuery.Shapeshiftです。 最初の表示です。 ドラッグして移動できます。その時、ちょっと斜めの表示になるのがいい感じです。 全てを猫に！ jQuery.Shapeshiftではオプションが色々あり、ドラッグ時のアニメーション可否やそもそもドラッグ可否も指定できます。たとえ同じコンテンツであっても見せ方を工夫することでユーザ体験は全く違ったものになります。さらにユーザ自身による並び替えがあればカスタマイズ性が大きく向上するでしょう。 jQuery.ShapeshiftはjQuery/JavaScript製のソフトウェア（ソースコードは公開されていますがラ

Morris.jsはjQueryを使ったSVG描画型のグラフライブラリです。 Webブラウザ上でグラフを描画しようと思ったら従来はサーバサイドの仕組みかFlashを使うのが一般的でした。しかし今後はJavaScriptが便利です。Morris.jsはjQueryを使ったグラフライブラリです。 二つのデータがある折れ線グラフ。 棒グラフ。 エリアグラフ。 パイチャート。 今のところ対応しているのは折れ線、棒、エリア、ドーナッツチャートになっています。それぞれ豊富なオプションが用意されています。また、マウスオーバーで値をフローティング表示してくれるのも便利です。データはJavaScriptで与えますが、グラフはSVGで出力される仕組みになっています。 Morris.jsはjQuery/JavaScript製、BSD Licenseのオープンソース・ソフトウェアです。 MOONGIFTはこう見る

Chrome simple HTTP ServerはGoogle ChromeをWebサーバ化してしまうGoogle Chrome機能拡張です。 Webの力は日々向上しています。今回はGoogle Chromeの隠された能力を引き出し、なんとWebサーバ化してしまうChrome simple HTTP Serverを紹介します。 インストールしました。 立ち上げました。 コンソールをみるとURLが表示されます。 そのURLにアクセスするとコンテンツが表示されます。 サーバ側のログはコンソールに表示されます。 ちゃんとGETアクセスされています。 これが使えるのはChrome canaryなどのver. 24以降になります。これはGoogle ChromeをWebサーバとして使うというよりも、機能拡張向けに提供されるものになります。Webブラウザと通信してしまうというアイディアに脱帽です。

XLSX.jsはJavaScriptでExcelファイル（Base64エンコード）を読み込んだり、ダウンロードさせられるソフトウェアです。 Googleスプレッドシートをはじめ、Webブラウザ上で表計算表示を行ったり、編集したりするWebアプリケーションがあります。しかし最も有力なのはExcelでしょう。そこで試したいのがExcelファイルを読み書きできるJavaScriptライブラリ、XLSX.jsです。 ダウンロードされたファイルです。ちゃんとXLSXとして認識されます。 ファイルを読み込む処理のデモです。Base64エンコードされたデータが解析されています。 XLSX.jsはbase64のXLSXファイルを読み込み、JavaScriptオブジェクトに変換できます。後はいかようにも表示できるでしょう。また、シート名と各セルの値をHTMLテーブルから読み込んでXLSXファイルに変換してダ

ColorSense for XcodeはXcode上の色設定をグラフィカルに行えるようにするXcodeプラグインです。 開発時の色設定というのは、感性的なものにも関わらずテキストやRGBで指定しなければならず分かりづらいものがあります。Webオーサリングツールの場合はカラーピッカーが使えるのですが、Xcodeで同様な機能を実現するのがColorSense for Xcodeです。 UIColorの上に色が表示されています。 カラーピッカーを使ってその場で色をカスタマイズできます。 デモ動画 ColorSense for XcodeをインストールするとUIColorやNSColorを使った場合にビジュアル的な色設定ができるようになります。色名の場合はフロート表示で実際の色が表示され、さらにカラーピッカーをスライドさせれば自動で色が入力されるようになります。 ColorSense for X

OneClickはGoogle ChromeにTorrentのダウンロード機能を加えるGoogle Chrome機能拡張です。 日本ではP2Pに対するイメージの悪さからかなかなか普及しないTorrent。ダウンロード技術としてみると分散処理による速度向上は見逃せません。しかし専用クライアントを用意するのが面倒でした。そこで使ってみたいのがOneClick、Google Chrome機能拡張のTorrentダウンローダーです。 Google Chrome機能拡張がダウンロードできるようになっていますが、筆者が確認した時にはJSONのエラーでした。ソースからJSONを修正してインストールできます。 インストールします。 Torrentファイルをダウンロード後、一気に複数ファイルがダウンロード開始します。Torrentクライアントは不要です。 OneClickは普通にTorrentファイルをダウ

skrollrはCSSを使ってスクロールによってアニメーションを実行するライブラリです。 最近プロジェクトやアプリ紹介ページで見られるようになったスクロールアニメーション。それを実現するライブラリがskrollrです。 デモです。スクロールを開始します！ 回転しながら飛んでくる文字！ 下から上がってくる文字！ 横からスライドも。 色が変わりました。それに合わせてテキスト色も変わっています。 上下からボックスが迫ってきます。 終了です。逆に上に上がっていくとアニメーションが逆に展開されていきます。 デモ動画です。スクロールすると次々と内容が変わっていきます。 実用性という意味ではあまり大きくなさそうですが、インパクトは強烈です。サイト全体を作るというよりも、ランディングページや紹介ページで使うと効果的でしょう。 skrollrはJavaScript/CSS製のオープンソース・ソフトウェア（M