TOP  >  Design  >  クリエイティブな入力フォームサンプルまとめ「Creative Form & Input Field Design Examples」 webサイトに文字や情報などを入力する際に使用する入力フォーム。一般的には文字を打ち込むとカーソルが右側に動いていくシンプルなものが主流ですが、今回紹介するのは、クリエイティブな入力フォームサンプルまとめ「Creative Form & Input Field Design Examples」です。 （Natural Language Form） 入力フォームに独自な動きや、フォーム自体にデザインが施された、他のサイトとちょっと差を付けたい時に活用できる例がまとめられています。 詳しくは以下 Minimal Form Interface | Codrops 文字を入力すると、入力を要求される数の分だけメーターが伸びていく

フリーで配布されているアイコンにはいろいろな種類があり、デザインテイストもさまざま。そんな中今回紹介するのは、シンプルさを可愛らしさを兼ね備えたフリーアイコン「Feather: 130 Free Icons by Cole Bemis」です。 130種の、定番として使用できるフリーアイコンがセットになってダウンロードできるようになっています。 詳しくは以下 メールやファイル、ダウンロード、天気、矢印などのベーシックなものを中心に揃えており、どのアイコンも角が丸く描かれているので、シンプルでクールなテイストの中に柔らかい雰囲気が求められている時におすすめ。形式もPSD、 CSH、 SVGと3種でパッケージされているので、web制作を中心にいろんなデザイン形式で使用できる点も魅力。 ベーシックに使えるアイコンとしてストックしておくととても便利だと思います。今主流のフラット系デザインにもぴったり

光のきらめきなどの表現は、Photoshopを使って加工を施したり作り出すことができますが、1から制作するのはなかなか大変なもの。そんな中今回は、光の柔らかなニュアンスが感じられるブラシ素材まとめ「20 Amazing Photoshop Bokeh Effect Brushes」を紹介したいと思います。 （Bokeh Brushes by redheadstock on deviantART） ボケ足のある光がまたたく雰囲気を簡単に描き出せるブラシ素材がまとめられています。 詳しくは以下 Light bokeh and neon heart by dusty-soul on deviantART キュートなハート型が散らばる華やかな印象のブラシ。ボケ足が効いているので、可愛らしすぎず雰囲気のよい表現ができそうですね。 Bokeh brushes by Nieblastocks on de

多くのwebサイトで取り入れられているHTML5。魅力的な動きやレイアウトを実現できるため、非常に重宝されています。そんな中今回紹介するのは、高品質なフリーHTML5テンプレート「26 Free HTML5 Templates」です。 （Treviso | Responsive HTML5 Template） スタイリッシュでデザイン性の高いHTML5テンプレートがまとめられています。気になったものをピックアップしましたので、下記よりご覧ください。 詳しくは以下 Overflow | HTML5 UP フルカラムのレイアウトが特徴のテンプレート。大胆な印象のwebサイトを制作したい時におすすめです。 WordPress Themes by GT3themes » Free Personal vCard One Page Template 5つのコンテンツバーがメインに並ぶ印象的なデザインの

TOP  >  WebDesign  >  40種の美しいランディングページテンプレート「40 Beautiful Landing Page Templates」 日本のWebサイトでランディングページは訴求ありきで、広告的な表現が強いものが多いのですが、今回紹介するのはシンプルで洗練されたランディングページテンプレート集「40 Beautiful Landing Page Templates」です。 Marketing – SNIPPER Landing page Powered with Rich Snippets | ThemeForest プロモーションや、コーポレートサイトに活用出来そうなレイアウトなど、さまざまなシーンを想定したものが紹介されています。中でも気になったものをピックアップしましたので下記よりご覧ください。 Marketing – Sytic – One-Page

TOP  >  WebService  >  【商用可】デザインのベースに使える紙のテクスチャパック「Free Paper Texture Pack: 64 Card Stock Photos」 日常には色々な種類の紙製品が溢れていますが、その表情は紙によってさまざま。例えば光沢感のあるコーティングが施されていたり、素朴で落ち着いた印象を受けるマット紙など、用途によって色々な紙が存在しています。今回紹介するのはそんな日常に溢れる紙のテクスチャを集めたテクスチャパック「Free Paper Texture Pack: 64 Card Stock Photos」です。 段階的に明るさが揃えられた白紙や、リサイクルされたクラフト紙、繊維感のある紙など、さまざまな紙が64種まとめられています。 提供されるデータは2100x1500pxと、どれも高解像度なので画像が荒れるといった心配は少なそうです。

TOP  >  Design  >  抽象的な表現が特徴の高解像度テクスチャ20種「20 High Resolution Abstract Textures」 非常に多彩なデザインが存在するテクスチャ。特にデザイナーの方で素材としてたくさんストックされている方も多いのではないかと思います。今回はそんなテクスチャ素材の中で抽象的な表現が特徴の「20 High Resolution Abstract Textures」を紹介したいと思います。 （Texture 445 by Sirius-sdz on deviantART） 高解像度が嬉しい、いろんな質感のテクスチャが20種まとめられています。気になったものをピックアップしましたので下記よりご覧ください。 詳しくは以下 Acrylic painted texture – Green Circles by flordeneu on devian

