ロゴデザイン・ロゴストック > カテゴリ:特集

faviconを作るときに参考にしたいデザインアイデア 2008年03月07日

Webサイトの構築をする上で、Faviconのデザインを考えることがあるかと思います。

Favicon(ファビコン)とは、ウェブサイトやウェブページに関連付けられたアイコンのことである。とWikipediaにはあります。

16×16pxという領域ではありますが、ちょっとした主張ができますし、ブランディングにもつながると思います。
そして、小さい領域だからこそクリエイティブのセンスが問われる部分でもあるのではないでしょうか?

今回は、過去にロゴストックで紹介したサイトの中からいくつかのFaviconを集めてみました。
ロゴとFaviconの対比でどうぞ。

1.ロゴそのまま、マーク部分のみ取り出し
ロゴ使用のレギュレーション上、加工ができなかったりするところは多いでしょうね。
その場合は、正方形に近いロゴマークは、やっぱりキレイに収まります。
また、マークと社名(またはサービス名など)といった場合は、マーク部分が正方形に近い場合が多く、そこをFaviconにするということが多いようです。

■アップル

ロゴFavicon
apple_fav.gif

■スターバックス コーヒー
ロゴFavicon
stb_fav.gif

■Fedex
ロゴFavicon
fedex_fav.gif

■eyeVio
ロゴFavicon
eyevio_fav.gif

■CONVERSE
ロゴFavicon
converse_fav.gif

2.一部分にフォーカス
上記のマーク部分取り出しとの違いは、そのロゴの特徴的な部分にフォーカスしていると言う点。
より印象深くなるような感じがします。

■鎌倉どんぶりカフェbowls

ロゴFavicon
bowls_fav.gif
どんぶりの部分をフォーカス。

■アイデアマンズ

ロゴFavicon
ideamans_fav.gif
アイデアが生まれる部分(?)をフォーカス

■SHOOTI

ロゴFavicon
shooti_fav.gif
顔っぽくなってる部分にフォーカス

■Wikipedia

ロゴFavicon
wikipedia_fav.gif
頭文字「W」にフォーカス

3.ロゴにない要素をつかう
Faviconということを意識してかどうかは、わかりませんが、
色々な要素を組み合わせて作っているものたちです。

■amazon

ロゴFavicon
amazon_fav.gif
頭文字「a」とにっこり口元を組み合わせています。

■ホットペッパー

ロゴFavicon
hotpepper_fav.gif
ナイフとフォークの部分にしそうですが、
何故か「.jp」の部分。

■The Animal Kingdom

ロゴFavicon
animalkingdom_fav.gif
こ、これは、いったい。。
輪になってる一つひとつが象の顔に見えるような見えないような。

最後に、ロゴストックでは紹介していませんが、
個人的に面白いなと思っているのは、

■任天堂

ロゴFavicon
nintendo_logo.gifnintendo_fav.gif
Faviconはマリオです!
うまいブランディングだなと思います。

いかがでしょうか?
faviconのデザイン制作の参考になれば幸いです。


ロゴうんちく集 -製薬会社編- 2007年08月01日

第3弾は、製薬会社のロゴマークを集めてみました。
製薬業界は同業同士の統合が進み、新会社が続々と誕生してますので、ロゴうんちくも新しめとなっています。

