MOONGIFT

管理画面がWeb OS風のCMS「Novius OS」

Novius OSは面白いCMSで、管理画面がWeb OS風になっています。ちょっと特徴ある管理画面ですが好きになる人も多そうです。 ログイン画面です。 ログインしました。Web OS風にアイコンが並んでいます。 ページ管理画面です。 編集画面です。 保存時の通知はフローティングで出ます。格好いい。 ユーザ一覧です。 プラグイン管理です。このページはテンプレートが当たっていないようです。 プロフィール編集画面です。 メディア管理です。サムネイルも出ていて使いやすそうです。 ブログ管理です。ちょっと画面が込み入っています。 こちらはユーザ向けの画面です。 基本はページ、ブログのCMSで、ユーザ管理とメディア管理がついています。またプラグインで拡張もできます。Novius OSは何より管理画面に力を入れているようです。

Gitリポジトリに蓄積された歴史を可視化、グラフ化する「GitStats」

Gitにaddしてcommit、addしてcommit…そんな日々の努力の結果をビジュアル化してくれるソフトウェアがGitStatsです。社内プロジェクトで使ってみても面白そうです。 supybotのGitリポジトリから作られたHTMLです。 アクティビティです。コミット数などをグラフ化しています。 時間数が出たりするのも面白いです。 コミット数を見ればプロジェクトの栄枯盛衰が分かります。 タイムゾーンごとのコミット数もユニークです。 開発者の一覧です。 ファイル数のカウントです。 拡張子ごとというのも面白いです。 コードの行数です。 タグ一覧です。 GitStatsはアクティビティ、ファイル数、コード数、タグ、開発者と言ったデータをリポジトリから抽出してグラフ化します。静的なHTMLで吐き出してくれるので出力後はいつでも快適に見られます。

オープンソース好きはここからAndroidアプリを探そう「F-Droid」

オープンソース・ソフトウェアを愛する人にお勧めしたいAndroidアプリがF-Droidです。オープンソース・ソフトウェアばかり集めたAndroid用マーケットアプリになります。 インストールします。 完了しました。起動します。 アプリケーション一覧です。全てオープンソースのようです。 アプリケーション詳細です。 メニューです。ここからインストールできます。 ダウンロード中です。 インストールの確認が出ました。 マーケットのメニューです。 リポジトリは追加、編集できます。 設定です。 アップデートチェックもあります。 カテゴリも多数あります。 F-Droidの面白い点としては、既にインストールされているアプリケーションについてもアップデートチェックしてくれる機能がある点です。Androidマーケットで配信されていないアプリもここにはあるかも知れませんね。

試すべし。懐かしのコマンド&コンカーをHTML5で復活「Command and Conquer」

コマンド&コンカーというゲームがある。日本ではあまり流行らなかったようだが、海外では絶大な人気があるリアルタイムストラテジーゲームだ。90年代のゲームらしいが、HTML5の力で復帰した、それがCommand and Conquerだ。 ゲーム開始。左上の枠がゲーム画面だ。 時機の戦車で領土を広げていく。見えている部分が陣地になる。 陣地には工場や発電所といったユニットを配置する。 ユニットを多く配置していけば、選択できるユニットも増えていく。 敵がいるので倒していく。 武器を作るユニットは開発に時間がかかる…。 リアルタイムストラテジーなので、ターン制ではなくちょっと放っておくと敵がどんどん攻めて来る。気を抜くとあっという間に全滅させられてしまうだろう。ゲームの面白さはもちろん、HTML5で作られている点も注目だ。

コンソール好きにお勧め。node.js製のTodo管理「todo」

