デザインを開発するという視点でお伝えするクリエイティブBLOG
HTML5という言葉が世に出てから、暫くたって多くのプロジェクトが発信されてきましたが、今日紹介するのはHTML5+CSS3+javascriptで作るルービックキューブ「Tutorial: Rubik’s cube with HTML5 (CSS3 + JavaScript)」です。
こちらはただ単にキューブを作って描画するだけではなく、ボタンやスマートフォン上でのフリック、マウスなど様々な方法でルービックキューブが遊べるようになるというものになっています。
詳しくは以下
ティザーサイトをはじめとして、公開前の期待感をどう作っていくかという部分も近年のWEB制作では求められる部分だと思いますが、今日紹介するのは設定した日時に向けてカウントダウンしてくれるカウントダウンティッカー「How to Code a jQuery Rolodex-Style Countdown Ticker」です。
非常にシンプルな構成と鳴っていて、日、時間、分、秒でカウントダウンを行ってくれます。
詳しくは以下
WEBサイトのユーザーインターフェイスの設計は、様々な端末の出現でそれらの端末も意識した設計が必要になってきています。今日紹介するのはブラウザサイズ、端末の解像度に合わせて形を変えるシンプルなレスポンシブナビゲーション「Simple Responsive jQuery Navigation Plugin」です。
こちらはシンプルな作りになっており、デザインなどもされていない、至ってシンプルなものとなっていますので、構造を理解しながら制作を進めることができます。
詳しくは以下
2011年も多くのWEB開発のためのリソースが公開され、開発者を助けてくれました。今回紹介するのは2011年に公開された中から選ばれた開発者のためのWEB開発リソース50個、紹介する「Our 50 Favorite Web Developers Resources and Tools from 2011」です。
CSSのフレームワークから、便利なjsライブラリ、オンラインツールなどなど、それぞれのジャンルで選びぬかれた50ものリソースがまとめられています。今回はその中から幾つか気になったものをピックアップして紹介したいと思います。
詳しくは以下
WEB制作の現場で利用されているjQuery。非常に軽量かつ、高機能なjavascriptライブラリで、世界中で様々なプラグインがリリースされていますが、今日紹介するのは2011年にリリースされた、使えるjQueryプラグインをまとめたエントリー「The 50 Most Useful jQuery Plugins from 2011」です。
全部で50ものプラグインがまとめられていますが、今日はその中から特に気になったものを紹介したいと思います。
詳しくは以下
制作には非常に便利なjQueryプラグイン、世界中で利用されているだけに、日々、様々なjQueryプラグインがリリースされています。今日紹介するのは2011年に公開されたjQueryプラグインを寄りすぐったまとめ「Best jQuery Plugins of 2011」です。
様々なjQueryプラグインが公開されていますが、今日はその中から気になったプラグインを紹介したいと思います。
詳しくは以下
デザインをする際に欠かせない素材の一つにもなっているフォント。使い勝手の良いシンプルなタイプ、フォントだけで個性を演出できるものなどいろいろなタイプが存在していますが、今回はデザイン性の高い最新のフリーフォント集「New Free Fonts for 2016」を紹介したいと思います。
デザインに使用するだけで、クオリティを高めることができるフォントが紹介されています。気になったものをピックアップしましたので、下記よりご覧ください。
詳しくは以下
フォントを使用する場所やデザイン感によって、ウェイトやフォント自体の太さを使い分けることで強弱をつけることができます。そんな中今回紹介するのは、細身のラインが特徴のフォントまとめ「21 Light & Ultra-Thin Fonts for Your New Designs」です。
Party at Gatsby's font by tysmagic – FontSpace
繊細なラインで構成されたデザイン性の高いフォントが多数まとめられています。
詳しくは以下
フリーフォントサイトはインターネット上に多々ありますが、今回紹介する「Urbanfonts.com」はユーザーのことを考えて作られているなというのが実感できるフリーフォントサイトです。
通常は大きくわかりやすいサムネイルでマウスオーバーでA〜Zまでの書体がすべて表示されたサムネイルを表示してくれます。さらにサムネイルをクリックすると収録フォントをすべて表示してくれます。
詳しくは以下
もうすぐ、2月の一大イベント・バレンタインがやってきます。デザインの仕事でもバレンタイン関連の制作を手がけている方も多いのではないでしょうか？そんな中今回紹介するのは、バレンタインデザインに最適なフリーフォント集「20 Free Valentine’s Day Fonts to Get You in the Mood」です。
ハートモチーフがあしらわれていたり、女性らしい可愛らしいテイストであったりと、バレンタインテイストのデザインにぴったりなフォントが紹介されています。
詳しくは以下
テクスチャをデザイン制作に利用することも多いと思いますが、アナログ感のあるテクスチャは制作するのにも時間がかかるので、イメージにぴったりのテクスチャを見つけられると嬉しいものではないでしょうか？そんな中今回紹介するのは、染みや色の塗り重ねなど 独特の雰囲気の中に美しさを感じられるテクスチャセット「Seven Ethereal Stained Textures」です。
コーヒーをこぼしたようなテクスチャから、色を塗り重ねたようなテクスチャまで、7枚のテクスチャがセットになっています。
詳しくは以下
web上に配布されている素材から、いろいろな素材を探すのは意外に時間がかかり大変なもの。今回はそんな時に便利な、アイコンやUIキットなどさまざまな素材が揃ったサイト「pixelkit」を紹介したいと思います。
最新のデザインテイストのデザイン素材が収録されており、このサイトだけでいろんな種類を一度にダウンロードできるようになっています。
詳しくは以下
デザインをするときに全くゼロから、自分自身から出すというかたもいるかも知れませんが、多くの方がインスピレーションを得るために何らかのデザインを見たりという作業を行っていると思います。今日紹介するのはデザインの参考になる海外デザインインスピレーションブログ11選「11 design blogs with a specific focus」です。
1. Packaging blog – Lovely Package
大枠なデザインのブログでは無く、それぞれロゴデザイン、パッケージデザイン、タイポグラフィなど、デザインの中でおジャンルが細かく分けられてブログがピックアップされていました。
詳しくは以下
様々な事柄をシンプルな絵で表してくれるアイコン。WEB制作やアプリケーションのインターフェイスにはとても便利に使えます。今日紹介するのはフリーで使えるシンプルなアイコンセットを集めた「14 Free Mobile Application Development Icon Sets」を紹介したいと思います。
Free iPhone Toolbar Icons (PixelPressIcons)
原文ではモバイルアプリケーション開発のためのとなっていますが、十分普段のWEB制作にも使えそうなフリーアイコン集だと思います。いくつかまとめられていますが、今日はその中からいくつか気になったモノを紹介したいと思います。
詳しくは以下
WEBサイトを制作する上で、ワイヤーフレームを書いてWEB全体の構成イメージやユーザーの流れなどを見せた上で実制作に入るという方も多いと思いますが、今回紹介するのはWEBフローチャートを簡単に制作できる素材キット「Web Layout Flowcharts」です。
詳細のワイヤーフレームまでは難しいですが、大枠のサイトの構成、流れなどは把握できるものが簡単に製作できます。
詳しくは以下