高品質で実用性の高い レスポンシブルHTML5フリーテンプレート「High Quality Yet Free Responsive HTML5 Templates」 webデザインを1から制作し完成までたどり着くには、かなりの時間と労力を必要とします。さらに、今ではスマートフォンからタブレットまで、ありとあらゆる端末への対応が求められることも多いのではないでしょうか？今回はそんなシーンに活用できる、レスポンシブルHTML5フリーテンプレート「High Quality Yet Free Responsive HTML5 Templates」を紹介したいと思います。 （Royale – Free html5 Template | html5mania.com） HTML5形式の、高品質で実用性の高いフリーテンプレートが紹介されています。 詳しくは以下 Agency is a responsiv

TOP  >  Design  >  リアルからフラットまで クリエイティブなアイコン35種まとめ「35 Fresh Icon Designs for Inspiration」 webデザインに使用されることの多いアイコン素材。シンプルな描写のものは使いやすく重宝しますが、時には凝ったデザインのタイプが必要になる時もあるのではないでしょうか？今回はそんな時に利用できる、クリエイティブなアイコン35種まとめ「35 Fresh Icon Designs for Inspiration」を紹介したいと思います。 （Dribbble – Backpack Icon by Maria Isaeva） 立体感のあるリアルさを追求したものから、今主流のフラットタイプまで、いろいろな種類のアイコンがセットになっています。 詳しくは以下 Dribbble – Volume by Andrew Baygulo

TOP  >  Design  >  スクエア型を利用したパターンまとめ「40 Amazingly Creative Square Patterns For Free Download」 デザインの背景などを鮮やかに彩るパターン素材には、さまざまな柄が存在していますが、今回紹介するのは、スクエア型を利用したパターンまとめ「40 Amazingly Creative Square Patterns For Free Download」です。 （Pattern / candy bunnies :: COLOURlovers） スクエアをいろんな形でデザインに取り入れたパターンが40種紹介されています。気になったものをピックアップしましたので、下記よりご覧ください。 詳しくは以下 Pattern / rock the tartan :: COLOURlovers スクエアを取り入れた代表的なパタ

TOP  >  Design  >  背景に使いやすいウォールテクスチャまとめ「Useful Wall Textures for Your Daily Use」 グラフィックをデザインするにあたってテクスチャは大事な要素。たくさん種類があればデザインにバリエーションを出すことができます。そんな中今回紹介するのは、是非テクスチャのストックに加えてほしいウォールテクスチャまとめ「Useful Wall Textures for Your Daily Use」です。 Useful Wall Textures for Your Daily Use – GraphicMania レンガや石造りの壁、コンクリートの壁など、さまざまウォールテクスチャがまとめられています。いくつか気になるものをピックアップしたので、下記よりご覧ください。 詳しくは以下 Texture – rock wall by ~Cr

日々、新しいフリーフォントがリリースされてえおりDesignDevelopでも多くの記事をお伝えしてきましたが、今回は最近リリースされた個性的なフリーフォント「20 Fresh New Free Fonts for Designers」を紹介したいと思います。 Free Font Alex Brush by TypeSETit | Font Squirrel どれも既存の文字から、ひと味加えた個性的なフォントばかり。全部で20ものフォントがまとめられていまたが、その中からいくつか気になったものをピックアップして紹介したいと思います。 Chocolate Dealer Font – 1001 Free Fonts 名前の通りチョコレートを溶かしたような光沢感あるフォント。スイーツ関連のデザインによく合いそうですね。 Science Fair Font | dafont.com レトロデザイン

web上で配布・販売されているフォントにはさまざまな種類が存在しており、制作するデザインテイストや、目的に合わせて選ばれていると思います。そんな中今回紹介するのは、ヴィンテージテイストのハイクオリティフォント「Top-Selling Vintage Veneer Font Family」です。 $9と有料版のフォントとなっていますが、デザイン性の高さは、使用するだけでクオリティを最大限にアップさせることができそうです。 詳しくは以下 フォントはサンセリフタイプで、インパクトを持たせたいデザインにおすすめ。形としては非常にシンプルなので、いろいろなシーンに応用できそうです。また、ドクロや稲妻、星といったモチーフのアイコンフォントも収録されており、デザインにポイントを加えることも可能になっています。全体的にかすれた雰囲気の処理が施されたヴィンテージなテイストが魅力的ですね。制作デザインのイメー

