デザインを開発するという視点でお伝えするクリエイティブBLOG
様々な解像度のデバイスが出まわっており、技術者側は日々その広がり続ける端末の解像度の多様化と向き合い、その端末に最適化したり、工夫したりして様々なプラグインや技術を編み出しリリースしていますが、今日紹介するのは、画面解像度を読取、それぞれの解像度に合わせたイベントを設定できるjQueryプラグイン「Breakpoints.js」
ブレイクポイントとなる解像度は数値で設定でき、それぞれ指定した解像度に合わせて、js側でイベントを分岐せることが可能です。
詳しくは以下
WEBでもグラフィックでもメニューの内容や機能などを端的に表現する時に便利なピクトグラム。シンプルながらもデザインを機能的にブラッシュアップしてくれる効果的なものですが、今日紹介するのはシンプルなピクトグラムをフォントとして使える「Erler Dingbats」です。
こちらはDingbatsフォントの一種で様々なピクトグラムがフォントセットとしてまとめられています。収録されているフォントの種類は以下からご覧ください。
詳しくは以下
春夏秋冬で誰もが衣替えをするように、デザインも衣替えをしたいもの。そこで今回紹介するのが、冬のデザインを彩るニットや布地のフリーテクスチャを集めた「30 Warm and Free Woven and Knitted Fabric Textures」です。
（texture 026 by ~juuichimei on deviantART）
シンプルなニットのテクスチャから、カラフルな配色がポイントとなるテクスチャまで、さまざまなテクスチャが紹介されています。
詳しくは以下
デザイン制作に欠かせないパターン素材は、デザインソフトでカスタマイズできる状態だと、制作のさまざまなシーンで利用しやすいもの。そんな中今回紹介するのが、PhotoshopやIllustatorでカスタマイズできるパターンを集めた「Ultimate Round Up of Free and Fresh Photoshop Patterns」です。
（22 Hexagon Photoshop Patterns (PAT) | Photoshop Patterns）
幾何学模様のキレイなパターンから、アイテムをモチーフにしたパターンまで、さまざまなパターン素材が紹介されています。中でも気になったものをいくつかピックアップしましたので、下記よりご覧ください。
詳しくは以下
普段の生活の中でなかなか感じる機会の少なくなっている自然の雰囲気をデザインに取り入れることで、ユーザーにも自然の雰囲気を感じさせることができると思います。そんな中今回紹介するのが、さまざまな表情を持つ木のテクスチャを集めた「25 Handy Wood Textures」です。
（Wood Textures ver 1 by ~artbees on deviantART）
自然の雄大さを感じられるテクスチャから、CGで作られた人工的なテクスチャまで、さまざまな素材が紹介されています。中でも気になったものをいくつかピックアップしましたので、下記よりご覧ください。
詳しくは以下
web上で公開されているデザイン素材は、プロのデザインワークでもよく利用されており、クオリティの高い素材はダウンロード数も多く人気も高いもの。今回はそんな人気の高い素材を多数公開しているWegraphicsの素材の中から、特におすすめのデザイン素材をまとめた「30 Gorgeous Freebies from Wegraphics」を紹介したいと思います。
アイコンなどのデザインパーツはもちろん、Photoshopブラシや背景テクスチャなど、デザイン制作にすぐに役立つさまざまな素材が紹介されています。中でも気になったものをいくつかピックアップしましたので、下記よりご覧ください。
詳しくは以下
世界中で利用されているWordpress。その魅力の一つに豊富なクリエイティブなテーマの存在があります。同じコンテンツでもテーマによって大きく印象が変わり、テーマはシンプルなフレームワークのものから細部まで凝ったデザインのテーマもあります。今回紹介するのは2011年の新しく登場したWordpressのテーマを集めた「40 High Quality, Fresh And Free WordPress Themes Of Year 2011」
クオリティが高く、細かい部分まで作りこまれたテーマが多く紹介されていました。今日はその中から幾つか気になったテーマをピックアップして紹介したいと思います。
詳しくは以下
オンラインショッピングに欠かせないクレジットカード。サイト上ではどんな種類のカードが使えるかを明確に記しておく必要があります。そんな中今回紹介するのは、ECサイトのデザインに活躍してくれるクレジットカードのフリーアイコンまとめ「11 Free Credit Card Icon Sets For Online Shops」です。
Dribbble – Credit Card Icons FREE PSD (Vector) by Vilen
使うことで、決済時のユーザビリティを格段にアップさせることができます。中でも気になった種類をピックアップしましたので、下記よりご覧ください。
詳しくは以下
webサイトのUI設計をする際に、さまざまな機能を取り入れることでより魅力的なサイトを作り上げることができます。今回はそんなシーンでチェックしたい、さまざまなツール&リソースまとめ「New Essential UI Design Tools & Resources for Web Designers」を紹介したいと思います。
jQueryやJavaScriptなど、ぜひ利用してみたいツールやリソースがピックアップされ、まとめられています。
詳しくは以下
webサイトからのお問い合わせなどにフォームを設置しますが、スマートフォンライクの時代となった今、従来のデザインをそのまま取り入れるとタテに長くなってしまう傾向が。そんな状況を解消できる、フローティングラベルを取り入れたフォームサンプルまとめ「9 Floating Form Label jQuery & JavaScript Plugins」を今回は紹介します。
GitHub – Baedda/floating-form-labels: jQuery plugin that makes inline form labels usable again.
プレースホルダの文字が、入力するとタイトルとして浮き出すので、フォーム上に常に配置する必要がなく、長さを軽減することができるサンプルがピックアップされています。
詳しくは以下
ブログのサイドバーにFlickr写真を読み込むサービスはWEB上で多々展開されていますが、今回紹介するのはFlickr写真の読み込みを行なってくれるWordPressプラグイン「FlickrRSS」です。
プラグインの名前の通りRSSから写真を取得しているみたいなので、ランダムで表示などはできず、新着順に表示されますが、目的に合致さえすればシンプルでかなり使えるプラグインかと思います。
詳しくは以下
シンプルなデザインももちろん素敵ですが、気分を明るくしてくれる華やかで楽しげなデザインも、ぜひ生活の中に取り入れていきたいもの。今回はそんなシーンにぴったりのパターン素材「Art Dimension abstract patterns」を紹介したいと思います。
花を抽象的にイメージしたようなカラフルな図形が並ぶ、ぱっと目を引く美しいパターン素材です。
詳しくは以下
Windowsは少し探せばフリーで使えるFTPクライアントが国内外問わず沢山でてきますが、Macの場合そうはいかず、ほとんどがシェアウェアでフリーで使える物は限られています。Mac用のFTPクライアントとしては黄色いアヒルがカワイイ「Cyberduck」が有名ですが、今日はフリーで使える別のFTPソフト「OneButton FTP」を紹介したいと思います。
このソフトもCyberduckと同じく若干日本語訳はおかしいものの、日本語に対応しています。
詳しくは以下
世界中で利用されているCMS、Wordpress。かなりの数のテーマがリリースされていて、無料でもかなりクオリティが高いテーマも配布されています。今日紹介するのはフリーのテーマを探すときに役立つサイトを集めたエントリー「 50 Best Websites To Download High Quality Free WordPress Themes」を紹介したいと思います。
上記のwordpress.orgといった定番中の定番から、様々なテーマ配布サイトがまとめられています。今日はそのなかから気になったサイトをいくつかピックアップして紹介したいと思います。
詳しくは以下
WEBGLをjavasuriptで制御するためのライブラリThree.js。ブラウザで3D表現などを行う際には国内でも有名なライブラリですが、今日紹介するのはThree.jsを利用した実験的なサンプルを集めたエントリー「20 Exceptional Three.js Experiments」です。
Many Icons in 3D Using Three.js
全部で20個の実験的なサンプルが公開されていますが、今日はその中からいくつか気になったものをピックアップして紹介したいと思います。
詳しくは以下
WEBの要素のうち最も重要なもののひとつ写真。そのクオリティや見せ方で、WEBサイトのクオリティは全く違ってきます。今日紹介するのはそんな写真を効果的に見せる、jQueryプラグインをまとめたエントリー「30 Best jQuery Photo Plugins」を紹介したいと思います。
スライダー、スライドショー、ギャラリー、スクローラーなど様々なプラグインが収録されていますが、今回はその中から特に気になったものをいくつか紹介したいと思います。
詳しくは以下
