グレヌデサ La graine du dessin: Designアーカイブ

バナーの国際規格

IAB(Interactive Advertising Bureauの略)という広告の業界団体が定めるバナーの国際規格をご紹介します。

Google Adwards や Amazonのアフィリエイトにはこのサイズが使用されているので、参考にしてください。なお、この規格はあくまで推奨されているものであり、必ずしも守らなければならないものではありません。

カテゴリーは【Rectangles and Pop-Ups】【Banners and Buttons】【Skyscrapers】の3つになります。

Rectangles and Pop-Ups：長方形型とポップアップ型

※クリックで原寸大になります。

300 x 250 Medium Rectangl
250 x 250 Square Pop-Up
240 x 400 Vertical Rectangle
336 x 280 Large Rectangle
180 x 150 Rectangle
300x100 3:1 Rectangle
720x300 Pop-Under

Banners and Buttons：バナー型とボタン型

※クリックで原寸大になります。

468 x 60 Full Banner
234 x 60 Half Banner
88 x 31 Micro Bar
120 x 90 Button 1
120 x 60 Button 2
120 x 240 Vertical Banner
125 x 125 Square Button
728 x 90 Leaderboard

Skyscrapers：摩天楼型

※クリックで原寸大になります。

160 x 600 Wide Skyscraper
120 x 600 Skyscraper
300 x 600 Half Page Ad

サイズ以外にもファイルサイズやアニメーション時間も定められています。また、随時ガイドラインが見直されているので、詳しくは公式サイトをご確認ください。
(参照:IAB - Ad Unit Guidelines )

(megumi)

クリエイティブ探訪　-築地活字編-

以前、若いデザイナーの間でひそかに「活字ブーム」なるものがじわじわ広がっているという新聞記事を読み、
ずっと気になっていたのですが、そのことを別件で向かっていた東京行きの新幹線の中で思い出し、
急遽予定を変更して、横浜の「築地活字」さんにお邪魔してきました。

株式会社築地活字
創業1919年以来、活版印刷用金属活字の鋳造販売業を行っていらっしゃる歴史ある会社です。
月に1回「活版活字鋳造見学体験会」という催しを行っており、2500円の参加費で
自分の名前の活字を鋳造し、名刺をつくることができるそうです。

ところで活字って何？かと申しますと、

活字（かつじ）は、狭義においては活版印刷の際に文字の図形を対象（特に紙）に印字するもので、木や金属に字形を刻み、それにインクをつけて何度も印刷できるようにしたものである。また広義においては、写真植字の文字盤やデジタルフォントをはじめ、広く文字を同一の字形で繰り返し表現するものを含む。 (wikipedia「活字」より引用)

印刷は大まかに分けると凸版・凹版・平版・孔版がありますが、この中でも活字は凸版に分類されます。
構造はいたってシンプル。ハンコのように、文字の部分が土台よりも一段高くなっており、
そこにインクをのせ、圧力をかけて転写させます。一文字一文字がバラバラになっているので、
一度印刷した後も組み替えて繰り返し使用することができます。

今や、DTPの発達によりパソコンでの文字製版が可能となり、
活版印刷はごく限られたものにしか見られなくなってしまいましたが、
版を押し当てた時にできる凹凸の手触りや仕上がりには独特の風合いがあり、
密かに人気があります。

と説明が長くなってしまいましたが、活字を体験したことがない私は興味深々。百聞は一見にしがず！
ということで、いざ、築地活字さんへ！

今回急遽アポなしでの訪問だった為、鋳造見学体験会はありませんでしたが、
職人の平工さんが快く迎えてくださいました。

印刷技術については学生の頃デザイン史で習ったきり...ほとんどうろ覚えだったので尻込みしてしまいましたが、平工さんが一つ一つ丁寧に説明してくださいました。

活字のサイズは１号とか２号とか、ポイントで設定されています。
一番大きいのは初号と呼ぶそうです。

これは一番小さいの。

活字の「部屋」と呼ばれる右手の棚に活字がビッシリ入っています。
「銀河鉄道の夜でジョバンニが拾っていたのアレですね！」と、思わずしょうもないコメントをしてしまい
「あんなに暗い仕事ではありませんよ。実際はもっと明るい現場ですよ。」と
笑われてしまいました。

