下記のホームページのボタンのように、透明で、しかも立体感のあるボタンを作りたいのですが、どちらのソフトでどのように作ったらいいのでしょうか?
http://www.imgt.jp/about/index.html
No.5ベストアンサー
- 回答日時:
こんにちは。
これはPhotoshopのほうです。
半透明に見えているのはHP制作時のプログラムによるものでなく、
もともと透明も含めて、画像というものです。
(しかしHP制作時のプログラムによるもので半透明にしている時もあります。)
Photoshopはレイヤーを扱いますが、
レイヤーは透明のセル画と考えてください。
一番下のセル画(レイヤー)に鳥の画像があって、
その上のセル画(レイヤー)に半透明のグラデーションなどがあって、
その上のセル画(レイヤー)にボタンのフチだけの画像があって、
一番上のセル画(レイヤー)に文字を書くと、
↓
4枚を合わせたときにこのような画像が出来上がります。
後はそのセル画(レイヤー)を1枚に「統合」して
(ここで4枚のレイヤーが1枚になる)
それでボタンの部分だけ選んで切り抜いて、
JPEGやGIFにして画像化するとできます。
ちなみにマウスオーバーでボタンの画像が変わるのは、
HP制作の際にロールオーバーイメージの指定をしているからです。
この場合はつまりマウスオーバー前と
マウスオーバー時の、両方の画像を作っているということです。
この文章は難しいと思いますが、Photoshopの基本が分かれば
必ず理解できる内容になっていると思います。
ぜひ参考になりましたら幸いです。
No.4
- 回答日時:
こちらのサイトでは数々の良質なボタン作成方法が掲載されています。
貴方が仰ってるいる表現は[glass]の質感だとおもわれますが、意外にメタルな表現であったりと数々のTipsが投稿されています。参考URL:http://www.tutorialized.com/search.php?id=1&s=bu …
No.3
- 回答日時:
「会社概要」のように背景画像が透けて見えるボタンでしたら、
photoshopで作ります。
立体感は下の人が回答しているように、グラデーションで作ります。
透けて見えるのは、重なる部分の背景をボタンに合成することで、そのように見せています。
http://www.imgt.jp/about/images/a_r2_c1_.jpg
なるほど、半透明のボタンを作って、htmlやcssでレイアウトするときに重ねているのかとおもっていました。
最初から鳥の部分もボタンで作るのですね。
そういえば、スタイルシートを適用させないで表示したら、そうなっていました。
ありがとうございました。
No.2
- 回答日時:
「ご挨拶」「企業理念」のボタンでしょうか?
それとも「サービス概要」「料金比較」?
どちらも単純なグラデーションで作れる画像です。
特別なテクニックは必要ないので、どちらのソフトでも同じように作れますよ。
むしろ、作り手のデッサン力がものをいうかもしれません。
お探しのQ&Aが見つからない時は、教えて!gooで質問しましょう!
似たような質問が見つかりました
- 据え置き型ゲーム機 【 Xbox Series X|S 】BIOHAZARD 5、ローカル協力プレイ (2-2) 1 2023/05/01 15:36
- InternetExplorer(IE) IE11とEDGEの違い 4 2022/05/19 10:50
- Web・クリエイティブ 今とても悩んでる事があるんです。至急アドバイス頂けたら助かります。 現在学生で、Illustrato 1 2022/09/18 20:02
- プリンタ・スキャナー キャノンmp490プリンター【エラー番号5400】で【プリンタートラブルが発生しました。電源を入れ直 2 2023/07/24 17:45
- その他(データベース) Accessフォームからパラメーターで表示したレコードを指定のExcelのセルへ転送する方法について 2 2022/08/22 18:04
- その他(AV機器・カメラ) 至急!Panasonicのリモコンを使ってるのですが、電源ボタンなどや音量ボタン入力切り替えのボタン 3 2022/06/02 14:43
- Visual Basic(VBA) Edge操作のアプリが例外発生に 1 2023/03/12 21:22
- 扇風機・冷風機・サーキュレーター スマートプラグで最近の扇風機は操作できない? 5 2022/11/04 13:37
- 工学 リモコンリレー(ワンショット)の質問です。 https://detail.chiebukuro.ya 2 2022/12/27 21:50
- iPad iPad Ai ProのM2はパソコン代わりになりますか? ワードプレスやPhotoshopのiPa 2 2022/10/19 21:23
おすすめ情報
デイリーランキングこのカテゴリの人気デイリーQ&Aランキング
-
フリーソフトPixiaで画像を切り...
-
フォトショのcamera rawフィルター
-
GIMP2 波打ってしまった線を滑...
-
フォトショップで切って分ける...
-
photoshopのレイヤーをIllustra...
-
フォトショップで、粗い砂目を...
-
フォトショップでの背景の特定...
-
イラストレーターでの画像の切...
-
フォトショップのアクションを...
-
photoshopでカンバスが動きませ...
-
photoshopで作った2枚の画像、...
-
真ん中の白い部分を切り取りたい
-
medibang paint を使っているの...
-
背景が透明な画像の色を反転
-
Photoshop背景とレイヤーの合成...
-
photoshop elementsでの画像の...
-
gimp2で写真を丸く切り取るには
-
PSDファイルのレイヤーの中の画...
-
フォトショップで細かい連続し...
-
photoshopで空にひこうき雲を合...
マンスリーランキングこのカテゴリの人気マンスリーQ&Aランキング
-
フォトショップで切って分ける...
-
フォトショのカンバスに画像を...
-
photoshopのレイヤーをIllustra...
-
影を両サイド(全方位)につけ...
-
medibang paint を使っているの...
-
GIMP2 波打ってしまった線を滑...
-
Photoshopの画像統合でレイヤー...
-
GIMPでレイヤーを固定したい
-
Photoshopで半透明な部分の抽出
-
GIMPでアルファチャンネル追加...
-
フォトショップで、粗い砂目を...
-
photoshopでカンバスが動きませ...
-
Photoshopを使って画像のような...
-
背景が透明な画像の色を反転
-
真ん中の白い部分を切り取りたい
-
フォトショのcamera rawフィルター
-
メディバンのグレースケール
-
複数のスキャン画像(一部に重...
-
photoshopで画像を白っぽくする...
-
手書き文字の背景を透明にする
おすすめ情報