任意のライブラリを読み込んでデベロッパーツールのコンソールからテストできる・「JS Envy」
JS Envy JS Envyは任意のライブラリをロードしてDevToolのコンソールからAPIテストを行えるツールです。上図はjqueryを読み込んだ瞬間のSSです。右側にライブラリが挿入されているのが確認出来るかと思います（わかり...
Resource - JavaScript
ブラウザでSwiftのコードを実行、動作テスト出来る・「IBM Swift Sandbox」
IBM Swift Sandbox IBM Swift SandboxはWeb上でSwiftのコードを実行出来るツールです。jsfiddleみたいな使い方でいいので簡単ですね。名前にもあるようにIBMのSwift関連のプロジェクトの内...
年表などのタイムラインUIを構築する為のライブラリ・「Labella.js」
Labella.js Labella.jsはタイムライン作成ライブラリです。上図のようなライン上にポイントとラベルを実装する事が出来る、というもの。ラベルは重なること無く他のラベルを避けてレイアウトしてくれます。なかなか良いのでは。ラ...
オープンソースのHTML5製パーティクルエンジン・「Proton」
Proton ProtonはOSSで公開されているHTML5製のパーティクルエンジンです。手軽に様々なタイプのパーティクルを実装、動作シミュレートが可能、とのこと。レンダラはCanvas、DOM、WebGL、Easeljs、pixel...
SVGで世界地図を作成する為のスクリプト・「World Map Generator」
World Map Generator World Map GeneratorはSVGで世界地図を作成する際にサポートしてくれるスクリプトです。jQueryに依存しています。各国へのリンクや、その地域のタイムゾーンを取得する事が出来る...
店舗等の予約システムを実装する為のスクリプト・「Booking.js」
Booking.js Booking.jsは店舗等のオンライン予約システム構築のためのスクリプトです。OSSとして公開されていますので日本語への対応も問題なさそうです。カスタマイズ性も重視してるそうです。宿泊施設や飲食店、サロン等に留...
HTML5製の軽量で高速な2Dゲームエンジン・「Stage.js」
Stage.js Stage.jsはHTML5製の軽量且つ高速な2Dゲームエンジンです。シンプルな2Dゲーム開発をサポートしてくれます。デモを触ってみましたが、割とはまってしまうものですね・・・DOMライクなツリー構造のデータモデルの...
モーショングラフィックスを構築する為のスクリプト・「mo.js」
mo.js mo.jsはWeb上でモーショングラフィックスを作成出来るOSSのスクリプトです。滑らかなアニメーションエフェクトでエレメントに動きを加え、組み合わせてモーショングラフィックスの構築をサポートする、というもの。デバイスを選...
パズルを利用したCAPTCHA実装の為のスクリプト・「PuzzleCAPTCHA.js」
PuzzleCAPTCHA.js PuzzleCAPTCHA.jsはパズルを利用したCAPTCHA実装の為のスクリプトです。jQueryに依存しているようです。パズルと言っても実際にパズルを解くのではなく、同じ絵柄を選択する、というだ...
Semantic UIユーザー向けのリアルタイムプレビューツール・「SemanticEdit」
SemanticEdit SemanticEditはSemantic UIを使用している開発者向けのプレビューツールです。HTMLを書けばSemantic UIのスタイルが適応された状態のプレビューをリアルタイムで確認する事が出来ます...
OS XのFinderライクな階層データ表示の為のスクリプト・「Finder.js」
Finder.js Finder.jsはMac OSのFinderのカラムビューライクな階層データ表示用スクリプトです。上記のようなファイルマネージャのUIを実装する事ができる、というもの。依存関係もなくサイズも軽量との事。ライセンス...
Webサイトに任意のユーザー用のショートカットキーを設定できるスクリプト・「visualKeys」
visualKeys See the Pen PPxEdN by kachibito (@kachibito) on CodePen. visualKeysはWebサイトに任意のショートカットキーを手軽に割り当てられるスクリプト...
SVGのパスをアニメーションにする為のシンプルなスクリプト・「jQuery DrawSVG」
jQuery DrawSVG jQuery DrawSVGはSVGのpathにアニメーションエフェクトを付与する為のスクリプトです。jQueryに依存しています。書いたpathにstroke-dasharrayプロパティとstroke...
Vue.jsベースのモバイル向けUIフレームワーク・「VUI」
VUI VUIはVue.jsベースのモバイル向けUIフレームワークです。iOS、Android、Windowsモバイルといった各モバイルデバイスのネイティブUIライクなコンポーネントを提供しているとの事。HTML属性をバインドする為の...
Dribbbleに投稿したアイテムでポートフォリオを作れるスクリプト・「Dribbbox」
Dribbbox DribbboxはDribbbleに投稿したアイテムを読み込んで自身のWebサイトにポートフォリオとして実装する為のスクリプトです。同梱されたconfig.jsを自分のDribbbleアカウントに設定する形で実装する...
任意の画像をプログレスバーにする為のスクリプト・「LoadGo」
LoadGo LoadGoは任意の画像をプログレスバーにする為のスクリプトです。jQueryに依存しています。上図のようなロゴを使ったプログレスバーを実装する事が出来ます。手軽で良さそうですね。ライセンスはMIT。 LoadGo
Basecamp製のシンプルなWYSIWYGエディタ・「Trix」
Trix Trixはプロジェクト管理ツールを運営するBasecamp社製のシンプルなインターフェースのWYSIWYGエディタの為のライブラリ。毎日使ってもストレス無く、WYSIWYGエディタでモバイル向けを含むWebブラウザ間にバグが...
軽さを意識したシンプルなCSSフレームワーク・「Kickstart」
Kickstart Kickstartは軽さを重視したCSSフレームワークです。元々はKickstrapという名でBootstrapの拡張ツールだったそうですが、Ver.3で完全に独立したCSSフレームワークになったとの事です。Boo...
HTML5/JavaScript製ゲーム開発フレームワーク・「hitagi.js」
hitagi.js hitagi.jsはHTML5とJavaScriptで作るゲームの為の開発フレームワークです。エンティティコンポーネントシステムを採用しているとの事で、OSSとしてMITライセンスの元でソースコードが公開されていま...
軽量なJavaScript製モーションエンジン・「Popmotion」
Popmotion Popmotionは軽量なJS製のモーションエンジンです。アニメーションや物理エンジン、キー入力ハンドリングを備えたライブラリで12kbと軽量サイズとなっています。ライセンスはMIT。 Popmotion
WebサイトへのGoogle Mapの埋め込みをサポートするスクリプト・「MAPIT」
MAPIT MAPITはWebサイトへのGoogle Mapの埋め込みをサポートするシンプルなスクリプトです。jQueryに依存しています。Google Mapのスタイルのカスタマイズやルート表示、ピンの変更など、面倒な部分を手軽に変...
Google Maps Javascript APIでフォームでの住所入力を自動補完する・「Autocomplete for Addresses and Search Terms」
Autocomplete for Addresses and Search Terms Google Maps Javascript APIを使ったフォームの住所自動補完が便利そうだったのでメモ。恥ずかしながら、今まで知りませんでした...