デザインを開発するという視点でお伝えするクリエイティブBLOG
tableタグやDIVタグを利用して制作するテーブル組、それほど難しい仕組みでは無いのですが、いざ手書きをすると時間を取られたりします。今日紹介するのはHTMLテーブルが直感的に簡単に生成できるWEBジェネレーター「DIV TABLE」です。
利用方法は非常に簡単で、tableタグで生成するかDIVタグで生成するかを選んで、あとはBorder、width、Cell Paddignを設定して、あとは欲しいテーブルサイズを選択すればタグが生成されます。
詳しくは以下
CSSのみで制作されるアニメーションは軽量でシンプルで非常に使い勝手も良く、国内でもブラウザの制限が商業レベルでも外れてきた今、数多く活用されはじめてきていますが、今日紹介するのはCSSのみで制作されたローディングアニメーションセット「CSS Loader」です。
ローディングアニメーションはWEB制作の現場でも比較的利用頻度が高く、最近の画像中心のWEBサイトでは必ずと言っていいほど実装するためCSSのみで利用できるのは非常に魅力的です。
詳しくは以下
WEBサイトなどの補足事項などを表示するのに便利なツールチップ。一般的にはアニメーション表現が伴うため多くはjavascriptを利用して制作されていますが、今回紹介するのはCSSのみで実現する1KB未満の超軽量ツールチップ「Wenk」です。
非常にシンプルなツールチップで、上下左右位置を表示したり、幅の調整したり細かな調整がデキるようになっています。
詳しくは以下
WEB上で何かを選択するときに用いるラジオボタン。様々な場所で実装されており、もはや当たり前のユーザーインターフェースの一つですが、今回紹介するのはそんなラジオボタンにアクセントを付けることができる、CSS3で実現するラジオボタンアニメーション「radiobox css」です。
ラジオボタンの選択時に特定のアニメーションをラジオボタン自体にかける事が可能です。
詳しくは以下
写真加工は現在様々なアプリケーションに搭載されており、もはや写真とは切手は切れない関係にありますが、今回紹介するのはWEB上でも動作する写真加工フィルタを生成できるCSSで実現するフィルタジェネレーター「CSSFILTERS.co」です。
このサービスでは、予め登録されたフィルタもしくは、パラメーターを指定して任意の画像にフィルタをかけるとと共に、WEB上で実現するためのコードも出力してくれるというものです。
詳しくは以下
Instagramなどを始め写真共有アプリでは気軽に写真に豊富なフィルタがかけられ多くの方が利用しており、フィルタによって創られた色味や風合いは写真のクオリティを大きく向上させてくれます。今日紹介するのはjavascriptとCSSで写真にフィルタ効果を与えるライブラリ「Philter」です。
パラメーターを調整するだけWEB上で表示された写真にフィルタと同じような効果をかけることが可能です。
詳しくは以下
WEBデザインに限らず、その作り込みや分かりやすさでデザインの精度を左右する要素アイコン。アイコンを作りこむにはかなりの時間を要しますが、今回紹介するのはそんなアイコン制作の手間を軽減してくれる、300個のアイコンをセットにしたフリーアイコンセット「Batch.」です。
全部で300以上のアイコンがセットになっており、スタンダードなものから少し変わったものまで、考えられるアイコンは粗方押さえられています。
詳しくは以下
webサイトのUI設計をする際に、さまざまな機能を取り入れることでより魅力的なサイトを作り上げることができます。今回はそんなシーンでチェックしたい、さまざまなツール&リソースまとめ「New Essential UI Design Tools & Resources for Web Designers」を紹介したいと思います。
jQueryやJavaScriptなど、ぜひ利用してみたいツールやリソースがピックアップされ、まとめられています。
詳しくは以下
クリスマスの素敵な一時に、クリスマスカードやメッセージカードを素敵なデザインとともにと考えている方で既製品ではなく、自分でカスタマイズしながら制作して贈りたいという方におすすめなのが、今回紹介するクリスマスを素敵に演出できる「Merry Christmas Lettering」です。
全部で6種類のデザインが収められており、どれも手書きのクリスマスメッセージとともにデザインのパーツワークが収録されています。クリスマスカード以外にも制作事例がまとめられていましたので以下からご覧ください。
詳しくは以下
天気予報として天気のマークを利用するのはもちろん、人の気分やさまざまな雰囲気を表現する際にも天気マークは利用しやすいもの。そこで今回は、天気を表すさまざまなアイコンをまとめた「30 Sets of Free Weather Icons」を紹介したいと思います。
Flat Weather Icons by ~LavAna on deviantART
立体感のあるアイコンから、ピクトグラムのようなアイコンまで、デザイン制作に利用しやすいアイコンがたくさん紹介されています。中でも気になったものをいくつかビックアップしましたので、下記よりご覧ください。
詳しくは以下
デザインのアクセントや装飾用など、さまざまなシーンで利用できるブラシ表現は、手軽にリアルな質感表現が可能になり非常に重宝されます。そんな中今回紹介するのは、飛び散る絵の具を表現できるPhotoshopブラシを集めた「300 Awesome Paint Splatter Brushes」です。
（11 Large Splatter Brushes by ~Manisma on deviantART）
300点という豊富な種類のブラシがセットになって紹介されています。中でも気になったものをピックアップしましたので、下記よりご覧ください。
詳しくは以下
■20 Splatter Brushes
さまざまな種類の表現が楽しめる墨のブラシセットです。20ものブラシがセットになっているので、多彩なシーンで利用することができますね。
■Blood Splatter Pack by *nathradas on deviantART
血が飛び散ったような表現のブラシです。Hiphop、アンダーグラウンド、ホラー、サスペンスなど、ダークな印象を与えたいデザインにぴったり。
■Splatter Star Brushes by ~UrikaRox on deviantART
宇宙や異空間のような神秘的なデザイン制作に利用してみてはいかがでしょうか？
テクスチャを利用するだけではなく、このようなアナログ感のあるブラシを利用することで、更にデザインに奥行きを感じさせることができるのではないでしょうか？他にもたくさんのブラシが紹介されていましたので、気になる方は是非原文もチェックしてみてください。
デザイン業界には必須のアプリケーション。イラストレーター多くのクリエイターが利用しているかと思います。今日紹介するのはそんなイラストレーターのチュートリアルを集めたエントリー「22 Very Useful Adobe Illustrator Tutorials」です。
Design with Swirls and Flourishes
WEBのワイヤーフレームから、グラフィックテクニックまで幅広いチュートリアルが記載されています。今日はその中からいくつか気になったチュートリアルをピックアップして紹介したいと思います。
詳しくは以下
先日、jQueryのプラグインを「新しくて、素晴らしいjQueryプラグイン「30 Fantastic New jQuery Plugins」」という記事で紹介したばかりですが、今回はクリエイティブなjQueryプラグインを集めたエントリー「28 Fresh jQuery Tutorials」を紹介いたします。
Fullscreen Gallery with Thumbnail Flip
このエントリーでは、スライダー、ギャラリーなどを中心に演出に凝った、見せるためのjQueryプラグインが多数まとめられていました。今日はその中からいくつか気になったものをピックアップして紹介したいと思います。
詳しくは以下
写真の補正というものは突き詰めれば突き詰めるだけ細かな部分があって本当に力をいれて行なうと相当な時間がかかります。今日紹介するのはそんな写真の補正の時間をグンと圧縮してくれるphotoshopアクションを集めたエントリー「50 Time Saving Photoshop Actions for Enhancing Photos」です。
Polaroid GENERATOR V1 (9 actions)
全部で50ものphotoshopアクションが紹介されています。今日は今までDesigndevelopで紹介した事が無いものを中心にいくつかきになったものをピックアップして紹介したいと思います。
詳しくは以下
仕事デスクの上ではいろいろなアイテムを使用していると思いますが、今回はそんなワークスペースのイメージアイテムが集合したベクターキット「FREE Elegant Vector Kit with 60 Workspace Elements」を紹介したいと思います。
非常に洗練されていながら、どこか柔らかさを感じることができるイラストベクターのセットがダウンロードできるようになっています。
詳しくは以下
書体はデザインのなかでも非常に重要な要素の一つで、書体が持つ印象や雰囲気にデザインが引っ張られます。今日紹介するのはコミカルで楽しげな雰囲気のコミックフォントを集めたエントリー「25 free comic fonts」を紹介したいと思います。
上記のような楽しさを感じられるフォントが多数集められています。今日はその中からいくつか気になったものをピックアップして紹介したいと思います。
詳しくは以下
