CSSの作業をもっと楽に！無料で使える便利なWebツール40選
CSSを使って作業をいているときに活用したい、無料で使えるオンラインツールをまとめてご紹介します。これらのツールは、制作時間を節約、短縮できるだけでなく、CSSのちょっとややこしい問題の解決ツールを想定し作成されています。 CSSをベースとしたアニメーション、レスポンシブに対応したナビメニュー作成ツール、パイチャート作成、CSSの圧縮やユニークなサークル型メニューの作成などさまざまなツールが揃っています。制作に困ったときに読み返してみてはいかがでしょう。 超便利！確認しておきたい最新CSSツール、リソースガイド 2018年度 CSSの作業をもっと楽に！無料で使えるオンライン便利ツール40選 Flexbox Parent Attribute Visualizer CSS Flexbox のプロパティを実際に変更しながら確認できるインタクラティブな方法。 Keyframes.app CSSアニ
デザインの現場で役立つ、すごいフリーフォント素材60個まとめ 2018年5月度
毎月公開されたデザイン性の高いフリーフォントのみをピックアップし、まとめてご紹介しています。今回は、2018年5月度のフリーフォントまとめです。 ユーザーの要望に答えた日本語フォントから、太さの異なる豊富なウェイトを揃えた万能フォント、高級感たっぷりなセリフ書体、人気の高い筆記体やブラシフォント、レトロスタイルのビンテージフォントなど、デザインの現場で活躍する素材が揃います。商用利用の有無について一緒に記載しています、変更されている可能性もあるので、参照ページを確認するようにしましょう。 デザイナー要注目！すごいフリーフォント57個まとめ 2018年4月度 デザインの現場で役立つ、すごいフリーフォント素材まとめ コーポレート・ロゴ丸 よく目にする企業ロゴの文字イメージをフォント化した「コーポレート・ロゴ」フォントを、丸ゴシック化したフォントです。漢字や英数字も含まれている日本語フォントです
手描きスケッチ、水彩画、インクなどアーティスト気分の写真レタッチ無料PSアクション
Photoshopの便利な機能のひとつに、ボタンクリック操作ひとつでさまざまなデザインエフェクトを加えることができる、アクション素材があります。再生ボタンを押すだけで完成のお手軽ツールで、特に写真加工エフェクトに活用されるケースが多くあります。 今回は、まるで写真のようなリアルペイント・エフェクトや、鉛筆で手描きされたスケッチ・エフェクト、水に溶かした絵の具で描いた水彩画エフェクト、新聞に印刷された仕上がりのインク・エフェクトの4種類のアクション素材をセットにした4 Artistic Photo Effect Actionsが公開されていたので、今回はご紹介します。無料ダウンロードできるだけでなく、有料アイテムにも負けないハイクオリティーが自慢のアイテムです。 詳細は以下から。 アーティスト気分を味わう写真加工PS無料アクション 4 Artistic Photo Effect Action
オキテ破りの写真加工！フォトショップ無料アクション素材100個まとめ【保存版】
※ 2021年8月31日に新しい素材18種類を追加し、合計100個の無料Photoshopアクション素材となりました。 ※ 2020年1月6日に新しい素材18種類を追加し、合計92個の無料Photoshopアクション素材となります。 ※ 2019年3月6日に新しい素材16種類を追加し、合計74個の無料Photoshopアクション素材となります。 フォトショップのアクションは、デザインに自信がないというひとでも、ボタンひとつでプロ顔負けの圧倒的なデザインを作成できる便利ツールです。 そこで今回は、写真加工を手軽に楽しむことができる、無料Photoshopアクション素材100個を、カテゴリー別にまとめてご紹介します。 作業ペースを格段に上げる時短ツールとして、あらゆるスタイルの写真加工をだれでも簡単に作成できます。 すべて無料でダウンロードできるので、気に入ったアクション素材はぜひ試してみまし
商用可！長く愛用できる人気テクスチャ、パターンの限定素材集 The Comprehensive Texture and Patterns Collection
商用可！長く愛用できる人気テクスチャ、パターンの限定素材集 The Comprehensive Texture and Patterns Collection テクスチャやパターン素材は、どんなデザインプロジェクトでも役立つ万能アイテムです。だからこそ、いつでも使える高品質な素材を揃えておきたいもの。 今回ご紹介する期間限定の素材集「The Comprehensive Texture and Patterns Collection」は、世界のトップデザイナーがタッグを組み、高品質で実用的なパターンとテクスチャのみを厳選し、総額$2,450（およそ27万円）相当のデザイン素材がまとめて大量に収録されています。 ユーザーの要望に耳を傾け、他では取り扱いのない高品質アイテムばかりがピックアップされています。個人で利用できるだけでなく、クライアント案件などの利用にも対応した商用ライセンス付き。2週
Webデザイン見本に最適！実例で学ぶ最新トレンド、スタイル45個まとめ
さまざまな想いやメッセージ、コンセプトを伝えるウェブサイトは、クリエイティブなアイデアを表現するのに最適です。2018年のデザイントレンドを採用したり、最先端のウェブ技術を駆使したこれまでにない体験をお届けするサイト、レイアウトや配色の参考にしたいサイトなどさまざま。 この記事では、最近国内外で話題となった最新ウェブデザインをまとめてご紹介します。アイデア出しに困ったときなど、デザイン見本として活用することができます。ますます加速するウェブの世界をのぞいてみてはいかがでしょう。 2018年に流行しそうな、注目Webデザイントレンド20個を大予想 https://photoshopvip.net/106130 Webデザイン見本に最適！実例で学ぶ最新トレンド、スタイルまとめ Chobani カラフルな果物のイラストを利用することで、ブランドイメージをうまく伝え、魅力的な見た目を演出しています
パッケージデザイン世界一を決める！ペントアワード2016の素敵な受賞作品まとめ
世界的に優れたパッケージデザインを表彰するため、2007年から毎年実施されているペントアワード（英: Pentaward）。 設立者のひとり、ブリジット・エブラール (Brigitte Evrard)は、「パッケージデザインは、コスト削減と短期的な利益回収、各マーケットにおける法律をクリアするなど、とても要求が高く、訓練の難しい分野です。ペントアワードの目標は、大量消費される商品から、ラグジュアリーな高級アイテムまで、あらゆる市場から集めたパッケージデザインを表彰することです。」と述べています。 作品のクリエイティビティやクオリティに基づき、銅、銀、金、プラチナ、そしてその年もっともすぐれた作品に贈られる「ダイヤモンド」の各賞が授与されます。2016年は、54カ国から1,843のパッケージデザインがエントリーし、その授賞式が中国、上海で行われました。 今回は見事に受賞を勝ち取った、クリエイ
Webサイトを使いやすく！UIデザインのCSS小技テクニック21個まとめ（実例サンプルコード付）
素敵なインターフェースを心がけ、ユーザーエクスペリエンスを格段に改善することができる、UIデザインの重要ポイントを具体的なHTML/CSSのサンプル例と一緒にご紹介します。これらの各ポイントは、もともと@steveschogerがTwitterでツイートした内容となります。 1. アイコンはラベルよりも少しだけ明るくしよう。 文字ラベルの横にアイコンを配置するときは、少しだけ色を明るくしてみましょう。こうすることで、もっとも重要な情報（文字ラベル）をうまく強調することができます。 See the Pen Little UI Details : 小技テクニック01 by PhotoshopVIP (@vipcrew) on CodePen. 2. 明るい背景色では、白文字に少しだけ影を追加しよう。 背景色が明るく、白文字を利用するときは、文字に少しだけ素敵な影を加えることで、より読みやすくな
快適ウェブ！機能的なアニメーションを実現するたった4つの方法
ほんの10年ほど前までは、ユーザーインターフェースへのアニメーションの使用は、ポップアップやチカチカ点滅する広告バナーなどがほとんどでした。しかし、現在では大きく変わってきています。 インタラクションデザインとアニメーションの詳細は、ウェブサイトやアプリに根本的な違いをもたらします。この考え方は、以下でもはっきりと述べられています。 もはや静的なウェブサイトだけをデザインすることはありません。ユーザーがこれらの画面から実際にコンテンツを見る方法をデザインしていると言えます。 より良いデジタル製品をデザインするには、はじめからインタラクティブな性質をウェブサイトやアプリに取り入れる必要があります。今回は、効果的なUIアニメーションの活用方法について詳しくご紹介します。 Web新時代！心地よいアニメーションを実現する6つの基本テクニックまとめ Webサイトに機能的なアニメーションを加える、9個
現役デザイナーも注目！最近話題のウェブデザイン50個まとめ 2017年7月度
ウェブサイトの制作に追われるうちに、アイデアが枯れてしまったという経験はないでしょうか。目まぐるしく変化を続けるウェブデザインの世界では、新しいアイデアやトレンドをうまくサイトに盛り込むことも重要です。 ユーザーに新しいウェブ体験を提供することで、コンテンツをより魅力的に仕上げるだけでなく、伝えたいメッセージやコンセプトをうまく表現できるようになります。 今回は、最近話題になった新作ウェブデザイン50個をまとめて紹介します。配色えら�びやデザインが苦手な人でも参考にできる、最先端で実践的なテクニックを得意としたサイトを集めているので、今後のデザイン制作にも活躍してくれるでしょう。 クオリティーが凄い！最近話題になったウェブデザイン40個まとめ 2017年5月度 これでもう悩まない！2017年のデザイントレンド完全ガイド 現役デザイナーも注目！最近話題になったウェブデザイン50個まとめ Sp
デザインの腕が上がる、すごい新作フリーフォント50個まとめ 2017年6月度
見ているだけで楽しくなる、個性豊かな新作フリーフォントをまとめています。個人利用、商用利用の可否についても一緒に記載しているので、デザインの目的に合った書体をスムーズに見つけることができます。 豊富なウエイトが揃ったシンプルな万能フォントから、トレンドを意識した手書きブラシフォント、読みやすさにもこだわった筆記体など幅広いバラエティが用意されているので、今後のデザイン案件に活用してみてはいかがでしょう。 デザイナーが愛用したい！こだわりの新作フリーフォント60書体まとめ 2017年5月度 デザインの腕が上がる、すごい新作フリーフォントまとめ Wavehaus Sans Typeface 太さの異なる極細から太字まで6ウエイトが揃ったサンセリフ書体は、使い勝手のよい万能スタイル。 ※ 個人、商用利用可能 Chlakh 手書きされたレトロ系フリーフォントで、温かみのあるデザインに仕上げます。
大人ナチュラルな西海岸スタイル！無料の手書きイラスト、文字フォント素材集
ロサンジェルスやサンディエゴなどの西海岸スタイルから、ニューヨークのカフェにある黒板ボードのグラフィティまで、大人ナチュラルな無料のデザイン素材集です。 かっこいいからかわいい系まで、なかなか描けないヘタウマ、「絶妙な手書き感」を文字フォントからイラストまでまとめているので、実際にデザインをするときにも便利です。 デザイン案件でのフォントやイラストはもちろん、お店のインテリアやご家庭のインテリア、結婚式や誕生日おめでとうデザインまで、DIY要素満点な素材を楽しむことができます。インクの溜まりやチョークのかすれ具合など、手描きならではの持ち味をデザインアイデアに役立ててみましょう。 ナチュラル手書き系フォントまとめ 今回は、手描きタイポを手軽に楽しめるプレミアム素材 The Handlettered Fontbox に収録されている書体を参考に、商用利用＆無料ダウンロードできるフォントをまと
これでもう悩まない！2017年のデザイントレンド完全ガイド
2016年も毎年と同じように、デザインについて新しいことを学んできました。今回は、ウェブからグラフィックやロゴデザインまで、デザイン全般に関する2017年のトレンドを掘り下げてみていきましょう。 デザイントレンドはメディアやテクノロジー、ファッション業界、そして最近では「使いやすさ」を追求するユーザビリティーなどに影響を受けています。トレンドは徐々に細かく枝分かれし、いつの間にか同じように消えていきます。 基本的にデザイントレンドの寿命は1〜2年。2017年のデザインは、2016年のトレンドを引き継いだものとなり、雰囲気もここ数年よく利用され、親しまれているものと言えるでしょう。Google マテリアルデザインの影響力は今年も強く、対応にはいくつかの変更が必要になります。 Adobe が2017年デザイントレンドを発表！確認しておきたいポイントとは？ 2017年のWebデザインはどうなる？
捕獲シーンも完全再現！ポケモンGOの面白HTML/CSSスニペットまとめ
すでにアメリカなどを中心に、世界的大ブームとなっているポケモンGO が、ついに日本でも配信が開始されました。この人気はウェブデザインのアイデアとして、じわじわ影響を与えはじめているようです。 今回はコード共有サイト CodePen より、ポケモンGO をモチーフにしたHTMLスニペットをいくつかご紹介します。モンスターの捕獲シーンを再現したり、コミカルな動きをCSSアニメーションで表現したり、面白い作品が公開されていました。 詳細は以下から。 ポケモンGOをモチーフにした面白HTMLスニペットまとめ Pokemon Go – ZingTouch x Anime.js 軽量なアニメーションJSライブラリ Anime.js を利用し、モンスターの捕獲シーンを再現しています。サークルの大きさに合わせて、スワイプしてボールをタイミングよく投げることで、実際にキャッチすることもできます。 See t
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
テーマ、目的別に探す！合計2000個のフリーフォント素材まとめ完全版
ウェブ初心者も安心して作成できる、無料HTMLテンプレート素材24個まとめ - PhotoshopVIP
ウェブ初心者も安心して作成できる、無料HTMLテンプレート素材24個まとめ - PhotoshopVIP
新着記事
ウェブ初心者も安心して作成できる、無料HTMLテンプレート素材24個まとめ - PhotoshopVIP
新着記事
