タグ

photoshopに関するlastelのブックマーク (91)

  • PhotoshopからレイヤーのCSSをコピーする

    Photoshopのデザインからコーディングをするとき、CSSについては今までエクステンションのCSS3Psというのを使っていたのですが、 最近動かなくなったようなので代替をさがしたお話です。 今まで使っていたCSS3Ps レイヤーを選択して、エクステンションのCSS3Psのウィンドウを押すだけで、CSSを吐き出してくれていたのですがサイトが無くなったのか表示されなくなりました。 CSS3Ps いつもこれでCSSをコピーしていたので困りました。 既存の機能であったCSSをコピー それで他にCSSを吐き出してくれるエクステンションはないかと調べたのですが、既存の機能でありました。 Windows:レイヤーを右クリック→CSSをコピー 知らなかった! コピーすると以下のようにペーストできるようになります。 .角丸長方形_1 { border-radius: 5px; background-co

    PhotoshopからレイヤーのCSSをコピーする
  • これは便利!Photoshopでマンガの集中線を一発で写真に描く方法 [Comic Kit]

    古くからマンガの表現技法として使われてきた中心から放射状に伸びる集中線ですが、最近では写真の加工用途に使われることが多くなってきました。簡易的な専用のアプリなどもあるのですが、今回はPhotoshopの便利なアドオンを使って柔軟に高品質な集中線を描く方法をご紹介します! ライターの村上です。 ブログやウェブサイトで写真を活用される方は非常に多いと思います。最近は個性的な加工をして、色々なブログの中でも埋もれない写真や画像をを作られる方が非常に多くいらっしゃいます。 自分もPhotoshopを使って人目を惹く写真の加工ができないか色々と試行錯誤しました・・・ 何か変わった、そして分かりやすい加工はあるかどうかと考えた結果は 集中線でした!!! 漫画の表現で良く見られるある点から放射状に伸びる線の表現の事で上のタイトル画像に用いている効果です。 これ、Photoshopのアドオン(無料)を使う

    これは便利!Photoshopでマンガの集中線を一発で写真に描く方法 [Comic Kit]
  • Photoshopで複数の画像に同じ処理を一度で自動適用させる方法

    ブログの記事を書く際、写真を複数並べたい時があります。だいたいはその写真を少し補正したりリサイズしたいなと思うのですが、枚数が多くなるとかなりの手間です。 前にもこのやり方を調べた気がするのですが、すっかり忘れていたので覚えるために書いておこうと思います。 バッチ処理をする Photoshopにはバッチ処理という「ファイルを一括で処理してくれる機能」がついています。 これを使用すると、指定したファイル全部に同じ処理を実行してくれます。すべて同じ処理が実行されるので、これだけはもっと補正したいなどがあったら個別に開いて対応しましょう。 アクションの登録 まずはどのような処理をするかのアクションを登録します。今回したかった処理は以下の項目です。 リサイズ 自動レベル補正 自動コントラスト 彩度をあげる アンシャープマスク 書き出す 閉じる なので、こちらを普通にアクションを登録する要領で実行し

    Photoshopで複数の画像に同じ処理を一度で自動適用させる方法
  • スキャンした下絵や線画から1クリックで主線を抽出するPhotoshopのアクション -Lineart Separate

    個人でも商用でも無料で利用できる、下絵や線画から1クリックで主線を抽出するPhotoshopのアクションを紹介します。 数手間かかるのが、1クリックでできちゃうと楽ちんですね。 登録すると、こんな感じに。 ※最後のアクション「Layer 0」で、日語環境だとアクションが止まってしまいますが、単にレイヤーを非表示にするだけのアクションなので無視しても大丈夫です。変更する時は上にちらっと見えてるように「レイヤー0」にします。 というわけで知り合いの絵師さんに下絵をいただいたので、実際に使ってみました。

    スキャンした下絵や線画から1クリックで主線を抽出するPhotoshopのアクション -Lineart Separate
  • Photoshopのパスファインダーパネルを作りました(CS6/CC用) - saucer

    意外と知られていないですが、PhotoshopでもIllustratorのパスファインダーのように、複数のシェイプを組み合わせて新しいシェイプを作成する機能があります(CS6以降)。でも、メニューとオプションバーを使って2回の操作を行わねばならず、Illustratorのようにワンクリックで実行することはできません。そこで、これらの処理をスクリプトにまとめ、実行しやすいようにパネルにしました。CS6以降のみになりますが、興味があればぜひ使ってみてください。(2014.07.29更新) ダウンロードお使いのPhotoshopのバージョンに合わせたものを、以下よりダウンロードしてください。なお、CC以降では最新バージョンの使用をお勧めします。 最新バージョンCS6用(ver. 1.0.1): ダウンロード(ps_pathfinder_cs6.zipzip形式)CC用(ver. 1.0.1):

    Photoshopのパスファインダーパネルを作りました(CS6/CC用) - saucer
  • 新着記事

    『フォトショップ・ブイアイピー』の新着記事です。フォトショップやデザインをたのしむウェブサイト。2009年3月創刊以来、3800を超えるコンテンツを更新しています。フリーフォントなどの無料デザイン素材/配色やWeb制作といった最新トレンドも公開中。

    新着記事
    lastel
    lastel 2013/11/22
    便利そうなのがいろいろ
  • Photoshopで写真を手書きの鉛筆画風に加工する方法 | 株式会社LIG(リグ)|DX支援・システム開発・Web制作

    こんにちは、デザイナーの王です。絵を描くのが趣味です。 最近は絵を書く時間が全く持てなくて困っています……。 どうにか早く描けないものかと悩んだ末、表題の通り、「写真から絵を作ってしまおう」という結論に至ったわけです。 折角だし、絵が描けなくて困っている方たちにも役に立つテクニックなのではないかということで、やり方をさくっと説明してみたいと思います。 【こちらもおすすめ】 ☞ Photoshopで初めて写真加工をするときに知っておくべき基手順まとめ 素材写真を用意する 鉛筆画らしく見せるためには、まず写真を切り抜いておきましょう。 アウトラインを抽出 次に、以下のステップを踏んで、アウトラインの抽出を行います。 cmd + Jでレイヤーを複製します。 cmd + Iで反転させます。 Shift + Alt + D で 描画モードを「覆い焼き」にします。 「色相 ・ 彩度」の調整レイヤーを

    Photoshopで写真を手書きの鉛筆画風に加工する方法 | 株式会社LIG(リグ)|DX支援・システム開発・Web制作
  • デザイナーの仕事を驚くほどラクにするPhotoshopアクション厳選18種【全て無料】 | Find Job ! Startup

    画像加工や写真の修正、すべて手作業でやってませんか? Photoshopのアクション機能で自動化すればアッという間に終わります。今回はデザイナーの仕事を驚くほどラクにするアクションを18種、厳選してまとめました。 目次 単純作業をラクにするアクション(×4種) モックアップ作成をラクにするアクション(×6種) 写真加工をラクにするアクション(×6種) 写真の枠をラクに付けるアクション(×2種) 単純作業をラクにするアクション 1.Retina対応画像を生成する Retinize Itを使えば、iPhoneiPadに対応したRetina画像を自動生成できます。リサイズ〜名前変更の手間を一気に短縮しましょう。 Retinize It 2.リフレクションする 水面に反射したような効果が得られるリフレクションエフェクトが簡単に作れるアクションです。たったのワンクリックでAppleプロダクトの

  • Photoshopでmp4をひらいて、動画から綺麗なアニメーションGIFを作る | ナナメウエblog

    生きてます。ナナメウエのはっちです。 お仕事で、mp4の動画からサムネイル(アニメーションGIF)を生成したいんだけどという場面に遭遇しました。 色々調べたところ、Webアプリでもあるっぽいのですが、そのアプリを試したところ正常に動いておらず、ぐぬぬ…どうしようかな、と。 そういえば?Photoshopで動画編集ができるという噂を以前聞いたことがあったので調べてみました。 意外とまだ需要のあるアニメーションGIF。 お役に立てれば幸いです。 Photoshopでmp4動画を開く 使用しているのはPhotoshopCS5です。 どのバージョンから動画が取り込めるのかは知りません。だってわたしFireworks派だもの…! ファイルから「開く」でもいけます。今回はドラッグ&ドロップで。 タイムラインを表示 読み込みに少々時間がかかりますが気になるような時間でもありません。 とりこま

  • 新着記事

    『フォトショップ・ブイアイピー』の新着記事です。フォトショップやデザインをたのしむウェブサイト。2009年3月創刊以来、3800を超えるコンテンツを更新しています。フリーフォントなどの無料デザイン素材/配色やWeb制作といった最新トレンドも公開中。

    新着記事
  • cutandslice.me

    This domain may be for sale!

    cutandslice.me
  • PIXELAPSE and DROPBOX

    Five years ago, Min Ming and I had this notion that designers didn’t have access to the same types of structured collaboration tools that programmers had built for themselves with CVS, SVN and later git. Min Ming had worked as a designer at Google where he found that assets were internally organized in a single massive shared folder. Finding the latest version of a file was nearly impossible with

    lastel
    lastel 2012/10/25
    PSDバージョン管理
  • Photoshoopでの作業時間を短縮するのに役立つ10のテクニック

    10 Photoshop Quick Tips to Improve Your Workflow 下記は各ポイントを意訳したものです。 1. レイヤースタイル パネルでの操作 2. 空の選択範囲の変形 3. 斜めの画像を水平にする 4. 画像に磨りガラスのようなパネルを設置 5. キレイな切り抜きを素早く 6. 瞳のカラーを変更 7. 画質に影響を与えないで照明のエフェクト 8. 作業確認用の新規ウインドウ 9. 画像からカラースウォッチを作成 10. レイヤースタイルをレイヤーの一部に適用 1. レイヤースタイル パネルでの操作 レイヤーパレットの下の「fx」ボタンをクリックすると開くレイヤースタイル パネルで、レイヤースタイルのアクティブ時に直接微調整ができます。 操作可能なスタイルは、4つです。 ドロップシャドウ グラデーションオーバーレイ サテン パターンオーバーレイ 4つのスタイ

  • 【オリジナル制作】Photoshopでの作業を効率化できるいい感じのJSXスクリプト | 株式会社LIG(リグ)|DX支援・システム開発・Web制作

    こんにちは、デザイナーの王です。「とりあえずタイトルに興味を持ったけどいまいちピンとこなかった」という方もいるのではないでしょうか。 ずばり、Photoshopのスクリプト機能を利用して、表題の作業を自動的に処理させるということです。僕みたいな怠け者で楽をしたい人にはぴったり! 今回主に紹介したいのは自作のスクリプトで、Webに特化した作業を簡単にしてくれます。 ダウンロードはこちら(ダウンロードが開始されます): https://liginc.co.jp/demo/2012/09/PhotoshopScripts.zip スクリプトを使うには? まずはスクリプトの使い方について説明していきます。 スクリプトをダウンロードし解凍したら、拡張子が「jsx」のファイルが幾つか入っていると思います。それらを下記のフォルダにコピーし、PCを再起動させます。 Windows:PhotoshopPre

    【オリジナル制作】Photoshopでの作業を効率化できるいい感じのJSXスクリプト | 株式会社LIG(リグ)|DX支援・システム開発・Web制作
  • Photoshopレイヤーに他のPSDをリンクできて便利なプラグイン「CanLinkIt」:phpspot開発日誌

    CanLinkIt Photoshopレイヤーに他のPSDをリンク・共有できて便利なプラグイン「CanLinkIt」。 こちらのプラグインを使うとよく使うアイテムを別PSD化して再利用可能にできるみたい。 例えば、ボタンのよく使う画像があるとします。 別PSDファイルのボタンを読み込んで使えます。デザインを変更すると・・。 すべてのボタンに適用されます。標準でこういう機能がなかったのか、という感じになりますが便利ですね。 よく使うものはライブラリ化しておくと、一括して編集を反映できるのでUIライブラリとかを作る場合に便利かもしれませんね。 関連エントリ PhotoshopでデザインしたシェイプをCSS3に変換するプラグイン「CSS3Ps」

  • Juaraslot88: Situs Slot Gacor dan Judi Slot88 Online Indonesia

    Juaraslot88: Situs Slot Gacor dan Judi Slot88 Online Indonesia Situs Agen Judi Slot Online Terpercaya di Indonesia Juaraslot88 Selamat datang di Juaraslot88 yang merupakan situs agen judi slot online paling terpercaya di Indonesia, juga sebagai tempat bermain taruhan judi online yang aman dan murah hanya bisa anda temukan pada situs slot online terbaik Juaraslot88. Minimal deposit yang kami tetapk

    Juaraslot88: Situs Slot Gacor dan Judi Slot88 Online Indonesia
  • CSS Hat translates layer styles to CSS3 code

    Goodbyes aren't our thing, but exciting new tools are! 🙌 “Avocode” was sunset on October 1st, 2023 Here at Ceros, we're no good at goodbyes. But one thing we've always excelled at? Embracing new beginnings and creating awesome new solutions. That's why we're kicking off a new era of tools crafted just for you: This transition means we’ve bid a fond farewell to all products offered by the Avocode

    CSS Hat translates layer styles to CSS3 code
    lastel
    lastel 2012/05/18
    photoshopのレイヤー効果をCSS3のコードへ
  • リッチに見せるデザインテクニック。Appleのデザインのように美しい金属調の質感を表現する方法。 (フェンリル | デベロッパーズブログ)

    こんにちは、イメージ担当の長谷川です。 今回は Apple がデザインしている iCloud アイコンのような美しい金属調の質感を Fireworks で表現してみました。 アレンジ次第で水平のエッチングやブラスト加工のようなイメージも簡単に作ることができます。 ぜひ Web や UI デザインの参考にしていただければと思います。 1. ベースのテクスチャを設定する まずグラデーションの設定をします。 長方形ツールで作成するボタンなどのサイズより少し大きいサイズの四角を描き、グラデーションの塗りを円錐にします。 以下のように白とグレーを交互に設定します。右端と左端を同じ色にしないとグラデーションに線が出来てしまいますのでご注意ください。 ここでは濃いグレーを #666666、両端の薄いグレーを #999999 に設定しています。 次にノイズを適用量:10で追加します。これが同心円状のヘアラ

    リッチに見せるデザインテクニック。Appleのデザインのように美しい金属調の質感を表現する方法。 (フェンリル | デベロッパーズブログ)
  • 新着記事

    『フォトショップ・ブイアイピー』の新着記事です。フォトショップやデザインをたのしむウェブサイト。2009年3月創刊以来、3800を超えるコンテンツを更新しています。フリーフォントなどの無料デザイン素材/配色やWeb制作といった最新トレンドも公開中。

    新着記事
  • 新着記事

    『フォトショップ・ブイアイピー』の新着記事です。フォトショップやデザインをたのしむウェブサイト。2009年3月創刊以来、3800を超えるコンテンツを更新しています。フリーフォントなどの無料デザイン素材/配色やWeb制作といった最新トレンドも公開中。

    新着記事