活字は鉛+アンチモン+鈴を高温で溶かして型に流し込み成形します。
その元になる型を母型（ぼけい）といいます。
写真ではわかりづらいですが活字とは逆に凹形に文字が彫ってあります。
この母形は火災にあっても燃えてしまわないように、頑丈な金庫にしまわれていました。
長年受け継いできた歴史の重みを感じますね。

そしてこれが鋳造機！現代アートかと思うぐらいカッコよかったです。
釜と一体になっていて、自動で鋳造の工程を行います。
古いけどメカメカしい。こういうものを見た時のボキャブラリーが乏しいので何といったらいいか難しいですが一言で表すとすれば「産業革命！！」という感じでした。
この日は一通りの作業が終わった後だったため、残念ながら稼動しているところは見ることはできませんでした。次回は必ず！

できたてほやほやの活字たち。ピカピカです。

活字ができあがったら、版を組み手動で印刷作業をします。字間などはスペーサーで調整するそうです。
Webでいうなら、携帯コーディングで使ったりするspacer.gifみたいなものですね。

最後に印刷見本を色々見せていただき、記念に書体見本を購入。
電話でも注文できるそうです。私はたまに趣味で革細工なんかもやるのですが、この活字を使って型押しもできるそうです。花形なんか入れたらカワイイ！とわくわくしながら見せていただきました。

時代の流れの中、こういった手間のかかる技術を使ったものはだんだんと少なくなってきていますが、
今回見学を通して、心と魂のこもった職人さんの技術に触れることで、これは無くしてはいけないし、これからも決して無くなることはない、と感じました。

日々の仕事でも、もちろんスピードは大切ですが、こういった「心をこめる」というスピリットも大事にしていきたいなと思いました。

ということで...！ジーピーオンラインの制作物も、スタッフ一同魂を削って制作しています。
そんなWeb職人渾身の制作事例はこちら！

Photoshopでデザインの効率化　ショートカットの巻

ショートカットキーで効率化なんて、デザイナーの方にとっては「そんな当たり前の事・・・」と思われるかもしれませんが、
全てのショートカットキーを把握している！なんて人は、稀ではないかと思います。

よく使うキーだけでなく、たまにしか使わないキーも覚えておくと、
作業効率を上げることができます。

ショートカットキーの一覧を公開されている方もたくさんいらっしゃいますので、是非ご参考ください。
フォトショップショートカットリスト PhotoshopShortcutList

ちなみに、上のマンガ内に出てきました「カンバスサイズの変更」は　[ Ctrl + Alt + C ]　となります。
ついでに「画像解像度の変更」の　[ Ctrl + Alt + I ]　も合わせて覚えておくと便利です。

エラソーですが、私も一部しか頭に入っていません。
とにかく、有言実行ですね・・・。

その他にも、ショートカットキーに関する記事を掲載しているサイトを集めてみました。
ぜひ参考にしてください。

【Photoshop】
知っておくと便利なPhotoshopショートカットキーまとめ | DesignWalker
ITキヲスク | 脱・初心者のための厳選Photoshopショートカットキー16選

【Illustrator】
デザインの裏技blog Illustratorショートカット一覧
Illustrator CS3 キーボードショートカット 50 - DTP Transit

(kana)

SO MEの素敵なアートワーク

http://www.shift.jp.org/より転載

フレンチ・エレクトロのレーベル、ED Banger Recordsのアートワークをほぼ一手に手掛けているフランスのアートディレクター、ソー・ミー。
ハンドライティングの独創的なタッチとカラフルな色使い、そしてちょっとダーティーな世界観。
「ジャケ買い」とはまさにこのこと！一度見たら忘れられない彼のキャッチーなグラフィックの中から私のお気に入りの作品をご紹介します。

