Web Design Facts

WEBデザインに関する内容(フォントやベクター画像、フォトショアクション、モックアップなど)をまとめています。

Web Design Facts

Web Design Facts

参考サイト

iPad&タブレット版Procreateで簡単にカラーパレットを作成する方法

適切なカラーを自分で作るのは中々大変。特にiPad版のプロクリエイトだと自分で色を選択してカラーパレットを選択するという方法が一般的。そこで本日は、Procreateで簡単に色合いと組み合わせが良いカラーパレットを作る方法をご紹介します。 Procreateで簡…

【UIデザイナー必見】動きが面白い!目を引くこと間違いなしのCSSアニメーション集part2

昨日紹介した以下の続編です。 個人的にはスターウォーズのトグルアイコンが、小ネタが入っていて面白いなと思いました。遊び心のあるデザインって面白いですよね。前回に引き続き今回も面白いアニメーションが盛りだくさんです。ぜひ気に入ったアニメーショ…

【UIデザイナー必見】動きが面白い!目を引くこと間違いなしのCSSアニメーション集part1

最近のデザインは動作が軽いアニメーションをいれているものが多いですよね。やはり目を引くという事で、アニメーションは重要な要素の1つになってきているのかもしれません。そこで本日はCSSとJSのコピペで簡単に導入出来る、動きが面白いかつ実用的なCSSア…

CSSだけでここまで出来る!?タイトルや見出しにオススメなぬるぬる動く最新のCSSテキストエフェクト19選

先日はCSSとJSで動くロゴをご紹介させていただきました。 今回はなんとCSSだけでぬるぬる動くアニメーション、テキストエフェクトをご紹介します。純粋にスゴイ!サイトのタイトルや見出しに使えば目立つこと間違いなし。とてもオシャレでイケてるので、ぜひ…

カッコ良すぎる!CSSとJavaScriptで作られた真似してみたいアニメーションロゴ10選

最近良く見るようになったアニメーションロゴ。コーポレートサイトやポートフォリオのTOPなどでよく使用されています。そこで本日は最新のカッコいいアニメーションロゴをご紹介!日本で有名な”あの”ロゴもあります!参考になるかつ、格好良いので良いインス…

コピペで簡単!サイト制作のアクセントになるパーティクル(粒子・分子)エフェクト・アニメーション14選!【CSS/JS】

今回はWEBサイトのアクセントになるようなパーティクル(粒子・分子)エフェクト・アニメーションをご紹介します。クリックで玉が弾けたり、動いたり、ドラッグで粒子を操作できたり面白いものが盛りだくさん。使い所が意外に多そうなのでぜひチェックしてみて…

ビジネス用サイト、ポートフォリオ、その他何にでも応用可能なPSDのWEBサイトテンプレート16選【Photoshop】

PSDのウェブサイトテンプレートを使用すると、サイト制作をする際に参考にもなりますし、そのままベースだけを利用するなどし、大幅に時間短縮が可能です。そこで本日は無料で使えるかつ、見た目がかなり美しい無料で使えるPSDのWEBサイトテンプレートをご紹…

【Sketch無料リソースの2018年決定版!】Sketch用UIキット、ワイヤーフレームキット55選【Sketchユーザーダウンロード必須!】

UIデザインといえば最近はSketch。ただやはりPhotoshopと比べて歴史が浅いため、オススメのリソースがまとまっている最適なサイトが少ないように感じます。そこで本日は、Sketchユーザー必見の無料で使用できるUIキット、ワイヤーフレームキットをご紹介しま…

2018年5月版【トレンド】世界中で流行りのWEBデザイン!AWWWARDSで2018年5月にエントリーされたオシャレなサイトをご紹介【インスピレーション】

先月もご紹介しましたが、今月も世界中の洗練されたデザインが集まるAWWWARDSで2018年5月にエントリーされた最新のトレンドデザインを組み込んだオシャレかつ、評価の良いWEBデザインサイトをご紹介いたします。 最新のトレンドを見てインスピレーションを湧…

デザイン制作時短術!デザインを制作する際に有用なツール14選【UI/ワイヤーフレーム/デザイン/コーディング】

