デザインを開発するという視点でお伝えするクリエイティブBLOG
オフィスやビジネスで使用するツールにはいろいろな種類があり、非常に身近な存在だという方も。webデザインなどをする時にイラスト素材として使用することも少なくありません。そんな中今回紹介するのは、さまざまなオフィスツールのベクターパック「Freebie: Comprehensive Office Environment & Tools Vector Pack」です。
定番のオフィスツールをフラットタイプのベクターイラストでまとめたフリー素材となっています。
詳しくは以下
WEBデザインにおいて便利な素材アイコン。アイコン自体のテイストにもよりますが、汎用性が高く、比較的どんなデザインでも活躍してくれます。今回紹介するのはフリーで利用できる650個以上のシンプルアイコンセット「defaulticon」です。
非常にシンプルなアイコンですが使い勝手がよく、使いやすいアイコンセット。全部で650以上のアイコンが公開されています。
詳しくは以下
データは16×16、32×32、48×48、64×64の、128 × 128、256 × 256のpngデータと編集可能なepsとなっていて、epsで配布されていますので、自由にカスタマイズ可能です。
このアイコンのライセンスは「Creative Commons Attribution-No Derivative Works 3.0 」となっていて、ライセンスに則った形であれば商用、非商用問わず無料で利用でき、WEBから、紙媒体などなど様々なものに利用することが可能です。詳しいライセンスについてはサイト下部に明記してありましたので、ご利用されるかたはご確認ください。
デザイン制作の現場に欠かせないテクスチャは、微妙なニュアンスの違いによってデザインの雰囲気が大きく変わるもの。そこで今回紹介するのが、さまざまなシーンに対応できるテクスチャパックをまとめた「45+ Free Texture Packs」です。
Free Totally Rusty Metal Textures | All Things Illustration and Design Resources – SDWHaven
シンプルな紙素材から個性溢れる素材まで、さまざまなテクスチャパックが紹介されています。中でも気になったものをいくつかピックアップしましたので、下記よりご覧ください。
詳しくは以下
今まで様々なフォントを紹介してきましたが、今回紹介する「FreshFonts」は少し変わった作り方をしています。その制作方法とはタイトルにもあるとおり、歯磨き粉やケチャップなどを使って作られるFontです。
実際上記のような形で、書いてから取り込んで、データに起こしているみたいで、かなりリアルな感じです。現在3種類のフォントが公開されています。3つとも下記に紹介しておきます。
詳しくは以下
今や世界共通のコミュニケーションツールとして広まった絵文字。そんな見慣れた絵文字がどうやって作られているのか、興味はありませんか？今回ご紹介するのは、絵文字風のアートワークの制作風景を撮影したタイムラプス動画つきの講座「Making Of An Emoji」です。
作業の全行程をたっぷり5分もの間、ノンカットで解説とともに確認できるメイキング講座です。
詳しくは以下
(さらに…)
日本では互換性を重視する傾向がつよくまだあまり、特殊なフォントをjavascriptなどで作り出すような手法はスタンダードではありませんが、中には、挑戦的なサイトもあり、フォントをjsやCSSで見せるそんなサイトもあります。今日紹介するのはWEBタイポグラフィ関係のjQueryプラグイン集「jQuery plugins for awesome web typography」です。
FitText – A plugin for inflating web type
フォントを加工するもの、テキストの組を特殊にしてくれるものなど、様々なフォント関連のjQueryプラグインが紹介されていますが、今回はその中から気になったものをピックアップして紹介したいと思います。
詳しくは以下
Lettering.js – A jQuery plugin for radical web typography.
自動的にclassを割り当てて、傾けたり、色を変えたり色々な処理が可能です。
It's Bacon! A jQuery plugin that allows you to wrap text around a bezier curve or a line.
オブジェクトにそって文字組を行なう事ができます。WEB上で紙のようなデザインが可能になります。
Arctext.js – Curving text with CSS3 and jQuery
文字をパスで並べたような、処理をjavascriptで可能にする。
上記の他にもいくつかのタイポグラフィ関連のjQueryプラグインが公開されています。文字をJS側で制御したいと言う方は是非原文もご覧ください。
テクスチャにはさまざまな種類があり、イメージしているデザインに合わせて使い分けて使用するため、種類を豊富にストックされている方も多いのでは？そんな中今回は、暖かみのあるデザインなどに特に活用できそうな、生地の織り目をテクスチャ化した「40 Intricate Weave Patterns For Your Creative Design」を紹介したいと思います。
Pattern / *No Sleep 2 :: COLOURlovers
さまざまな織り方がある生地をテーマとし、いろんなテイストのテクスチャがまとめられています。気になったものをピックアップしましたので、下記よりご覧ください。
詳しくは以下
webデザインにはさまざまなテイストがあり、その中で個性を演出していくことは、意外に難しいもの。そんな中今回は、ひと目見たら忘れられないようなwebサイトデザイン「MODALZ MODALZ MODALZ」を紹介したいと思います。
すべての要素がドットで作られた、懐かしささとアナログさが逆に新鮮なサイトデザインとなっています。
詳しくは以下
幾何学柄の中でも人気の高い、ポリゴン調のデザイン。web業界でもさまざまな場所で取り入れられていますが、いざ制作しようと思うと意外にバランスやカラー配色などが難しいもの。そんな時に参考にしたい、美しい色合いが魅力的なポリゴン柄フリーテクスチャまとめ「35 High-Res Low Poly Background Textures For Free」を今回は紹介します。
Dribbble – FREE 10 low-poly polygonal textures by Lumberjacks
さまざまなカラー配色で構成されたいろんな表情のポリゴンテクスチャがまとめられています。
詳しくは以下
インターネット上から数多くのフリー素材がダウンロードできるようになっていることもあり、どの素材を選んでいいか迷ってしまうこともあるのではないでしょうか？そんな中今回は、さまざまな種類の素材を厳選してまとめた「50 fantastic freebies for web designers, December 2014」を紹介したいと思います。
Menú despegable estilo acordeón | Accordion Menu
UIやフォント、ツールなど、たくさんある素材から利用活用度の高そうなものが選定され、紹介されています。気になったものをピックアップしましたので、下記よりご覧ください。
詳しくは以下
デザインにレトロ感を演出したい時は、ヴィンテージテイストのフォントを取り入れることでより雰囲気を強く表現できると思います。そんな中今回紹介するのは、ヴィンテージ調のデザインフォントまとめ「30 Vintage Fonts Perfect for Retro Style Design」です。
Caslon Antique font by Alan Carr – FontSpace
ヴィンテージな質感のデザインフォントがまとめられています。中でも気になったものをピックアップしましたので、下記より御覧ください。
詳しくは以下
WEBを制作されている方は日々工夫をこらしているCSS。多々あるブラウザ環境の中で、統一した見た目を保つ為に色々な努力を積み重ねている事かと思います。今日紹介するのはクロスブラウザのためのCSSのテクニックを紹介するエントリー「10 astonishing CSS hacks and techniques」を紹介したいと思います。
Cross browser inline block
ツールチップやギャラリー表示、選択したテキストのカラーを変える等、様々なテクニックがソースコード付きで紹介されています。今日はその中からいくつか気になったテクニックを紹介したいと思います。
詳しくは以下
