人力検索はてな
モバイル版を表示しています。PC版はこちら
i-mobile

イラストレーターやフォトショップを使ってWEBのバナーや素材をつくろうとしていますが、いまいち保存形式などがわかりません。

例えば、イラストレーターで製作しているものの中にフォトショップの素材をもってくる場合なんで保存しどうやってもってきたらいいのか(単に配置でいいのでしょうか?)

後、サイズの問題や、透過場合・・・あと、注意点など
そういった事が詳しく書いてあるサイトなどでもかまいません。
教えていただけませんか?

それから、もしあなたが人の似顔絵を描いてサイト上にのせるとしたら、どのようなソフトでどうやって描きますか?
参向までに教えてください。

ものすごく初心者でごめんなさい。

●質問者: lotus_mie
●カテゴリ:インターネット ウェブ制作
✍キーワード:Web あなた いまいち それから にの
○ 状態 :終了
└ 回答数 : 4/4件

▽最新の回答へ

1 ● drowsy
●23ポイント

まず似顔絵はイラストレーターで描きます。

ペンツールでベジェ曲線。線の太さは、効果を狙うので無ければ、

最低1ポイント合った方がいいです。

*ベジェ曲線はパスのこと。

ペンツールでぐりぐり描いてください。

で、コピー&ペーストか書き出しでフォトショップデータに。

*ややこしかったら、イラストレーターとフォトショップを立ち上げておいて、

イラレでコピーして、フォトショで新規作成→OKでペースト。

(カラーはRGB、解像度は72DPI)

あとは線のレイヤーを一番上にして。

新しいレイヤー作って色をペタペタ。

とりあえずはPSDファイルで保存します。間違ってもJPGではやらないように。

完成したら、書き出します。

web用に保存を選んで、イラストだったらGIFがいいでしょうから、

GIFを選んで下さい。

透過の時はレイヤーの「背景」という一番下のやつを不可視(目玉をクリック)

にしてからweb用に保存を選んで、透明という項目にチェック。

色数は現物をみながら調整。

出来上がり★


…これでわかりますでしょうか…。

あとはこの辺を参考に。

http://ameblo.jp/shimomayu/theme-10001044449.html

http://www.detarame.jp/

http://photoshop.deca.jp/

◎質問者からの返答

ご丁寧にありがとうございました。

やってみますね♪


2 ● よーいち
●23ポイント

バナーの保存形式ですが、一般的なブラウザが読める形式であれば何でも良いでしょう。たとえば、GIFやJPEG、PNG等です。

できるだけサイズが小さくなるようにした方がよいです。


バナーのサイズは一応定められているので、以下のところを参考にして切り抜くなりすると良いでしょう。

http://ja.wikipedia.org/wiki/%E3%83%90%E3%83%8A%E3%83%BC#.E7.94....

用途によっては必ずしもこのサイズで作らなければならないわけではありませんが、これで作れば調和の取れた縦横比になり、見た目も美しいです。


IllustratorにPhotoshop画像を貼り付ける場合は、おっしゃるとおり「配置」で問題ないと思われます。


しかし、最終的にJPEGやGIFで保存する以上は、最後はPhotoshopに持って行って仕上げをして保存するようにする方がよいでしょう。


この場合は、Illustratorでひととおり作成し、「コピー」して、Photoshopで「ペースト」するのが手軽で良さそうです。


*


似顔絵は、絵心がないので確かな答えはできませんが、以前描いたときは、PhotoshopやIllustratorに元になる写真を配置などして、別のレイヤーで上からなぞることで、下手な私でも何とか見られる絵を描くことができました。


3 ● rael
●22ポイント

WEBの画像を作成する際の保存形式としては

●たくさん色を使用している画像(写真やイラスト・似顔絵など):jpg

●単色でそれほど色を使用しない画像やワンポイントなど:gif

が一般的と考えられます。

PhotoshopとIllustlatorは、単体で使うのではなく、

それぞれの特性を組み合わせて使うのが賢い使い方で

画像(写真等)やいわゆるCGなどを作成する際はフォトショップで。

