プロトタイプやフレームワークの為の落書きフォント・「Scribble Font」
Scribble Font Scribble Fontはプロトタイプやフレームワーク作成時用に作られた落書きタイプのフォントです。上図のような適当に書いたフォントをタイプできるようになります。同じ用途のフォントも既に開発されていますの...
Resource - Webデザイン補助
InVisionがフリーで配布するPhotoshop/Skechのワイヤーフレームキット・「Form」
Form Formはプロトタイピングツールを展開するInVisionがフリーで配布しているワイヤーフレームキットです。Photoshop用とSkech用が配布されています。PC向け、スマフォ向け、タブレット向けがそれぞれ用意されており...
イージングに使われるペジェ曲線に合わせた法則でカラースキームを作り出す・「ColorBox」
ColorBox ColorBoxはイージングアニメーションの法則に沿って新たなカラースキームを作り出すプロジェクトサイトです。イージングの詳細は「イージングの基本 | Web | Google Developers」をご参照...
ダウンロード可能なさまざまなカラースキームを大量に保管している・「SchemeColor」
SchemeColor SchemeColorはさまざまなカラースキームを超大量に保管しているWebサイトです。ダウンロードや編集も可能です。基本的にはシンプルな機能ですが、量が非常に多く、ざっと数えただけでも1万ほどあるようです。ま...
美しいカラーパレットを手動収集している・「Trendy Palettes」
Trendy Palettes Trendy Palettesは美しいカラーパレットを手動収集しているパレットキュレーションサイトです。本ツールのユーザーや開発者が世間で人気の配色を収集しているそうです。本ツールはGradient H...
器や絵画、ポスター等、歴史的に利用されてきた美術品に利用されている色をパレットにした・「Color Leap」
Color Leap Color Leapは器や棺などの歴史的出土品やポスター、絵画など、今まで利用されてきた色をタイムライン上でカラーパレットとして確認できるプロジェクトサイトです。多くはなく、色の美しい美術品を厳選しているようで数...
ポスターとして印刷するために作られたPhotoshopのショートカットチートシート・「Photoshop Shortcuts And Commands Poster」
Photoshop Shortcuts And Commands Poster Photoshop Shortcuts And Commands PosterはPSのショートカットをポスター用に作成された高解像度のチートシートです。キ...
スマフォやタブレット向けのプロトタイピングツール・「MockingBot」
MockingBot MockingBotはスマフォやタブレット向けのプロトタイピングツールです。使いやすさに拘って開発したそうで、頭痛がおきない使い勝手の良さが特長だそうです。触った感想は、頭痛が起きるかどうかは個人によりけりでしょ...
Dribbbleで注目されたイラストからカラーパレットを作成している・「The Colorbook」
The Colorbook The ColorbookはDribbbleへの投稿で注目されたイラストからカラーパレットを作成しているWebサイトです。パレット作成数はかなり厳選しているようで１日に数個といったところのようです。現在はそ...
食べ物の写真を専門に配布するストックフォトサイト・「FOODIE FACTOR」
FOODIE FACTOR FOODIE FACTORは食べ物の写真を専門に配布するストックフォトサイトです。サラダとかケーキとかドリンクといったカテゴリで分けられています。基本的にCC0のようですが、全て確認したわけではないのでわか...
ストックフォトやフォント、アイコン、カラースキームやチュートリアル等、Web制作に役立つツールやリソースを収集、公開している・「PinTab」
PinTab PinTabはWeb制作の際に役立ちそうな情報を収集しているキュレーションサイトです。ストックフォト、アイコン、フォント、PhotoshopやSkech、カラースキーム、プロトタイプやWordPress、Bootstra...
UI制作の際に役立ちそうなツールやリソース等の情報をまとめた・「designer lynx」
designer lynx designer lynxはUI制作の際に役に立つかもしれない情報をキュレーションしているWebサイトです。デザインギャラリーやカラーツールやプロトタイプツール、アイコンやタイポグラフィの情報などなど。施工...
Webデザインギャラリーに掲載したWebサイトと連動したカラーパレットサービス・「Colors」
Colors ColorsはWebデザインギャラリーに掲載したWebサイトと連動したカラーパレットツールです。本サービス開発者が並行して運営しているギャラリーのPixelsで掲載したWebサイトに連動させて作られたカラーパレット、とい...
FeatherやFont Awesomeなどのアイコンを色やサイズをパスに指定するだけで表示できる・「icongram」
icongram icongramはサイズや色をURLに指定するだけで表示出来るサービスです。一時期はやったダミー画像サービスの表示方法やUnsplash itのようにパスにオプションを指定して表示させる事ができる、というもの。パ...
クリックするだけでPantoneカラーをhexコードでコピーできる・「Pantone colors」
Pantone colors Pantone colorsはPantoneの色名をクリックするだけでhexコードでコピーできるツールです。Pantone社が提供する色見本帳にある色名、いわゆるPantoneカラーをCSS等で使えるよう...
Sketchユーザー向けのリソースを収集している・「Sketch for Designrs」
Sketch for Designrs Sketch for DesignrsはSketchユーザー向けのリソースを収集しているWebサイトです。プラグインやアイコン、エレメントのサンプルやアプリなどさまざま。まだ作られたばかりで収集...
写真に有ったグラデーションを生成、カラーコードをコピー出来る・「Gradient World」
Gradient World Gradient Worldは写真を元にグラデーションを生成、カラーコードをコピーできるWebサービスです。写真はUnsplashのAPIで引っ張ってきたものを使っているようです。グラデーションは自動生成...
さまざまな色の知識を学べる・「Colors – Canva’s Design Wiki」
Colors - Canva's Design Wiki Colors - Canva's Design Wikiはさまざまな色の知識を学べるカラースタディサイトです。グラフィックデザイン作成ツールのCanvaが提供したサービスで...
Google Web Fontsのフォントの表示確認が出来る・「Archetype」
Archetype ArchetypeはGoogleフォントの表示確認が出来るWebツールです。表示確認だけなら公式でも他ツールでも出来ますので特別このツールを使う理由もありませんけど、PCサイトとモバイルの表示確認が出来たり色の変更...
AndroidやiPhone、iPad等でのデバイスで表示確認が出来る・「Sizzy」
Sizzy Sizzyはモバイルやタブレットでの表示確認が出来るWebサービスです。よくあるRWDに対応してるかどうか、みたいな幅を狭くするだけのものではなく、それぞれのUAでアクセス、狭い幅で表示してくれます。 縦横での確認も...
任意の画像をアップロードするとその画像を元にカラーパレットを作成してくれる・「Pictones」
Pictones Pictonesは任意の画像をアップロードすると、その画像からカラーパレットを作成してくれるWebサービスです。抽出する色の数の指定やCSS/SASS/LESSのコード、保存が可能となっています。シンプルで良いの...
パターン素材を表示確認しながら探せる・「Lisbon Azulejos」
Lisbon Azulejos Lisbon Azulejosはパターン素材を表示確認しながら探せるWebサービスです。8つのタイルが用意されており、それぞれのタイルをクリックすると別のパターン素材を探せるようになっています。矢印キー...