もうシルエットの素材には困らない！人物や動物など600種類以上揃ったシルエットのベクター素材セット
個人でも商用でも無料で利用できる、600種類以上の人物・動物・乗り物をはじめスポーツやダンスなどのシルエットが揃ったベクター素材を紹介します。 素材はベクターのさまざまなフォーマットが揃ってます。 Free download: 600+ free vector silhouettes シルエットは多種多様なものがそれぞれにたくさん揃っています。 スポーツ 人物（ビジネス・女性・家族・恋人・子供など） ミュージック ダンス 動物 乗り物・交通機関 モーション 人や動物などの足跡 鍵 ダウンロードできる素材のフォーマットも豊富！ .ai .eps .svg .pdf ダウンロードは、下記ページの下の方からどうぞ。
これは楽しい！本格的なピクセルアートが簡単に描けるPhotoshopの無料ブラシ
ピクセルアートを描く時に使うラインやドットで構成されたさまざまなイラストのパーツ・エレメントが収録されたPhotoshopのブラシ素材を紹介します。 ピクセルアートならではのギザギザの斜めのラインをはじめ、L字、Y字、矩形、円形、四角柱、円柱、三角柱、マス目など、いろいろ揃っています。 NASC Photoshop Pixel Art Brush Set Photoshop Pixel Art Brushの使い方 Photoshop Pixel Art Brushのダウンロード Photoshop Pixel Art Brushの使い方 ブラシセットには、175種類のピクセルアートのパーツ・エレメントが揃っています。 その中の一部をご紹介、他にもさまざまなパーツやアルファベットなども揃っています。
Photoshopでベクトルスマートオブジェクトを扱うときのちょっとしたテクニック - saucer
Photoshopを使ってウェブページなどのデザインをするとき、Illustratorでアイコンを作り、Photoshopにベクトルスマートオブジェクトとして配置することが多いと思います。そんなとき便利に使える、ベクトルスマートオブジェクトについての小技をいくつかご紹介します。 モノクロのアイコンに色をつけるベクトルスマートオブジェクトとしてPhotoshopに配置したアイコン。元はIllustratorで作成しています。このアイコンの黒い部分に色をつけたいとき、ベクトルスマートオブジェクトをIllustratorで開いて、黒い部分の色を変更してから保存し直すというのが一般的な方法です。 でも、いちいちアプリを行き来するのが面倒だし、何より状態を確認しながら色を変えることができないのが不便。そんなときは、レイヤースタイルの“カラーオーバーレイ”を使ってみましょう。ベクトルスマートオブジェク
新作 iPhone 7 を完全再現した、Photoshop や Sketch 用デザインファイルまとめ
先週発表された Apple の新型 iPhone 7。ヘッドフォンジャックの廃止や防水防塵に対応したほか、任天堂からスーパーマリオのアプリが出るというサプライズも飛び出しました。その中でも、新色の光沢感たっぷりなジェット・ブラックへの人気が集まっているようです。 今回は、iPhone 7発表直後に公開された、Photoshop や Sketch でカスタマイズできるモックアップ用デザイン素材をまとめてご紹介します。ダウンロードしたファイルの Photoshop によるデザイン変更方法も簡単にまとめています、参考にどうぞ。 詳細は以下から。 モックアップ用PSDファイルの編集、カスタマイズ方法 今回紹介するPhotoshop 用モックアップのほとんどは、非破壊編集のできるスマートオブジェクト機能を利用することで、よりカスタマイズしやすくなります。まずは、ダウンロードしたモックアップ素材を P
【フォントの些事】第2回 Photoshopでの文字詰めとフォントのボディについて | 株式会社LIG(リグ)｜DX支援・システム開発・Web制作
どうも、デザイナー兼イラストレーターのもりたです。 前回の「【フォントの些事】第1回 インストールする前に確認したいフリーフォントの基礎知識」で次回予告したものがうまくまとめられなかったので、今回は第3回で予定していた、Photoshopのフォントと文字ウィンドウについて書きます！ 普段仕事でPhotoshopを使ってる人でも、文字ウィンドウはその数値が何を指しているのかよくわからないまま使っていることが多いんじゃないでしょうか。 特に文字詰めに使用する「カーニング」「トラッキング」「ツメオプションの設定」の違いがいまいちよくわからない。 例えば「ツメオプションの設定」の「100％」という数値は、文字のどこを基準に何が100％詰まるの？とか。「トラッキング」の数値って何を基準に100なの？ピクセルじゃないしな？とか。 正直に言っちゃえばWebでは文字詰めをそんなに細かく設定することがないの
【サンプルPSDデータ配布中！】デザイナーとフロントエンドにちょっと優しい「PSDルール」を考えてみた | 株式会社LIG(リグ)｜DX支援・システム開発・Web制作
【サンプルPSDデータ配布中！】デザイナーとフロントエンドにちょっと優しい「PSDルール」を考えてみた こんにちは、デザイナーのもりたです。 突然ですが皆さん、整理整頓は得意ですか？ 私の会社のPCのデスクトップはスクリーンショットだらけです。 よく整理整頓の第一歩はルールづくりだと言いますね。 リモコンはサイドテーブルに置く、雑誌はラックに入れる、シャツ類は一番上の引き出しに入れる……。でも、整理整頓ができる人にはきっとわからないけれど、自分に合わせたルールをつくるのが一番めんどくさいんですよ！ だからデザイナーの間でもPSD（Photoshop Document）のレイヤー整理がまちまちだったり、同じ人でさえ場合によって変わったりします。そこで、いちいち考えることすらめんどくさくなったので、社内共通のルールをつくってしまおうということになりました。 せっかくつくったので、今回はそれをご
Webデザイナーとフロントエンドが歩み寄るためのPhotoshop豆知識 | 株式会社LIG(リグ)｜DX支援・システム開発・Web制作
こんにちは、デザイナーのぺちこです。 以前、デザイナーもりたの、デザイナーとフロントエンドにちょっと優しい「PSDルール」を考えてみたという記事が公開されましたね！ こんな風に、最近LIGのデザイナー＆フロントエンド間では、いかにお互いの仕事をスムーズにするかという話題が増えています。 まだまだ模索中ではありますが、今回は、これを知っておけばお互いにとってハッピーなのでは？というPhotoshopの機能や工夫の豆知識をご紹介したいなと思います。 フロントエンドの方にぜひ知ってもらいたい！というのはもちろんですが、デザイナーの方もこれを読んで気遣いがチラ見えするPSDを作れるようになったら、明日から職場の空気が和やかになるかもしれませんね。 その気遣い、伝わってないかも。 デザイナーは普段Photoshopを使っていて自分の使いやすいようにプラグインを入れていたり、さまざまな機能を駆使してい
Photoshopで、任意のレイヤーを別ファイルの同一座標に複製する。｜会社辞めブログ
やぁみんな！ atomだよ！ 今日は、複数のPhotoshopファイルで作業をするときの、ちょっとしたコツを書いていくぞ。 Photoshop のファイルAからファイルBへ同一座標でレイヤーを複製 Photoshopでデザインデータを制作していると、あるファイル（A）から別のファイ（B）の同じ場所に、レイヤー（グループ）を持って行きたいときって、あるよね。 そんなときは、「レイヤー（グループ）を複製」メニューを使うといいんだ。 たとえば。。。 ヘッダー画像のデザイン作業ファイル（ex.header-design.psd）から ヘッダー以外の部分の決定稿ファイル（ex.base.psd）に、ヘッダー画像の決定稿を移したい。 レイヤー（グループ）を複製 そんなときは、両方のファイルを開いて、複製元（この場合はheader-design.psd）の移したいレイヤー（グループ）を右クリック。 「レ
FireworksデータをPhotoshopデータに変換する際にやるといいこと - Qiita
前置き(Fireworks Dis) AdobeがMacromediaを買収して早10年。AdobeがFireworksの開発を終了して早2年。IllustratorやPhotoshopにウェブデザイン関連の機能が実装されてきて、Fireworksで作業をするメリットが徐々に薄れてきた昨今ですが、未だにその人気は根強く、WEBデザイナーさんから送られてきたデザインデータが *.fw.png になってることがままあります。 正直、Fireworksはバギー過ぎてまともに動かないことが多々あるし、できることなら使いたくないし、いまだFireworksを使ってるひｔ（ｒｙ とはいえ、*.fw.png が送られてきてしまった以上は仕方がないし、おそらくFireworksのデータを送ってくる人はPhotoshopで起こし直すなんてことしない（できない）だろうから、スライス切って書き出すにしても、この
Photoshopで高品質なUIを作り込むチュートリアル
Photoshopを使ってスマートフォンアプリのUIをデザインするコツを学ぶ本連載。前回は、作例となる「お天気投稿アプリ」の主な要素を配置して、基本的な画面レイアウトを整えました。第3回では写真やアイコンを配置したり、質感を作り込んだりして、アプリのデザインを完成させます。 お天気投稿アプリのUIデザインチュートリアル ▼第2回 1.アプリの配色を考えよう 2.ドキュメントを新規作成する 3.基本的な要素をレイアウトする ▼第3回 4.レイヤー効果を使って質感のあるボタンを作る 5.Illustratorで作ったアイコンを配置する 6.写真を配置してデザインを調整する 7.SNS連携ボタンを配置する 4.レイヤー効果を使って質感のあるボタンを作る お天気アイコンのボタンを作ります。このアプリのキーとなる「お天気選択機能」を実行するためのボタンですので、ユーザーにアプリを印象づけるデザインに
フレームを使用した GIF アニメーション作成方法 （Photoshop CS5）
この文書では、Adobe Photoshop でフレームを利用してアニメーション GIF を作成する方法について説明します。 アニメーション GIF は、Web ブラウザで表示できる動画の一つです。アニメーション GIF では、複数の静止画をアニメーションのコマ （フレーム） のように順番に表示することで、画像が動いているように見せています。
Adobe MAX 2015で発表されたアドビが研究中の新技術〜 スニーク・ピークで発表された未来の11の技術 - ICS MEDIA
Adobe MAX 2015で発表されたアドビが研究中の新技術〜スニーク・ピークで発表された未来の11の技術 アメリカ・ロサンゼルスにて開催されているアドビシステムズ（以下、アドビ）のクリエイティブティ・カンファレンス「Adobe MAX 2015」。初日の基調講演（参考記事「[速報]Adobe MAX 2015 基調講演レポート」)に続いて、二日目は「スニーク・ピーク」というアドビが開発中の実験技術を紹介する講演が行われました。紹介された技術は将来的に搭載されるかもしれない技術であり、未来のAdobe Creative Cloudの新機能を一足先に知ることができます。現地に渡った弊社ICSの池田が速報レポートとしてお伝えします。 簡単な操作で新しいフォントを作り出せる技術：Project Faces フォントの骨格を解析し、字形を自由自在に調整し新しいフォントを作成できる技術。 ▲フォン
プロカメラマン仕様のPhotoshopのトーンカーブのまとめ -写真画像の自然光とカラーを美しく印象的に仕上げる
シドニーを拠点に活躍しているプロのファッションカメラマン: Julia Trotti氏のトーンカーブのコレクションが無料でダウンロードできるので、紹介します。 まずは、トーンカーブファイルの利用方法を。 ダウンロードとインストールは簡単です。 各ページの左「download」からファイルをダウンロードし解凍、拡張子「.acv」がトーンカーブファイルです。 Photoshopのアプリケーションフォルダ内の「Presets/Curves」内にトーンカーブファイルを移動。これで準備は完了です。 トーンカーブを利用するのも簡単です。 Photoshopで画像を開きます。 メニューバーから「レイヤー: 新規調整レイヤー: トーンカーブ」を選択します。 トーンカーブのパネルの「プリセット」からトーンカーブを選択します。 ※ファイルがプリセットに無い場合 トーンカーブのパネルの右上のアイコンをクリックし
Photoshopがもっと便利になるすごい機能拡張・プラグインのまとめ
Photoshopは標準機能だけでも便利なツールですが、もっともっと便利になる機能拡張やアクションを紹介します。 定番として入れておきたいものから、特別な使用シーンに使うものまで、優れ物ばかりです。 Photoshopでのガイド引きに欠かせない強力な機能拡張 定番のGuideGuideは3.1.2にバージョンアップ 幅の異なる複数のガイドを一気に作成できる優れ物 Photoshopのスウォッチをフォルダで管理 カラーピッカーを開かずにカラーのコードを簡単コピー 複数のさまざまなオブジェクトのカラーを一元管理 手元の画像からシームレスなテクスチャを1クリックで作成 ビットマップのオブジェクトをベクターに変換 画像にパースをつけてかっこよく見せる パラグラフのレイアウトを段組みに変更 要素のサイズやエフェクトやフォントなどの情報を書き出す エレメントやマージンのサイズを書き出してくれる 黄金比
Photoshopできれいに切り抜く!ふわっとした髪の毛の切り抜き方法
Photoshopで細い毛先やふわっとした髪の毛をきれいに切り抜く方法です。 今回は画像の切り抜きの中でも難しい、髪の毛の切り抜きです。Photoshopではさまざまな画像の切り抜き方法がありますが、今回使用する機能は、CS5以降の「境界線を調整」です。 CS5以下のバージョンの方も、最後に切り抜きの境界線を合成した背景となじませる方法もご紹介しているので、ぜひ参考にして下さい。 「クイック選択ツール」や「投げなわツール」などで切り抜きする対象物をざっくりと選択します。ふわっとした髪の毛の細い部分も、上図のようにざっくりとした選択で大丈夫です。 今回はshutterstockで購入した写真を使います。 （上記写真はshutterstockで購入した写真です。こちらの写真を使用する際は必ず同サイトで購入し使用して下さい。） 選択した状態で、オプションバーの「境界線を調整」をクリック、ダイアロ
ガイドラインや指示書の作成が楽になる！エレメントやマージンのサイズを書き出してくれるPhotoshopのスクリプト -Size Marks | コリス
エレメントやマージンなど、指定した箇所のサイズを新規レイヤーに書き出すPhotoshopのスクリプトを紹介します。 個人でも商用でも無料で利用でき、ライセンスはMIT licenceです。 Size Marksを使ってるアニメーション（偶然両方とも173pxになってびっくり！） 以前紹介したInkも同様にサイズを書き出してくれますが、ベクターとテキストのデータのみです。エレメントがベクターならInk、ビットマップのエレメントやマージンならSize Marksが便利です。 Inkの特集記事：Photoshopの機能拡張 -Ink Size Marksのインストール Size MarksはPhotoshopのスクリプトで、当方の以下の日本語環境で動作しました。 Photoshop CC 2014 for OS X Photoshop CS 6 for Win7 ※配布ページにはCC 2014
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
The Blog | Welcome to Adobe Blog
http://www.yomogi.sakura.ne.jp/~ronz/trash/text/gif_ani.html
ウェブ初心者も安心して作成できる、無料HTMLテンプレート素材24個まとめ - PhotoshopVIP
ウェブ初心者も安心して作成できる、無料HTMLテンプレート素材24個まとめ - PhotoshopVIP
