<< December 2017 | 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 >>
<< 書くネタはあるけど… | main | Illustratorでアクア風 角丸バナー作成方法 >>

ハムからみんなへお願い&お知らせ

相互リンク募集!
ハムにメールを送る時はここから
07月05日(Sat)

スポンサーサイト

一定期間更新がないため広告を表示しています

人気blogランキング  にほんブログ村 サラリーマン日記ブログへ

  • 2014.07.05 Saturday
  • -
  • -
  • -
  • by スポンサードリンク

10月13日(Sat)

今的なWebのデザインは・・・?

仕事上、デザインを作る機会がでてくるようになった。

しかし、専門的に学んできたわけじゃない僕は
常につくり方の勉強から学ばなければならない。

色合いの勉強とかもしなくちゃならないし、
どんな風に作ると、綺麗にみえるか、
どんな風に作ればかわいくみえるか…

いろいろわからないことだらけです。

加えて言うなら、
画像を作るためのソフトも覚えなければならない(;´Д⊂)

Illustrator(イラストレーター)とか
Photoshop(フォトショップ)、
それにFireworks(ファイアワークス)・・・

多いよ。・゚・(ノд`)・゚・。

一つ覚えればいいんだけど、
なぜか同時進行で3つ利用している現状です。。。

だから覚えにくいってのもあるのですが...

以前、Web2.0風のデザインってどんなのだろうな〜
なんて思って調べたことがあったんですけど、
結局うまく作れず終いだったんですよ。

でも、やっぱり綺麗なのをつくりたくなって。。。

いろいろ勉強してみました。

そして作ったのがコレ↓

色の勉強

どれも似たような感じになっているようで、
微妙に全部ちがうように作っています。

1番は単なる青色の四角形です。
つまり基本となる形です。

それをちょっと変えたのが2番。
微妙に上の部分がうすくなっているんです。
これだけでもなんだか印象がかわりますよね。

3番は、1番の色をパステルカラーっぽくしてみたもの。
4番は、2番に近いのですが、
1番の色と4番の色をグラデーションで変化させてみたものです。

どうでしょう?これだけでも結構綺麗に見えませんか?

5番はちょっとぼやけてしまったのですが、
全体を白っぽくして、さらに下のほうに影をつけてみた画像です。
ちょっと立体にするだけでも、
なんだか見栄えがちがうもんなのですね。

6番は、青から白へのグラデーション。
それにちょっと灰色の外枠をつけたものです。
ここまで色が変化すると、
4番よりも明るい印象を受けます。

順番を間違えたんですが、9番!
これは1番の四つ角をちょっとだけ丸くしたものです。

どうでしょう?
角が丸くなっただけで、なんだか和らいだ印象になりませんか?

さらに角を丸くして2番のグラデーションをつけたのが7番。
丸が深くなるほど、インパクトが強くなるようです。

8番は角丸+パステルカラーのちょっとだけグラデーション。
これなんか、本当に和らいだ印象と落ち着いた感じをうけて、
それが角丸によってインパクトを与えられた感じがしませんか?

10番は6番と比べて見てください。
ちょっとだけ角が丸くなっただけなんですが、
印象が強くなります。

そしてWeb2.0のアクアと呼ばれる感じのデザインが11番と12番!
上部が白く、角丸で立体みたいにしているやつです。


簡単にですがいろいろ作ってみました。

まだまだ勉強段階なので全然使えるものではないですが、
ちょっとは勉強したかいがあったのか、
色合いと作り方がわかってきたような感じがします。

これがきちんと仕事としていかせるようになるのは
いつの日か・・・

人気blogランキング  にほんブログ村 サラリーマン日記ブログへ


07月05日(Sat)

スポンサーサイト

人気blogランキング  にほんブログ村 サラリーマン日記ブログへ

  • 2014.07.05 Saturday
  • -
  • 23:32
  • -
  • -
  • by スポンサードリンク

【i2i】SEO対策ツール ロリポップ NetMile 見ると得する『CMサイト』
コメント
コメントする









この記事のトラックバックURL
トラックバック
categories
archives
recent comment
recent trackback
friend links
link list
あわせて読みたい
search this site.
tag cloud search
others
  • RSS1.0
  • Atom0.3
powered
みんなのブログポータル JUGEM
sponsored links