デザインを開発するという視点でお伝えするクリエイティブBLOG
会員登録ページや管理画面へのアクセスに使用するログインページ。シンプルなものが一般的ですが、こだわりを見せることでサイトのクオリティは高まります。今回はそんな時に参考にしたい、オープンソースのログインフォーム10選「10 Open Source Login Pages Built With HTML5 & CSS」を紹介したいと思います。
10種類の、それぞれ個性をもったログインフォームがピックアップされています。
詳しくは以下
普段私たちが見ているサイト。それを構成するHTMLはこの数十年のうちに大きく発展をしてきました。開発されたプログラミング言語は膨大であり、追いかけることも一苦労。わからないことを検索するのも非常に手間がかかります。そんなときに活躍してくれる「Interactive HTML Cheat Sheet」を紹介していきたいと思います。
目的のHTMLを簡単に検索することができる便利なチートシートになります。
詳しくは以下
ブラウザの発展によりjavascriptによるアニメーション表現はより高度なものとなってきていますが、今日紹介するのはCSSやSVGとも連携し、様々なアニメーションを描画できる軽量なライブラリ「Anime.js」です。
回転や移動といったシンプルなものから、ランダムな動きなどなど、作りこめばかなり高度な動きも可能な用で、CODEPENでは様々なアニメーションサンプルが上がっていました。
詳しくは以下
webサイトのUI設計をする際に、さまざまな機能を取り入れることでより魅力的なサイトを作り上げることができます。今回はそんなシーンでチェックしたい、さまざまなツール&リソースまとめ「New Essential UI Design Tools & Resources for Web Designers」を紹介したいと思います。
jQueryやJavaScriptなど、ぜひ利用してみたいツールやリソースがピックアップされ、まとめられています。
詳しくは以下
フリーのテーマを利用することで、1からの構築作業時間を短縮できるとともに、さまざまな機能などを同時に手に入れることができます。仕事の種類によって使い分けるととても便利です。今回はそんなシーンに利用したい、11種のHTML5&wordpressフリーテーマ集「11 Free Fresh HTML5 & Responsive WordPress Themes」を紹介したいと思います。
WordPress › Radcliffe « Free WordPress Themes
フリーで利用できる、比較的シンプルな構造のテーマが11種、厳選され紹介されています。気になったものをピックアップしましたので、下記よりご覧ください。
詳しくは以下
webサイトを制作する際には、デザインだけでなく全体の構成などの設計が必要となってきます。しかしコストや時間の関係でなかなか思ったようにデザインできないこともあるのではないでしょうか？そんな時に参考にしたい、HTML5のフリーレスポンシブテンプレート「50 Free Responsive HTML5 Web Templates」を紹介したいと思います。
Cafe & Restaurant Free Website Templates
レスポンシブで、スマートフォンやタブレットに自動対応した、ハイクオリティなテンプレートが紹介されています。気になったものをピックアップしましたので、下記よりご覧ください。
詳しくは以下
インターネット上でショッピングをする際の決算方法として、クレジットカードを使用する方は非常に多いと思います。決済は非常に重要な工程であるため、デザイン的にも分かりやすく案内してあげることが重要。今回はそんな時に必要な素材の一つ・クレジットカードビジュアルをアイコン化した「27 Free Credit Card Icon Sets for Online Web Shops」を紹介したいと思います。
Dribbble – 1 Color Credit Icons by Chad Pugh
さまざまな表現のクレジットカードのアイコンセットが、27種まとめられています。気になったものをピックアップしましたので、下記よりご覧ください。
詳しくは以下
デザインされたグラフィックに合うフォント探しは、ほとんどの制作シーンで行うと思いますが、時にフォントを主役にしたデザインを手がけることもあるはず。今回はそんな時におすすめ、芸術性の高いフリーフォント11種まとめ「11 Awesome Free Artistic Fonts」を紹介したいと思います。
Hipster Viral Blackletter Font #freebie on Behance
11種という厳選された種類ですが、どれも魅力的なタイプばかり。気になったものをピックアップしましたので、下記よりご覧ください。
詳しくは以下
webやグラフィックのデザイン制作に欠かすことができない素材の中でも、使用頻度の高い写真テクスチャ。シンプルなもの程アレンジの幅が広く、非常に重宝するのではないでしょうか？今回はそんなコレクションに是非加えたい、フリーコンクリートテクスチャ「9 Free High-Res Concrete textures」を紹介したいと思います。
比較的シンプルなタイプのコンクリートを撮影したテクスチャが9種類収録されています。
詳しくは以下
デザイン制作に欠かすことのできないフリーフォント。クオリティの高いデザイン性のあるものを取り入れるだけで、制作物の雰囲気が変わってしまうほど重要な役割を持っています。そんな中今回紹介するのは、デザイン性の高いフリーフォントコレクション「Collection of New & Free Fonts for June 2015」です。
Bellico font by seventhimperium – FontSpace
非常に魅力的なビジュアルやテーマが特徴のフリーフォントがピックアップされています。
詳しくは以下
夏が過ぎると、秋、そして寒い冬はあっと言う間にやってきます。そんな中今回は一足早く、美しい冬のネオンのような光の空間を表現できるPhotoshopブラシをまとめた「100+ Free Bokeh Brushes For Photoshop」を紹介したいと思います。
きらきら輝く光が散りばめられるPhotoshopブラシが多数紹介されています。中でも気になったものをいくつかピックアップしましたので、下記よりご覧ください。
詳しくは以下
webサイトをデザインするときにはいろいろなパーツ素材が必要になってきますが、同じデザインテイストですべてを揃えるのはなかなか大変なもの。今回はそんなときに参考にしたい、webサイト設計で使用する基本的UIが揃ったフリーキット「Spot UI Kit PSD」を紹介したいと思います。
ポップでカラフルなテイストのUIが揃っており、シリーズで使用すればデザイン感を合わせながらクオリティを高めることができます。
詳しくは以下
非常にたくさんのフリーフォントがインターネット上で配布されており、膨大な数の中からデザイン性のあるものをピックアップするのはなかなか大変なもの。今回はそんな時に参考にしたい、ハイクオリティなデザイン性を感じられるフリーフォント選「30 High Quality Free Fonts You Should Definitely Own」を紹介したいと思います。
Cornerstone – Free Font on Behance
いろいろなテイストのデザイン性の高いフリーフォントがまとめられ紹介されています。気になったものをピックアップしましたので、下記よりご覧ください。
詳しくは以下
WEBデザインの次世代規格として注目を集めているCSS3。徐々に技術系のWEBサイトでも取り上げられて、WEBデザイン業界内では話がでる機会も増えてきたと思いますが、今日紹介するのはCSS3を使ってボタンを作るテクニック集「20 CSS3 Tutorials and Techiques for Creating Buttons」を紹介したいと思います。
グラーデーション、オーバラップ、ドロップシャドウなどなど、いままで画像でしか表現が困難だったボタン表現が多数集められています。今日はその中からいくつか気になったテクニックを紹介したいと思います。
詳しくは以下
グラフィックでもWEBでもデザインにおいて、書体選びというのは非常に重要で、書体一つで大きくそのデザインが左右されます。それだけに選べる書体はできる限り揃えておきたいもの。今日紹介するのは最近リリースされた使えるフリーフォントをまとめたエントリー「11 Extremely Useful Fresh Free Fonts」です。
スタンダードというよりはクリエイティブによった、個性的な書体が全部で11個集められています。今日はその中からいくつか気になったエントリーをピックアップして紹介したいと思います。
詳しくは以下
デザイン作りをコスト面からも支えてくれるフリーフォントは、デザイン業務の強い味方。愛用しているデザイナーの方も多いのでは無いでしょうか。今回ご紹介するのは、そんなデザイナーが愛用するフリーフォント探しを手助けする、最も訪問されたフリーフォントサイトをまとめた「21 Most Visited Free Fonts Site」です。
プロのデザイナーも多数愛用する、知る人ぞ知る海外の王道フリーフォントサイトがまとめられています。その中から、幾つか気になったサイトを選んでみましたので是非ご覧ください。
詳しくは以下
(さらに…)