いつもコンソールを使っている方にお勧めしたいTodo管理ソフトウェアがtodoです。ターミナル上で動作する、シンプルなタスク管理ソフトウェアになります。 インストールです。npmでインストールできます。コマンドなので-gをつけます。 ヘルプです。シンプルな使い勝手です。 todoの後に単純にタスク名を入れれば良いだけです。 ls --allでタスクが一覧表示されます。 タスクを実行したらcheckをします。 すると達成済になります。 todoはtodoコマンドに加えてタスク名を入れるだけでタスク追加ができます。後は一覧を出して、達成した目標をチェックしていくだけです。rmを使って削除もできます。ターミナル上ながらちょっとだけ色がついているのも面白さです。

Facebookチャットに特化したインスタントメッセンジャー「JFBChat」

Facebookで提供されるメッセージ(チャット)機能をローカルソフトウェアから利用できるのがJFBChatです。WindowsやLinuxに対応しています。 インストールします。ウィザードに沿って進めていくだけです。 ライセンスの確認です。 インストールパスを指定します。 プログラム名を決めます。 ショートカットの確認です。 設定の確認をOKすればインストール開始です。 インストールが終わると情報が出ます。 インストール完了しました。起動します! 最初に認証を行います。大事なのはメールアドレスではなく、ユーザ名を入力することです。ユーザ名とは、URLに設定する名前のことです。 ログインしました。オンラインになっている友人が一覧で表示されます。日本語名は文字化けてしまっています…。 通知も出ます。 チャット中です。1対1のやり取りのみ対応しています。チャットは日本語も利用できます。 JFBChatを使えばFacebookにログインすることなくFacebookチャットが使えます。Web画面より使いやすいのではないでしょうか。

HP製のJavaScriptフレームワーク「Enyo」

EnyoはHPがwebOSのオープンソース化ロードマップとともに発表されたHTML5のWebアプリケーションフレームワークになります。特にスマートフォンに適したオブジェクト指向のフレームワークになります。 サンプルです。左側がコード、右側がその実行結果です。 ボタンを押すとテキストが追加されます。 同様に色が変わるサンプルです。 消したり表示したりします。 ボタンを追加していくサンプルです。 Flickr画像検索&ビューワーのデモです。 こちらはYouTubeの検索&ビューワーです。 ボールが落下するデモです。 WebKitに最適化されたモックです。 頭文字ごとにグループ化されたリストです。 ボタンです。 日付ピッカーです。 サンプルゲームです。同じ動物を縦横に3つ並べると消えます。サウンド付きです。 Enyoは現状、デスクトップのWebブラウザにも対応していますが、モバイル対応を優先的にして開発されることになっています。カスタマイズの容易さ、軽量で高速、単一での動作、スケールのしやすさを特徴として掲げています。

Amazon EC2/S3/SQS/ELB/IAMを一つのコマンドで操作「aws」

Amazon Web Servicesを活用している人に使ってみてほしいのがawsです。一つのコマンドで複数のAmazon Web Servicesを扱えます。 ヘルプです。 lsはAmazon S3のブラケットを一覧します。 EC2の有効なゾーン一覧です。 awsが対応しているのはEC2、S3、SQS、SDB、ELB、IAMとなっています。予めアクセスキーとシークレットキーを書いたファイルを保存しておく必要があります。参照だけでなく、インスタンスを実行したり止めたりすることもできます。それぞれにコマンドを用意しないで済むのが便利です。

DjangoをOAuth/OAuth2/OpenID1.0、2.0に対応させる「django-socialregistration」

Djangoで各種Webサービスに対応した認証を実装したいと思ったならば試してほしいのがdjango-socialregistrationです。FacebookからOpenIDまで多数の認証を利用できます。 様々な認証システムが表示されています。 settingsに各サービスの認証キーを設定します。 Facebook、Twitter、GoogleなどのOAuth2の他、OAuth、OpenIDの認証に対応しています。OpenIDも1.0の他、2.0にも対応しています。

ファイル共有を知る。Webサービス+オープンソース・ソフトウェア×26選

