ボタンをデザインするときに使いがちなデザイン効果をまとめました。 詳しいやり方は記述しませんが、ほとんどがPhotoshopのレイヤー効果でなんとかなります。 コツは、色々と組み合わせて使うため、ひとつひとつを「やりすぎない」ことです。 ボタンデザインのご参考になれば… 01.Gradation グラデーション 02.Texture 模様 03.Border ボーダー 04.Dent へこみ 05.Shadow シャドウ 06.Text Shadow テキストシャドウ 07.Text Brightness 文字光彩 08.Reflection 反射 09.Highlights ハイライト 10.Shine てかり サンプル 作成例です。 01 + 03 + 04 + 06 + 09 + 10 を組み合わせています。 いろいろとお試しください〜。 LIGはWebサイト制作を支援しています。ご
どうも僕です。LIGブログがリニューアルされて、今まで以上にコンテンツの内用が重視されるようになって、我々中の人も、身が引き締まる思いだよ。主に、下半身あたりがね。あれかな、まだ寒いからっていうのもあるのかな。キュッてなり続けている。キュッて。 今回は、人間の脳科学の観点から、視覚的なデザインの法則をご紹介かつご解説しようではないか。 実際にものを見ているのは脳である コンピュータに詳しい人なら、 携帯とかにくっついているデジタルカメラは、 光の三原則であるRGB(赤、緑、青)の色の強度を感知する、 センサーの集合体で構成されるものだとご存知だろう。 実際、人間の目でも、 目で見える情報を各色の強度を感知する細胞の集合体で感知し、 電気信号情報に変換して受信しているわけである。 つまり、目はデジタルカメラと同じように、 色の集合体として情報を受け取る。 しかし、その情報を実際に処理している
どうも!デザイナの王です。 2012もいよいよ12月を迎え、果てして2013年は来るのかと、わくわくしている今日この頃です。 ここ最近、AppleのRetinaを皮切りに、超高精細ディスプレイが色んなメーカーから出ているニュースが目に付く。 有名所ではシャープのIGZO(約500ppi)、ジャパンディスプレイのLTPS(約650ppi)などがありますよね、iPhoneのRetinaをぶっちぎりで凌駕してしまうという!4K時代の到来を予感させる!(その前に地球が終わらなければいいのだが!) ということで、来るRetina全盛時代に備えるべく、どんなにモンスター級の高解像度のデバイスでも綺麗に表示する「シンボルフォント」を最近使い始めました。今回はそんな素敵なシンボルフォントの導入法を紹介したいと思います。 そもそも♥「シンボルフォント」♥って何? 読んで字の如し、「図形のフォント」です。タイ
Sugamo.cssでちょっと前に話題になったのが、CSSのメタ言語(って言い方でいいのかな)であるSassです。 Sassを使うと、CSSをクールに記述する事ができます。 Sass自体についての解説はググると詳しいものがいくつかあります。 この記事では、Windows PC(XPとVistaで試しました)にSassを導入する手順を紹介します。 Rubyのインストール SassはRubyで動いているので、まずはRubyをインストールします。 RubyInstaller for Windows を使えば、何度かクリックするだけで完了します。 インストールが終了したらコマンドプロンプトを起動して、次のコマンドを入力してエンターをッターンと叩いてください。 ruby -v ruby 1.9 1p430(2010-08-16 revision 28998) みたいのが出たらgemのアップデートに進
Win+Dreamweaver(以下DW)環境でSassを使えるようにし、初歩をかじって理解まで出来る、自分の中では最も簡単なクイックガイドです。30分後には貴方もSassを扱えるようになってます。 Scoutのインストールhttp://mhs.github.com/scout-app/ 上記よりダウンロードしインストールする。 Scoutの初期設定適当なプロジェクトフォルダを作成。例として「scout_test」 ※ディレクトリパスに日本語など2バイト文字が含まれるとエラーが出るため注意プロジェクトフォルダの中に「css」「scss」のフォルダを作成Scoutを起動し、左下の「+」ボタンをクリック作成したプロジェクトフォルダを指定する。「Configure」画面の「Input Folder」に「scss」フォルダを指定「Configure」画面の「Output Folder」に「css」
RSS feeds My Tweet ご利用上の注意 広告枠の販売 バナーサイズ別 728 × 90(134) 468 × 60(138) 234 × 60(112) 125 × 125(88) 88 × 31(90) バナーカラー別 □ ホワイト(389) ■ ブラック(272) ■ グレー(77) ■ レッド(160) ■ オレンジ(150) ■ イエロー(83) ■ グリーン(142) ■ ブルー(178) ■ パープル(25) ■ ピンク(92) ■ ブラウン(71) 地域別 日本国内(521) 海外(42) 詳細検索 728 × 90 468 × 60 234 × 60 125 × 125 88 × 31 □ ■ ■ ■ ■ ■ ■ ■ ■ ■ ■ 日本国内 海外 PR広告 ”バナーデザインギャラリー”とは バナーデザインギャラリーは、皆様からのご投稿情報を基に、かっこいいバナー
こんにちは、デザイナーの王です。 昨今セピア風やらトイカメラ風何やら、昔っぽい写真のような加工が流行ってるみたいですね。自分的には今の最新鋭の一眼で撮ったまんまのようなクリアな写真のほうが好きだったりします。 とはいっても、たまには古き良き昔の写真も味深くていいのかもしれないですね。デザイン的見地から見ても色が統一されてたり、色の寒暖差が出たりで印象的な写真になりやすいものね。 スマホとかでその手のアプリが多数出回っているので、カスタマイズ性は低いものの、割りと手軽にできますが、パソコンなら言わずと知れたことだが、Photoshopで加工する場合がほとんどだと思います。 スマホよりは自分好みにいじれるが、いざやろうと思うとなかなか手間がかかって面倒だったりします。加えて、枚数が多い場合なんかはさおさらそうです。だがしかし!アクションを使えば一気に形勢逆転! 寒色系 Purple wonde
OGPタグを設定するのにOpen Graph ProというWordPressのプラグインを使ってたのですが、 descriptionの設定が不安定だったので、最近Facebook Toolsというプラグインに変えてみました。 このプラグインはOGPタグの設定だけでなく、いいねボタンやfacebookコメントボックスの設置も簡単に行えます。 このブログではOGPタグを設定するのにOpen Graph ProというWordPressのプラグインを使ってたのですが、 descriptionの設定が不安定だったので、最近Facebook Toolsというプラグインに変えてみました。 このプラグインはOGPタグの設定だけでなく、いいねボタンやfacebookコメントボックスの設置も簡単に行えます。 ざっと使い方まとめました。 インストール インストール方法は通常のWordPressプラグインと同じで
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く