デザインを開発するという視点でお伝えするクリエイティブBLOG
シンプルながらも星空をイメージさせるために最適な素材の一つ、スターダストパターン。今回ご紹介する「Night Sky Star Patterns」では、雰囲気の違う背景素材が20種類も収録されています。
実際の星空が一つとして同じ瞬間がないように、収録されている内容も様々。組み合わせ次第でいろいろな夜空に輝く星の様子を表現することができそうです。
詳しくは以下
近年Webデザインに導入する機会が増えてきた「SVG」。拡大や縮小が容易にできる為、レスポンシブ性が求められるWebデザインに適応するフォーマットとして注目を集めています。今回ご紹介するのはそんなSVGを利用した背景を容易に生成できる「SVG Backgrounds」です。
シームレスで拡大と縮小に適応したSVGバックグランドをCSSコードで入手することができます。
詳しくは以下
(さらに…)
季節行事の中でもクリスマス、ハロウィンと同じくらい特別なイベントであるバレンタイン。行事によってデザインを変えることはユーザーの目を引くにも非常に重要なファクターです。今回ご紹介する「A Huge Set Of Valentine’s Day Backgrounds (exclusive)」ではバレンタインを中心とした背景素材がまとめられています。
バレンタインらしくハートをモチーフとしたファンシーな背景素材がまとめられています。
詳しくは以下
WEBデザインは背景によって大きく印象が変わり、それだけにテクスチャや背景パターンの素材は数多くリリースされていますが、今回紹介するのは先進的な印象を与えてくれるカラフルな幾何学パターンセット「Colorful Geometric Pattern」です。
全部で8枚の繰り返しで利用できるシームレスな背景パターンがまとめて配布されています。収録されているパターンについては下記からご覧ください。
詳しくは以下
1カラムのダイナミックなデザインが主流となって暫く経ちますが、WEBサイトの印象を決定づける要素の一つに背景があります。特にPCサイトでは大きな面積を占めることから非常に重要な要素ですが、今日はそんな背景デザインのアイデア集、2017年の主流となるWEBデザインの背景のアイデア集「5 Modern Website Background Ideas for 2017」を紹介したいと思います。
1. Geometry on Photos
幾何学的なデザインを写真に重ねる背景デザイン
2017年のトレンドとなりうる背景デザインが全部で5つ掲載されていましたので以下からご覧ください。
詳しくは以下
WEBデザインの世界感を表現する上で便利な素材がパターン。どのようなパターンを背景に用いるのかで全く印象が異なったりします。それだけに様々な背景素材が配布されていますが、今日紹介するのは登録されたパターンをベースにカスタマイズができるパターン配布サイト「HeroPatterns」です。
決められたパターン素材をただ、取得するというものでは無く、登録されたパターンをベースに自分自身でカスタマイズして利用することが可能です。
詳しくは以下
WEBサイトなどの補足事項などを表示するのに便利なツールチップ。一般的にはアニメーション表現が伴うため多くはjavascriptを利用して制作されていますが、今回紹介するのはCSSのみで実現する1KB未満の超軽量ツールチップ「Wenk」です。
非常にシンプルなツールチップで、上下左右位置を表示したり、幅の調整したり細かな調整がデキるようになっています。
詳しくは以下
WEB業界ではすっかりおなじみのCSS3。ただまだ全てのブラウザに標準化され実装されているわけではなく、ブラウザ毎に接頭語を付けてあげる必要があります。
機能的にはそれぞれ接頭語をつけて、書き分けてあげれば良いのですが、管理面や手間的もあり面倒です。そこで今回紹介するのは、接頭語を欠かずにシンプルなCSSのみで様々なブラウザに対応させる事ができるというものです。
詳しくは以下
WEBに音をつける。敬遠される場合もありますが、WEBの用途によっては世界観を生み出すのに一役買ってくれます。皆さんはWEBを制作したあとにもし音を流したいとしたらどうしていますか?今日はそんな時に役立つWEBサイト「Purple Planet Music」を紹介したいと思います。
clam、dramatic、movementなどなど様々なジャンル別に音源が配布されていて雰囲気から音源を探す事ができます。
詳しくは以下
webデザインの制作素材として欠かすことができないアイコン素材。デザインテイストに合わせて、アイコン自体のデザインも使い分けたい、そんな時に是非参考にしたいフリーアイコンまとめ「Fresh and Free Icons for December 2013」を今回は紹介したいと思います。
フラットタイプのアイコンを中心に、さまざまなジャンルのアイコンがまとめられています。中でも気になったものをピックアップしましたので、下記よりご覧ください。
詳しくは以下
さまざまな素材が展開されているパターンやバックグラウンド素材を、デザイン制作に活用しているという方も多いはず。そんな中今回紹介するのは、汎用性の高いシームレスな素材を集めた「20 Great Seamless Backgrounds」です。
（Seamless Chromatic Rainbow Patterns | WebTreats ETC）
イラストやファブリック・写真素材まで、さまざまなシームレス素材が紹介されています。中でも気になったものをピックアップしましたので、下記よりご覧ください。
詳しくは以下
新しいデザイン制作をする度に、新しく使いやすいフォントとの出会いを求めているというデザイナーの方も多いと思います。そんな中今回紹介するのが、美しいスクリプトフォントをまとめた「10 Free Beautiful Script Fonts to Download」です。
個性とバランスを兼ね備えたフリーのスクリプトフォントばかりが紹介されています。中でも気になったものをいくつかピックアップしましたので、下記よりご覧ください。
詳しくは以下
国内での知名度はまだTwitterやfacebookなどと比べると格段に劣りますが、それでも多くの方が利用しているスクラップブック的なWEBサービスtumbler。テーマを設定でき、思い思いなデザインで利用することができますが、今日紹介するのはクリエイティブなンブラーのテーマを集めたエントリー「20 Astonishing Free Tumblr Themes」。
沢山のテーマが公開されていますが、今日はその中から幾つか気になったテーマをピックアップして紹介したいと思います。
詳しくは以下
WEB制作ではスプリットスクリーンなどが極端な例ですが、中央線を軸に左右を大胆に振り分けて使う手法が流行の一つになっていますが、今日紹介するのは、異なるものではなく、一つのオブジェクトをミラーリングして表現できるライブラリ「Mirror Effect」です。
Mirror Effect | Demo 3 | Codrops
単純に全く同じものを出現させることもできますし、上記のように背景を切り分けて表示することもできます。いくつかのパターンが公開されていましたので以下からご覧ください。
詳しくは以下
撮影した写真が思ったような雰囲気に仕上がらなかった時、photoshopなどの写真加工ソフトを使って加工を施すだけで、望んでいたイメージに仕上げることができます。今回はその作業負担を減らしながら、プロが撮影したような高いクオリティの写真が出来上がるアクションをまとめた「20+ Awesome Photoshop Actions to Pimp Your Photos」を紹介したいと思います。
（free photoshop actions 14 Freebies: 20+ Awesome Photoshop Actions to Pimp Your Photos）
アンティーク風の質感から、多彩な色味のバリエーションを作り出すことができるものまで、さまざまな種類が紹介されています。気になったアクションをいくつかピックアップしましたので、下記よりご覧下さい。
今までいくつかオンラインストレージは紹介してきましたが、今日紹介するオンラインストレージサービス「Filesavr」は、なんと1ファイル毎に10Gまでのファイルをアップロードしておけます。しかもログイン不要で利用できるので、気軽に利用する事ができます。
現実的に10Gともなるとアップロードするのも大変ですし、単体のファイルでそこまでのファイルを受け渡しする機会は滅多に無いと思いますが、制限の上限が高いのは嬉しい所です。
詳しくは以下