今回のテーマは「ファイル共有」です。P2Pをはじめとしてアングラなイメージが拭いきれない感はありますが、ファイルはコンピュータの基本構成の一つです。それだけに手元のファイルを他人と共有したいと思うのはごく自然なことです。そんなファイル共有のためのWebサービス、ソフトウェアを紹介します。

非公式でも良い!Java製のGoogle+投稿ライブラリ「Google+ Post lib Java」

Google+を積極的に使いたいと思いつつも躊躇させる大きな要因の一つがポストするAPIが未だに公開されないことです。クロスポストを警戒しているのかも知れませんが、そもそもポストしたくなくなります。そこで使ってみたいのがGoogle+ Post lib Java、Java製のGoogle+非公式ポストライブラリです。 実行します。 何やら色々出ましたが完了です。 見事投稿されています! Google+ Post lib JavaはGoogle Appsアカウントからのポストには対応していないようです。しかしGmailアカウントであればIDとパスワードを指定しておけば指定した文字をポストしてくれます。これならば他のSNSとも連携が考えられるかも知れません。

iTunesの音楽ファイルをAndroidに同期「iTunes Sync Android」

Androidの普及が進んでいます。メインのデバイスをAndroidにしつつも音楽はiTunesで管理している、そんな人に使ってみてほしいのがiTunes Sync Androidです。 実行しました。コピー先(AndroidのSDカード)とプレイリストの名前を指定するだけです。 iTunes Sync Androidを使う際には予めSDカードがマウントされていなければならないので、USBケーブルなりでAndoridを接続しておく必要があります。また、MacRubyを使っているのでRubyではあるもののMac OSX専用になるようです。

オープンソースラブ度チェッカー「SourceSquare」

MOONGIFTを閲覧いただいている方はおそらくオープンソース・ソフトウェアが大好きではないかと思います。自分がどれくらいオープンソースに惚れ込んでいるか、それをファイルベースで証明してくれるのがSourceSquareです。 起動しました。まずチェックするディレクトリを指定します。 開始します。 Webブラウザが立ち上がってスキャンが行われます。チェック内容はリアルタイムに描画されていきます。 チェック中のメイン画面です。 チェック途中です。オープンソースの割合は17%とのことです。 解析が終わると表示がツリーマップビューになります。 オンマウスでフローティングの説明も出ます。 クリックでドリルダウンもできます。 解析結果によってバッジが出てきます。4つゲットしました。 解析結果をシェアできます。 自分の作業ディレクトリなどでチェックしてみると面白いかもしれません。意外とオープンソース開発をしていなかった、なんて気付いてしまったならば新しいプロジェクトを立ち上げてみましょう。

サイドバイサイド/インライン表示に対応したJavaScriptテキスト差分表示ライブラリ「jsdifflib」

テキストを扱うWebアプリケーションで便利そうなライブラリがjsdifflibです。JavaScriptを使って二つのテキストの差分を表示してくれます。 デモです。二つのテキストエリアにテキストを入力しました。 Diffボタンを押すと差分が表示されます。サイドバイサイドのビューです。 行の内容が違う場合は表示色が異なります。 インラインで差分表示もできます。 jsdifflibはPython製のdifflibと互換性のあるライブラリとのことで、差分解析をサーバサイドで行って結果を描画することもできます。表示色などはCSSで自由に編集可能です。

Tumblrのテーマをローカルでさくさく作り上げる「Fumblr」

Tumblrにはデザインをカスタマイズする機能がありますが、オンラインで行うには色々修正した後、確認して…という作業を繰り返す必要があります。そこでFumblrを使ってももっと効率的にTumblrのテーマを作成してみましょう。 インストールします。必要なライブラリはbundleでインストールできます。 インストール中です。 起動しました。まんま、Tumblrのデザインです。 Fumblrは独自のWebサーバを起動するのでWebブラウザで結果を確認しつつ、CSS/JavaScript/画像を配置してデザインを作っていけます。CSSはSassやCompassに対応しています。さらにインポートコマンドによって既存のTumblrコンテンツを取り込んだ上でデザインを行うこともできます。

