• ベストアンサー

photoshop6 角丸で切り抜きたい

先ほど、QNo.4093888にて http://www.69monos.com/nosotros.html のサイトにあるような「角丸二重枠画像の作り方を質問した者です。 いただいた回答をヒントに、どうにかそのような図形を作ることはできました。 レイヤー1:背景色と同色の塗りつぶし レイヤー2:別色の角丸(四方を1pxずつ小さく) レイヤー3:背景色と同色の角丸(さらに1pxずつ小さく) レイヤー4:別色の角丸(さらに1pxずつ小さく) さて次は、サイト右上の、画像が角丸に切り取られていて、その周りに二重の枠がある、と同じ状態を作りたいと思います。 素人考えですが、先ほど作った角丸二重枠のレイヤー4の角丸部分を切り抜いて、画像にちょうど額縁をかぶせるようにすれば、角丸の二重沸くが残るだろうと考えました。  そこで、いろいろと切り抜く方法を検索してのですが、わかりません。 ヒントだけでもいただければと思い、投稿します。 よろしくお願いします。

質問者が選んだベストアンサー

  • ベストアンサー
  • fineimage
  • ベストアンサー率34% (143/419)
回答No.3

ANo.1です。 ファイルメニューとはタイトルバー下の「ファイル」や「編集」などのメニューのあるバーの事です。 ANo.2様がふれてますが、Illustratorをお持ちでしたら圧倒的にIllustratorで作業した方が楽ですよ。 そして間違い失礼しました。 全選択の状態からだとできないので、必要な画像サイズより一回り大きめに作り、フチを付けたいところを選択してください。 後は選択範囲を滑らかにするのところから続けていただければ大丈夫だと思います。 もう一度おためしください。

tanreinama
質問者

お礼

イラレもそれほどいろいろ得意なわけではなく、逆に何から手をつけたらいいのかさらにわからない要素が多いので、photoshopで行ってみることにしました。 「選択範囲」や「反転」や「境界線」などのヒントをいただいて、教えていただいたとおりの方法ではありませんでしたが、どうにかできました! 自分はまだまだphotoshopを使いこなせていないのだなあと実感しました。ありがとうございました。

その他の回答 (3)

  • ddg67
  • ベストアンサー率22% (1211/5475)
回答No.4