■アステラス製薬
シンボルには、未来に向かって進む美しく輝く星を表すデザインを採用し、“フライング・スター”と名付けました。信頼に裏付けられた最先端のサイエンス&テクノロジーと斬新なインサイトで、... (続きを読む。

■大塚製薬
コーポレートシンボルは大塚製薬の企業理念をシンボリックに表したもので、大塚製薬の「O」をモチーフにしています。「大きなO」は人々の頭上に広がる青空のイメージです。... (続きを読む。

■キョーリン
新しいブランドが約束する「笑顔のある社会」のイメージ、その実現に向かって「のびのびと勇気をもって行動」するキョーリンの意志と、社会の人々から「信頼され、期待感をもって」... (続きを読む。

■グラクソ・スミスクライン
このCIは、シンボルマーク(オレンジ色の形のなかにgskと小文字で記されている)と、GlaxoSmithKlineの文字マークから構成されます。シンボルと文字マークは常に一緒に用いるよう... (続きを読む。

■ゼリア新薬
シンボルマークの「Z」は大きく外へと向かって成長するイメージをデザイン化したもので、ゼリアレッドと名付けた「赤」を使用し「情熱」を表現。さらにブルーのラインにより「知性」を表しました。... (続きを読む。

■第一三共
全体の円形は、神秘的な生命の輝きを感じさせる美しい地球を表しており、上部の優しい形は柔軟な知性と創造性を、下部のしっかりした大きな円弧は信頼感と使命感を表しています... (続きを読む。

■ツムラ
化学構造式を形どった形状は、ツムラの「自然と健康を科学する」姿勢を表しています。上部の箱型は「人間」「生命」を表したもので、これを「ツムラ」のTが下から支える形になっています... (続きを読む。


ロゴうんちく集 -金融機関編- 2007年07月18日

第2弾は、金融機関のロゴマークを集めてみました。
カラー展開がいろいろで面白いですね。

■みずほフィナンシャルグループ
シンプルで洗練されたロゴタイプ(字体)と動きのある赤い円弧によるデザインは、今まさに太陽が昇らんとする地平線をイメージしたもので... (続きを読む。

■三菱UFJフィナンシャル・グループ
MUFGグループのシンボルマークは、円形をモチーフに、それらを重ね合わせることで、MUFGグループのめざす「グループの総力を結集して生み出す新しい総合金融サービス」と... (続きを読む。

■三井住友フィナンシャルグループ
右肩上がりの上昇カーブを描くマークは、SMFGが常に価値あるサービスを提供していくことにより、お客さま、株主、そして社会と共に発展する願いが... (続きを読む。


■りそなホールディングス
「りそな」を象徴するシンボルマークは、2つのRをモチーフとしており、「りそな(Resona)」と「地域(Regional)」が共鳴し合う様子を表現... (続きを読む。

■新銀行東京
二つの長方形が寄り添った新銀行東京のシンボルマークは、顧客と新銀行の揺るぎない信頼関係を構築することにより、経済の第一線で「常に新しい」存在を目指して... (続きを読む。


■東京都民銀行
このマークに込められた、私たちの想い。それは、人と人とのあたたかなふれあいです。「コミュニティ・バンク」の基本である「人」と東京都民銀行の「T」が交わり... (続きを読む。


こうやって作ればいいのね!ロゴ制作チュートリアル動画集 2007年07月11日

Photoshop や Illustrator などでロゴをデザインする人が多いと思います。

様々なロゴを見ていると、このロゴはどうやって作ってるんだろう?と思うことも多いはず。

ロゴ制作のチュートリアルに関する動画を集めてみました。
制作作業の参考にしてみては?

カンパニーロゴをつくるチュートリアル


きれいな球体のロゴをつくるチュートリアル


Xファイル風のロゴをつくるチュートリアル


Web2.0っぽいロゴをつくるチュートリアル その補足


バッヂをイラストレータでつくるチュートリアル


あるデザイナー(?)のロゴをデザインする過程。


うんちくのないロゴはロゴじゃない!? ロゴうんちく集 2007年07月04日

ロゴマークは、その形状、色などに至るのにさまざまな理由、物語がある。

その業種、サービスの専門家だからこそ語れる「うんちく」。それがロゴにこめられているのだ。
このうんちくを読めば、そのロゴへの理解も深まり、より愛着も増すというものだ。

デザイナーの方は、デザインしたロゴのプレゼンテーション文句を考えるときなどにもご活用ください。

■イー・モバイル [2006年10月17日発表]
新しいブランドロゴマークは、コーポレートカラーに「赤」を採用し、私たちが切り拓いていく新たなモバイルの世界における無限の可能性、私たちの挑戦の力強さと、それにかける... (続きを読む。

■サントリー [2004年4月1日発表]
サントリーのロゴマークは、私たちが生きるこの地球の生命のエネルギーと喜びをあらわしています。その中心イメージは、水。サントリーという企業の源泉とも言える水を、新しい... (続きを読む。

■ダイエー [2005年10月14日発表]
新しいロゴデザインは、ダイエーの文字と、ハートをあしらったマークで構成されます。このマークは、daieiの「d」と、発見やよろこびをあらわす「!」が組み合わさって、こころ(ハート... (続きを読む。

■JCB [2007年2月14日発表]
これまで、「3つのS」は「Sign・Smart・Safety」を、青・赤・緑の「3つの色」は、クレジットカードの汎用性を表現しておりましたが、今回のデザインではブランドパーソナリティの中核... (続きを読む。

■中部電力 [2007年4月2日発表]
中部電力のイニシャル「C」と、親しみと成長・発展を象徴する「花弁」をモチーフにデザイン。5つの「花弁」は、「中部5県の調和と繁栄」、「様々なエネルギーのベストミックス」を... (続きを読む。

■富士写真フイルム [2006年7月12日発表]
新しいロゴは、1980年に制定された赤い六角形のシンボルマークを取り去り、コーポレートブランドの「FUJIFILM」をシンプルに力強く打ち出すデザインとしました。また、ロゴ中央... (続きを読む。

■GMOインターネット [2005年6月1日発表]
2本のラインが交じり合うデザインは、コミュニケーション、ネットワーク、エックス(X)を意味しております。コミュニケーションは、GMOインターネットグループのキャッチコピーであります... (続きを読む。

■帝人 [2003年2月4日発表]
ダイナミックな躍動感とスピード感を持つ新しいブランドロゴは、Human Chemistry , Human Solutionsの実現に絶えず挑み続けるテイジングループの企業姿勢や先... (続きを読む。

■コクヨ [2005年10月2日発表]
新しいコーポレートロゴは、コクヨグループが新たに目指すブランドイメージの「躍動感」がテーマです。軽快で柔らかな曲線を持った文字は、「先進」「独自」「活気」を表現し... (続きを読む。

■DTI [2005年9月14日発表]
これまでのDTIロゴをベースによりスタイリッシュにしたデザインと、ブランドカラーは力強さのある明るくさわやかな赤を採用。DTIのブランドイメージ「高品質」、「知的感」、... (続きを読む。


ロゴデザインはリスペクトとインスピレーションから? ロゴデータベースサイト集 2007年05月01日

ロゴマークのデザインをするなら、様々なロゴを見てみるのもよいでしょう。
そこからインスピレーションを受けるかもしれません。

ロゴデータベース的サイトで目指すデザインを見つけよう。
このロゴストック以外にもたくさんあります。

■ロゴログ
ロゴストックの先輩的サイト。いいロゴ揃ってます。

■LogoPond
ロゴストックの外人の先輩。海外のロゴデータベース。

■Creator's Exchange
公共ロゴのイラレデータがあります。無料でダウンロードできるようです。

■LOGO-TANK
​企業、団体、商品等のロゴが1000点以上だそうです。
全て無料でダウンロードできるようです。

■the best brands of the world
世界中の企業・ブランドのロゴマークがかなり多くの量あります。

■ロゴストック logo stock
今あなたが見ているこのサイトです。
どんどん、集めていきます!

その他にも、オススメのロゴを集めたサイトがありましたら教えてください。


Web上でロゴが簡単に作れる5つのサイト 2007年04月16日

logo stockは、ロゴ紹介だけでなく、ロゴ制作に役立つサイトなども紹介していきます。
まずは、第一弾。

Web上には便利なツールがたくさん!
無料で使えるツールを使って、いざロゴ制作。

本格的にロゴをデザインするほどでもないけど、簡単にオシャレなロゴを作りたいといったときに役立つサイトをピックアップしてみました。

  • LogoYes
    Web上でロゴ制作から購入まで。
    軽快なインターフェースで簡単につくれます。
    ちなみにlogo stockはこんな感じ。

  • FREE Logo Maker
    こっちは4ステップで簡単にロゴ作成。

  • Web2.0 Logo Creator by Alex P
    いわゆるWeb2.0っぽいロゴが簡単に作れる!
    結構いろんなサイトで見かけますね。

    Generated Image

  • Flickrロゴメーカー
    flickrのロゴをお手軽生成だそうです。はい。

  • ImageChef イメージクリエーター
    ロゴとはちょっと違うかな?簡単にオシャレな画像を作れます。



1 2 →次のページへ

ロゴストックからのお知らせ


ロゴストック mobile

ケータイでもロゴストック。
http://logostock.jp/m/

あわせて読みたいブログパーツ