デザインを開発するという視点でお伝えするクリエイティブBLOG
エラー・許可・着信などなど、優れたユーザーインターフェイスは視覚だけではなくて、直感的にわかりやすい音があり、表示されるユーザーインターフェイスに組み合わせることで、ユーザーがどのようなことをしたかの理解を早めてくれます。今日紹介するのはそんなユーザーインターフェイスの音を、様々なサービス別に集めたWEBサイト「UI Sounds」です。
今までユーザーインターフェイスをまとめて紹介するサイトは多数ありましたが、こうして音に注目したサイトは珍しいと思います。
詳しくは以下
数多くの情報を整理し分かりやすく表現するために様々なユーザーインターフェイスが開発されてきましたが、今回紹介するのはフリックやグリッド生成など様々なUIが簡単に実現できるjsライブラリ「egjs」です。
実現できるユーザーインターフェイスは全部で4つ。タッチアクションから座標位置を取得するeg.MovableCoord、シンプルなフリックeg.Flicking、要素がビューポート内に存在するかを確認できるeg.Visible、グリッドスタイルをループで生成するeg.infiniteGridとなっています。
詳しくは以下
Webサイトを制作する上で、ナビゲーションの設計はユーザーが最も触る部分だけに非常に重要な要素の一つであるといえます。同じWebサイトであっても、ナビゲーションの設計が上手く出来ているかどうかでユーザビリティはかなり変わってくるのではないでしょうか。そこで今回は、ナビゲーションのトレンドを多方面から分析した「Up and Coming Navigation Trends」を紹介します。
Lack of navigation – Socket Studios 2013
ナビゲーションを取り払ってしまった例や、コンテンツを見せるために最小限に抑えたもの、全体的な閲覧の流れを作るなど、さまざまに工夫されたナビゲーションの事例が紹介されています。中でも気になったものをピックアップしましたので、下記よりご覧ください。
リッチからフラットへとデザインのトレンドが変わってきているように、Webにおいても時代のトレンドや利便性の向上を目指して、新たなトレンドが生まれると共に古いトレンドが消えていく、そういった進化の道を歩んでいます。今回紹介するのは2014年のWebでは見なくなるであろう古いトレンドたち「Web Design Trends That Will Disappear in 2014」です。
昔はよく見たけれど最近はあまり見かけなくなってきた、そんなトレンドたちが紹介されています。中でも気になったものをピックアップしましたので、下記よりご覧ください。
UI（ユーザーインターフェース）とは、ユーザーがコンピュータを操作する際の画面表示やナビゲーション、全体的な操作感のことを示し、これはWebサイトを不便なく閲覧する上で非常に多くのなウェイトを占めています。今回紹介するのはそんなUIに絞って事例や素材を検索できるWebサービス「UI Cloud」です。
これは入力したキーワードを基にUIを検索して、表示された結果から各種素材データがダウンロード出来るというもので、クリエイター向けのサービスとなっています。
インターフェイスは日々進化しており、デザインの流行り廃りデバイスの進化などを含めて多様化そして変化してきています。今日紹介するのは、最近リリースされているユーザーインターフェイスをセットにして利用できるインターフェイスキットを集めたエントリー「10 Free UI Kits」です。
最近流行りのフラットデザインからスタンダードなものまで、様々なユーザーインターフェイスキットが紹介されていますが、いくつか気になったものをピックアップして紹介したいと思います。
詳しくは以下
photoshopのブラシは手軽にデザインに彩りを与えることができる優れた機能として、多くのデザイナーに愛されています。そこで今回は、デザインを華やかに演出するフリーブラシセット「25 Most Popular Photoshop Brush Sets from BrushLovers.com」を紹介したいと思います。
（Pop Dots – Photoshop Brushes – BrushLovers.com）
デザインがパッと明るくなるような、POPなデザインのブラシがさまざまなバリエーションで展開されています。気になったブラシを選んでみましたので、下記よりご覧ください。
詳しくは以下
今まで様々なphotoshopブラシを紹介してきましたが、今日はひび割れや、汚れなど、ディテールや質感を作り込む時に便利なグランジ風に特化したphotoshopブラシ集が今回紹介する「200+ Free Grunge Photoshop Brushes」です。
エントリーのタイトルにもあるとおり合計で200を超えるブラシがダウンロード可能です。クオリティも精査されており、比較的高いクオリティのグランジphotoshopブラシをダウンロードすることができます。
詳しくは以下
ファッションアイテムの中でも定番中の定番として愛用されているデニム。デザインの世界でも、ポピュラーで人気の高い素材となっています。今回はそんなデニム地のシームレステクスチャまとめ「Grab These Free Seamless Denim Textures」を紹介したいと思います。
Denim by marlborolt on deviantART
比較的シンプルな表情が特徴の、いろいろなデザインシーンで利用できそうなデニムテクスチャがまとめられています。
詳しくは以下
日々進化していくWebデザインの表現方法。特にjQueryやHTML5・CSS3においては最新の動向と合わせていくため、たくさん勉強をされているデザイナーの方も多いのではないでしょうか。そんな中今回は、CSS3で実現できる最新のデザイン表現方法をまとめた「20 Useful Fresh CSS3 Tutorials for Web Designers」を紹介したいと思います。
20 Useful Fresh CSS3 Tutorials for Web Designers – DJDESIGNERLAB
奥行きを感じる3D表現、またプルダウンメニューなどに代表される基本機能も一味異なる、最新のWebサイトで見られるような斬新で面白いチュートリアルが揃っています。中でも気になったものをピックアップしましたので、以下よりご覧ください。
詳しくは以下
webデザイン制作の際には特によく使用するアイコン。テイストに合わせて、バリエーションを揃えておきたいものです。そこで今回紹介するは、さまざまなテイストのアイコンをまとめた「Top 50 Web Development, Design and Application Icon Sets from 2010」です。
（200+ Exclusive Free Icons: “Reflection” | Webdesigner Depot）
デザインの雰囲気はもちろん、それぞれにテーマ性を持ったアイコン集が多数収録されています。気になったものをいくつかピックアップしましたので、下記よりご覧ください。
インターネット上で配布されているさまざまな種類のフォント。デザイナーの方はいろんな種類をダウンロードして使用されていると思います。そんな中今回は、フリーで使用できるハイクオリティなフォントまとめ「Download High Quality Free Fonts」を紹介したいと思います。
（Construthinvism – Free Font on Behance）
ベーシックに定番として使用できそうなものから、使うだけで個性的なデザインに仕上げることができそうなものまで、たくさんのフォントが紹介されています。
詳しくは以下
様々な処理を一瞬で行なってくれるphotoshopのアクション。デザイナーなら一度はお世話になったことがある機能だと思いますが、今日紹介するのは2013年にリリースされたphotoshopアクション集めたエントリー「55 Brand New Adobe Photoshop Actions for 2013」です。
最近リリースされたphotoshopアクションが全部で55個紹介されています。今日はその中から特に気になったアクションをピックアップして紹介したいと思います。
詳しくは以下
先日「待望のWordPress2.5正式版がリリース-導入に当たってのまとめ」でも取り上げましたて、少し待ってからアップグレードしようとエントリーしましたが、待ちきれずにWordPress2.5にDesignDevelopもアップグレードしました。変わる変わるのWEB上では言われていましたがここまで変わるとは…といったのが正直な感想です。
アップグレードは特に問題なく無事終了。動作も全く問題なく、いくつか使えなくなったプラグインはある物の運営には困らないレベルでした。
詳しくは以下
SNSで写真を日々投稿している方も多いかと思いますが、ただ写真を撮って上げるよりも加工やアレンジを施した方が魅力的に見えることも。今回はそんなシーンで活用したいSNS投稿用テンプレート「Peach Social Media Templates」を紹介したいと思います。
ピンクカラーで展開された、ガーリーなデザイン性が魅力のテンプレート集となっています。
詳しくは以下