新規レイヤー(レイヤー1)を作って 全てを選択 境界線を描く→内側1ピクセル、描画色はwebの背景色 レイヤー1の中を選択ツールで選択 選択範囲の変更→滑らかに3ピクセル 選択範囲→境界をぼかす、1ピクセル 選択範囲の反転をして、塗りつぶし 選択範囲の反転をもう一度してから 境界線を描く→外側1ピクセル、濃いグレー 境界線を描く→内側1ピクセル、黒 レイヤーを統合したら出来あがり。 切りぬきってのはしません、最初に必要なサイズの画像を用意してください イラストレーター使うほどでも無い作業だよん(^_^;

tanreinama
質問者

お礼

切り抜かなくても、反転という方法があったんですね! みなさんに教えていただいた方法そのままではないのですが、すでに作った画像のフチの部分を切り出すことができたので、思い通りの結果にたどり着きました。 ありがとうございました!

  • doorakanai
  • ベストアンサー率27% (758/2747)
回答No.2

先日の質問を見ていましたが このサイトと同じものを作るとしたら イラストの方が楽で早いんですが お持ちじゃないですかね?

tanreinama
質問者

お礼

イラストレーターで書く、ということですね? あ。そういう手もあるのか。 試してみます。 ありがとうございました!

  • fineimage
  • ベストアンサー率34% (143/419)
回答No.1

この右上のゴリラ(?)のぬいぐるみの画像の写真の処理ですか? まず指定した新規画像を作って背景色と同じ色で塗りつぶす。 新規レイヤーを作り、そこに画像を配置する。 次に全選択>ファイルメニュー>選択範囲>選択範囲の変更>滑らかに、で10pxくらいかな? 選択範囲を反転し、写真のレイヤーの角を消す。 選択範囲を反転し元に戻す。 新規レイヤーを作成し、適当なグレーで塗りつぶす。 選択範囲を縮小で1px縮小し、背景色と同じ色で塗りつぶす。 選択範囲を縮小で1px縮小し、削除し外の二重線だけを残す。 で、いいんじゃない? 確かこんなの一発でできるプラグインがあったと思うけどなぁ。 確かEYE CANDYだったかな? インナーベベルのフィルターで自由自在にこういうの作れてたと思う。

tanreinama
質問者

お礼

回答ありがとうございます! まず、「ファイルメニュー」というのがphotoshop6.0にはありません。 そこで、 全選択>選択範囲>選択範囲の変更>滑らかに を試みましたが、「境界線」は選択できますが、「滑らかに」「拡張」「縮小」が選択できません。一度「境界線」を選ぶと、そのあとは「滑らかに」が選べますが、当然境界線が入ってしまいます・・・。 QNo.4093888でも、回答を寄せてくれた方が「選択範囲を縮小」と言っていたのですが、縮小できないのですが、これはphotoshopのバージョンの問題でしょうか?

関連するQ&A

  • photoshopで2重の角丸

    http://www.69monos.com/index.html このサイトのように、二重の角丸枠で囲んだ画像を背景にしてサイトを作りたいと思っています。  二重枠の作り方もわからないのですが、二重枠の中に画像、というのがさらにわかりません。 どなたかやり方を教えていただけませんか? photoshopのバージョンは、残念ながら6です。

  • 角丸ボタン等のweb素材の透明部分について

    ボタンやら見出しやらに角丸使って、ボタンがつるつるしてるweb2.0風?のサイトって多いですよね? それらのボタンやdivの画像をフォトショで造る際、カンバスの形は矩形だから、角丸意外の背景は消去しないといけないですよね? でもjpgだと透明部分を持つことができないし、gifだとボタン等のグラデーション(鏡面反射みたいなつるつるしたやつ)がキレイにでませんよね? プロの皆さんはグラデーション等を使った角丸の素材を造る際、どうしてるんですか? Bodyの色と同じ色のレイヤーを重ねて画像を統合してからweb用に保存したり、 またはサイトの背景はだいたい白だからあんまり気にしないとかそういうことなんでしょうか? 初心者なものですいません。教えて下さい。

  • 角丸ボックスの色が合いません!!

    趣味でサイトを作っている初心者です。cssと画像を使って角丸ボックスを作っているのですが、うまくいきません・・どなたか助けてください! 上段と中段と下段を組み合わせて作りたいのですが、上段と下段(角丸の部分)はイラストレーターで画像を作り、中段は背景に色をつけて background:#99cc00 url(images/navbar.png); などとしてくっつけようとしてるのですが、どうしても、どーしても画像と背景色(#99cc00のこと)が合いません!もともと#99cc00にしたいのですが、これをイラレで画像を作るためにCMYKの値に直すと、全然違う色が出来てしまいます。CMYK⇔RGB間で完璧な変換ができないことは、なんとか調べて分かったのですが、ではみなさんはどの様に画像と背景色を合わせているのでしょうか・・・どうか教えてください!

  • ヘッダー部分:画像の繰り返し、なおかつ角丸

    はじめまして。 photoshopやweb制作を学び始めた初心者です。 http://www.sive.jp/memory/ こちらのサイトのトップページヘッダー部分は、 角丸であり、その中身はグラデーション・斜線が描かれています。 これは繰り返しなどせずに そのまま画像を貼り付けているのでしょうか? それとも横幅を10px程度に縮小した画像を 横へ繰り返しているのでしょうか? しかし、そうすると 角丸まで繰り返されてしまうと思うのですが どうやってやっているのでしょうか? ご回答どうかよろしくお願いいたします><

    • ベストアンサー
    • HTML
  • 角丸画像に点々の1pix枠を作りたい

    角丸画像に点々の1pix枠を作りたい 今イラスト中心のサイトを作るため フォトショップでサムネイル画像を作っています。 正方形角丸画像+1pixの枠は作れるのですが この1pixの枠に点々の加工(選択範囲で囲った時の様な) をする方法がわかりません。 サンプル添付しました。 どなたかご存知でしたらご回答よろしくお願いします。 使用できるフォトショップのVerは5.5と6です。 再度上げさせていただきました。 何卒よろしくお願いします。

  • photoshopのことについて質問します。

    photoshopのことについて質問します。 まず最初に背景をきめ、そして新規レイヤー作成にてレイヤーに画像をいれようと思うのですが レイヤーに画像が表示されずに新規背景として表示されてしまいます。 どうしたらよいでしょうか。 初心者すぎることみたいでネットにはこの作業ができるものとして掲載してあります。 どこかわかりやすいサイト等あれば教えてください。

  • イラレ-角丸長方形ツールを文字ツールで切り抜きたい

    Illustrator CC を利用しています。 1. 角丸長方形ツールを使って背景にするオブジェクト?を作成 2. 別レイヤーに切り抜きたい文字を入力 3. 2の文字を使って、1の真ん中辺を切り抜く。 3番目を行いたいのですが、どのようにすればよいのでしょうか? 切り抜いた部分は透過になってほしいです。 ご教示の程、よろしくお願いします。

  • javascriptで角丸の枠作成

    画像を使わないでjavascriptで角丸を作るのに「Nifty Corners」を使用しています。 http://www.html.it/articoli/nifty/index.html ここで、角丸を作成する時に枠線(ボーダー)に色をつけたいのですが、できません。いろいろとサイトを調べたら下記サイトでどうやらできるようですが、ソースコードの書き方がよくわかりません。 引用 smoothの他にborder,smallなどを指定できます。borderを指定することで、角丸枠に枠線をつけられます。スペース区切りで複数指定による組み合わせが可能のようです。 Rounded("div#nifty","all","#FFF","#D4DDFF","smooth"); 枠線の色指定や枠をつける場合どうしたらよいのでしょうか? http://phpspot.org/blog/archives/2006/04/javascript_8.html

  • Photoshop CS3 レイヤーマスクについて。

    みなさんこんにちわ。 Photoshop CS3をはじめて使うのですが、この度「プロに学ぶ一生枯れない永久不滅テクニック」という本を購入しました。 どうしてもわからない部分があるのですが、加工したい写真は850p×650pなのですが、背景をつくり、レイヤー合成を使ったカバーフロー画像を作成したいのです。 最初に透明で2000p×2000pのレイヤーを作り、その中にカバーフローにしたい写真をレイヤー2としてはめ込みます。 そこでわからないのが、本には 「レイヤーマスクボタンを押し、マスクを作りレイヤーマスクを黒く塗ってから、角丸長方形ツールでマスクの画像にあたる部分を白く塗りつぶす。」 と書いてあるのですが、レイヤーマスクを黒に塗り潰すと画面からメインの写真が見えなくなり角丸長方形ツールで白く塗りつぶすにも、何処から何処までを選択したらよいかわからないのです。 補足説明をしてくれということでしたらしますので、どなたか、この件に関してわかる方いらっしゃいましたら宜しくお願い致します。 これからまた自分でもやってみますが、教えてください。

  • Photoshopでハメコミ合成を作りたい

    Photoshop初心者です。 角丸長方形のシェイプをテレビ画面と見立てて、 別で用意した画像をハメコミ合成したいのですが、 方法が分かりません。 シェイプを書いたレイヤ上に何か処理をするのでしょうか?? ご存知の方いらっしゃいましたらご教授下さい。 Photoshop7.0

専門家に質問してみよう