Archive for 'WEBデザイン'

陽射しや煙をphotoshop雲模様で描く

陽が射している光線や煙などはphotoshopの雲模様で簡単に描ける。 ちょっと手を加えるだけで写真の表情は変わるもの。 上の写真(手ごろなものがモノクロしかなかった・・) 夜明けのような感じの写真です。 では雲模様を使って地面に朝っぽさと陽射しを描いてみます。 1:まず地面にあたる部分を選択し、新しいレイヤーで雲模様を描きます。色は初期設定の上が黒で下が白のままです。フィルター→描画→雲模様1を選択します。 2:次に遠近法で雲模様下の方を広げてあげます。 3:フィルター→ぼかしガウスで少しぼかします(半径3.4くらい)。そしたら表示設定を通常から覆い焼きカラーにしてみましょう。 4:次に陽射しの線を新しいレイヤーを作り 多角形ツールでマスクします。同じように雲模様1で描きます。 5:最後に表示をスクリーンにして不透明度を50%くらいにしたら出来上がり。 今回はモノクロ写真ですが、カラー写真もまったく同じやり方。 例えば料理に湯気をつけるなんてのもこれで出来ます。その場合は消しゴムツールなどで湯気らしい形にしてからぼかし スクリーンでOK。 may the force be with you.

背景をグラデーションにする

  たまにはWEBデザインネタでも。   WEBサイトやブログの背景をグラデーションにするパターンです。   いま仕事用のサイトもwordpressにしてしまおうと、丁度背景の設定をしたので やり方は他にもありますが、オーソドックスなやり方を紹介しますね                             CSSをいじるだけです。例えばwordpressのテーマでしたら 管理画面の外観→編集→Style.cssとかで編集です。   1:まずはグラデーション画像を用意します こんな感じです。  2:CSSのBODYの部分に以下のように記述します body { margin: 0; background: url(“画像URL”); background-repeat: repeat-x; background-color: #FF9900; } repeat-xは横に並べるという意味です repeat-yにすると縦に並びます グラデーション画像を背景にしたら グラデーションの明るい色を色番でサイトの背景に指定します。 上の画像の明るい部分がFF9900です。   さぁ やってみよう                 :icon13: 一日一回ぽちっと協力お願いします

オバマ大統領の赤いネクタイと 意味

  オバマ大統領が誕生しました。 選挙中はブルーのネクタイが殆どでしたが、圧勝してからは赤いネクタイが多くなりましたね。   赤には色々な意味があります   ロゴやWEBデザインをする私には赤というと飲食業のイメージがあります。 赤と黄色の組み合わせは食欲を高める効果があると言われています。 例えば マクドナルドを始めとするファーストフード。  ラーメン屋さん等も赤と黄色が多いですね。 それと、もう一つが目立つと言う事。赤い看板は遠くからでも目立ちます。 目だつと言う事はどういう事かというと・・・   ケネディ大統領と赤いネクタイ   第35代大統領 ジョン・F・ケネディの選挙中のテレビ討論会での話での事。 至上稀に見る大接戦となったケネディとニクソンの大統領戦。 それまでメディアの中心はラジオや新聞でしたが、 テレビ時代の到来と共に選挙戦も見た目重視の物に変わってきます。 ケネディ陣営は見た目による人に与える影響を考えカラーコーディネイトします。 討論会にて、彼の服装の色の組み合わせは、「誠実」・「冷静」・「信頼感」をイメージする紺色のスーツに、「清潔」・「永遠」というイメージの白シャツ、そして、「情熱的」な赤いネクタイです。 ベテランニクソンに対して若造のケネディは視聴者に対して信頼感、そして強烈なリーダーシップをアピールしなくてはなりません。そこで赤いネクタイを用いる事により人を惹きつける事に成功したとも言われています。 その効果もあってか、演説は大成功、彼の若々しく力強いイメージはテレビ画面を通じて広くアピールされ、後の大統領にも多く用いられるようになったのです。   このように赤には力強いアピール力があります。 ただし・・営業マンが訪問するのにいきなり赤いネクタイは不味いです。 最後の一押しやプレゼンなどには赤いネクタイは力強く効果的かもしれません。 それと赤にも色々ありますので、自分に合った赤を選ぶのが大事です。 日本人には暗めの赤やストライプがいいかもしれませんね。   一日一回ぽちっと協力お願いします

流行のWEBデザインとWEBサイトの横幅

先日 とあるクライアントとの会話。 「佐脇さん うちのサイトはデザインが古臭くてね」 「はぁ 古いとは?」 「なんか古いんだよね^^ javaとか余計な物も多いから もっと今風にすっきりしたデザインにしたいんだ」 という会話から 夜、その会社のサイトをチェック。 CSSで書かれたソースは やることやってる感じ。 目的のページに行くのに少し分かりづらいかもしれないが それ程 酷くもない。 たしかにJAVAを使った小技が少しうざいけど・・・ すっきりというクライアントの希望はWEB2.0風ということだろうか。。 お風呂に入ってからもう一度チェック。 確かに古臭い・・ 分かった・・幅だ。 そのサイトの幅は780px うむ~ 確かに他の要素もあるだろうが この幅だけで古臭く見えるとは恐るべし・・ 最近は どこのポータルサイトも900超えてて 大抵ネットの基準とされるyahooが950だから 今780(しかも左寄せ)というのは確かに狭く見えるかも。 情報量が多ければ尚更ですな。 -主なポータルサイトの横幅- パクリですが・・ ←ポチッとお願いします

サムネイルをクリックすると画面上に大きい画像が表示するやつ

  最近良く見る手法なのですが サムネイルをクリックすると別ウィンドウでは無く画面上に大きな画像が広がるのありますよね? Lightboxっていうライブラリーを使用したWEBサイトが多いのですが 最近はThickboxというライブラリーが多くなってきました。   Thickboxは簡単に設置できる上に応用が効くので 初心者からプロまで幅広く使えると思います。 我がデザインスタジオサイトのデザインサンプルでも使用していますので参考までにどうぞ。   さて、簡単に設置方法を。 続きは↓ 人気ブログランキング協力お願いします^^