デザインのクオリティや質を高めるためにもっとも重要な要素が配色。バランスの良いデザインでも色がチグハグでは良いデザインにはなりえません。今日紹介するのはそんな配色を便利にしてくれる、配色を操るためのカラーツール5選「Finding Colors: 5 Tools for Great Color Concepts」です。
今回は紹介されている5つの配色ツールの使い勝手や特徴を簡単にまとめてご紹介したいと思います。
詳しくは以下
色の決定や配色は難しく、経験があるデザイナーでも迷う事も多いのではないでしょうか?オレンジや赤と一口にいっても様々なオレンジや赤があり、最終どの色がふさわしいか吟味に時間を使うというデザイナーも多いと思います。今日紹介するのは自分の選んだ色を基準にして、色を選べるWEBツール「colllor」です。

このツールはまず自分で色をカラーツールで選択し、その後選んだ色の周辺色やトーン違い等を並べて提示してくれるというもので、その色の差を見比べながら決定できるというものです。
詳しくは以下
画像ビューワーのように画像を拡大して表示するという機能をjavascriptで実現しているのが今回紹介する「shiftzoom.js」です。下記のよう現在拡大されているのが全体の何処の部分なのか、表示することも可能です。

上記の拡大して見せると言う基本動作の他に様々なオプションが用意されていて、画像をフェードさせたり、ズームのタイミングを指定できたりと細かいところまで配慮されていますので、画像をメインに扱うサイトでは重宝しそうなスクリプトです。
詳しくは以下
写真やデザインなど、作品や仕事をオンラインで紹介する上で欠かせないのが、ポートフォリオサイト。今回ご紹介するのは、そんなポートフォリオサイト作りを手助けしてくれるフリーのウェブサイトテンプレート「25 Free HTML Website Templates For Zero-Cost Websites」です。

Apollo: One page HTML template for photographers – Freebiesbug
使いやすくクオリティの高いフリーのウェブサイトテンプレートが25種類まとめられています。中でも気になったテンプレートを幾つかピックアップしてみましたのでご覧ください。
詳しくは以下
最近流行のフラットデザイン。目新しさに加えて、ファイルサイズも小さくなるのでスマートフォンなどの端末に適していると言われています。今回紹介するのは、そんなフラットデザインを取り入れたさまざまな拡張子のファイルアイコンセット「FILE TYPE ICONS with Flat Design Style」です。

Microsoft WordやXLSに代表される一般的な拡張子のファイルや、Photoshop、Illustratorといった、制作系で使われるファイルが数多く取り揃えられています。
世界中で利用されているCMSの一つWordpress、ブログを運営している人のみでは無くて、昨今では様々なサイトもWordpressで制作されており、それに合わせてクリエイティブなテーマも多く開発され、公開されています。今日紹介するのは2016年にリリースされたクリエイティブなWordpressテーマTOP10「Top Ten New, Free WordPress Themes of March 2016」です。

Activello
Activello Demo
License: Free for private and commercial purposes | GNU General Public License
いくつかのテーマが紹介されていましたが、今回は気になったテーマをピックアップして紹介したいと思います。
詳しくは以下
デザインの良し悪しを決める重要な要素となっているのがフォント。使う種類によって見た目の印象がガラリと変わります。今回はそんなフォントの中でも、個性的なデザインのフリーフォント8選「8 Fresh Free Fonts for Your Designs」を紹介したいと思います。
膨大な数のフリーフォントの中から厳選された8種のフォントがピックアップされ紹介されています。
詳しくは以下
使いどころが難しいですが、デザインでもたまに必要となるカモフラージュパターン。意外と作るのが難しく。0からとなるとかなり面倒だったりします。今日紹介するのはそんなカモフラージュパターンを簡単に使えるphotoshopスタイル「Free Styles for Photoshop – Camo」です。

全部で25種類のカモフラージュパターンが収録されていて、定番の物から、少し変わったものまで収録されています。
詳しくは以下
なかなか普段使わないけど持っていると役に立つ手書き風フォントを配布してくれているのが今回紹介する「ふい字置き場」です。下記のようなゆるーい感じの手書き風フォントが無料でダウンロードできるようになっています。
配布されているのは全部で「ふい字」「まきばフォント」「おひさまフォント 」の3つです。下記にサンプルを貼っておきます。

【収録文字】
ひらがな/全角・半角カタカナ/全角・半角数字/全角・半角アルファベット/ギリシャ文字/ロシア文字/各種記号/シフトJIS第一水準漢字/シフトJIS第二水準漢字/絵文字

【収録文字】
ひらがな/全角・半角カタカナ/全角・半角数字/全角・半角アルファベット/ギリシャ文字(小文字だけ)/各種記号/絵文字/シフトJIS第一水準漢字/シフトJIS第二水準漢字の、わりと使いそうな字

【収録文字】
ひらがな/全角・半角カタカナ/全角・半角数字/全角・半角アルファベット/ギリシャ文字(小文字だけ)/各種記号/絵文字/シフトJIS第一水準漢字/シフトJIS第二水準漢字の、わりと使いそうな字
フォントはすべてttf(トゥルータイプフォント)で配布されています。ダウンロードは「ふい字置き場」から利用はリンク先の配布サイト様の利用規約に従ってください。
フロントエンドエンジニアの多くの方は、自分が利用するエディタというのを決めているとは思いますが、緊急の時だったり、どうしても自分のPCが手元に無い環境でコードを書かなくてはいけないなんて事も極稀ではありますがあると思います。今回紹介するのはそんな、もしもの時のためのHTML、CSS、JSが同時に編集できるシンプルなオンラインエディタ「playcode.io」です。

この「playcode.io」非常にシンプルなツールで順番に左からコントロールパネル、HTML・CSS・Javascript、HTMLプレビューと並んでおり、結果を見ながらコーディングすることが可能です。
詳しくは以下
さまざまな時代の雰囲気を作り上げることができるというのも、デザインの大きな魅力ではないでしょうか。今回はそんなデザイン製作の中から、オールディーなデザインに使いやすいビンテージテクスチャをまとめた「20 Vintage Texture Packs」を紹介したいと思います。

Vintage Book Textures | Pixel Pixel Pixel // Jetpacks for Designers
年代を感じられるパターンを利用したテクスチャや、味のあるペーパーやフィルムのテクスチャが多数紹介されています。中でも気になったものをいくつかピックアップしましたので、下記よりご覧ください。
詳しくは以下