TrueType/OpenTypeフォントを読み込んで描画「Font.js」

Web上での好きなフォントを使ってテキストを描画したい、そんなニーズに応えてくれるのがFont.jsです。Imageオブジェクトに似た、Fontオブジェクトとして作るのが特徴です。 最初の表示です。ボタンを押します。 こんな感じでフォントを埋め込んで使えます。 TrueTypeフォントを使っています。 こちらはOpenTypeフォントの例です。 実際のコードです。 Googleの提供するWeb Fontsに似ていますが、独自のTrueTypeやOpenTypeフォントが使えるのが利点と言えそうです。フォントデータはAjaxで取得するので、使っていない場合は読み込まれません。描画幅を取得するメソッドがあるなど、面白い使い方もできそうなライブラリです。

DeNA製のゲーム開発フレームワーク「Arctic.js」

DeNAが公開したHTML5によるゲーム開発フレームワークがArctic.jsです。実際にゲームでも使われていますので、実践的なゲーム開発に向いていると言えそうです。 APIドキュメントとチュートリアルが同梱されています。 クラス定義の例です。 こちらは継承の例。 superも使えます。 Arctic.jsではゲーム開発以外でも役立ちそうなユーティリティ系の他、アニメーション支援機能、ActionScript3と近いAPIの提供、Android2.x系、iOS3または4、Safariに対応などが特徴になっています。

これはいい!設置するだけでWebサイトを高速化「FastPage」

Googleはページの表示速度を検索順位の要素に盛り込むようになっています。そうでなかったとしてもページが高速に表示されるのは良いことです。そこで既存のサイト構成そのままにサイトを高速化するFastPageを使ってみましょう。 ファイル構成です。 例えば実行したイメージです。普通にファイルの内容が返ってきますが、実際にはキャッシュが使われています。 FastPageではファイルサイズの小さい画像をHTML/CSS内にインラインで展開したり、JavaScriptもサイズが小さければHTML内で展開します。さらにファイルもGzipで圧縮して転送量を小さくする、キャッシュ(サーバサイド、クライアントサイド)の利用などの施策がとられています。

テキストエリアでタグのハイライトや自動補完「TAGMATE!」

TwitterやFacebookによってテキストエリアの中に特定の記号を伴った文字を書くとそれがユーザやタグとして認識されるサービスが多くなっています。そこで類似の実装をする際に使えるのがTAGMATE!です。 #、@、$の後に書かれた文字列が自動的にタグとして認識されてハイライト表示されています。 @の場合は本名での補完機能がついています。 $は金額に反応します。 名前のタグだけ抽出できます。この時はユーザ名なのが面白いです。 同様にハッシュタグだけ抽出。 プライスタグはうまくアラートが出ませんでした。 全てのタグを抽出しました。 TAGMATE!は@#$のタグに対応しています。パースする条件は正規表現で指定できます。インラインのオートコンプリートにも対応していて、使い勝手が良さそうです。

JavaScriptの開発、運用に。console出力をクライアントサイドで制御「andlog」

andlogを使うとJavaScriptのデバッグメッセージの出力をクライアントサイトで切り替えられるようになります。妙なメッセージを出してしまわぬよう、使ってみると良いでしょう。 console.logを実行します。何も出力されません。 debugを有効にします。あくまでもクライアント側での処理です。 またconsole.logを実行します。今度は出力されました。 debugのフラグを落とせば元通りです。 andlogの面白い点はクライアントサイドでconsole.logの出力を制御できる点にあります。コードを見ればconsole.logという表示がされているとは思いますが、実際にコンソールに出さずに済むのは良さそうです。andlogはCommonJSと組み合わせて利用もできます。

音楽を巡る最近の動きと関連ソフトウェア×15選

