Webデザインに黄金比や白銀比を取り入れる方法 | 株式会社LIG(リグ)｜DX支援・システム開発・Web制作
こんにちは。デザイナーの白浜です。 人が見て美しいとデザインとされる黄金比や白銀比。なんとなく知っているものの、作り方や使い方がよくわからないという人もいますよね。 今回は黄金比や白銀比の考え方についてわかりやすく解説するとともに、Webデザインのレイアウトや画像制作に黄金比や白銀比を取り入れる方法・お役立ちツールをご紹介します。 良かったら参考にしてみてください。 （編集部注：2013年12月16日に公開された記事を再編集したものです。） 黄金比・白銀比って？ 黄金比・白銀比は、古くからある人が見て美しいと言われる調和的な比率のこと。デザインに黄金比や白銀比を使用することで、言葉で言い表せない芸術的な美しさを加えることができます。 まずは黄金比・白銀比がどういうものなのか、基本の考え方についてみていきましょう。 黄金比の比率と作り方 コトバンクによると、黄金比(Golden ratio)
佐藤可士和が語る“クリエーティブから見たインターネット”：NBonline(日経ビジネス オンライン)
日本を代表するクリエーターの一人、佐藤可士和氏。テレビCM、プロダクトデザイン、CDジャケット、空間デザインなどのほか、ロゴやサイトのデザインまでを手がける幅広い活躍でよく知られている。これまで手がけたデザインは、楽天のロゴ、キリン「極生」のテレビCMと商品デザイン、SMAPのCDジャケットやNTTドコモの「FOMA N702iD」など、実に多岐に渡る。 個人事務所のサムライ（東京都港区）でクリエーティブディレクター、グラフィックデザイナーを務める佐藤可士和氏はここ最近のインターネットやケータイの普及、そしてこれらを活用したネットマーケティングをどう見ているのか。話を聞いた。 ケータイはみんなを街に解放した 消費者の情報に対する質を見分ける力が最近、ものすごく上がっていると思います。特に東京近辺に住む人。東京はやはりすごい街です。世界中のものがこれだけ集まっている都市はありません。表参道で
初心者からWEBクリエイターになるためのまとめ｜WEBクリエイターの木
「WEBをつくれるようになりたいんですけど何から始めればいいですか？」 WEBは今や広告には欠かせないものになり、会社の組織運営そのものに関わるシステムにも使われ、コミュニケーション、エンターテイメント、ショッピング、・・・日々アメーバのように使い方が増殖していて、各分野のスタイルを変えており、一概にコレと言えなくなりました。 WEBクリエイターに必要とされる知識も技術の発展と分野の拡大に伴ってどんどん増殖しています。 だからそれぞれを細かく学んでからやろうとするときりがないです。全体を見て、作りながら足りなくなったら検索。知識はネットで検索するか本を読めばたいてい探せますし、もっとまとまった本が日々出版されています。 もっとも大切なのは行動しながら今の自分に何が必要なのか感じることだと思います。
80年代のAppleに学ぶUIの部品化とガイドライン ― ＠IT
インタラクションデザインパターン（1） 80年代のAppleに学ぶUIの部品化とガイドライン ソシオメディア 上野 学 2007/2/7 インタラクションデザインパターンのプロローグとして、その原則や秩序の歴史を見てみよう。20年前のAppleはどのように質の高いアプリケーション開発を目指していたか デザインが優れていれば、道具はより楽しいものになり、利用者はより生産的になるはずです。道具のデザインというものは大昔から私たち人間が取り組んできたことですが、近年急激にデジタルデバイスが多様化したことによって、インタラクティブな道具をデザインするための方法論は技術の進歩に追い付くことができなくなっています。利便性を高めるはずの新技術が使い方を複雑化する要因となり、利用者の混乱は増すばかりです。 最近私は携帯電話を買い替えたのですが、同じメーカーの3年前の機種と比べて、著しく使い勝手が悪くなって
2006年を彩った50の超美麗CSSデザインサイト集:phpspot開発日誌
50 Beautiful CSS-Based Web-Designs in 2006 | Smashing Magazine Let’s take a close look at some of the most beautiful designs we’ve seen in 2006.2006年を彩った50の超美麗CSSデザインサイト集。 どれも凄まじく凝ったサイト集で、1個1個が1つのクリエイターが精魂込めて作ったのが伺えます。 (Webデザイナーのためのリンク集) こういった美しいサイトを参考にサイトを作ったりすると自分のセンスも磨かれそうですね。 単に見るだけでも楽しめます。 2007年も素晴らしいサイトが出てくるんでしょうね。こういったデザインは数年前では見られなかったようなもののように感じます。 WEBデザインの面での進化についても今後が楽しみでしょうがないですね。 作成に使っ
クールなロゴをオンラインでお手軽作成「FREE Logo Maker」:phpspot開発日誌
FREE Logo Maker - FREE Logo Creator - FREE Online Logo Design クールなロゴをオンラインでお手軽作成「FREE Logo Maker」。 ４つのステップで次のようなカッコいいロゴが簡単に作成できます。 ソフトはブラウザだけあればよく、Flashを使ったインタフェースでデザインを行えます。 手順は、 (1) エンジニアリング、スポーツといったカテゴリを選択 (2) ロゴのベースとなるアイコンを選択 (3) フォントを選んでデザイン実行 (※ ロゴをデザイン中の画面) ↓↓↓↓↓↓ (※実際に作ってみたロゴ) これは簡単で実用的ですね。サイトのロゴを作成するのに役立ちそうです。
美しいレイアウトを計算してくれるツール :: Love & Design ::
以前 Webデザインと黄金比の関係 でご紹介した、白銀比、黄金比、白金比、第二黄金比を使った美しいレイアウトを計算してくれるツールが、さらに再分割できるようになりパワーアップしました。 電脳狂想曲 レイアウトの小技 使い方と説明 実際に画像を表示しながら分割ができるので、サイドバーや画像の大きさを決めるときや、ロゴやメニューを配置するときに便利です。 【使用例】段組（２カラム）するとき 横幅780px の場合 黄金比：横幅 / 552px / 228px 白銀比：横幅 / 512px / 268px 白金比：横幅 / 571px / 209px 第二黄金比：横幅 / 565px / 215px ↓もしかして黄金比？ これまでテキトーに決めていたという方も、Webデザインだけでなく、プレゼンの資料などにも活用できそうなので、ぜひ一度お試しください。 参考記事 「見えない線」に沿ってページをレ
1
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
Photoshopの無料ブラシを使って、たった３分でプロが作ったようなグラフィックを作る方法 - デザインウォーカー | DesignWalker - ロサンゼルスで働くウェブデザイナーの日記
http://bodytalk.girly.jp/archives/2006/11/web_1.php