デザインを開発するという視点でお伝えするクリエイティブBLOG
毎日コーディングでさまざまなコードを書くデベロッパーにとって非常に便利なスニペット。知っているだけで作業効率が格段にアップするもの。そんな方におすすめできる「30 Seconds of CSS」をご紹介していきたいと思います。
先進的な知識を多く取り込むためにも、基礎的な業務内容をいかに短縮して行っていけるかは非常に重要なポイント。デベロッパーの方はぜひ下記よりチェックしてみてください。
詳しくは以下
モダンな雰囲気からスタイリッシュな雰囲気まで、幅広い演出をしてくれるハーフトーン。今まで画像としてWebサイトに取り込むことが多かったのではないでしょうか。今回ご紹介する「Pure CSS Halftone Effect」ではWebならではの動きを楽しむことができるエフェクトを通したハーフトーンになります。
美しい動きで視線を惹き付ける、ぜひ取り入れてみたいエフェクトとなっています。
詳しくは以下
他の世界に入り込むような没頭感を味わうことができるVR。気軽にデモを作成ができたらと、デベロッパーであれば1度は感じたことがあるかもしれません。そんな中今回紹介するのは、CSSで作るVR「CSSVR: Progressive VR experiences」です。
VRの複雑な動きをどう再現していくのか、その再現率の高さはどうれくらいなのか。デベロッパーであれば気になるところ。下記にデモを載せているのでご覧ください。
詳しくは以下
Webデザインの中でもユーザーの目を簡単に引くことを可能にするエフェクト。動きがつくだけでサイト内がぱっと華やかになります。今や様々なエフェクトをつけることが可能ですが、ついついワンパターン化してしまいがち。そんな方におすすめできる、水のような動きに焦点をあてた「Liquid Distortion Effects」を今回はご紹介致します。
水のような動きは優雅さと洗練された雰囲気を与えてくれます。下記にデモをいくつかピックアップ致しましたので、ご覧ください。
詳しくは以下
フォントにはいろいろな太さのものが存在していますが、太めのラインが特徴のBold系は、文字を目立たせたいときなどに活躍してくれます。今回はそんな20種のBoldフリーフォントを集めた「20 Bold Free Fonts Perfect for Headlines」を紹介したいと思います。
Natasha | FREE FONT on Behance
Bold系でありつつ、さらに洗練されたデザイン性も兼ね備えた、ぜひデザインに取り入れたいフォントが紹介されています。気になったものをピックアップしましたので、下記よりご覧ください。
詳しくは以下
特に最近、よく見かけるデザインテーマの一つになっている幾何学柄。印象的かつデザイン性のあるグラフィックを作り上げることができる点でも、人気が高い表現の一つです。そんな中今回紹介するのは、ポリゴンイラストレーションまとめ「25 Creative Polygonal Illustration Freebies」です。
Polygonal mountain background Vector | Free Download
幾何学柄をデザインに取り入れるための、フリーで使用できる素材が紹介されています。気になったものをピックアップしましたので、下記よりご覧ください。
詳しくは以下
Webデザインにおいてアイコンはとても重要なもの。特に個性的なアイコンは、デザインに色を添えてくれる力強い存在です。今回はそんな個性的なデザインアイコン30種「Free Sparkly Icons To (Literally) Make Your Designs Shine」をご紹介します。
クリエイティブ・コモンズアトリビューション3.0の規約に準じて配布されるもので、規約を守る場合のみ利用可能なコンテツになっています。
詳しくは以下
さまざまなタイプのサイト構築に活用できるwordpress。更新が簡単にできるなどの利点も含め非常に便利な存在です。そんな中今回紹介するのは、wordpressでの構築の参考にしたいフリーテーマ「Top 10: Free WordPress Themes of December 2015」です。
WordPress › Kotha « Free WordPress Themes
新しくピックアップされたwordpressのフリーテーマが紹介されています。気になったものをピックアップしましたので、下記より御覧ください。
詳しくは以下
最近では、WEBサイト制作にあたって一つ重要な項目の一つにもなってきているすでに多くの現場で対応が求められていると思いますが、そんなスマートフォン向けのWEBサイトを構築する上でのテクニックがまとめられた書籍、「iPhone+Android スマートフォンサイト制作入門」をアスキーメディアワークスさんに献本して頂きましたので紹介したいと思います。
構築的な部分以外にも序章で、スマートフォンのブラウザならではの制限や仕様などが詳しく開設されていて、サイトを制作する上で、必要な知識から、実際の構築まで幅広く網羅されています。
詳しくは以下
可憐なイメージから華やかなイメージなど様々な印象を与えてくれる花柄の素材。今日紹介するのは花柄の背景パターン素材を60集めた背景素材セット「60+ Floral Patterns, Backgrounds」です。
POPなものからシックなモノまで様々な背景パターンが収録されていますので、色々な出算に使えそうな素材集です。収録パターンがまとめて公開されていましたので、下記に貼り付けておきます。
詳しくは以下
WEBだけに留まらず、イメージを伝える為に必要不可欠な写真。的確に利用すれば伝えたい事はより伝わり、全体のイメージも形作れたりします。今日紹介するのは3000枚以上の写真素材をダウンロードできる国内フリー写真素材配布サイト「Futta.NET」です。
風景写真がメインで、外国と日本、観光名所と街中の風景、自然風景、洋風・和風等の高解像度画像が公開されていて、その他にも世界遺産都市、スイス・ドイツ、東京・沖縄、犬・猫・鳥・猿、ビーチ・バー、桜・梅、虹のある景色など特徴的な素材もあり、様々なフリー写真素材がカテゴリに分けられて収録されています。
詳しくは以下
Designdevelopではデザインに役立つTipsを公開してきましたが、今回紹介する「イラレラボ illustrator-labo」はイラストレーターに特化してTipsや素材などを紹介配布されているサイトです。
前回紹介した「日本の伝統色をデザインに！グラフィックスタイルライブラリ「Japanese Traditional 24」」もそのイラレラボさんが配布されている素材の一つです。様々なTipsや素材が公開されていますが、今日はその中から気になるエントリーを紹介したいと思います。
詳しくは以下
webサイトからのお問い合わせなどにフォームを設置しますが、スマートフォンライクの時代となった今、従来のデザインをそのまま取り入れるとタテに長くなってしまう傾向が。そんな状況を解消できる、フローティングラベルを取り入れたフォームサンプルまとめ「9 Floating Form Label jQuery & JavaScript Plugins」を今回は紹介します。
GitHub – Baedda/floating-form-labels: jQuery plugin that makes inline form labels usable again.
プレースホルダの文字が、入力するとタイトルとして浮き出すので、フォーム上に常に配置する必要がなく、長さを軽減することができるサンプルがピックアップされています。
詳しくは以下
フォントにはさまざまな種類があり、デザインのトレンドに合わせてどんどんと新しいタイプも登場し続けています。そんな中今回紹介するのは、是非取り入れたい、最新のクリエイティブなフォント「20+ New and Free Fonts for March 2014」です。
（FARRAY FONT /// FREE DOWNLOAD on Behance）
新しく配布されたフリーフォントが20種まとめられています。気になったものをピックアップしましたので、下記よりご覧ください。
詳しくは以下
