Resource - Webデザイナー向け

ツリー構造のリストアイテムをドラッグでソート出来るスクリプト・「Jquery sortable lists」

Jquery sortable lists Jquery sortable listsはツリー構造のリストのアイテムをドラッグで自由にソートできるスクリプトです。アイテム単体に限らず、ネストされたリストごと任意の他リストへ移動する事が...

フリーの写真を公開している複数のストックフォトサイトからまとめて探せるMacアプリ・「Zoommy」

Zoommy Zoommyはフリーの写真素材を公開しているストックフォトサイトを1箇所に集めて探しやすくしたMacアプリです。現在18のストックフォトサイトが纏められており、どのサイトも素敵な写真がCC0などのライセンスで公開されてい...

CSSのA to Zを動画で学べる学習サイト・「A to Z CSS」

A to Z CSS A to Z CSSはデザイナーや開発者が動画でCSSの基本から応用までを学べる学習サイト。本サイトでフロントエンド開発スキルを磨いて欲しいとの事。当然全て英語になっていますが、英語がダメでも動画によっては映像だ...
Ads

シンプルでクリーンなモバイルファーストのCSSフレームワーク・「Outline」

Outline OutlineはシンプルでクリーンなCSSフレームワークです。モバイルファースト設計のレスポンシブWebデザイン対応で、tableやタブ、ボタンなどの各UIコンポーネントもひと通り揃えられています。もちろんこれらもRW...

データの編集やソート、ページングにも対応した軽量なデータグリッドを実装するスクリプト・「jsGrid」

jsGrid jsGridはデータグリッドを実装する為の軽量スクリプトです。jQueryに依存しています。データテーブルのセル内のデータ編集やソート、ページングにも対応しています。スタイルコンポーネントのカスタマイズもし易いように設計...

商用でも無料で使えて著作権表記も不要のBGM配布サイト・「ノスタルジア」

ノスタルジア ノスタルジアは商用でも無料で使える国産のBGM配布サイトです。著作権表記も不要との事。こちらではノスタルジックな音を中心に、イメージやジャンルから探すことが出来ます。姉妹サイトに甘茶の音楽工房も有り。配布数は工房さんの方...

レスポンシブWebデザインに対応している各CSSフレームワークや人気のライブラリの動作テストを手軽に行える・「Codeply」

Codeply CodeplyはBootstrapやFoundationなどのRWDに対応したフレームワークをベースに、jQueryやBackbone.js、Underscore.js、Angular.jsなどのライブラリの動作テスト...

Web上にある記事やPDFファイル、動画やリンク、プレゼン等をプレイリスト化してチームで共有出来る・「Gibbon」

Gibbon GibbonはWeb上にある記事やPDF、動画等をプレイリストにしてチームで共有する事ができるツールです。主に学習用に開発されたみたいですね。同じ学習目的を持った者同士でオンライン上にあるリソースを共有しよう、というもの...

Web制作者向けに写真素材サイトやフォント配布サイトなどのリソースをまとめている・「Makerbook」

Makerbook MakerbookはWeb制作者向けのリソースをまとめているWebサイトです。写真やらフォントやら音源やら、カテゴリは様々で、複数の配布サイトが簡潔に紹介されています。覚えておいても損はしないでしょうけど、この手の...

画像にウォーターマークを付与出来るスクリプト・「watermark.js」

watermark.js watermark.jsは画像にウォーターマーク(透かし)を付与出来るスクリプトです。画像の上にCSS等でレイヤーを重ねるのではなく、指定した画像に直接任意の画像やテキストを透かしとして加え、データURIスキ...

404ページやメンテナンスページを作成出来る・「Better Error Pages」

Better Error Pages Better Error Pagesは404ページや503ページ、メンテナンスページ等を作成出来るWebサービスです。URLやメールアドレスなど、必要な情報を入力し、スタイルするだけ。テンプレート...

大量のjQueryプラグインと、その使い方等をコレクションしている・「jQueryScript.Net」

jQueryScript.Net jQueryScript.NetはjQueryのプラグインをコレクションしているWebサイトです。プラグインだけでなく、その使用方法やライセンス、ファイルサイズ等を簡単に紹介しています。今更感が否めな...

モバイルファーストな軽量フロントエンドフレームワーク・「Wee」

Wee Weeは軽量でモバイルファーストなOSSのフロントエンドフレームワークです。軽量ではあるものの、その性能は非常に充実しており、フレームワークとしてしっかり機能してくれそうな印象でした。開発をサポートするJavaScriptツー...

CSSのfilterのコードを、インタラクティブに生成出来るジェネレーター・「CSS Filter Effects」

CSS Filter Effects CSS Filter EffectsはCSS filterのコードを、実際にかかるエフェクトを見ながら生成出来るジェネレーターです。BlurやBrightness、Hue Rotate、Grays...

書いたテキストに背景画像を適応させるスクリプト・「TextHoler.js」

TextHoler.js TextHoler.jsは書いたテキストに上記のように背景画像を適応させる為のスクリプトです。jQueryに依存しています。指定された要素にCSSを加えるだけのシンプルなものなので手軽でいいですね。とは言え、...

色覚異常の方向けに作られた、Webサイトにカラーフィルターを適応させて認識しやすくするChromeエクステンション・「Color Enhancer」

Color Enhancer Color Enhancerは色覚異常の方のためのChromeエクステンションです。Webサイトにカスタマイズ可能なカラーフィルターを適応させ、色認識を向上させることが出来ます。フィルターはSet upか...

Web制作者向けのツールやリソースを収集している・「wwwhere」

wwwhere wwwhereはWeb制作者向けのツールやリソースを収集、公開しているWebサイトです。カテゴリもそこそこ細かく分けられていて探しやすい印象です。収集されているリソースは本Webサイト開発者の主観で集められているのでア...

SASSのように使えるJavaScript・「Stylus」

Stylus StylusはSASSのように簡易的な記述でCSSを生成してくれるJavaScriptです。シンプルなコードでコンパイルしてくれるので取っ付き易い印象です。とはいえ、これだけLESSやSASSが普及している中で敢えて本ス...

データリストに使っているフォーマットを解釈して一括で変更してくれるツール・「Transformy」

Transformy Transformyは任意のデータ等のリストで使っているフォーマットを解釈し、任意のフォーマットに一括変換してくれるWebツールです。上図では「果物-foo個:bar円」という形式を、「果物/fooダース/bar...

iPhoneやApple Watch、Androidのアプリアイコンにリサイズ出来るツール・「App Icon Resizer」

App Icon Resizer App Icon Resizerは作成したアイコンをiPhoneやApple Watch、Android向けのサイズにリサイズしてくれるWebツールです。チェックボックスにチェックを入れてアイコン画像...

Canvasベースのグラフを描けるjQueryスクリプト・「Flot」

Flot FlotはCanvasを使ったチャートを実装する為のライブラリです。jQueryに依存しています。上図のようなシンプルなグラフに限らず様々なビジュアルのグラフに対応することが可能です。グラフのリアルタイムアップデートにも対応...

SVG関連の情報を配信する・「SVG News」

SVG News SVG NewsはSVGに関するチュートリアル記事や情報を配信するニュースサイトです。SVGをこれから勉強する、もう少し向上させたいという方に良さそうな印象でした。若干の探しにくさはありますが、このような特化したキュ...
Ads