デザインを開発するという視点でお伝えするクリエイティブBLOG
Webやアプリケーションのデザインに欠かせないUI設計。しかし使いやすく最適なUIデザインを一から考えるのは中々手間がかかるもの。今回ご紹介するのはそんなデザイナーの方におすすめしたい、最新のUIデザインキット「25 Fresh Free HTML UI Kits」です。
GitHub – ElemeFE/element: A Vue.js 2.0 UI Toolkit for Web
CSSやHTMLの知識が必要にはなりますが、使いやすく多彩なシーンで活躍できるUIデザインキット25種類が紹介されています。さらにその中から幾つかおすすめのUIキットをピックアップしてみましたのでご覧ください。
詳しくは以下
(さらに…)
ECサイトのデザインや会員向けページなど何かと必要となる機会の多いログインぺージ。求められる要素の少なさから、いつも似たり寄ったりのデザインになってしまうと言う方も多いのでは。今回ご紹介するのはそんなログインページのデザインの参考にもなる、オープンソースなログインページのフォーマットをまとめた「10 Open Source Login Pages Built With HTML5 & CSS」です。
10 Open Source Login Pages Built With HTML5 & CSS
フラットデザインからビジネス向けな印象のものまで、様々なログインフォームが10種類紹介されています。さらにその中から幾つか気になったものをピックアップしましたので、ご覧ください。
詳しくは以下
(さらに…)
写真やデザインなど、作品や仕事をオンラインで紹介する上で欠かせないのが、ポートフォリオサイト。今回ご紹介するのは、そんなポートフォリオサイト作りを手助けしてくれるフリーのウェブサイトテンプレート「25 Free HTML Website Templates For Zero-Cost Websites」です。
Apollo: One page HTML template for photographers – Freebiesbug
使いやすくクオリティの高いフリーのウェブサイトテンプレートが25種類まとめられています。中でも気になったテンプレートを幾つかピックアップしてみましたのでご覧ください。
詳しくは以下
最早Webデザインに欠かせない存在となってきたアニメーション。デザインに動きをつけることで、より見やすく魅力的なサイトへとクオリティアップすることも可能な魅力的なツールです。今回はそんなWebアニメーションからフローティングアクションボタンのみをまとめた「Floating Action Buttons: 20 Free Animations for Web Developers」をご紹介します。
Floating Action Buttons: 20 Free Animations for Web Developers
検索窓から何かと利用シーンの多いプラスボタンのアニメーションまで、全部で20種類ものアニメーションが集められています。その中から数点ピックアップしてご紹介しますのでご覧下さい。
詳しくは以下
(さらに…)
プログラムを組むと一言で言っても、内容は幅広く、多くの知識と技術が必要不可欠です。そんな中今回紹介するのは、時間短縮できる無料のツールをまとめた「Best of 2016: 100 Free HTML/CSS Themes」です。
できるだけ短時間でウェブサイト制作が必要とされる場合や、手順のかかるプログラムを素早くこなしたい時に役立つツールが、数多く紹介されていますのでご覧ください。
詳しくは以下
デザイナーが自分の価値や力量を知ってもらうために必要不可欠なのが作品をまとめたポートフォリオ。昨今では紙のポートフォリオだけでは無く、WEBでのポートフォリオが必要なケースも増えてきているように感じます。今日紹介するのはシンプルで洗練されたポートフォリオサイトテンプレート「Magnet Portfolio Template」です。
このポートフォリオサイトテンプレート「Magnet Portfolio Template」色彩も写真以外は白と黒でまとめられており、作品自体が映えるデザインになっています。その他のページ構成は以下からご覧ください。
詳しくは以下
WEBデザインの演出として、便利なのが、背景素材。背景素材を効果的に使うことでサイトの世界観が生み出せます。今日紹介するのはそんなWEBで使う背景を簡単にしかも細かいところまでこだわって生成できる背景画像ジェネレーター「Tiled backgrounds designer」です。
色や、背景のパターンはもちろんのこと、画像の素材感や背景パターンの角度まで選択することができます。自分自身でphotoshopなどで作らずとも、かなりこだわって背景画像を作ることができるかと思います。
詳しくは以下
利用頻度の高い定番のアイコンはたくさん所持していても、個性のあるテーマによって選ぶことが必要なアイコンはなかなか揃っていないことが多いのではないでしょうか？そんな時に参考にしたい、8カテゴリ・280個展開されたフリーラインアイコンセット「Free Download : 8 Line Icon Sets」を紹介したいと思います。
8つのテーマで多数のアイコンがダウンロードできるようになっているので、持っているといざという時に非常に役立ってくれそうです。
詳しくは以下
アイコンにもさまざまなテイストがあると思いますが、リアルで質感のあるタイプはアイコンとしてだけでなく、グラフィックビジュアルの一部として利用できることも。今回はそんなシーンで活用できる、ハイクオリティなpsdフォーマットのフリーアイコンセット集「15 Fresh & High Quality Free Icon Sets In PSD Format」を紹介したいと思います。
Digital camera icon (PSD) | PSDGraphics
まるで本物のような質感のアイコンが、厳選された数ではありますが、ピックアップされ紹介されています。気になったものを以下よりご覧ください。
詳しくは以下
webサイトでよく使用するアイコン。シンプルなものから手の込んだものまで様々なテイストが存在しています。そんな中今回は、キッチングッズに焦点を当てたポップなカラーが可愛らしいキッチンアイコンセット「50 Kitchen Icons」を紹介したいと思います。
生活する中で目にすることの多いキッチンアイテムが50種類のアイコンになったセットです。
詳しくは以下
プライベート、仕事に関わらず圧縮ファイルに接する回数はものすごい多いかと思います。ファイルのやり取りにはもはや欠かせなくなってきています。圧縮ファイルにも様々な物が存在していてソフトも多岐に渡ります。自宅のPCや職場のPCならある程度環境が整っている方が多いかと思いますが、出先ともなるとそうはいきません。
わざわざ圧縮解凍のソフトをインストールして使わなければ行けない自体もたまにではありますがあります。そんな面倒な自体を回避する為のWEBサービスが今回紹介する「Wobzip」です。
こちらのWEBサービスはオンライン上で簡単に圧縮解凍ができ、解凍したファイルはダウンロードしてローカルに移すという方法をとっています。対応している圧縮ファイルは7z, ZIP, Z, CPIO, RPM, DEB, LZH, SPLIT, CHM, ISOとかなり豊富です。ちなみに容量制限は100MBとなっています。
via コリス
WEBだけに留まらず、イメージを伝える為に必要不可欠な写真。的確に利用すれば伝えたい事はより伝わり、全体のイメージも形作れたりします。今日紹介するのは3000枚以上の写真素材をダウンロードできる国内フリー写真素材配布サイト「Futta.NET」です。
風景写真がメインで、外国と日本、観光名所と街中の風景、自然風景、洋風・和風等の高解像度画像が公開されていて、その他にも世界遺産都市、スイス・ドイツ、東京・沖縄、犬・猫・鳥・猿、ビーチ・バー、桜・梅、虹のある景色など特徴的な素材もあり、様々なフリー写真素材がカテゴリに分けられて収録されています。
詳しくは以下
人々の生活シーンを、デザイン制作の中で再現することは多いと思います。そんな中今回は、生活のさまざまなシーンを想像させるベクターシルエット素材をまとめた「30 Sets of Free Vector People Silhouettes For Your Next Design Project」を紹介したいと思います。
大人から子どもまで、デザイン制作に使いやすいベクター素材が多数紹介されています。中でも気になったものをいくつかピックアップしましたので、下記よりご覧ください。
詳しくは以下
手軽にデザインの表現力を高めてくれるテクスチャは、デザイン制作の際に非常に便利に活用できますが、定番のレパートリーだけでなく、常に新しい素材との出会いを求めていきたいもの。そこで今回紹介するのが、比較的最近発表されたデザイン制作に使いやすいテクスチャをまとめた「A Selection Of Various Useful New Textures – 40 Examples」です。
stock.xchng – paper rainbow 2 (stock photo by GiniMiniGi)
自然の織り成す美しい風景から、可愛らしさを感じられる素材まで、さまざまなテクスチャが紹介されています。中でも気になったものをいくつかピックアップしましたので、下記よりご覧ください。
詳しくは以下
スマートフォンやタブレット端末の普及とともに、様々な機能の実装も可能になってきました。そんな中今回紹介するのは、複数のモバイルデバイスを飛び越えて連結できるjavascript「What if all your mobile devices formed a single screen?」です。
今までにない新しいモバイル体験でユーザーを楽しませてくれそうです。デモムービーが公開されておりますのでご覧ください。
動画は以下より
あまり使用する頻度は高くありませんが、あるといざという時に便利な天気アイコン。たくさんの種類がフリーで配布されており、今回はその中でもシンプルなデザインに合う天気フリーアイコンを集めた「20 Free Weather Icon Sets with Minimal Designs」を紹介したいと思います。
24 Weather Icons – Freebie by Carl Robin Kylander ✦ – Dribbble
ミニマルテイストなものを中心に、さまざまなバリエーションを揃えたアイコンセットがピックアップされています。
詳しくは以下
