タグ

ブックマーク / www.moongift.jp (44)

  • Webサイトのサムネイル生成に。RubyでGeckoエンジンを操作する·MozShot MOONGIFT

    MozShotはRubyでGeckoエンジンによるWebサイトのサムネイル画像を保存するソフトウェア。 MozShotはRuby製のオープンソース・ソフトウェア。WebサイトのURLを指定してスクリーンショットを撮影するサービスはニーズが多い。やはり単なるタイトルやURLといったテキストの羅列に比べて、サムネイルが表示されることによるインパクトの大きさがある。 MOONGIFT 一般的な手法としては、Webブラウザをリモートで操作してその画面を画像として保存する方法をとる。レンダリングをGeckoエンジンで行うならばMozShotを使うのが良いだろう。 MozShotはLinuxでXサーバを使い、gtkmozembedを使ってWebサイトをレンダリングし、そのキャプチャを画像として保存する。デモのCGIインタフェースも用意されており、Apache + mod_ssiを使って三パターンのスク

    t9a
    t9a 2014/01/15
    サムネ作成
  • Facebook製。プログラマー向けのプロジェクト管理·Phabricator MOONGIFT

    PhabricatorはFacebookが開発しているプロジェクト管理です。ソースコードレビュー、バグトラッキングなど開発者フレンドリーな機能が数多くあります。 企業においてGitHubをソースコードリポジトリ/プロジェクト管理に使っているケースも増えてきていますが、大規模な企業では難しいケースも多いでしょう。そこで紹介したいのがFacebookで開発されているPhabricatorです。 最初にログインを求められます。 ついでユーザ名を入力します。 ダッシュボードです。 チケットの詳細画面です。 ソースコードレビュー。 もちろんコードハイライター付き。 リポジトリビューワー。 コミットログ。 画像付きでディスカッションもできます。 Wiki。 IRCのチャンネルリスト。 PhabricatorではGit/Subversion/Mercurialをサポートしています。また、OSはWindo

    Facebook製。プログラマー向けのプロジェクト管理·Phabricator MOONGIFT
  • Google ChromeでJavaScriptのデバッグをする際にはぜひインストールを!·JS Runtime Inspector MOONGIFT

    JS Runtime InspectorはGoogle ChromeJavaScriptデバッグを強力にサポートしてくれるソフトウェアです。 最近はJavaScriptを徹底的に活用したWebアプリケーションも増えてきました。そんな中デバッグは非常に困難になってきています。そこで使ってみたいのがJS Runtime Inspectorです。 インスペクタにJS検索フィールドが追加されます。 検索結果です。 そこから定義されている場所に簡単に飛べます。 利用例。 JS Runtime Inspectorを使えばJavaScriptを掘り下げて調べるのがとても簡単になります。関数名の他、値でも検索できるので目的の処理を見つけるのが簡単になるはずです。 JS Runtime InspectorはGoogle Chrome用、MIT Licenseのオープンソース・ソフトウェアです。 MOONG

    Google ChromeでJavaScriptのデバッグをする際にはぜひインストールを!·JS Runtime Inspector MOONGIFT
  • Seleniumを使ったiPhoneアプリの自動操作テストツール·Appium MOONGIFT

    AppiumはiOSのテストを自動化するSeleniumを使ったテストツールです。 iOSのテストはユニットテストが基と思われます。実際の操作については人が細かくテストを行っているのではないでしょうか。その面倒なUIテストを自動化してくれるのがAppiumです。 実行中です。 文字の入力などは自動で行ってくれます。 テストコード。 AppiumはテストコードをJava/Ruby/PHP/node.js/Pythonで書くことができます。さらにSeleniumを使って開発されているのも特徴です。テストは分離しているため、既存のアプリに何らかのSDKを組み込んだりする必要はありません。近く、Androidもサポートされるそうです。 AppiumはMac OSX用のオープンソース・ソフトウェア(Apache License 2.0)です。 MOONGIFTはこう見る iPhoneを自動操作して

    Seleniumを使ったiPhoneアプリの自動操作テストツール·Appium MOONGIFT
  • 自由度高く部品を配置するちょっと不思議なWebアプリケーション·Morphic.js MOONGIFT

    Morphic.jsはWeb上に部品を配置して自由にデザインを決められるWebアプリケーションです。 ちょっと不思議なWebアプリケーションの紹介です。Morphic.jsはWeb上に独自のコンポーネントを配置できるWebアプリケーションです。モックアップを作ったり、ドローアプリケーション的に使えそうです。 トップページです。右クリックでメニューが出ます。 ドラッグして動かしたりできます。 ボックスを追加しました。 さらにスライダーやフレームを追加しました。 モバイルモードにするとメニューが大きくなります。 色設定もあります。 複数のmorphic.jsを埋め込めます。 Morphic.jsでは右クリックから部品を配置して、それを動かしたりリサイズしたりできます。ラベルを描画してフォントサイズを変更し、Webサイトのワイヤーフレームを作ったりすることもできるでしょう。いろいろな使い道が考え

    自由度高く部品を配置するちょっと不思議なWebアプリケーション·Morphic.js MOONGIFT
  • 小さなツールだけど便利。Photoshopを自動操作するJavaScript集·Photoshop Javascript Tools MOONGIFT

    Photoshop Javascript ToolsはPhotoshopの自動操作を行うためのJavaScriptライブラリ集です。 知らなかったのですが、Photoshopの自動操作を行うスクリプトはJavaScriptで記述可能です。今回はそのためのツール集とも言えるPhotoshop Javascript Toolsを紹介します。 インストールします。PhotoshopのScriptsディレクトリ内にコピーします。 スクリプトメニューに取り込まれました。 一例です。ガイド作成します。 こんな感じにラインが引かれました。 エラーを見るとJavaScriptっぽいのが分かります。 主な機能は二つで、ガイドラインを引くライブラリとフォント名を表示したり変更できるライブラリになります。また、その他プログレスバーのUIやカレンダーを作成する、JPEGへのエクスポートを行うライブラリなど小さなツ

    小さなツールだけど便利。Photoshopを自動操作するJavaScript集·Photoshop Javascript Tools MOONGIFT
  • その場で編集。Webベースのガントチャートエディター·jQuery Gantt editor MOONGIFT

    jQuery Gantt editorはjQuery製のガントチャートエディターです。その名の通り、その場でデータの編集ができます。 プロジェクト管理において進捗や各人のステータスによる作用を判断するのに便利なガントチャート。オンライン版も幾つか出ていますが、既存サイトに組み込みたいならjQuery Gantt editorを使ってみましょう。その名の通り、jQueryベースのガントチャートエディターです。 メイン画面です。まさにガントチャートの画面です。 日程や階層の深さを編集できます。 詳細な情報も変更できます。 タスクの追加も可能です。 人員のアサインにも対応しています。 データはそのまま保存したり、JSONとしてエクスポートできます。従ってJSONデータを使えば同じ画面を再現するのは難しくありません。Undo/Redoをサポートし、クロスブラウザで動作します。閲覧だけでなく、編集ま

    t9a
    t9a 2012/09/08
  • シンプルで格好いい。親切なコードレビューシステム·Barkeep MOONGIFT

    BarkeepはGitリポジトリに対応したユーザビリティ高いコードレビューシステムです。 会社でプログラミングを行っているとそのコードの品質はばらつきが出てきます。そうするとバグが多くなったり、予期しない問題に直面したりします。それを防ぐのに有効なのがコードレビューです。Barkeepはユーザフレンドリーなコードレビューシステムになっています。 メイン画面です。コミットログが並んでいます。 詳細です。差分が表示されています。 サイドバイサイド。アニメーションしながら表示されて格好いいです。 コードをダブルクリックするとコメントできます。 コメントしました。 一つにまとまっている場合もコメントできます。 レビュー依頼もできます。 ステータスです。レビューされている、されていないといった情報が一目で分かります。 検索結果です。 こちらはプロフィール。 Barkeepは検索における入力補完やフィ

  • クエリの改善に。MySQLのSlow Query Logを可視化する·MySQL slow-query-log Visualizer MOONGIFT

    MySQL slow-query-log VisualizerはMySQLの時間のかかるクエリをWeb上で閲覧するソフトウェアです。 MySQLには実行時間の遅いクエリをログファイルに書き出す機能があります。単純にテキストに吐かれるだけなので分析に時間がかかってしまうのではないでしょうか。そこで使ってみたいのがWebブラウザベースの解析ソフトウェアMySQL slow-query-log Visualizerです。 サンプルです。データ量が多くないとあまり面白くないですね。 公式サイトより。曜日ごとに発生回数をグラフ化しています。 クエリログファイルをWebブラウザの画面にドロップするだけで解析処理が行われます。その結果はグラフに描かれる仕組みです。また、クエリは一覧で表示され、任意の文字でフィルタリングすることもできます。曜日と時間によって分析されるので対応すべきポイントが分かりやすくな

    クエリの改善に。MySQLのSlow Query Logを可視化する·MySQL slow-query-log Visualizer MOONGIFT
    t9a
    t9a 2012/06/18
  • jQuery/CSS3でPath風メニューを·Pie Menu MOONGIFT

    Pie MenuはPathのメニューに似たUIをjQueryで再現したライブラリです。 人気のあるiOSアプリのUIはすぐに真似したモックアップが登場します。Pathもその一つです。流れるようなUIはもちろん、赤いプラスボタンのメニューが人気です。Pie Menuはそんなメニュー表示をjQuery/CSS3で再現したライブラリです。 赤いボタンを押します。 アニメーションがあってメニューが表示されます。 パラメータを変更して表示をカスタマイズできます。 密着版。 デモ動画です。 デスクトップ版でPie Menuを採用したとしてもなかなか使い方が分からないかもしれませんが、PhoneGapと組み合わせると話が違ってきそうです。スマートフォン向けサイトで使ってみても面白いかもしれません。 Pie MenuはjQuery/JavaScript製のソフトウェア(ソースコードは公開されていますがライ

    jQuery/CSS3でPath風メニューを·Pie Menu MOONGIFT
    t9a
    t9a 2012/05/28
  • 吹き出し風CSSデザインをオープンソースで·CSS Arrow Please MOONGIFT

    CSS Arrow PleaseはCSSだけで作成する吹き出しデザインをオンライン上で行えるサービスです。 Twitterをはじめコミュニケーションが基のサービスで欲しくなるのが吹き出し風のデザインです。そんなデザインをオンラインで簡単に作成できるのがCSS Arrow Pleaseです。 トップページです。左に描かれている吹き出しデザインが右側のCSSで作成されています。 吹き出しの位置は上下左右から選べます。 色はカラーピッカーを使って自由に選択できます。 カスタマイズしたパターンです。 CSS Arrow Pleaseでは吹き出しの配置や色、線の太さなどを自由にカスタマイズできます。後は出来上がったスタイルをコピーして自分のサイトに組み込むだけです。 CSS Arrow PleaseはHTML/CSS製のオープンソース・ソフトウェア(MIT License)です。 MOONGIFT

    t9a
    t9a 2012/04/29
  • Bootstrapを使おう!様々なカラーテーマ、プラグインを用意·Kickstrap MOONGIFT

    KickstrapはBootstrapをベースにしたテーマ、プラグインを提供するソフトウェアです。 最近作られるWebサービスでよく使われているBootstrap。そんなBootstrapは固定色でそれっぽさが感じられてしまうのが欠点でしたが、見事に打ち消してくれるのがKickstrapです。 色が変わると随分印象が違います。 テーマ機能があります。 青と白。 こんな感じのシンプルなテーマも。 逆にカラフルなものもあります。 基は同じですが、印象は違いますね。 好みのテーマを選べます。 JavaScriptプラグインがデフォルトよりもぐっと増えています。 Kickstrapを使えばBootstrapをより便利に使えるでしょう。JavaScriptプラグインも通知機能をはじめ、色々なものが追加されていますのでWebサイトをより強力にパワーアップできるはずです。 KickstrapはHTML

  • これは格好いい。Windows 8のMetro UIをHTML5で再現·Metro UI CSS MOONGIFT

    Metro UI CSSWindows 8のMetro UIHTML5/CSS3で再現したソフトウェアです。 次期WindowsWindows 8ではMetro UIと呼ばれる新しいインタフェースが利用されています。そんなMetro UICSSで再現したのがMetro UI CSSになります。 デスクトップで見たイメージです。アイコンが並んでいます。 選択できる画像リストです。 選択できるリストです。画像も埋め込めます。 チャットなどで使えそうなリストです。吹き出しもついています。 アプリケーションリストです。 時計などのウィジェットです。 iPadでの表示です。タブレットの方が最適化されています。 左右の移動もできます。 デモ動画です。動きはスムーズです。 動きはかなりスムーズで格好いいです。パネルを押すとちょっとへこんだり、ボタンも多数用意されています。リストをタップして選択し

    これは格好いい。Windows 8のMetro UIをHTML5で再現·Metro UI CSS MOONGIFT
    t9a
    t9a 2012/04/07
  • プロジェクト管理に使ってみたい。jQuery製のガントチャートライブラリ·jQuery.ganttView MOONGIFT

    jQuery.ganttViewはjQuery製のガントチャート表示ライブラリです。 jQueryを使ってガントチャートを表示するライブラリがjQuery.ganttViewです。表示だけでなくデータのメンテナンスもできるようになっています。 いい感じにガントチャートが表示されています。 ドラッグでタスクを左右に移動させられます。 期間の変更は枠の端をドラッグします。 データはJSONで与えるだけです。 jQuery.ganttViewは表示系のライブラリなのでデータベースに蓄積された内容をガントチャートにして表示すると言った使い方が便利そうです。なお表示はタスクごとに横に表示される形で、複数のタスクを同一線上に表示することはできないようです。 jQuery.ganttViewはjQuery/JavaScript製のオープンソース・ソフトウェア(MIT License)です。 MOONGI

    t9a
    t9a 2012/03/26
    ガントチャート
  • Clear風のUI、操作を実現するスマートフォン向けWebアプリケーション·HTML5 Clear MOONGIFT

    HTML5 ClearはiOSのTodoアプリClearに似た操作をHTML5で実現しています。 これまでにないほど先進的なUIをもったTodoアプリがClearです。こちらはiOSアプリですが、同様の操作をHTML5で実現しているのがHTML5 Clearになります。 トップ画面です。タスクリストが並んでいます。 次にタスクが並んでいます。操作がそのままタスク名になっています。 タップでエディットです。 ドラッグダウンで新しいタスクを追加できます。 タスクを右にスワイプすると完了になります。 HTML5 ClearはClearの全ての動きを再現している訳ではありませんが、何となくそれっぽい動きが実現できています。HTML5でここまでできるのか、という点からも興味深いソフトウェアです。なおデータは保存されていないのでご注意ください。 HTML5 ClearはHTML5/JavaScript

    t9a
    t9a 2012/03/03
    Clear風
  • Ruby製の小グループ向けIRCサーバ·hector MOONGIFT

    hectorは小さなグループ用のプライベートなIRCサーバです。 hectorはローカルで簡単に立ち上げられるIRCサーバです。ちょっとしたグループのプライベートなIRC利用にぴったりです。 インストールはRubyGemsで。セットアップもコマンドラインで簡単にできます。 立ち上げたサーバにLimeChatから接続します。日語も使えますが、一言発言するごとに接続が切れているようです。 サーバのログです。 hectorは立ち上げるのがとても簡単なIRCサーバなので社内や限られた友人同士でのIRCに最適と言えます。接続は通常、または暗号化(SSL)に対応しています。認証をつけることが可能で、その際には独自の認証システムを利用できるようになっています(デフォルトはテキストベースです)。 hectorはRuby製、MIT Licenseのオープンソース・ソフトウェアです。 MOONGIFTはこう

    Ruby製の小グループ向けIRCサーバ·hector MOONGIFT
    t9a
    t9a 2012/01/17
    IRCサーバー
  • 多彩な表現をご覧あれ。JavaScriptによるデータビジュアル化ライブラリ·JavaScript InfoVis Toolkit(JIT) MOONGIFT

    JITJavaScriptを使ったデータビジュアル化ライブラリです。 JavaScriptを使ってWeb上でデータを多彩にビジュアル化するライブラリがJavaScript InfoVis Toolkit(JIT)です。その多彩な表現をご覧ください。 積み上げのエリアグラフです。表示の際にはアニメーションが実行されます。 実際のコードです。 棒の積み上げグラフです。 横向き、2Dのグラフです。 関連グラフです。マウスで動かせます。 マウスオーバーで説明が表示されます。 こんなグラフもあります。 星形。格好いいです。 カスタマイズにも多様に対応しています。 容量の表示などによく利用されるツリーマップです。 こちらもパターンが色々用意されています。 グラフを組み合わせたパターンです。 こんな表現も可能です。 派生していくアニメーションが格好いいです。 円グラフです。アニメーションやマウス操作に

  • 社内でも立てられるGitHubクローン·GitLab MOONGIFT

    GitLabRuby/Ruby on Railsで作られたGitHubクローンです。 GitHubは有料でプライベートリポジトリが持てますが、それでもセキュリティ上の理由でリポジトリを外だしできないケースはあるかと思います。そんなときに使ってみたいのがGitLabGitHubクローンです。 ログイン必須になります。 ログインした後の画面です。登録済のプロジェクトが一覧表示されます。 一つのプロジェクトを閲覧しています。ソースツリーが出ます。ソースツリーは右へ右へスライドして表示されます。GitHubに似ています。 ソースコードハイライターも内蔵されています。rawでファイルをダウンロードできます。 タグやブランチを切り替えることもできます。 コミット履歴一覧です。 コミット詳細ではDiffが確認できます。 コミットに対するコメントも確認できます。 チーム設定です。複数人でのコラボレーシ

    t9a
    t9a 2011/11/02
    Github Clone
  • ストーリーベースのアジャイル開発に。Railsのプロジェクト管理·Fulcrum MOONGIFT

    Fulcrumはストーリーベースのアジャイル開発にマッチしたプロジェクト管理システム。 FulcrumはRuby on Rails製のオープンソース・ソフトウェア。アジャイル開発において用いられるユーザストーリー。利点としては機能をユーザ視点で捉えることで、実装されるべき機能が明確になりイテレーションが終わった段階できちんとできているか確認がしやすいことだ。 4つの枠が特徴 そのため通常のタスク管理に比べると大ざっぱに見えてしまい、逆に細かな進捗が見づらくなってしまう場合もあるようだ。そんな状態を解決するには、最適なプロジェクト管理を導入することにあるだろう。今回紹介するのはFulcrumだ。 Fulcrumはストーリーベースのタスク管理を実現する、アジャイル開発向けのプロジェクト管理だ。完了したストーリー、作業上、バックログ、Chilly Bin(終わらなかったタスクを放り込んでおく場所

    t9a
    t9a 2011/10/09
    PivotalTrackerのクローン
  • Backbone.js + Ruby on Railsの勉強に。ドキュメント作成、編集のWebアプリケーション·CloudEdit MOONGIFT

    CloudEditはBackbone.jsとRuby on Railsを組み合わせたドキュメント編集システム。 CloudEditRails/JavaScript製のオープンソース・ソフトウェア。どれだけ面白い技術であっても、動いているものがあるかないかで印象は大きく変わる。デモサイトやデモアプリケーションがあればすぐに試せて動いているコードを見て、動作原理に納得できる。 文書作成 JavaScriptのMVCフレームワークが幾つか登場しているが、これもまた実際に動いているデモがあるかどうかでデファクトが決まってくるかもしれない。フレームワークの一つ、Backbone.jsを使ったWebアプリケーションとしてCloudEditを紹介しよう。 CloudEditはシンプルなドキュメント編集アプリケーションだ。まず一覧でドキュメントのタイトルが並んでいる。それをクリックすると編集画面になる。