justice - D.A.N.C.E
ソー・ミーの作品で有名なのがこのPV。好きすぎて何回見たことか...！
キャンバスに見立てたTシャツの中でサウンドに合わせてカラフルに動きまくるTシャツ芸がめちゃクールです。モノクロの背景とは対照的なビビッドカラーが、どこか懐かしいディスコテイストなサウンドとうまく絡み合っていい感じにアナログな雰囲気を醸し出していますね。ナイス！

Justice - DVNO
古きよき80'sへのオマージュ？とも思えるハリウッド映画のタイトルのパロディ風のロゴタイプが歌詞に合わせて次々と展開していく映像。BACK TO THE FUTUREとタイポ好きな私にはたまらないPVです。モーションはiPodのCMでもおなじみの「Shoot the runner」を手がけたMachine Molle。

このPVに出てくるロゴタイプについては下記サイトにて詳しく分析されています。元ネタとなったロゴが紹介されていて興味深い記事です。
fontfeed.com
http://fontfeed.com/archives/back-to-the-eighties-with-justices-dvno/

Ed Banger Records VOL. 2
ED Banger RecordsのCMclipです。所属しているアーティストのジャケが動きまくるアニメーションが秀逸です。D.A.N.C.EのPVと同じ手法のようみ見えますが、どのように作られているのでしょうか？

Kanye West - Good Life ft. T-Pain
こちらもロゴワークが彼らしいPVです。

ついでにジャケットのデザインも色が素敵です。
(画像は amazon.co.jpより）

また、彼のすごいところは、アーティスティックなポップカルチャーやファッションだけでなく西洋美術にも精通しており、それを彼なりの感性で作品にアウトプットし新しい表現を生み出しているところです。
彼がデザインした同レーベルのアーティスト"Mr.Oizo"のジャケットににその片鱗が散りばめられています。

MR.OIZO - POURITURE

51+tuufxYRL._SL500_AA240_.jpg

こちらのジャケはマネの「草上の昼食」をモチーフにしているそうです。

LAMBS ANGER

51d97hl8rQL._SL500_AA240_.jpg

こちらのアルバムはルイス・ブニュエルとサルバドール・ダリの「アンダルシアの犬」へのオマージュ。
SO-MEのアートワークへの解析については、梶野彰一さんのblogで詳しく書かれています。

QUI EST "IN" QUI EST "OUT"
http://cherchem.exblog.jp/11308915/

最近ではネットショップ｢COOL CATS｣を開設し、Tシャツや、グッズの販売を行ったり、NIKE - エアフォース1とのコラボレーション様々なアーティストとコラボレーションするなど、ますます精力的に活動を展開しているSO-ME。

彼のエンドレスなチャレンジから今後も目が離せません。

(yukako)

なにもないに全てある

過去に読んだ本の中で、原研哉さん「デザインのデザイン」という本があります。学生の頃に読んだ本ですが、今読み返しても大変参考になる本です。この本では、デザインの持つ意味や意義を、原さん自身の手がけたデザインの具体例や経験談を通して表現されています。
その中でも特に印象に残ったのが無印良品のブランディング。
当時の私の中での広告といえば、写真があってキャッチコーピーがあって「なるほどこれはココがイチオシなわけね」というのがほとんど。無印良品の広告は写真のみ。あとはロゴだけ。
徹底して無駄を排除したデザインです。
当時の私にはとても印象的だったわけです。

日本デザインセンター原デザイン研究所無印良品
http://www.ndc.co.jp/hara/home/muji2003/index.html

無印良品のコンセプトは「EMPTINESS」
広告そのものが明確なメッセージを打ち出すのではなく、むしろ広告としては空っぽの器を差し出すようにふるまうということ
（引用：原研哉「デザインのデザイン」）

ここまでシンプルにできるのも、根底にしっかりしたコンセプトがあるからなのですが、Web でもコンセプトワークは大変重要になってきます。といってもグラフィック広告のようにビジュアルのみで簡潔することはまずありません。よりユーザーとの距離が近くなるため、デザインする場合にも多くの要素が必要となってきます。当たり前にサイトをもつようになってきた今、他の企業との差別化を図り、より明確なメッセージを打ち出していくためにも、こういったコンセプトメイキングやブランディングという思考は、これからもどんどん広がっていくでしょう。

>デザインのデザイン