デザインを開発するという視点でお伝えするクリエイティブBLOG
デザインをする上で欠かすことのできないワイヤー制作。設計の基礎となるものであり、制作の方針をディレクターに伝えるためのものでもあります。デザイン業務に必ず組み込まれているものだからこそ、便利なツールを使用すれば業務がスムーズになるはず。そんな中今回は、知っていれば業務が楽になるまとめ「10 Free & Latest Wireframe Tools and Templates」をご紹介していきます。
Prototyping tool for web and mobile apps – Justinmind
ワイヤー制作を楽に行えるようになるツールがまとめられています。下記にいくつかピックアップしているのでご覧ください。
詳しくは以下
デザインのクオリティは細部に宿るといいますが、ちょっとした粒子や、色味の違いで大きくクオリティが変わったりします。今日紹介するのは、微細な汚れや味を表現するブラシコレクション「A Collection Of 100+ Subtle Brush Sets」です。
Hi-Res Subtle Grunge Vector Textures
粒子を表現したものから、刷り傷やランダムな粒子など様々なブラシセットがまとめられています。今日はその中からいくつか気になったものをピックアップして紹介したいと思います。
詳しくは以下
FLASHの代用として多くのサイトで取り入れられているスライダー。主にjavascriptなどで制作されており、管理のしやすさや、お手軽に導入できることから人気を集めています。今日紹介するのはハイクオリティーなスライダー集めたエントリー「Top 20 Premium Quality Sliders 」。
様々なタイプのスライダーがまとめられています。今日はその中からいくつか気になったものをピックアップして紹介したいと思います。
詳しくは以下
デザイン制作に欠かせないテクスチャ素材。特に”布素材”は加工やアレンジがしやすく、簡単に質感も出せることから非常に人気の高いジャンルとなっています。そこで今回は、さまざまな素材感の布テクスチャを集めた「230+ Awe Free Fabric Textures」を紹介したいと思います。
シンプルな素材感のものから、非常に質感のたかいざっくりとした編みの布素材、またくしゃっとした動きを感じさせる状態のものなど、テーマもさまざま。今日はその中からいくつか気になったものをピックアップして紹介したいと思います。
詳しくは以下
花や、渦や、カールなど流線的な印象をうけるブラシを400以上のブラシをまとめてあるエントリーが今回紹介する「400+ Swirls, Curls, and Fleurons」です。装飾的な部分ではかなり昔から利用されていて、様々な所で目にするような、イメージづくりには非常に使えるブラシが数多く紹介されています。
セットで色々と紹介されていますので、今回はその中から特に気になったブラシセットを紹介したいとおもいます。
詳しくは以下から
PCで見るWEBサイトの印象を大きく左右するアクションの一つホバーアクション。主にWEB上のユーザー導線上に配されるものだけに、小さいながらも、このアクションが心地よいかでサイトのクオリティを左右するものですが、今日紹介するのはクリエイティブなホバーアクションを実装できる「Tilt Hover Effects」です。
一般的に色が変わる、透明度が上がる、画像が切り替わるなどといったものでは無く、複数の画像がズレたり、アニメーションが加わったりマウス座標の位置で見た目が変わったりと、多彩なホバーアクションが簡単に実装できるようになっています。
詳しくは以下
人間から生み出されるイメージやグラフィックとはまた違った魅力がある、コンピュータなどで計算式を可視化する手法。今回紹介するのはそんなコンピュータによって幾何学的に描き出したイメージをテクスチャとして利用できる素材セット「Seven Free Fractal Wireframe Images」です。
細かい線によって描き出された図はどれも美しく、個性的です。またそれぞれ一定の特徴性を持っていて、ランダムのようにも感じるけれども、その中に確かな法則性があることも感じさせます。
マウスオーバーすると、色が変わったり、様々なアクションが走ったりと、WEBデザインでは多用されるホバーエフェクト。簡単に透明度だけ変えたり、色を変えたりというシンプルなものも良いのですが、一工夫されたホバーエフェクトは上手に使えばサイトの質を向上させてくれます。今日紹介するのはリッチなホバーエフェクトを実現するCSSセット「IMAGE HOVER EFFECTS」です。
画像が拡大されたり、フィルタが掛かったような表現になったり、全部で16ものホバーエフェクトを簡単に実装することが可能です。
詳しくは以下
WEBの欠かせない要素の一つフォーム。お問い合わせから、アンケートまで、様々な情報をユーザーから取得する際に利用されていますが、項目や、表示の仕方によっては、面倒な印象を与え、思ったように情報が得られなかったりしますが、今回紹介するのは質問項目のカテゴリーごとにスライド表示でフォームを表示できる「Fancy Sliding Form with jQuery」を紹介したいと思います。
実際に動作しているデモは「Fancy Sliding Form with jQuery」をご覧下さい。単純にスライダー表示させているだけでなく、スライダーを動かした段階で、入力項目がキチンと入力されているかどうかの判定も行えるみたいです。
詳しくは以下
WEBの素材としてアイコンセットは珍しいものではなく、様々なものがリリースされており立体的なものから、ピクトグラムライクな平面的なものもあります。今回紹介するのはすべて面で描かれた、POPでキュートなアイコンセット「Flat Design Icons Set Vol1」を紹介したいと思います。
アイコンはシンプルながらも細かいところまで作り込まれており、面で描かれながらも陰影や光も表現されており、立体的に見えます。
詳しくは以下
WEBを仕事中に私用で使っている人に、そして自宅でちょっと家族には見せれないページを見ていたりする方には非常に役立つ拡張機能「hideBad」を紹介したいと思います。
これはfirefoxで表示しているタブをすべて一瞬にして閉じることができると言うfirefox拡張機能です。
詳しくは以下
タイトルにもある通り「ボスが来た」系ソフトです。「ボスが来た」ってなにと言う方は「ボスが来た – Wikipedia」をご覧ください。いつの時代も悩むことは同じですね。
使用方法は至って簡単で拡張機能インストール後、［Alt］＋［X］キーを押すか、ツールバーに配置された専用の”閉じる”ボタンを押せば一瞬にして、firefoxで表示しているタブが閉じられます。
対応しているFirefoxは1.0系から2.0系までなのでまず大丈夫かと思います。「hideBad v2.0」が近日中にリリース予定で、それにyれば次回はタブを回復する機能や選んで閉じる機能も実装予定みたいです。使わないで良い状況でいることが何よりですが、どうしてもと言う場合はこちらで上手く凌いでください。
