タグ

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

  • モトローラ社製。HTML5を使ったWebアプリケーションを作るなら·Montage MOONGIFT

    Montageはモトローラ社製のHTML5 Webアプリケーションフレームワークです。 Webサイトに比べるとWebアプリケーションで求められる素養は多少異なります。アプリケーションゆえに予め決められたコンポーネントを組み合わせて作る方が一般的です。そこで紹介したいのはMontage、モトローラ社製のHTML5 Webアプリケーションフレームワークです。 デモのKitchen Sinkです。 ボタンです。デザインはすっきりとして見やすいです。 こちらは時刻を表示するデモ。 クリックで削除するタグのデモ。 Todoアプリのデモ。 Fiddleを使って試す事もできます。 画像からカラーピッカーするデモ。 計算機のデモ。 Montageには多数のコンポーネントが用意され、それらを埋め込む形で配置してけば画面が出来上がります。カレンダーやレンジ入力、トグルボタンなど様々な入力コンポーネントが用意さ

  • モトローラ製。HTML5 Webアプリケーションを作るためのオーサリングツール·Ninja MOONGIFT

    NinjaはHTML5 Webアプリケーションを開発するためのオーサリングツールです。 Webのオーサリングツールの代表格と言えばDreamweaver。しかしHTML5、さらに各種フレームワークの登場以降、徐々に状況が変わってきています。そんな中登場したのがNinja、Google Chrome上で動作するHTML5オーサリングツールです。 インストールします。Chromeウェブストアでインストールできます。 インストールしました。 起動するとクラウドサーバのURLが求められます。 サーバになるアプリもダウンロードできます。 ローカルで立てるサーバを使います。 色々な拡張子のファイルが作成できるようです。 こんな感じにドローを描いていきます。 Google Chrome上でのプレビューです。 3Dも作成できます。 タイムラインのデモ CSSを使ったデザイン 3DモデリングNinjaはHT

    モトローラ製。HTML5 Webアプリケーションを作るためのオーサリングツール·Ninja MOONGIFT
  • これがあればWebアプリケーションのデザインがすいすいできる·Bootstrap MOONGIFT

    Bootstrapは今風のWebアプリケーションを開発するのに最適なデザインパーツを提供するCSSテンプレート。 BootstrapCSS製のオープンソース・ソフトウェア。ITエンジニアが苦手にするのがWebデザインだ。作るのは良いが、それを奇麗に配置していくのがとても難しい。Webサービスが流行るか否かに技術が及ぼす影響は良くて半分だろう。残りの半分以上は見た目にかかっている。 グリッド それもあって奇麗な画像を生成したり、何かのサービスを模したデザインに人気が集まったりする。Appleの作るデザインのような、今風なWebサイトを作る際にはBootstrapが便利そうだ。 BootstrapTwitterの開発チームが作成したWebデザインテンプレートだ。単なるHTMLのみならず、色々な機能がおり混ざっている。複数カラムのグリッド、高さの揃った複数カラムのレイアウト、基的なHTML

  • IE6〜8でのHTML5の印刷を適切にサポート·IE Print Protector MOONGIFT

    IE Print ProtectorはIE8以前のWebブラウザでHTML5サイトの印刷をサポートするライブラリ。 IE Print ProtectorはIE用、JavaScript製のオープンソース・ソフトウェア。HTML5/CSS3になって、HTMLの表現力があがった。それに伴って新しいタグが幾つも追加されている。新しいWebブラウザであれば問題はないが、HTML5非対応のWebブラウザにとっては大きな問題だ。 表示 その最たるものがIEではないだろうか。未だに企業によってはIE6を使っている場合もある。そんなレガシーなWebブラウザでも印刷時の問題を解消してくれるのがIE Print Protectorだ。 IE Print ProtectorはJavaScriptを使って印刷時の問題を解消する。IE Print Protectorを読み込んでいない状態と、読み込んだ時とで印刷プレビ

  • 画像もファイルもテキストも管理できるクリップボード管理ツール·Clipboard Manager MOONGIFT

    Clipboard ManagerはWindows用のオープンソース・ソフトウェア。なぜかOSで提供されるクリップボードというのは枠が一つしかない。一つ上書きしたらそれで終わりだ。こんな不便がなぜか一向に改善されずに続いている。 しかしそんな不便さだからこそ、それを解決するソフトウェアに人気が集まる。いわゆるクリップボード管理ソフトウェアだが、主にテキストのみに対応したものが多かったように思える。Clipboard Managerはその一段上をいく便利さだ。 Clipboard Managerが対応するのはテキストに限らない。ファイルも、画像の一部をカットした情報も管理することが出来る。複数の画像から一部を切り抜いていって、まとめて文書内に埋め込むなんて作業もできる。ファイルの移動もとりあえずカットして、後で実行させることもできる。 使い方は簡単で、コピーしたりすれば自動的にリストに追加さ

    画像もファイルもテキストも管理できるクリップボード管理ツール·Clipboard Manager MOONGIFT
  • SEOに力を入れるなら使おう·Seo Panel MOONGIFT

    Seo PanelはPHP/MySQL製のオープンソース・ソフトウェア。検索エンジン最適化、いわゆるSEOだが最も重要なのは有益なコンテンツをただひたすらに積み重ねていくことだ。小手先のテクニックではそうそう順位は操作できない。なにせ各検索サービスはそうしたテクニックと戦っているのだ。 WebベースのSEOチェッカー だがコンテンツを積み重ねていく中で順位が変動するのは気になる所だろう。メタタグやキーワードによっても最適化する道もある。そうしたSEOの手法を教えてくれつつ、日々のチェックが可能なのがSeo Panelだ。 SEO系のソフトウェアというと有料で提供されるものが多い。また、おおっぴらにWebサービスとして展開するのは検索エンジンから嫌われる可能性がある。その点においてSeo Panelは個々にインストールが可能で、かつ無償というすばらしい選択肢になる。 ツール管理 キーワードを

    SEOに力を入れるなら使おう·Seo Panel MOONGIFT
  • 映画の字幕をダウンロードする·Subdownloader MOONGIFT

    SubdownloaderはMac OSX/Linux向けのオープンソース・ソフトウェア(Windows版はシェアウェア)。洋画の場合、日語の字幕をつけて観ることが多いが、英語の勉強がてらに観るならば字幕無しで観た方が良いだろう。だがそのままでは十分な理解ができずに物足りなく感じるかも知れない。 検索フォーム そんな時に使えるのが英語の字幕を付けるという方法だ。映画のDVDや動画があれば、Subdownloaderが自動的に探してくれる。Subdownloaderは動画の情報を元にOpenSubtitles.orgから字幕をダウンロードするソフトウェアだ。 動画がない場合や、うまく検索できなかった場合でも手動検索機能がある。中には日語の字幕も見つけられるはずだ。多様な言語の字幕が登録されているので、フィルタを使ってうまく探そう。同じ言語でも多数の字幕が登録されている。 アップロードフォ

    映画の字幕をダウンロードする·Subdownloader MOONGIFT
  • マインドマッピング的にデータを視覚化する·Visual Understanding Environment MOONGIFT

    Visual Understanding EnvironmentはWindows/Mac OSX/Linux向けのオープンソース・ソフトウェア。プロジェクトを企画する際、頭の中で考えていることをまとめる時には、それに特化したツールを使うとうまくいく。例えばマインドマッピングだ。 情報整理、視覚化に だが必ずしもノードがつながっているとは限らない。それ以外にも可視化したい情報はたくさんある。地図や写真に付加情報をつけたいなんてニーズもあるかも知れない。そんなあらゆるデータを視覚化、まとめあげるツールがVisual Understanding Environmentだ。 Visual Understanding Environmentはいわゆるマインドマッピングではない。ノードを配置して、線でつなぐこともできるというだけだ。ノードは写真やファイル、リンク、メモをつけることができる。キーワードを

    マインドマッピング的にデータを視覚化する·Visual Understanding Environment MOONGIFT
  • 複数バージョンのFirefoxを一括インストール·Mozilla Firefox Collection MOONGIFT

    Mozilla Firefox CollectionはWindows用のフリーウェア。Webサイトを開発する際にはどのバージョンのブラウザからサポートするかが工数に影響を与える。ブラウザは進化するに従ってレンダリング結果やJavaScriptの動作が異なったりするので、多くのブラウザをサポートする場合はテストの工数が増えていく。 4つのFirefoxがインストールされる IEでは複数のバージョンをインストールして確認するソフトウェアがあるが、Firefoxでは見かけなかった。だがMozilla Firefox Collectionはまさにそのためのソフトウェアになる。Firefox2〜3.6までの歴代Firefoxでのシステム確認作業が出来るようになる。 インストールされるのは2、3.0、3.5、3.6の4つのFirefoxになる。さらにFirebugやWeb DeveloperといったW

    複数バージョンのFirefoxを一括インストール·Mozilla Firefox Collection MOONGIFT
  • ついに!iPhoneでもFlashが表示できるライブラリ·Gordon MOONGIFT

    GordonはJavaScript製のオープンソース・ソフトウェア。iPhoneの最大の欠点とされるのがFlashの表示が未対応という点だ。それによって利用できないサイトがいかに多いことか。今しばらくはAppleの対応は見込めないとあって、我慢の日々が続くだろう。 アニメーションにも対応している だがただ指をくわえて待っていても意味がない。技術者たるもの無理といわれているからこそ挑戦する価値があるのだ。そして一部において問題を乗り越え、見事iPhoneでもFlashを使えるようにしたのがGordonだ。決めてはFlashのSVG化だ。 単なるドローの表示はもちろん、アニメーションについても一部対応している。描画は元のFlashファイルとほぼ変わらず、とても良好な結果だ。もちろん動画や音楽を再生するようなプレーヤレベルはできないが、将来的にはFlashバナー程度ならいけそうだ。 iPhone

    ついに!iPhoneでもFlashが表示できるライブラリ·Gordon MOONGIFT
  • JavaScriptのソースコードをもっと格好よく、見やすく·Code Illuminated MOONGIFT

    Code IlluminatedはWebベース、JavaScript製のオープンソース・ソフトウェア。開発者にとってシステムのソースコードを直接見られるというのは貴重だ。ライブラリの操作が分からないとき、どのように処理をしているのか気になった時にソースコードが見られれば簡単に解決する。 ハイライト表示されると見やすい しかし単なるソースコードのファイルだけが置いてあるのでは利便性が高いとは言いがたい。見やすくなっていてこそ、使いたいと思えるものだろう。JavaであればJavaDoc、PHP用のPHPDocumentorも知られているが、これらは書き方を習得するのが面倒に感じてしまう。JavaScriptに限定されるがCode Illuminatedはなかなかユニークなソースコードビューワーだ。 Code Illuminatedは左にクラスの説明やメソッドに関する説明がされ、右側にソースコー

    JavaScriptのソースコードをもっと格好よく、見やすく·Code Illuminated MOONGIFT
  • IE向けのWebサイトテストツール·IEUnit MOONGIFT

    IEUnitWindows、IE向けのオープンソース・ソフトウェア。Webシステムのテストではサーバサイド言語のテスト(ユニットテスト)は良く行われるが、クライアントサイドのテストについてシステマチックに行っている例は少ない。有名なものとしてはSeleniumが知られている。 IE向けのユニットテスト そんなSeleniumと同様に、IEを使ったブラウザベースのユニットテストが行えるのがIEUnitだ。SeleniumでもIEを指定してテストを実行することができるが、IEUnitはIEに特化していることが特徴だ。実行にはJScriptを使っているのでさらに広範囲にテストができそうだ。 テストは表示されている文字のチェックや文字を囲んでいるタグのチェックもできる。もちろん一般的な真偽値のチェック方法も可能だ。テストファイルを実行するとコマンドプロンプトが開き、そこにテスト結果やログが記述さ

    IE向けのWebサイトテストツール·IEUnit MOONGIFT
  • モバイルアクセスか否かを判定する·Detect Mobile Browser MOONGIFT

    Detect Mobile Browserはコードを生成するWebサービス。スマートフォンが多数登場した結果、WebサイトへのアクセスがPCのみならず携帯電話から来ることも増えてきた。その際に必要になるのがモバイルか否かの判定だ。 コードを生成する 日の携帯電話においては既に幾つかのライブラリが存在する。だがグローバルなサービスを構築する場合は別な判定が必要になるだろう。そこで使ってみたいのがDetect Mobile Browserだ。Detect Mobile Browserは各種プログラミング言語向けのモバイルアクセス判定コードを生成する。 対応しているのはApache(.htaccess)、ASP、ColdFusion、JSP、JavaScriptPHPRailsとなっている。処理としてはブラウザのユーザエージェントを取得して判別する形式になっている。コード量は少なく、正規表

    モバイルアクセスか否かを判定する·Detect Mobile Browser MOONGIFT
  • 正規のiPhoneアプリが取得できるあなたの情報はこれだけある·SpyPhone MOONGIFT

    SpyPhoneはiPhone向けのオープンソース・ソフトウェア。iPhoneアプリでは内部にある情報で操作できるものは限られている。例えばアプリ側で電話をしたり、他のアプリケーションにあるコンテンツを利用したりすることはできない。携帯電話というプライバシーの固まりを守っている訳だ。 データソース一覧 だが全ての情報が取得できないかと言えばそんなことはない。JailBreakすれば好き放題に取得できるだろうが、App Storeに登録できるレベルであっても多様な情報が得られるのだ。それを理解できるのがSpyPhoneになる。 SpyPhoneを立ち上げるとメール、WiFi、電話、位置情報、Safari、Youtube、写真、アドレス帳、キーボードキャッシュといったデータソースが表示される。そしてそれぞれのデータソースに応じて取得できるデータを閲覧できる。例えば電話であれば最後にかけた電話番

    正規のiPhoneアプリが取得できるあなたの情報はこれだけある·SpyPhone MOONGIFT
  • SVGを使ったものすごいグラフライブラリ·dygraphs JavaScript Visualization Library MOONGIFT

    dygraphs JavaScript Visualization LibraryはJavaScript製のオープンソース・ソフトウェア。グラフライブラリは多数あれど、大抵は円グラフや棒グラフなどのシンプルなグラフを描く機能しかない。高度なグラフを描こうとすると利用できるライブラリは途端に少なくなる。 高機能なグラフライブラリ また高度なグラフはクライアントサイドだけでなく、サーバサイドの仕組みが必要になることも多い。そんな中dygraphs JavaScript Visualization Libraryはとても簡単に使えるグラフライブラリになっている。JavaScriptSVGを描いてグラフ化するのだ。 主なグラフはX-Y軸を持った折れ線グラフになるようだ。とはいえ測定範囲を含んだグラフを描いたり、グラフの一部をマウスを使って拡大する、マウスオーバーすると値が表示されるなど高度な機能

    SVGを使ったものすごいグラフライブラリ·dygraphs JavaScript Visualization Library MOONGIFT
  • iPhone/スマートフォン向けのJavaScriptフレームワーク·xui-js MOONGIFT

    xui-jsはJavaScript製のオープンソース・ソフトウェア。スマートフォンが隆盛だ。iPhoneはもとよりAndroid、Plam Pre、Windows Mobile、Blackberryと多彩なスマートフォンが登場している。多数のスマートフォンではWebKitをブラウザに使っている。 スマートフォン向けのJavaScriptフレームワーク WebKitであればHTML5にも対応し、JavaScriptも高いレベルで実行ができる。そんな中登場したJavaScriptフレームワークがxui-jsだ。多彩な表現を可能にしつつ、スマートフォンでしか実行できない機能もある。 イベントを取得してHTMLの内容を書き換えたり、アニメーションを実行する操作がコード数行で実現できる。Ajaxも利用でき、アクションによって外部からデータを取得して表示するのも簡単だ。CSSのクラスを追加したり、逆に

    iPhone/スマートフォン向けのJavaScriptフレームワーク·xui-js MOONGIFT
  • 写真から人物を簡単に切り出す·InstantMask MOONGIFT

    InstantMaskはWindows用のフリーウェア。写真の一部から人物を切り出して別な写真と合成するような操作をしたいと思うと、高度な画像編集ソフトウェアが必要に感じられるだろう。もちろんそうしたソフトウェアがあれば容易にできるかも知れない。 写真に線を引くだけ だが素人がそのためだけに高価なソフトウェアを購入するとは思えない。そこで使ってみたいのがInstantMaskだ。InstantMaskはまさに写真から一部を切り出すためだけのソフトウェアだ。機能が限定的な分、使い方も簡単だ。 切り出したい写真を開いたら二種類のペンを使ってマーキングを行う。一つは残しておきたい場所を指定するもので、もう一つは不要な場所を指定するものだ。線は厳密である必要はなく、だいたいのラインで描くだけで良い。 線の引き方を失敗したが概ねOK 後はプレビューボタンを押せば自動的に写真が解析されて、それらしいラ

    写真から人物を簡単に切り出す·InstantMask MOONGIFT
  • クロスブラウザでXUL/SVGを実現するフレームワーク·Ample SDK MOONGIFT

    Ample SDKはJavaScript製のオープンソース・ソフトウェア。JavaScriptはAjaxが登場して以来、一気に進化を遂げた。Prototype.jsやjQueryを使えばインタラクティブなアクションが可能なWebサイトが簡単に構築できる。そうしたライブラリはプラグインによって細かく分割された機能をもっているのが特徴だ。 XULによる画面定義 だが自分の目的にあったプラグインがあれば良いが、ないと自分で作ったり探す羽目になる。Ample SDKであればその使い方を覚えてしまえば一つのライブラリで済むのが利点と言えそうだ。リッチなインタフェースや操作を可能にする各種機能が盛り込まれている。 機能は数多いが、例えばリサイズしたりドラッグアンドドロップを実現するオブジェクトを簡単に作ることが出来る。さらにマウスオーバーで枠の色が変わるデモやJavaScriptのアクションをブラウザ

    クロスブラウザでXUL/SVGを実現するフレームワーク·Ample SDK MOONGIFT
  • Google製、JavaScript/CSSの難読化&キャッシュ·Reducisaurus MOONGIFT

    ReducisaurusはJava製/Google App Engine用のオープンソース・ソフトウェア。Webアプリケーションが隆盛になり、JavaScriptを多用したシステムやCSSによる凝ったデザインのサイトが増えてきた。それぞれフレームワークを使ったりして複数のファイルを扱うケースも多い。 設定方法 JavaScriptCSSのファイルを複数読み込むにはその分だけコネクションを行う必要があり、負荷がかかってしまう。そこで使ってみたいのがReducisaurusだ。ローカルファイルやリモートのファイルを読み込んで一つにまとめてアクセスできるようになる。 ReducisaurusはGoogleエンジニアでJaikuの開発にも関わっているプログラマによるソフトウェアだ。実行はGoogle App Engine上で可能になっている。自分でサーバを立てることもできるし、Reducisa

    Google製、JavaScript/CSSの難読化&キャッシュ·Reducisaurus MOONGIFT
  • Windowsのhostsファイルを切り替える·Hosts Manager MOONGIFT

    Hosts ManagerはWindows向けのフリーウェア(ソースコードは公開されている)。システム開発を行っている時や、ネットワークの調査を行っている際に良く使われるのがhostsファイルだ。ローカルを運用サーバのように見せたりする目的で使ったりするだろう。 タスクトレイで切り替え 便利とは言え、常時設定しておくと逆に問題が起こる場合もある。そのため設定をコメントアウトして残しておく人が多いと思うが、これからはHosts Managerを使ってみるといいだろう。Hosts Managerはhostsの設定をグルーピングして管理できる。 Hosts Managerはタスクトレイに常駐するソフトウェアで、hostsファイルの設定をグループとして定義し、その内容をタスクトレイから切り替えられる。例えば開発用、といった定義をしておけば開発サーバと運用サーバを簡単に切り替えられるようになる。 編