TOP  >  Design  >  いろいろな雰囲気の木目テクスチャパックまとめ「10 Free Wood Texture Packs for Your Design」 テクスチャの定番としてさまざまなシーンで活用されている木目テクスチャは、表現がワンパターンにならないようにバリエーションはできるだけ多く所持しておきたいもの。今回はそんなシーンにおすすめな、いろいろな雰囲気の木目テクスチャパックまとめ「10 Free Wood Texture Packs for Your Design」を紹介したいと思います。 （Wood Pack by ~kissbomb on deviantART） 定番として利用できるシンプルなタイプから、木目の個性を活かしたタイプまで、多彩な種類が収録されています。気になったものをピックアップしてみましたので、下記よりご覧ください。 詳しくは以下 ■: Text

TOP  >  javascript , WebDesign  >  レスポンシブメニューを実現してくれるjQuery集「15 Responsive Navigation jQuery Plugins」 スマートフォンのシェアが高まるに連れてPCでもスマートフォンでも両方共通のコンテンツで、各端末ごとに最適化されたデザイン+機能。多くのWEBデザイナーが頭を迷わせるところですが、今回紹介するのはその中でもユーザーが操作するナビゲーションをレスポンシブにしてくれるjQueryを集めたエントリー「15 Responsive Navigation jQuery Plugins」です。 Sidr 最近のスマートフォンアプリのナビのようにサイトのサイドからせり出てくるようなナビゲーションから、端末によって、それぞれの端末に最適化された形に変化するものまで多種多様なレスポンシブメニューがまとめられてい

さまざまなパターンが楽しめる 自然風景や壁のPhotoshopテクスチャまとめ「8 Excellent Galleries of Free Photoshop Textures」 効果的なビジュアルがあると、Webサイトの雰囲気はガラっと変わるもの。クリエイティブなWebデザイン制作にとってテクスチャは効果的なツールの1つです。そんな中今回は、背景に使えそうな自然の風景や壁・タイル目地などの、様々なテクスチャをまとめた「8 Excellent Galleries of Free Photoshop Textures」を紹介したいと思います。 （TexturePop Free Textures – Grass Textures） 高解像度なテクスチャが種類豊富に揃っているので、色々な用途に使用することができそうです。中でも気になったものをいくつかピックアップしましたので、下記よりご覧ください

TOP  >  Design  >  ビジネスシーンのデザイン表現に利用したいフリーベクター素材「25 Free Business and Finance Vectors」 硬めで堅実なイメージを表現することが多いビジネス系のデザインですが、内容を分かりやすく伝えるために、イラスト等のビジュアル素材を使うこともあるのではないでしょうか？今回はそんな時に参考にしたいフリーベクター素材「25 Free Business and Finance Vectors」を紹介したいと思います。 （Businessmen Graphics） 仕事をするシーンをイメージさせる素材から、金融関連の素材など、ビジネスシーンで目にすることが多いビジュアルのベクター素材がまとめられています。 詳しくは以下 ■Business Presentation – Vecteezy! – Download Free Vect

いろいろなデザインで活用できる ミニマルデザインフォントまとめ「19 Free And Stylish Minimalistic Fonts For Your Designs」 インターネット上で配布されている素材の中でも、活用の幅の広いフリーフォント。特にシンプルで汎用性の効くタイプは1つでも多く持っておきたいものです。今回そんなタイプのミニマルデザインフォントまとめ「19 Free And Stylish Minimalistic Fonts For Your Designs」を紹介したいと思います。 （Simple Ronde Font | dafont.com） いろんなデザインに使用できそうなフォントが19種、ビジュアルイメージと共に公開されています。いくつかピックアップしていみましたので、下記よりご覧ください。 詳しくは以下 ■Gabriele 8008 Typewriter

デザインの質感をより高めてくれるテクスチャ。下に敷くテクスチャで大きくデザインの印象は変わりますが、今日紹介するのは、様々な質感のフリーテクスチャを集めたテクスチャ集「30 Free High Resolution Texture Packs」です。 Texture Pack 04: black by =mercurycode on deviantART (6 Textures, 4200×2800px) 高品質なテクスチャセットが全部で30紹介されていますが、今日はその中から幾つか気になったテクスチャセットをピックアップして紹介したいと思います。 詳しくは以下 High Speed Water Textures (8 Textures, 4500×3000px) 流れる水の一瞬を捉えたテクスチャセット。 Wood and Paint Textures (6 Textures, 3000×

TOP  >  Font  >  比較的最近公開されたピクセルフォントまとめ「A New Collection of Pixel Fonts」 楽しげな雰囲気や、レトロなテレビゲームの雰囲気を感じさせるピクセルフォント中から、比較的最近公開されたフォントをまとめた「A New Collection of Pixel Fonts」を今回は紹介したいと思います。 Pixel Millennium font by Zdeněk Gromnica – FontSpace ポップで可愛らしいフォントから、レトロゲームの雰囲気をそのまま楽しめるフォントまで、さまざまなタイプが紹介されています。中でも気になったものをいくつかピックアップしましたので、下記よりご覧ください。 詳しくは以下 ■Power Pixel-7 font by Style-7 – FontSpace 太さの異なるラインで構成された、