デザインを開発するという視点でお伝えするクリエイティブBLOG
WEBサイトに欠かせないUI/UXの一つローディング。この小さなアニメーションで多くのストレスが軽減でき、かつ世界観を表現できます。ローディングアニメーションには様々な作り方がありますが、今回紹介するのはCSSのみで実現するカラフルポップなローディングアニメ「CSS PIN」です。
全部で10個のローディングアニメーションが公開されており、どれもクリエイティブでポップな印象を受けます。
詳しくは以下
写真を利用する時、撮影されたまま利用するという事はソフトウェアが発達してきた現在まずありませんが、今日紹介するのはレタッチソフトでは無く、CSSで実現するイメージフェクト「20 Image Effects With CSS」です。
水彩風から、黒板に書いた風のエッジを検出したものエアブラシで書いたものなどなど、全部で20ものエフェクトがCSSで指定するだけで簡単にエフェクトを利用することが可能です。
詳しくは以下
WEBデザインの世界は非常にトレンドの流行り廃りが早く、昨年のものは今年、今年のものを来年使えないぐらいのスピードでトレンドが移り変わっていきます。今日紹介するのは来年の2017年のWEBデザインのトレンドをまとめた「The Future of Webdesign: Trends 2017」です。
来年の注目すべき、WEBデザインのトレンドが全部で6つまとめられていましたので、順に紹介したいと思います。
詳しくは以下
そろそろ街はクリスマスムードとなってきて、クリスマス装飾を見かけるようになってきました。今日紹介するのはクリスマスを彩るアイコンセット「100 Free Flat Christmas Icons」です。
このアイコンセットはフラットでカラフルな、クリスマスらしい楽しげなアイコンが全部で100種類収録されています。収録アイコンは以下からご覧ください。
詳しくは以下
アイコン素材はデザインの感覚を揃えて利用すれば、サイトの統一感、ユーザーインターフェイスの精度など向上させてくれます。今日紹介するのはまとめて利用できるレトロポップな170個収録のビジネスアイコンセット「170 Retro Business Icons」です。
上記の様なポップでレトロな温かみのあるデザインテイストでビジネスに関するアイコンが全部で170個収録されています。収録されているアイコンセットは以下からご覧ください。
詳しくは以下
WEBデザインの世界感を表現する上で便利な素材がパターン。どのようなパターンを背景に用いるのかで全く印象が異なったりします。それだけに様々な背景素材が配布されていますが、今日紹介するのは登録されたパターンをベースにカスタマイズができるパターン配布サイト「HeroPatterns」です。
決められたパターン素材をただ、取得するというものでは無く、登録されたパターンをベースに自分自身でカスタマイズして利用することが可能です。
詳しくは以下
デザインの背景に使用することで、より魅力的なデザインに仕上げることができるバックグラウンド素材。持っていると非常に便利に活用できるもの。そんな中今回紹介するのは、雰囲気・ニュアンス感のあるバックグラウンド背景集「Free 50 Retro Dotted Blurred Backgrounds」です。
50種の、柔らかくどこかレトロな雰囲気も感じさせてくれるバックグラウンド素材がまとめダウンロードできるようになっています。
詳しくは以下
制作に非常に便利なphotoshopブラシ。様々なブラシセットをDesigndevelopでは紹介してきましたが、今回紹介するのはブラシ本体の方ではなく、photoshopブラシを制作するためのチュートリアルをまとめたエントリー「24 Useful Tutorials on Creating Photoshop Brushes」です。
Creating grunge brushes | Veerle’s blog
よく見かけるphotoshopブラシの作り方が詳細に紹介されています。全部で24個ものphotoshopブラシの作り方がまとめられています。今日はその中から気になったものをいくつか紹介したいと思います。
詳しくは以下
UI（ユーザーインターフェース）とは、ユーザーがコンピュータを操作する際の画面表示やナビゲーション、全体的な操作感のことを示し、これはWebサイトを不便なく閲覧する上で非常に多くのなウェイトを占めています。今回紹介するのはそんなUIに絞って事例や素材を検索できるWebサービス「UI Cloud」です。
これは入力したキーワードを基にUIを検索して、表示された結果から各種素材データがダウンロード出来るというもので、クリエイター向けのサービスとなっています。
世界中には無数の種類の布地があり、デザインテイストに合わせてさまざまな織り目のテクスチャを選択していると思います。今回はそんな布地の中からタオル生地にクローズアップ。さまざまな織り目が楽しめるタオル生地テクスチャをまとめた「A Collection of Free and Comfy Towel Texture」を紹介したいと思います。
A Towel -Greyscale- by ~Wezza-T on deviantART
タオルの柔らかい雰囲気をはじめ、織り目の異なるテクスチャが豊富に紹介されています。中でも気になったものをいくつかピックアップしましたので、下記よりご覧ください。
詳しくは以下
リンクがクラッシュしている時などに表示される404エラーページ。目にする機会も多いページですが、意外とデザインは凝られていない部分でもあります。そんな細かいところまでデザインした事例をまとめた「20+ Fresh & Creative 404 Error Pages Examples For Your Inspiration」をご紹介いたします。
魅力的な404エラーページのデザインサンプルがまとめられています。下記にいくつかピックアップ致しましたので、ご覧ください。
詳しくは以下
企業や団体のアイデンティティを確立するための一つの重要なデザインとなるロゴデザイン。今日紹介する「36 Clever and Creative logo」はアイデア溢れるロゴデザインを集めたデザイン集です。
Food Writers
全部で36ものクリエイティブなロゴが紹介されていますが、今日はその中からいくつか気になったロゴをピックアップして紹介したいと思います。
詳しくは以下
Adobe Illustrator10でベクターデータで作られたドット絵の世界地図素材が今回紹介する「Dotted world map vector resource」です。白黒のシンプルなドットの世界地図が無料でダウンロードできます。
ベクターデータで配布されていますので一部分を使ったり、色を変えたりと様々な方法で使えそうな素材です。制作期間は数日だそうで、現在v1.1が最新版としてリリースされています。
詳しくは以下
制作にバリエーションと幅を与えてくれるphotoshopのブラシ。上手く使えば劇的に制作時間を短縮してくれます。今日紹介する「75 Sets of Unusual Photoshop Brushes」は様々な表現のphotoshopブラシを集めたエントリーです。
全部で75個のブラシセットが公開されていて、建物や人体の一部、警告シンボルなど様々なジャンルのブラシセットが公開されています。今日はその中からいくつか気になったphotoshopブラシをピックアップして紹介致します。
詳しくは以下
さまざまな使い方ができるベクター素材はとても便利な存在。気になったものをストックしておくことで、いろいろなシーンで活躍してくれます。今回はそんなストックのコレクションに加えておきたい、種類が豊富なジオメトリックベクター「45 Geometric Vector Shapes」を紹介します。
白と黒の異なるカラーで展開された幾何学模様が、45種類セットになっています。
詳しくは以下
アラートを出したり、案内をだしたり非常に多様な使い方で便利に使えるモーダル。それだけに多くのWEBサイトで利用されています。今日紹介するエントリーは、便利なjQueryモーダルプラグイン15選「15 Cool jQuery Modal Plugins」です。
SimpleModal / Eric Martin / ericmmartin.com
シンプルなものから、ギャラリー的なら利用ができるものまで幅広く収集されていますが、今日はその中からいくつか気になったものをピックアップして紹介したいと思います。
詳しくは以下
