グラデーションマスクを線状、円状にかける方法の紹介です。Photoshopでは基本的な操作なのですが、自分が忘れがちなのでメモ。 線状（一方向） 線状（二方向） 円状（背景が柄の場合） 円状（背景が無地の場合） マスクを線状（一方向）にかける 1. 選択範囲からレイヤーマスクを作成 選択範囲を作成後、「マスクの追加」ボタンをクリックしてレイヤーマスクをかけます。 2. グラデーションをかける 「グラデーションツール」を選択し、グラデーションを「黒、白」にして、「線形グラデーション」を選びます。マスク部分をクリック後、「Ctrl」+「クリック」で選択範囲を作成します。 マスクをかけたい方向にカンバス上をドラッグします。 マスクを線状（二方向）にかける 1. レイヤーをフォルダに入れる 上記1、2の手順を行ったあと、そのレイヤーを「Ctrl」＋「G」でフォルダに入れます。 2. フォルダにレイ
フォトショップで入れておきたい無料ブラシ素材95個まとめ 2024年版 デザインの幅がグッと広がる、高品質アイテムのみ集めました。 フォトショップの素材の中でも、高品質なブラシは使いやすい万能アイテム。 あらゆるスタイルを表現できますが、どれを使ったら良いか迷ってしまうというひとも多いでしょう。 いつの間にか同じブラシばかりを使っていた、なんて経験もあるかもしれません。 この記事では、フォトショップでまず入れておきたい無料ブラシ素材90個をまとめてご紹介します。 ダウンロードしたブラシ素材のインストール方法や、新しくなったCreative Cloudライブラリを活用した、ブラシの整理、保存テクニックも参考にしてみましょう。 これから紹介するブラシを利用するには、Adobe Photoshopが必要となります。 ここ最近のAIをつかったフォトショップの新機能は、「過去10年でもっとも革新的な
Adobeツールの乗り換えを検討し始めたけど、 「どこで見つければいいの？」「どんなツールを選べば後悔しない？」「代替ツールのいいところって何だろう？」「乗り換えのタイミング今なのか？」「費用の違いはどのくらい？」 普段から利用するツールだからこそ、自分にとって最適なデザインツールを知りたい方向けのリストとなっています。 Adobe Creative Cloudソフトから乗り換えたいと考えているひとへ どんな代替ツールがあるか知りたいひと いろいろツールを見たけどピンとこないひと 自分にあったツールが知りたいひと 代替ツールへの乗り換えで失敗したくないひと
米Adobeは9月28日、β版として提供していた「Adobe Photoshop Web」の正式版をリリースした。インストール不要でブラウザからPhotoshopの機能にアクセスでき、同社の生成AI「Firefly」などの機能も利用可能。無料版はないものの、Photoshopを含む全てのCreative Cloudプランで使えるとしている。 Web版はインストールなしに、ブラウザ上でPhotoshopの機能が利用できるもので、ファイルの作成や編集だけでなく、デスクトップ版に移動しての作業もスムーズに行うことができる。デスクトップ版と機能は同一ではないものの、β版のリリース以降、よく使われる機能の大半をWeb版に搭載したとしている。 また、データの共有先がPhotoshopユーザーではない場合でも、共有時に生成したリンクからWeb版Photoshopを立ち上げることができ、ファイルの表示とコ
ホームページやブログ、ショッピングサイトなどで使われているボタン。 ユーザーに分かりやすく直感的にクリックしてもらうためには、ボタンのデザインにも気を配りたいところです。 今回はそんなボタンデザインの中でも、フォトショップで加工、編集することができるPSDファイルを42個まとめた「Ultimate Collections of Free Buttons in PSD Formats」をご紹介します。 紹介しているファイルはすべて無料でダウンロードすることが可能となっているのですが、「これが無料？」と思うほど高品質なデザインが揃っています。 オリジナルでデザインすることもできますが、これらのファイルを使うことでデザイン制作の時間を大幅に短縮することができとても便利ですよ。 それぞれのボタンは細かくレイヤーに分けてデザインされているので、色の変更なども簡単に行うことができます。 またステッカー
Webデザイナー、UI/UXデザイナーの@sdesignlaboです。 スマホゲームのUI（ユーザーインターフェース）をPhotoshop(フォトショップ)で作る方法について詳しく解説します。 ゲーム会社に応募する際、オリジナルキャラを使ったスマホゲームのUI（ユーザーインターフェース）をポートフォリオに載せておくと、イラスト単体を載せるより採用担当者の目に留まる可能性が高まります。 フォトショ初心者の方にも分かりやすいよう、順を追ってゲームUIの作り方を解説いたします。 ゲーム業界への就職を考えられている学生の方にオススメのコンテンツです。 「ぼくのかんがえたスマホゲーム」のマイページ画面を作ってみましょう！
Photoshopなどのデザインソフトにある「乗算」「スクリーン」「焼き込みカラー」「覆い焼きカラー」など、各描画モードがどのように機能するかを解説します。 それぞれの違いがよく分からない、どんな効果があるのか分からないという人に、これを読めば描画モードでどれを使うか迷うことはなくなります。 Blending Modes by Dan Hollick (@DanHollick) 下記は各ポイントを意訳したものです。 ※当ブログでの翻訳記事は、元サイト様にライセンスを得て翻訳しています。 はじめに 描画（ブレンディング）モードとは 各描画（ブレンディング）モードについて解説 はじめに 見た目が思い通りになるまで、描画モードをいろいろ試していませんか？ 描画モードの種類 この記事を読んでもあまり変わらないかもしれませんが、少なくとも「比較（明）」や「比較（暗）」を使用することはなくなるでしょう
セピア色写真の作り方フォトショップCC セピア色写真の作り方を説明します。 イカ墨を原料にした絵具を英語でセピア（sepia）といいます。イカ墨の絵具は光の影響で淡い褐色に変化することから、セピア色＝薄い褐色となります。 古いモノクロ写真が色あせると褐色になることから、ノスタルジックな雰囲気を与えたいときにセピア色を使用します。 それではフォトショップでカラー写真をセピア色に変更してみましょう。 フォトショップで写真を開きます。 メニューバーの「イメージ」→「色調補正」→「白黒」を選択します。 「白黒」ダイアログボックスが表示されるので、「着色」にチェックを入れます。 「色相」と「彩度」のスライダーを動かし調整するとセピア色に変わります。 フォトショップでセピア色を作るにはいくつか方法があるので、もうひとつ紹介します。 メニューバーの「イメージ」→「色調補正」→「色相・彩度」を選択します。
（2019.02.23に書いたブリコルールのブログ記事の引越しです） 写真をイラストっぽく使いたいなどの局面はいろいろありまして、備忘録も兼ねて。 会社の近所で撮影した写真をこんな感じでイラスト風にして、弊社のキャラクターと合わせてみました。まあまあアニメのワンシーンのようにも見えなくもない？？ 最近だと、アプリで簡単に写真をイラスト風に変換できるものもありますが、photoshopを使います。 ベースとなるレイヤーを作成・調整する もとの写真はこちらです。 なんの変哲もない、何年か前に撮ってフォルダの奥底で眠っていた写真ですが、空を抜きやすい写真を選ぶとよいです。 【イメージ】＞【色調補正】＞【HDRトーン…】を選択します。 他のサイトなどでもHDRトーンを使って紹介しているところは多いです。私もこれを使います。HDRトーンの正しい使い方は正直なところ自分はわかっていません…。調整がまと
当サイトでは、Photoshopの新しい機能テクニックをつかった最新チュートリアル、作り方を定期的にまとめて紹介しています。 この記事では、2020年のあいだに公開された、特に確認しておきたいPhotoshopのデザインチュートリアル、つくり方をまとめてご紹介します。 これまで以上に便利になった新しくアップデートされたPhotoshop 2021の新機能はもちろん、ボタンひとつで完成のお手軽写真やアクション、合成テクニックなど、デザイナーが覚えておくと便利な人気のデザインスタイルのつくり方がずらり揃います。 これからPhotoshopを始めてみよう、というひとにもぴったりなテクニックを揃えています。年末の連休をつかって、新しいテクニックを習得してみてはいかがでしょう。 2020年公開のIllustratorチュートリアル、つくり方も以下の記事でまとめています。 【総まとめ】2020年公開の
"Sympli has significantly improved our coordination around designs, enabling designers, product managers and engineers to work together much more seamlessly. It allows our engineers to build confidently to specifications, and allows our design team to easily share out their vision. It’s a vital part of our product development workflow!" Tom Wilson Principal Engineer
素敵な女の子を描きたい方必見！ 注目の書籍『美少女作画』から、表情が魅力的な女の子のイラストを得意とするフライさんによる厚塗りメイキングを抜粋して紹介します。プロの技を参考に、魅力的な女の子のイラストを描いてみませんか？ ▲完成イラスト フライさんは、線画はCLIP STUDIO PAINT、色塗りはPhotoshopで完全に使い分けをしています。 複数のソフトを使い分けた描き方も参考にしてみましょう！ 線画で大ラフを描く CLIP STUDIO PAINT PRO で大ラフを作成します。 （1）大ラフで表情を固める 表情がしっくりくるまで消して描くを繰り返します。 （2）大ラフをもとに線画を描く 大ラフで描いた線をもとにディテールを詰め、線画にします。 カラーラフでイメージを固め線画を完成させる Photoshop でカラーラフを作成し、絵のイメージを固めます。 ラフの段階である程度絵の
最終更新日: 2022年10月3日 Photoshopで画像から人や物などのオブジェクトを除去する方法は、デザイン制作において重要なテクニックです。しかし、用途に応じてツールを使い分け、除去レタッチ作業を行っているというひとは、どれだけいるでしょう。 今回は、Photoshopの各種ツールを駆使した除去、消去テクニックと、いつその技を使うのがベストなのか、各サンプルと一緒にまとめてご紹介します。これらの方法を実践することで、写真に写り込んでしまった不要なモノを、2〜3分の短時間で、スピーディーに除去することができるので、フォトショップ初心者のひとにもオススメです。
スライス名を変更せずにスライス名のあとに「_on」とかつけたい時のメモです。 Fireworksだと割と簡単にできることですが、photoshopでボタン画像などを書きだす際に、 スライス名を手動で変更せずに「（スライス名）_on」みたいにリネームしながら画像を書き出したいな～と思っていたのですが・・・。 やっぱできたんですね。でも案外知らない人も多いようなので（自分も含め）メモしておきます。 「Web用に保存」を押したときに出てくるダイアログのここ↓ ここをポチっと押すと出てくる「出力設定の編集」で書き出しのルールを決めることができます。 例えば、「スライス名_on」というルールで書き出したい場合は、以下のように設定 これでいちいちスライス名に_onをつけなくてもリネームしながら画像保存できます。 他にもスライス名や日付など、命名規則は細かく設定できるので、連番なんかもさくっと作れるので
今回は、Photoshopの便利機能についてご紹介します。 使い始めの方は覚えておくと何か素敵なことがあるかもないかも。 「超カンタン!!オブジェクトを一瞬でスライスする方法」 1. スライスしたいオブジェクトを選択 （それぞれ1個ずつのスライスになってしまいますが；）複数選択可。 2. メニューから、レイヤー＞レイヤーに基づく新規スライス じゃん。 以上!!ではなく、 いちいちメニュー開くのもかったるいし全然一瞬じゃないですよねー なので、ショートカットを登録しておきます。 「オリジナルショートカットを登録する」 1. メニューから、編集＞キーボードショートカット 2. レイヤーグループの中にレイヤーに基づく新規スライスのコマンドがあるので、そこに好きなショートカットを登録 ショートカットキーを実際に押せば、登録できます。 んで、他のキーと被っている場合は注意書きが出るので、他の候補を試
Pixel Dropr 簡単に機能を説明すると、アイコンやパーツなどよく使うエレメントをリフィルと呼ばれるセットにし、Photoshopでどのドキュメントを開いても呼び出せるプラグインです。 上記のサイトでは動画も公開されています。 インストールしてみた！ Pixel Droprは有償のプラグインで、無料版のRefill Readerもあります。二つの違いは、オリジナルのリフィルを作成できるかできないかです。 上記はとりあえず無料版のRefill Readerです。 無料版のRefill Readerは配布されているリフィルを利用することができます。 リフィル配布サイト 配布サイトへはRefill Readerのパネルの左から2番目のボタン「load Refill」をクリックすると行くことができます。 プラグインのインストール Refill Readerのインストール方法を紹介します。 お
これはPhotoshopの標準機能として、ぜひ実装してほしいですね。 外部ファイルをリンクさせ、スマートオブジェクトとして配置できるPhotoshopのエクステンションを紹介します。 Linked Smart Objects in Photoshop [ad#ad-2] Linked Smart Objectsのインストール 下記ページの「LinksCS4.zip」をダウンロードします。 対応しているPhotoshopのバージョンはCS4, CS5です。 Smart Object links panel 解凍した「LinksCS4.mxp」をダブルクリックすると、Photoshopへのインストールがはじまります。 インストールが完了すると、メニューの[ウインドウ]-[エクステンション]に「Links」が表示されます。 Linked Smart Objectsの使い方 [ウインドウ]-[エク
Photoshopで複数ページのカンプデザインを展開するとき、ファイルは一括にするのか、それとも１ページごとに作成するのか、その際共通オブジェクトをどう扱うかといったデータ・ファイル管理についてまとめてみました。また、Photoshopでのウェブデザインの際に便利そうなツールや「やり方」も合わせて考えてみました。
PhotoshopでWebサイトのデザインをしよう「連載！実践で学ぶWebサイト制作ガイド」第四弾はAdobe Photoshopというツールを使って実寸のサイトデザインを作成します。Photoshopで説明していきますが、同様のグラフィックツールでもOK。Photoshopは体験版もあるのでぜひご利用ください。説明しやすいよう、簡単なデザインにしたつもりですが、すごく長くなってしまったような…。わかりにくくてすみません X( 実践で学ぶ Web サイト制作ガイド：その 4目標：実際の幅にあったサイトデザインが作れる・Photoshop の基本的なツールを使った装飾ができる必要なもの：Adobe Photoshop対象レベル：Photoshop の基本的なツールの使い方がわかる目次誰のため？何のため？Web サイトを作り始める前に。Web サイトの構成図を簡単に作れる便利ツールWeb サイ
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く