デザインを開発するという視点でお伝えするクリエイティブBLOG
高機能なjavascriptライブラリjQuery。サイトを製作されている方には説明も必要もないほど有名なライブラリで様々なサイトに実装されており、様々な機能を持ったプラグインが日々、世界中公開されています。今回紹介するのはギャラリー構築のためのjQueryプラグインを集めた「20 jQuery Image and Multimedia Gallery Plugins」です。
サムネイルが付いたものから、ズームアップのようなエフェクトのもの、iPhoneで見ることを前提としたギャラリーなど様々なギャラリープラグインがまとめられています。今日はその中からいくつか気になったものをピックアップして紹介したいと思います。
詳しくは以下
本来であればjavascriptやflashを使って画像を準備しないと作れなかった、リッチな表現のナビゲーションですが、CSS3の登場に伴い、かなりの部分が、CSS3のみで表現できるようになってきています。今日紹介するのはCSS3で創られた、表現豊かたCSSメニューが簡単に作れるメニュージェネレーター「CSS3 Menu. Free CSS Menu Maker」。
こちらは、上記のようなナビゲーションメニューがフリーでダウンロードすることができます。基本的にはjavascriptは一切使われておらず、テキストで構成されるため、SEOにも優しい作りとなっています。
詳しくは以下
WEB制作業界ではすっかりおなじみのキーワードとなってきたCSS3。ブラウザの対応も進んでいて、そろそろ手を付けていこうというかたも多いかと思います。今日紹介するのはCSS3を駆使して、立体的でアナログ感のあるボタンを作るプロジェクト「BonBon Buttons – Sweet CSS3 buttons」です。
シャドウと立体感と角丸などCSS3ならではの機能をふんだんに利用してボタンを作っています、見た目だけではなくて、クリックした時の動作感などもこだわっていて、表現だけではないリッチなボタンになっています。
詳しくは以下
非常に使い勝手が良く、世界中で利用されているjavascriptライブラリjQuery。その中でもサイトの演出として多くのサイトで利用されているスライダーやギャラリーを集めたエントリー「30 Awesome jQuery Slider and Gallery Plugins and Tutorials」を紹介したいと思います。
horinaja for scriptaculous or jQuery
一般的によくある定番のものから、一工夫あるもののまで様々な演出のスライダーやギャラリーが集められています。今日はその中から今までDesigndevelopで紹介したこと無いものを中心にいくつかピックアップして紹介したいと思います。
詳しくは以下
対応ブラウザも徐々に増えてきて、ますます注目を集めるCSS3。様々な可能性を持っています。CSS3独自の機能も多く、その分様々な利用方法が日々考えられ、デモが作成されていますが、今回はCSS3で実現する今までに無いWEBデザイン集「25 Amazing CSS3 Experimentations and Demos」というエントリーを紹介したいと思います。
上記の他にも様々なCSS3を利用したクリエイティブなWEBサイトが構築されています。今日はその中からいくつか気になったものをピックアップして紹介したいと思います。
詳しくは以下
多くのWEB開発者が利用し始めているCSSの次の規格CSS3.0。今までCSSではできなかったことが多数実現できるように改良が加えられています。以前Designdevelopで「選んで、見て、使える簡単CSS3ジェネレーター「CSS3 Generator」 | DesignDevelop」という記事でリアルタイムにプレビュー、コードプレビューができるCSSジェネレーターを紹介しましたが、今回もCSS3特有の様々な処理を簡単に実現することができるCSS3メーカー「CSS3.0 Maker」を紹介したいと思います。
画面は非常にシンプルな作りでグローバルナビにCSS3の効果がメニューになっていてプレビューも数値の操作も、CSSのコードビューも一画面で利用出来るようになっています。
詳しくは以下
デザイン制作をする上で、重要な要素の一つ、フォント選び。選ぶフォントによって、デザインが大きく左右され、その影響力は非常に大きなものです。今日紹介するのは、比較的発表されてからまもなく、クリエイティブなフォントを集めたエントリー「10 Fresh Free Fonts」を紹介したいと思います。
正統派でシンプルというよりも、タイポ中心のデザインでも充分通用するようなクリエイティブなフォントが集められています。今日はその中から幾つか気になったものをピックアップして紹介したいと思います。
詳しくは以下
WEB上でもよく見かけるインターフェイスの一つカレンダー。日付ベースでデータを整理したり、直感的に時間を理解したりするのに便利なものですが、今回紹介するのは、フリーで利用できるWEBカレンダーデザイン集を「30+ Inspiring Free Calendar and Date Picker PSD Designs」です。
シンプルなものを中心に、様々なカレンダーデザインがまとめられています。いくつか気になったものをピックアップして紹介したいと思います。
詳しくは以下
HTML5やCSS3などの次世代の企画も徐々に業界内では浸透してきていますが、まだまだ商業ベースでは特定の用途を除いては使えないシーンも多く、HTML+CSSを用いて制作をしている人がほとんどだと思います。今日紹介するのは最近リリースされたクリエイティブなHTML+CSSのテンプレート「25 Fresh and Professional CSS and HTML Templates」です。
25 Fresh and Professional CSS and HTML Templates
様々なテンプレートがまとめられています。今日はそのなかからいくつか気になったものをピックアップして紹介したいと思います。
詳しくは以下
自然に生えている木、加工された木など、多彩な表情を楽しめる木の中から今回は、さまざまな質感の板が表現できるテクスチャをまとめた「19 Useful And Realistic Wood Textures」が公開されていましたので、紹介したいと思います。
Peeling Red Paint on Old Barn | Royalty Free Texture
年輪の模様が美しいテクスチャから、古びた雰囲気のテクスチャまで、さまざまなテクスチャが紹介されています。中でも気になったものをいくつかピックアップしましたので、下記よりご覧ください。
詳しくは以下
photoshopで背景を作り込む時に便利なパターン素材。キャンパスのサイズに応じてパターンを展開できるかなり便利なものです。今日紹介するのはレトロ、幻想的、シンプルなどといった、様々テイストのphotoshopパターンを集めたエントリー「200+ free beautiful Photoshop patterns」を紹介したいと思います。
今日は今までDesigndevelopで紹介した事が無いもののなかからいくつかピックアップして紹介したいと思います。
詳しくは以下から
デザインイメージをわかりやすく・伝えやすく表現するために、フリーで配布されているモックアップ素材を使用することで、手軽にクオリティの高いイメージを作り上げることができます。そんな中今回は、フリーで使用できるモックアップイメージpsdが揃った「11 Free Hero Images & Mock-ups PSDs」を紹介したいと思います。
Hero Images – download free mockups by PixelBuddha
いろいろなテーマのモックアップが紹介されており、さらにフリーでダウンロード・使用できるのが嬉しいところ。気になったものをピックアップしましたので、下記よりご覧ください。
詳しくは以下
冬のシーズンになると見かけることの多くなる雪をイメージしたデザイン。簡単なようで、雪のニュアンスをしっかり出そうと思うと意外に大変なもの。そんな中今回は、雪の降る景色を手軽に描き出せるブラシまとめ「20 Snow Brushes Every Designer Should Own」を紹介したいと思います。
Snow Brushes by Kyaro on DeviantArt
ブラシを使って簡単に雪景色を作り出すことができます。気になったものをピックアップしましたので、下記よりご覧ください。
詳しくは以下
デザインのポイントとして活躍してくれるアイコン。いろいろな種類をストックしておくことで、日々のデザイン制作にいざという時に役立ってくれます。そんな中今回紹介するのは、アウトドアイメージのフリーアイコンセット「Free Adventure Icon Collection」です。
ポップで柔らかな質感の色合いとディテールが特徴。キャンプやマリンシーンをイメージさせる可愛らしいアイコンがセットになっています。
詳しくは以下
ハイクオリティなWEBページを簡単に構築できるWordPressを利用し、ポートフォリオサイトを公開されているそこで今回紹介するのが、ポートフォリオサイトに利用しやすいWordPressテーマをまとめた「35+ Free and Premium WordPress Portfolio Themes」です。
画像領域の演出が多彩なテーマが豊富に紹介されています。中でも気になったものをいくつかピックアップしましたので、下記よりご覧ください。
詳しくは以下
Webやアプリケーションのデザインに欠かせないUI設計。しかし使いやすく最適なUIデザインを一から考えるのは中々手間がかかるもの。今回ご紹介するのはそんなデザイナーの方におすすめしたい、最新のUIデザインキット「25 Fresh Free HTML UI Kits」です。
GitHub – ElemeFE/element: A Vue.js 2.0 UI Toolkit for Web
CSSやHTMLの知識が必要にはなりますが、使いやすく多彩なシーンで活躍できるUIデザインキット25種類が紹介されています。さらにその中から幾つかおすすめのUIキットをピックアップしてみましたのでご覧ください。
詳しくは以下
(さらに…)