ロゴや地図作成など、線を引いたりハッキリしたロゴなどを作りたい場合は

イラストレーターで作るといいと思います。

また、イラストレーターでHTMLを作成することができますが、

これもまた技術が必要なので、あまり詳しいわけではないということでしたら、

それは次のステップにとっておいて、基本のHTML作成ソフトを使うことをお勧めします。

gifアニメーションなどを作成したい場合は、

Photoshopに付属としてついている、ImageReadyを使うと

非常に簡単だと思います。

(参考URL:http://www.adobe.com/jp/web/tips/ill10animlyrs/index.html)


それと、イラストレーターで作成しているデータに

画像を貼り込むという作業は、

WEB作成では(イラストレーターでHTMLを作成しない限り)あまりしないように思えます。

また、もし似顔絵を描くとしたら、

私はペインターというソフトを使うと思います。

(参考URL:http://www.corel.jp/product/painter/index.html)

このソフトは油絵を描く様な感じで画面上に絵を描いていけるので

使い方さえ覚えれば非常にいろいろなタッチの絵を描く事が出来、

楽しいと思いますよ。

しかしこのソフトだけではなく、やはりフォトショップも同時に使うので

なれるまではあまりお勧めできません。

(要するに、ソフトの良い(便利な)部分・悪い(不便な)部分を使い分けて賢く利用するということです)


参考になりそうなところのURLをあげておきます。

イラストレーター使い方講座

http://ama.jpn.org/illust/

フォトショップのテクニック

http://www.geocities.co.jp/MusicStar-Guitar/7240/

http://mippi.jp/siya/kouza/kouza_main.html

ペインターの紹介(Verが違う可能性がありますが基本は変わりません)

http://www7a.biglobe.ne.jp/~painter_e/

http://kanna.cside.com/painter/

個人的には、WEBよりも本のほうがずっと詳しく親切なので、

何冊か参考書を買うことをお勧めします。

お勧めの本を何冊かご紹介します。

プロとして恥ずかしくないWEBレイアウトの大原則

http://www.amazon.co.jp/exec/obidos/ASIN/4844358146

プロとして恥ずかしくないIllustratorの大原則

http://www.amazon.co.jp/gp/product/4844358049/ref=pd_sim_b_2/250...

プロとして恥ずかしくないPhotoshopの大原則―正しいPhotoshopの使い方を知っていますか?

http://www.amazon.co.jp/gp/product/4844357840/ref=pd_sim_b_4/250...

3日で腕が上がった(ように見える)グラフィックデザインの技とコツ

http://www.amazon.co.jp/gp/product/4844357522/sr=8-21/qid=115915...

◎質問者からの返答

本なども含め勉強しますね。

それぞれのソフトの特徴をしる事が必要ですね。

ありがとうございます。


4 ● sokyo
●22ポイント

こんにちは。

質問が多岐にわたっていますね(汗)。

Illustratorで制作しているものの中にPhotoshopの素材を持ってくるときには、

私なら単に配置にします。

ただしそれは自分ひとりで作っている場合の話で、

他の人に渡すようなコトがある場合にはpdfに書き出しますね。

この形式だと見た目をキープできる上に、リンクなどを気にしなくていいので。

Webページにアップロードするならjpegやgifで書き出すのがいいです。

詳細は↓などを参考に。

http://www.htmq.com/gazo/index.shtml

サイズの問題や透過具合、というのはちょっとわかりません。

具体的にどのような問題なのか、具合とはどういうコトなのか、

もうすこし情報をください。

私が人の似顔絵を描くなら絶対 手描きをスキャンすると思います。

ペンタブレットなども持っていますが、やっぱり手描きにはかないませんので。

スキャンしたらPhotoshopでトーンカーブだけ整えて完成ですね☆

◎質問者からの返答

とろとめのない質問ですみません。

しかし、お蔭さまで解決しました。

ありがとうございました。

関連質問


●質問をもっと探す●



0.人力検索はてなトップ
8.このページを友達に紹介
9.このページの先頭へ
対応機種一覧
お問い合わせ
ヘルプ/お知らせ
ログイン
無料ユーザー登録
はてなトップ