ちょびスタイル

ライフスタイル、仕事術、パソコンなどなど日常の気づいたことを記録します

*

PhotoshopとIllustratorを使ってヘッダーバナーを作成しました

      2017/04/20

futta1533m

このサイトのheaderの画像をずっと変えよう変えようと考えていたのですが、
なかなか取り掛かれずやっと実行しました。

ほんとデザインが苦手な私。
昔から図工や美術で褒められた試しなしなんです。
(つд⊂)


まず使うイラストを探して来ました。3つほど。


 

画像の加工ができる便利なWEBサービス

こちらでイラストに写真枠をつけることに。

結果

kako-R2vNVRphP2N4eOmJkako-6kHOyjqveGFxLPOikako-kqRJJ34g4W1EDWug
この3つを作りました。


背景のグラデーションを作ります。

Photoshopで作業開始

 

参考サイト:フォトショップで余白に溶け込むグラデーションをつくる|画像加工の便利帳

名称未設定-1

 

2.最初に背景のグラデーションのバナーを作り
先ほど作った写真枠をつけたイラストを貼り付けました。

多少縮小が必要でしたが、なんとか3つ貼り付け完了。
回転させることで、少し動きをつけてみたけど・・・。

とりあえず、これで背景のバナーは完成にしました。

文字を入れていきます。

今度はIllustratorで作業開始。
サイト名は、最近なんでもメモするようになってきたので
わかりやすく『MEMO-STYLE』で。
メモしても使えないと意味ないですから、ここで今後も使えるようにメモしていくようにします。
ついついなんでもevernoteに入れまくって整理できないので:(;゙゚’ω゚’):

参照サイト:イラストレーターで文字に縁取りを入れる方法

私の知りたい方法がバッチリ説明してくれていたので
簡単にできました。

文字に縁があるのとないのとでは全く見え方が違うのは知っていたので
なんとか縁取りはできました。

初めて真剣に作ったヘッダーバナーにしては、よろしいかと。(^-^)//””

画像の編集や加工は奥が深すぎて
まだまだ勉強したいことがたくさんありますね。

色の選び方とかが一番苦手そうな分野かな。
でも、インターネットさえ使えたら何でもチャレンジできそうです。

あ、本も買いたいなあ。

 - 画像編集 , , ,

スポンサーリンク

スポンサーリンク

follow us in feedly

  関連記事

no image
鏡面の画像が作れる画像編集サイト

いろいろなフリーで使える画像編集のサイトや フリーソフトがありますが、 その中か …

イラストレーターで同じイラストを等間隔に並べる方法

Illustratorを使っていて、 同じイラストを同じ間隔でまっすぐ並べる方法 …

photoshop切り抜き方法で検索したところ参考にした13の記事
ブログ見栄えアップにも!オリジナル感満載の画像が簡単につくれるWEBツール「ImageChef]

  オリジナリティのある写真や画像を簡単に作成できるサイトを紹介します …

no image
Photoshopで使えるキュートなバターン

  背景やライン素材など、Photoshopで加工すれば いろいろな使 …

オリジナルのファビコンを簡単に作成できるツール2選
オリジナルのファビコンを簡単に作成できるツール2選

ファビコンを使うと、サイトのイメージが湧きやすいですよね。 分かりやすいオリジナ …

商用利用可能な無料写真素材サイト5選
商用利用可能な無料写真素材サイト5選

ホームページやブログを作成するにあたって、 見映えなどを考えると、写真などがある …

開いているWEBページを簡単に画像として保存する方法
開いているWEBページを簡単に画像として保存する方法

ブログをしていたり、ホームページを作っていたりすると 特定のサイトを画像化して保 …

画像の切り抜きが簡単にできるWEBツール「Clipping Magic」
画像の切り抜きが簡単にできるWEBツール「Clipping Magic」

写真などの加工や編集をするとき、背景をなくしたかったり、 いろいろ要望がでてくる …

夢中になりすぎ注意!作業につかれた時に無心で楽しめるWebサイト
夢中になりすぎ注意!作業につかれた時に無心で楽しめるWebサイト

「頭のなかがあれもこれもといっぱい、もう疲れたー」 という時に、遊び心をくすぐら …

Message

メールアドレスが公開されることはありません。 * が付いている欄は必須項目です