WEB制作業界ではすっかりおなじみのキーワードとなってきたCSS3。ブラウザの対応も進んでいて、そろそろ手を付けていこうというかたも多いかと思います。今日紹介するのはCSS3を駆使して、立体的でアナログ感のあるボタンを作るプロジェクト「BonBon Buttons – Sweet CSS3 buttons」です。
シャドウと立体感と角丸などCSS3ならではの機能をふんだんに利用してボタンを作っています、見た目だけではなくて、クリックした時の動作感などもこだわっていて、表現だけではないリッチなボタンになっています。
詳しくは以下
WEBデザインを制作される際に、photoshopを利用してデザインを制作するという方も多いと思いますが、今回紹介するのは成果物のPSDファイルとチュートリアルがセットになったエントリーをまとめた、PSDで学ぶWEBデザイン「Modern UI and Layout Tutorials for Photoshop」です。
Clean Web Layout with the 960 Grid
チュートリアルだけではどうしても分かりにくかった部分が,完成後のPSDも併せてみることで、作り方や構造を直接学ぶことができます。今日は紹介されているものの中からいくつか気になったモノをピックアップして紹介したいと思います。
詳しくは以下
非常に使い勝手が良く、世界中で利用されているjavascriptライブラリjQuery。その中でもサイトの演出として多くのサイトで利用されているスライダーやギャラリーを集めたエントリー「30 Awesome jQuery Slider and Gallery Plugins and Tutorials」を紹介したいと思います。
horinaja for scriptaculous or jQuery
一般的によくある定番のものから、一工夫あるもののまで様々な演出のスライダーやギャラリーが集められています。今日はその中から今までDesigndevelopで紹介したこと無いものを中心にいくつかピックアップして紹介したいと思います。
詳しくは以下
現在WEBデザインは基本的にはCSSとXHTMLで構築されている場合が多いと思います。今日紹介するのは主流であるクオリティの高いフリーCSS、XHTMLテンプレートを集めたエントリー「40+ Elegant Free CSS/(X)HTML Templates from 2010」を紹介したいと思います。
テクスチャが効いたアナログ感があるものもから、洗練されたシンプルなものまで様々なテンプレートがまとめられています。今日はそのなかから気になったテンプレートを紹介したいと思います。
詳しくは以下
WEBサイトでの印象を決定づける一つの大きな要素の一つ背景。色ベタ、テクスチャを使ったものなどサイトによって様々な背景が制作されていますが、今回紹介するのはWEBサイトに使えるシームレスなパータン素材を集めた「200+ Seamless Patterns Perfect for Website Backgrounds」。
Photoshop Stripe patterns (20 patterns)
紙や布などといった定番のテクスチャを表現したものから、個性的な表現のパターンまで背景に使えそうなパターンセットがまとめられています。今日はその中から幾つか気になったものをピックアップして紹介したいと思います。
詳しくは以下
世界中で利用されているjavascriptライブラリjQuery。多機能で軽量。そして豊富なプラグインと制作者、開発者にとっては非常にありがたい存在です。今日紹介最近リリースされたjQueryプラグインを集めたエントリー「50 Awesome New jQuery Plugins」。
様々なジャンルのプラグインが紹介されていますが、今日はそのなかから今までDesigndevelopで紹介した事が無い、プラグインを中心にいくつか紹介したいと思います。
詳しくは以下
シンプルなwebサイトももちろん魅力的ですが、独特な動きを取り入れることでもっと見栄えの良いサイトに仕上げることができるのではないでしょうか?今回はそんな時に利用したいjQueryプラグイン「A Cool Collection Of jQuery Plugins To Make Your Website More User Friendly」を紹介したいと思います。
ちょっとしたさりげない動きから、メインとなる部分に取り入れられる演出まで、いろいろなタイプのjQueryプラグインが紹介されています。
詳しくは以下
WEBでのユーザーインターフェイスを劇的に改善してくれるアイコン。それだけに素材としても多く流通しており、WEB上では様々な高品質のアイコンセットが公開されていますが、今日紹介するのは丸で囲われたシンプルで使い勝手の良いアイコンセット「Metrize Icons」です。
収録されているアイコンは全部で300種類にも及び、それぞれシンプルなピクトグラムライクなものとなっております。
詳しくは以下
A・B・Cといったようなアルファベットや、日本語のひらがななどではなく、イラストが各文字として割り当てられた「Dingbat Fonts」をまとめた「A Collection of Free Dingbat Fonts」を、今回は紹介したいと思います。
(AnimaliaScissored dingbat | UrbanFonts.com)
モノクロのさまざまなテーマのイラストフォントがいくつも紹介されています。気になったものをまとめてみましたので、以下よりご覧ください。
新しいフリーフォントが日々公開されており、常にチェックされている方も多いのではないでしょうか?そんな中今回紹介するのは、最新のフレッシュなフリーフォント5種「Fresh Free Fonts From Last Week」です。
FRINCO // Free Font on Behance
デザイン性の高い5種類のフォントが紹介されており、どれも魅力的なものばかり。いくつかピックアップしましたので、下記よりご覧ください。
詳しくは以下
HTML5やCSS3などの次世代の企画も徐々に業界内では浸透してきていますが、まだまだ商業ベースでは特定の用途を除いては使えないシーンも多く、HTML+CSSを用いて制作をしている人がほとんどだと思います。今日紹介するのは最近リリースされたクリエイティブなHTML+CSSのテンプレート「25 Fresh and Professional CSS and HTML Templates」です。
25 Fresh and Professional CSS and HTML Templates
様々なテンプレートがまとめられています。今日はそのなかからいくつか気になったものをピックアップして紹介したいと思います。
詳しくは以下
さまざまな機能が追加され、より効率的にデザインワークが進められるようになっているIllustrator。しかし、デザイナーによって機能の使い方は大きく異なり、更に利用できる機能を全てチェックするというのは至難の業。そこで今回紹介するのが、Illustratorのさまざまな機能や技が学べるチュートリアルをまとめた「Illustrator Tutorials: 70+ Awesome Hot New Tips」です。
Astute Graphics Blog : How to Create Vector Denim Texture Using Adobe Illustrator
タイポグラフィの制作からポスター・ポストカードの制作まで、さまざまなチュートリアルが紹介されています。中でも気になったものをいくつかピックアップしましたので、下記よりご覧ください。
詳しくは以下
制作の現場でとても便利なテクスチャ素材。平坦なデザインに素材感や立体感を与えてくれますが、今回紹介するのは水彩からグランジ・ポリゴンまでフリーテクスチャを集めた「20 Free Texture Packs」です。
多様な種類のテクスチャパックがまとめられています。今日はその中か特に気になったテクスチャパックを幾つか紹介したいと思います。
詳しくは以下
デザインに欠かすことのできないフォントは、選定する種類によってデザインそのものの印象が変わってくる重要な役目を持ったもの。イメージにぴったり合ったものを是非見つけたい、そんな時に参考にしたいフリーフォントまとめ「45 New High-Quality Free Fonts For Designers」を今回は紹介したいと思います。
ゴシック、スクリプト、手書き風など、いろんなテイストのフリーフォントがまとめられています。気になったものをピックアップしましたので、下記よりご覧ください。
詳しくは以下