今回のテーマは音楽です。レコード、テープ、CD、ネットと伝達媒体は時代に合わせて変わりつつも、音楽自体の魅力は決して色あせることがありません。それは今も同じで、オンライン上には無数の音楽が存在しています。それだけ溢れたコンテンツであれば、きっと新しいビジネスの種もあるに違いありません。そこで今回は音楽を巡る2011年からの話題と、関連ソフトウェアを取り上げます。

テキストエディタ派に。Titaniumアプリをコンソール上でコンパイル「MakeTi」

Titaniumで作ったiOS/Androidアプリを実行する場合、Titanium StudioやTiDev Communityを使うのが一般的です。ですがこれではテキストエディタで開発している時に切り替えるのが不便です。そこで使ってみたいのがMakeTi、コンソールベースのTitaniumアプリ実行ソフトウェアです。 ファイルの内容です。 ヘルプです。プラットフォームやバージョンを指定して実行することもできます。 実行しました。無事起動します。 そのままログも受け取れます。 プラットフォームを指定して実行もできます。 MakeTiはTextmate用のプラグインも用意されており、Textmateで編集してそのまま実行もできるようになっています。iOSデバイスであればdeployオプションで実機インストールもできます。また、TestFlight用にアプリを作ってリリースも可能です(別途API設定が必要です)。

Facebook風ボタンをCSS3でデザイン「CSS3 Facebook Buttons」

最近はFacebookアプリの開発も増えてきました。そんな開発の際に使えそうなのがCSS3 Facebook Buttons、Facebook風ボタンをCSS3で作成したソフトウェアです。 色は3種類から選択できるようです。 classを指定するだけ。使い方は簡単です。 サイズが少し大きいバージョンです。 classにlargeをつけるだけです。こちらも簡単です。 グループ化です。こちらも需要がありそうです。 div.uibutton-groupをつけるだけです。 こんな感じに混ぜた表示もできます。 ツールバーという指定を使います。 アイコン付き表示もあります。これは便利そう。 addやeditといったclassをつけるだけ。簡単です。 色付きボタンはもちろん、大きさやアイコンをつけたボタンというのも使い道が多そうです。class指定だけで使えるのも手軽で良いですね。

Webブラウザアイコンを作った神経衰弱「Browser Memory」

Webブラウザのアイコンを使って作られた神経衰弱パズルがBrowser Memoryです。 3x4のHTML5のパネルが表示されています。適当にクリックします。 NyanCatが出ました。 見事当たりました。 この調子でどんどんいきます。 後もう少し。 全て見つけました! 二回目もMove10でした。もっと短く見つけられるのがベストです。 アイコンの種類は6種類、HTML5をサポートしたWebブラウザとNyanCatになります。ゲームをクリアしたりすると音が鳴ります。HTML5で作られたシンプルなゲームのサンプルとしてどうぞ!

Time Machineの差分を表示「timedog」

Mac OSXのバックアップ機能、Time Machineはとても便利です。とりあえず設定しておけば後は放置しておいてもバージョン管理されたバックアップが行われます。そんなバックアップをさらに便利にしてくれるのがtimedogです。バックアップデータを精査して差分を表示してくれます。 実行中です。しばらく時間がかかります。 差分が出ました。Firefoxをインストールしたようです。 3500以上のファイルを変更し、740MB増えているそうです。 コマンドヘルプです。 前回とその前の差分が表示されるので、直近のバックアップで何が変わったのかすぐに分かります。Time Machineではデフォルトでは何が変わったかは分かりませんが(そういう意識をせずに使えますが)、timedogを使えばリストアップされるので追いかけるのが簡単になりそうです。

Google Apps担当者向け。コマンドラインでシステム設定変更「Google Apps Manager」