紙媒体でもWEB媒体でも、デザイン制作をするのには時間がそれなりにかかりますよね。世間的に残業に対する認識が厳しくなってきたおかげで徹夜して働くという企業も減ってきたような体感ですが、まだまだデザイン業界では徹夜、泊まりなんて当たり前なんてい…

2018年に公開された無料Photoshop/Lightroomチュートリアル40選【映画のような効果も!?/モックアップ】

Photoshopのチュートリアルは良いものを作れるだけではなくPhotoshop自体の機能の使い方を学ぶことも出来、大変良いものです。特に最新のチュートリアルは最新の機能も駆使しているため、すごく勉強になります。 そこで本日は2018年に公開されたPhotoshopの…

デザイン制作時に役立つ!配色が簡単ワンクリックで決められるカラーパレットジェネレーターツール15選【パターン/組み合わせ/カラーコード】

デザインにおいて配色は全体の雰囲気が決まるので最も重要な要素。ただし、重要な要素だからこそ選定に時間を要しますし、最適な配色を見つけるのは簡単な作業ではないですよね。そこで本日はデザイナー必見の簡単ワンクリックで配色が決められるカラーパレ…

【無料&商用可】ロゴデザインの参考に!無料で使える100個以上のロゴテンプレート集【モックアップ/PSD/AI】

デザインは1から作るのが当たり前。ただ、他のデザインを見てインスパイアしたり、雰囲気を参考にしたり、色合いを真似てみたりなど、通常仕事をしているとそのような事があるかと思います。そこで本日はロゴ制作をする際にとても参考になる、無料かつ商用可…

【WEBデザインの参考に】ミニマリストに大人気!洗練されたシンプルで美しいHTML5ウェブサイトテンプレート10選【フラットデザイン/サンプル】

昨今、日本だけではなく世界中で要素を最小限に抑えた暮らしをする方が増えてきました。WEBサイトも例外ではなく、ミニマルなデザインが今求められています。そこで本日はHTML5を使用した、海外のミニマリストに大人気のシンプルで美しいウェブサイトのテン…

【完全保存2018年版】初心者必見!作業効率アップ!Photoshop/Lightroomアクション オススメTOPサイト7選 - 無料&有料【写真加工/方法/使い方】

このブログでも何度か紹介しているPhotoshopのアクション。作業効率が大幅にあがるので活用必須だと思いますが、いざ目当てのアクションを探そうとすると中々見つかりません。そんな時にオススメなのが今回紹介する7サイト。PhotoshopやLightroomのアクショ…

【sketchユーザー必見】仕事を大幅に効率化!オススメの最新Sketchプラグイン7選【WEBデザイナー/UIデザイナー】2018年版

数年前からPhotoshopからの乗り換えが増えたSketch。圧倒的な動作の軽さと、コーディングのしさすさから、Macを使用していてUIデザインを主としてやっている方はSketchへ移行された方が多いのではないでしょうか。そこで本日はそんなSketchユーザーの方にオ…

これが無料!?2018年に公開されたHTML&HTML5のWEBサイト無料テンプレート25選

今回は2018年に公開された(一部2017年も有り)HTML&HTML5で作成された"無料"のWEBサイトテンプレートを31つご紹介。サイトを手軽に作りたいと考えている方はもちろん、WEBデザイナーやコーダーの方も参考になる内容です。人が作ったサイトの中身を全部見られ…

【トレンド】イギリス発刊の世界的有名デザイン雑誌「net」3月号で紹介された今もっともホットなWEBデザインサイト6選

イギリスで発刊されている世界的に有名なデザイン雑誌「net」3月号で紹介された、最先端のWEBデザインサイトを本日はご紹介します。各所の挙動や、色使いはもちろん、構成やコンセプト、ユーザービリティ・アクセシビリティがとても参考になります。ぜひ最先…

【トレンド】世界中で流行りのWEBデザイン!AWWWARDSで2018年4月にエントリーされたオシャレなサイトをご紹介【インスピレーション】

WEBサイトのデザインも服などと同じで流行り廃りがありますよね。直近では以前の記事でもご紹介しましたが、グラデーションがブームになっており、色々なサイトで見ると思います。 そこで本日は世界中の洗練されたデザインが集まるAWWWARDSから、4月にエント…

PAGE TOP