Google Appsを使って企業内のメールや情報共有を行っている企業のシステム担当者にお勧めなのがGoogle Apps Managerです。コマンドラインでGoogle Appsの管理ができます。 コマンドヘルプです。 まず設定を行います。公式サイトのWikiに書かれている手順に従ってOAuthを取得します。 シークレットキーを設定します。 権限を付与するスコープを設定します。 メール設定をつけました。全てのスコープを有効にすることもできます。 実行するとWebブラウザが開くので、OAuthを承諾します。 Google Apps ManagerではロゴをダウンロードしたりSSOの設定変更、ユーザアカウントの作成、設定など実に多様な処理をコマンドラインだけで実行できます。処理はバルクでも実行できます。現在登録されているデータをCSVでダウンロードする機能もあります。

Google Sky Mapは開発終了&オープンソース化「Stardroid」

Googleは最近、色々なサービスを終了しています。最近、その一つに挙がったのがSky Mapです。しかしGoogleとしての開発は停止しますが、Sky MapはオープンソースのStardroidとして継続されることになりました。 OSS阪のコンパイルに失敗してしまったのでマーケット版を。まずは規約の同意です。 天体図が描かれます。Androidを動かすと天体図も動きます。 銀河や惑星など表示項目を切り替えられます。 メニューです。 表示項目を選択できます。 タイムトラベルです。指定した日付の天体を見られます。 これはアポロが月面着陸した時の天体です。 時間を早回しで進めることもできます。 イメージギャラリーもあります。宇宙、やばいです。 ナイトビジョンモードです。夜間屋外で使う場合はこちらのモードで。 Stardroidは星座早見盤をデジタル化したようなものですが、デジタルコンパスや傾きを使って自動的に位置を補正してくれるのが便利です。肉眼では見えなかった星や星雲を見つけるきっかけになるかも知れません。

地図上に独自のデータをマッピング「WorldMap」

地図の上に様々なデータを載せて表示するだけでとても面白いコンテンツになります。それを容易に実現できるWebアプリケーションとしてWorldMapを紹介します。 既に登録されている地図を検索できます。 ローディング中です。 日本の地図はやはり東日本大震災に関連した地図データでした。 様々なレイヤーが用意されています。 地図もGoogleマップ以外に切り替えられます。 レイヤーデータの色分け基準です。 海外のデータもたくさんあります。 複数のレイヤーを重ねて表示できます。 ユーザ登録すると地図の作成ができます。 地図を表示しています。 レイヤーを追加します。 外部データの取り込みもできます。 レイヤーデータをアップロードすることもできます。 一から作成もできるようです。 WorldMapはGeoNodeというオープンソース・ソフトウェアのカスタマイズ版になるようです。外部データや独自データを取り込んだ地図を手軽に作成して世界中に公開できるプラットフォームです。

EC2の月額料金は幾ら?を教えてくれる「EC2-cost」

Amazon Web Services、特にEC2を使ってみたいと思いつつ従量課金のためなかなか踏み切れない…という方に使ってみてほしいのがEC2-costです。シンプルにEC2のコストを算出してくれます。 アクセスしました。東京リージョンの価格が表示されています。 特に他のページはなく、基本的な月額料金が表示されるのみです。Googleの為替情報を用いているので、円ドルレートの変化があっても大丈夫です。なお、ここで出ている金額は1時間あたりの金額を月額分にしたものであって、転送に伴う課金は含まれないようです。

面白い!WebSocketを使ってWebブラウザでVNCライクに操作「WebSocketRemote」

WebSocketを使って色々なWebアプリケーションが作られていますが、WebSocketRemoteはひと味違います。何とWebSocketでVNCライクなリモートPC操作を実現しています。 起動するとメニューバーに常駐します。この時点で既に使える状態です。 他のPCからWebブラウザでアクセスできます。デュアルスクリーンにも対応しています。 スマートフォン対応もしています。 WebSocketRemoteはマウスクリックのイベントのみサポートしているので、今のところキーボード入力はサポートしています。またiOS向けには画面を表示するリモートモードの他、マウスポインタ代わりに使えるマウスモードというのが用意されています。

このページのトップへ