「最近のWEBとCM」

テレビ好きです。
面白しろいＣＭ大好きです。
Takumaです。

【Web誘導CM】
《commercial message》「コマーシャル1」に同じ。
(by yahoo辞書)

今回はWEBとその他のメディアについてのお話です。

今日のニュースでこんな記事をみっけた。
■「Web誘導CM」1年で10倍に急増
http://www.j-cast.com/2007/09/26011669.html

記事のポイントとしては以下のとおり
・07年上半期に作成されたインターネットに連動したテレビCMが725
　⇒内、「Web誘導CM」が前年同期比（71本）で約10倍に急増

・特徴例(1)：視聴者をインターネット上のウェブサイトに誘導。
・特徴例(2)：ウェブサイトでテレビCMのストーリーの続編が視聴可。
・特徴例(3)：キャンペーン情報を入手できる。

■そういえば、近年よくみるようになりました。

先日、大手WEB代理店のセミナーを受けてきたのですが、
やはりこの点についても若干ながら触れていました。

キーワードは
「メディアミックス」や「クロスメディア」
お客さんとの接点(コンタクトポイント)はリアル店舗も含めみんな総動員で、行うべきとの事。

それに、「one to one アプローチ」がWEB2.0的なイノベーションで出来るようになった。
(↑アマゾンのレコメンド機能・ロングテール商法とか、ジャパネットたかたのＣＭ等々。)

加えて、流通の中でのWEBの立ち位置も、主体的になり始めてるらしい。
という事は、もっと「直感的に分かりやすい」＆「使いやすい」＆「Ajax風」なものがクライアントからもユーザーからも求められるのだろう。

最近話題のこんなのとか？
■モデくる
http://www.st-image.com/0/guide-02-03/contents.aspx

俺らの時代が来たぜ！！って感じでうれしいですよ。
うれしいですけど。。。頭が痛い。

￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣

Takuma Saitou Works site - 私的展示・アトリエ空間(PC)
[ http://www.geocities.jp/takuma_saitou/ ]
ブログ(PC・モバイル)
[ http://takumasaitou.blog114.fc2.com/ ]

「新規ウィンドウの小技」

サイト制作好きです。
ＷＥＢ標準めんどいです。
Takumaです。

【ＷＥＢ標準】
W3Cが勧告しているWWW関連の規格のことである。
特にウェブサイト製作に関わるHTMLやCSS、DOM、WCAG等のことを言う。


http://ja.wikipedia.org/wiki/%E3%82%A6%E3%82%A7%E3%83%96%E6%A8%99%E6%BA%96
(by ウィキペディア)

今回はWEBの制作ネタのお話です。

みなさま
■Another HTML-lint gateway
http://htmllint.itc.keio.ac.jp/htmllint/htmllint.html
というサイトはご存知でしょうか？

W3Cが勧告している「正しいとされているhtml記述」をチェックできるサイトです。

Takumaも以前、公共機関のサイトを作ったことがあるのですが、
こちらのサイトで全ページ「80点以上(←たしか)」という営業からの無茶振りを受けなきながらお世話になったことがあります。

あの頃、cssによる分離型コーディングも走り出しで
高級品感覚だったのに3年もたてば、いまや常識となってしまいました。
と前置きはコレぐらいにして今回は、

■WEB標準対応(?)の新規ウィンドウの出し方
のお話です。

Takumaもコーディング業務から離れて久しいのですが、
そんな私でも、お勉強のために作品サイトを活用しております。
(↑コーディングのスペシャリストには、かなり適わないですけど。。。)

そんな中、「Another HTML」でソースコードをチェックした際に
こんな警告をされました。





簡単に訳すと
「何年も前から使うなっていってるだろ！
　いい加減、使うのやめろよ！！(怒)」
というないようです。

タグの「TARGET属性」は「_blank」と指定すると
リンク先を新規ウィンドウで開いてくれます。
(↑外部リンク等に有効なリンクのしかたなのです。)

しかしながら、使うなとおっしゃる(号泣)。。。
というわけで回避策を探していたところ、
素敵な解決法が紹介されていたので、作品サイトでも一部反映してみた。

●javascriprを使用
外部jsファイルを用意し、aタグ内にclassを指定することにより別ウィンドウリンクを設定。

・外部jsファイルの内容
window.onload = function() {
var node_a = document.getElementsByTagName('a');
for (var i in node_a) {
if (node_a[i].className == 'newwin') {
node_a[i].onclick = function() {
window.open(this.href, '', '');
return false;
};
}
}
};

▼元ネタ：mikiさん
http://bodytalk.girly.jp/

▼紹介/解説：REDLINEさん
http://blog.livedoor.jp/red_line/archives/50765597.html

この方法でやんないと
リンクごとにjavascriptを直接記述しなくてはならなそうで、困ってたのです。

というわけで「Another HTML」のご機嫌をとるのに、
一つ大きなハードルを超えたと思ったのですが、
(↑「Safari」では正常動作しないらしい。)
お仕事ではちょっと厳しいかも。。。


￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣

Takuma Saitou Works site - 私的展示・アトリエ空間(PC)
[ http://www.geocities.jp/takuma_saitou/ ]
ブログ(PC・モバイル)
[ http://takumasaitou.blog114.fc2.com/ ]

続きを読む »

「Photoshopベストショートカット30」

Photo shop好きです。
ショートカット大好きです。
Takumaです。

【ショートカット キー】
コンピューターで、キーボードの複数のキーを組み合わせて入力することにより、
ディスプレー上のメニューから選択することなしに、特定の機能を実行させるキーの総称。
(by Yahoo辞書)

先日、会社の後輩にデザインツールの使い方を説明する際に
1/3がショートカットでしか説明できませんでした。

実践主義のTakumaです。

デザイン系の業種ですと、皆様かならずと言っていいほど使用するツール。
Photo shop
別にPhoto shopに限るわけではないのですが、ショートカットはとっても便利です。

そんな、ショートカット中毒推進活動の一環として下記の記事を紹介いたします。




■Photoshopベストショートカット30
http://www.webdesignerwall.com/tutorials/photoshop-secret-shortcuts/

説明はMac版なので、
Cmd = Ctrl
Opt = Alt
に置き換えればWindowsでもいけると思います。

￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣

Takuma Saitou Works site - 私的展示・アトリエ空間(PC)
[ http://www.geocities.jp/takuma_saitou/ ]
ブログ(PC・モバイル)
[ http://takumasaitou.blog114.fc2.com/ ]

「256色でも伝統色」

様々な色彩好きです。
伝統色大好きです。
Takumaです。

【色彩】
１ いろ。いろどりや色合い。「―が美しい」
２ 物事にあらわれている、あるようすや傾向。「保守的―が強い
(by Yahoo辞書)

インターフェース重視のデザインの場合。文字の視認性を確保し、
掲載する写真をジャマしない為に「背景は白」と考えやすい傾向にある
昔は白いキャンバス全体をビビットカラーで塗りたくってました。Takumaです。


最近、「群青」という作品を作り
日本色の名前に魅力をとっても感じました。

日本色について特別勉強したことが
お恥ずかしながら、なかった私ですが

WEBの256色ワールドでも伝統色！！
的なサイトを見っけました。




■色彩のスパイス
http://www.nicopon.com/

日本を始め「世界各国の伝統色」が載っている素敵なサイトです。
まずは




・日本の伝統色
http://www.nicopon.com/iro/ja/index.html

その他にも
・中国の伝統色
http://www.nicopon.com/iro/china/index.html

・イギリスの伝統色
http://www.nicopon.com/iro/uk/index.html

・フランスの伝統色
http://www.nicopon.com/iro/france/index.html

外国サイトですが「500色の名前を一覧できる」素敵なサイトはこちら。
■500+ Colours
http://cloford.com/resources/colours/500col.htm

■解説記事
http://www.designwalker.com/2007/09/color-name.html

色の名前は本当に沢山あるんですよね。

いまさらですが、デザイナー1年生の頃
緑系の色を指差して「このアオ色が・・・」と発言し
「昭和初期の人間か？お前は。」と突っ込まれた事がありました。

同じような経験がある人は(←いないだろうけど。)
是非、ご活用下さいませ。


￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣

Takuma Saitou Works site - 私的展示・アトリエ空間(PC)
[ http://www.geocities.jp/takuma_saitou/ ]
ブログ(PC・モバイル)
[ http://takumasaitou.blog114.fc2.com/ ]

「インターフェース虎の巻」

サイト設計好きです。
インタフェースデザイン大好きです。
Takumaです。

【インタフェース】
コンピューター本体と各種周辺装置やコンピューターどうしを接続し、電気信号の大きさを調整したり、データの形式を変換したりして、両者間のデータのやりとりを仲介する回路や装置。また、人間がコンピューターなどの装置を円滑に使用できるようにするための操作手順。インタフェイス。
(by Yahoo辞書)

商業デザインの場合インターフェース重視のサイト構築が
多くなる傾向のTakumaです。

日々、いろんなサイトやデザイン系ブログを見つつ
「こんなインターフェースがでてきたんだ。」とか
「こんな組み合わせで面白いことできるんだ。」とか
「あっ。これ使いづらい」とか
考えたり忘れたりしている分けですが、

インターフェースの虎の巻的サイト
を見っけました。





■Welie.com
http://www.welie.com/の
http://www.welie.com/patterns/index.php

いろんなところで見る「あれやこれやのナビゲーションの名前と実例」が載っている素敵なサイトです。
Ajax的ナビも紹介されています。

例えば
・アコーディオン(最近、作品サイトで導入したタイプ)
http://www.welie.com/patterns/showPattern.php?patternID=accordion

・スクローリングメニュー(Flashでよくある座標をつかった動きのタイプ)
http://www.welie.com/patterns/showPattern.php?patternID=scrolling-menu

・ナビゲーションツリー(Google Suggest見たいな奴とよく言うタイプ)
http://www.welie.com/patterns/showPattern.php?patternID=tree

もはや一種の暗記の域に近いですが、
学生のテスト前の気分
で覚えてみようと思います。


￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣

Takuma Saitou Works site - 私的展示・アトリエ空間(PC)
[ http://www.geocities.jp/takuma_saitou/ ]
ブログ(PC・モバイル)
[ http://takumasaitou.blog114.fc2.com/ ]

「素敵な素材データ配布サイト」

グラフィックソフト好きです。
Illustrator大好きです。
Takumaです。

【Illustrator】
Adobe Systems社のグラフィックス描画アプリケーションソフト。画像を点の座標や点を結ぶ曲線の方程式のパラメータなどの形で扱うベクター(ベクトル)グラフィックスを作成・編集するソフトで、直線や曲線、円などの図形を組み合わせて描画を行なう。
(by Yahoo辞書)

最近、経験の浅い後輩にIllustratorを教えることが激増中のTakumaです。
というのもデザインのレクチャーをすることが多くなっているのですが
その中でこんな傾向が。

・Photoshopの基本機能は使えるが写真加工が苦手
・簡単なデザインはできるが、イラストは無理
・Illustratorは基本的に使えない

I Love Illustrator
を自負しているTakumaといたしましては
実に切ない思いを日々しつつ、布教に力を入れています。

そんな中、こんな素敵なサイトをみっけました。



■bittbox
http://www.bittbox.com/

クォリティの高いボタンやアートブラシ等をフリーで配布している
私のような状況に置かれている人間にすばらしく優しいサイトです。




その中のピックアップページ
・http://www.bittbox.com/freebies/free-photoshop-buttons-white-glass/
・http://www.bittbox.com/freebies/free-vector-web-page-elements-part-4/
・http://www.bittbox.com/freebies/free-vector-web-page-elements-part-3/
・http://www.bittbox.com/freebies/free-vector-glass-orbs/
・http://www.bittbox.com/freebies/free-vector-web-page-elements-part-2/
・http://www.bittbox.com/freebies/free-vector-buttons-and-icons-metal-and-glass/
・http://www.bittbox.com/freebies/free-vector-glass-header-designs-fancy/
・http://www.bittbox.com/freebies/free-vector-web-page-elements-part-1/
・http://www.bittbox.com/freebies/72-free-vector-glass-buttons-and-bars/
・http://www.bittbox.com/freebies/free-vector-glass-bar-set-diagonal-striped/

■日本語の解説ページ
・http://e0166.blog89.fc2.com/blog-entry-107.html

彼らにあくまでサンプルを探させたりするのに便利なのですが、
長期で考えた場合、基礎が弱くなる可能性が。。。

でも、これをきっかけに好きになってもらえれば。


￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣

Takuma Saitou Works site - 私的展示・アトリエ空間(PC)
[ http://www.geocities.jp/takuma_saitou/ ]
ブログ(PC・モバイル)
[ http://takumasaitou.blog114.fc2.com/ ]

「作品を追加しました」

お散歩好きです。
写真撮影大好きです。
Takumaです。

【箱庭】
浅い箱に土や砂を入れ、小さい橋・家・人形などを置き、木や草を植え、庭園・山水などに模したもの。《季 夏》「―の人に古りゆく月日かな／虚子」
(by Yahoo辞書)

引き続き風邪で床に伏せており、やることがありません。Takumaです。
外に出るといえば、自宅と病院の間という実にストイックな毎日です。

実にこの様な事態になるのは数年ぶり(就職してから無かったはず)というワケでして

正直、何をしてよいのか分かりません。。。

だからといって、

先生に「熱これだけあるのに仕事にはいきませんよね？」とか
言われても。

会社の営業に「体を鍛えなおしたら？」とか
言われようと。。

こうなる背景をしる部の上司から「ゆっくり しっかり治して」と
言われても。。。

やっぱり会社には逝けないので、
一日に5度寝する合間に作品を作ったりしてました。
(↑すぐダウンするんだけどね。)


▼ Photo Worksに追加「箱庭」
http://www.geocities.jp/takuma_saitou/photo/



代休が無くなっていく。。。
(↑また直ぐたまるんだろうけど：泣)

￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣

Takuma Saitou Works site - 私的展示・アトリエ空間(PC)
[ http://www.geocities.jp/takuma_saitou/ ]
ブログ(PC・モバイル)
[ http://takumasaitou.blog114.fc2.com/ ]

「カラーマネージメント サイト」

色選び好きです。
デザイン大好きです。
Takumaです。

【配色】
スル2種以上の色を取り合わせること。また、取り合わせた色合い。
(by Yahoo辞書)

小さい頃。白いキャンバスに思いのまま、想いのままに
色の華をさかせていました。

最近は「いけてる配色になったけど。。。客にどう説明すっかな？」
という場面によくはちあわせ、その果てに。
デザインの解説ドキュメントの作成スキルがメキメキあがりました。。。
複雑な思いで日銭を稼いでおります。Takumaです。

きっとこのサイトを見ていただいたデザイン関連の方は少ないのは承知の上。
デザイン系の友人より、プログラマ系との相性がいい私ですが、
便利なサイトをいくつか見っけたのでご報告。




▼ ColorBlender：http://www.colorblender.com/
デザインが苦手な人でも「パレットデザイン」が簡単にできる。

自分の好きなキーカラーを1色を選ぶだけで、6色のカラーパレットを自動生成してく
れる無料サービス。
生成された色のカスタマイズ、データのダウンロードも可能です。

▼ ColorToy 2.0：http://www.defencemechanism.com/color/
配色が苦手な人でも一色決めれば、パレットを作ってくれる。
自分の好きなキーカラー(RGB指定)を1色を選ぶだけで、9色のカラーパレットを自動
生成してくれる無料サービス。


▼ I Like Your Colors ：http://www.degraeve.com/color-palette/index.php
指定した画像(URL)からカラーパレットを作ってくれるサービスです。

クライアントから「●●な感じ〜♪」とか言われたときに
Google イメージ検索(http://images.google.co.jp/)と連携すると時間の節約になる
かもしれません。

▼参考サイト：元の記事のこちらには掲載サイトがもっとたくさん。
http://weblibrary.s224.xrea.com/weblog/webdesign/post_10.html#more

￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣

Takuma Saitou Works site - 私的展示・アトリエ空間(PC)
[ http://www.geocities.jp/takuma_saitou/ ]
ブログ(PC・モバイル)
[ http://takumasaitou.blog114.fc2.com/ ]

「ネジまき」

アナログチック好きです。
ネジをまくオモチャ大好きです。
Takumaです。

【ネジ】
ぜんまいを巻く装置。また、ぜんまい。
(by Yahoo辞書)

エアコンの無いエコロジーライフを実践中の今日この頃。
9月初頭の急な天候の変化についていけませんでした。
風邪で寝込んでおります。Takumaです。

今週頭から調子が悪かったものの、無理を押して出社。
⇒今週のミッションをコンプリート。
⇒金曜日に悪化し倒れる。

そんな、綱渡りな生活をしている昨今。
忙しくなければ、勤務地が渋谷ということで
原宿なんぞにお散歩にいけるのですが。

8月の今頃。
給料が入り、生活が一時的に(←そう。一時的に：泣)潤い
何か買いたくなる衝動にかられます。(←今月はカゼ薬：号泣)

そもそもアナログチックな物が好きな私ですが、
近年このようなものをチョクチョク買っています。





■KIKKERLAND(キッカーランド)
http://www.kikkerland.com/

シンプルでネジがついててナイスなシリーズです。
一つ当たり、日本では￥1,500くらいで売っています。(←微妙に高い。)

寝込んで暇すぎてマダム(飼い猫)には無視され、
これで遊んでいる駄目な休日を過ごしています。

ちなみに、Takumaのネジを巻いてくれる人を募集しています。
ここ数年出会ってませんが。。。


￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣

Takuma Saitou Works site - 私的展示・アトリエ空間(PC)
[ http://www.geocities.jp/takuma_saitou/ ]
ブログ(PC・モバイル)
[ http://takumasaitou.blog114.fc2.com/ ]

「スーパー風シールメイカー」

スーパーマーケット好きです。
特売品大好きです。
Takumaです。

【POSシステム】

『店舗で商品を販売するごとに商品の販売情報を記録し、集計結果を在庫管理やマーケティング材料として用いるシステムのこと。
(by Yahoo辞書)

24H営業のスーパーが憩いの場所となっている今日この頃。
前職場の尊敬する女性のディレクターに「サイトー君 お母さんっぽいよね♪」とさらりと言われた事があります。
ほめ言葉であると、未だに自分に言い聞かせる毎日を送っております。
Takumaです。

スーパー風シールメイカー
http://azflash.net/az/fla/barcode.htm

特にお惣菜とかにスーパーで張られているあのシールを
作れるサービスです。

とりあえずサンプルで自分のシールを作ってみました。





台風迫り、早く帰宅するよう総務から促されているにも関わらず、アホな記事を書いています。
上から「50％OFF」とか張られないように頑張んないと。


￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣

Takuma Saitou Works site - 私的展示・アトリエ空間(PC)
[ http://www.geocities.jp/takuma_saitou/ ]
ブログ(PC・モバイル)
[ http://takumasaitou.blog114.fc2.com/ ]

「ヱヴァンゲリヲン新劇場版」

エヴァンゲリオン好きです。
ヱヴァンゲリヲン大好きです。
Takumaです。





【ヱヴァンゲリヲン新劇場版】

『新世紀エヴァンゲリオン』前回のTVシリーズ及び劇場版を「旧世紀版」と呼称した。
時間軸はTVシリーズと同一だが、前編から後編までは旧作のフィルム映像は一切使用せず、現存する原画から新たに撮り直し、それに新画像を大幅に付け加えた作品になる。

また新設定や新キャラクターも登場する。完結編は完全新作となり、その終わりは企画段階の構想に近い、大団円となるエンターテイメント志向の作品になるという。

http://ja.wikipedia.org/wiki/%E3%83%B1%E3%83%B4%E3%82%A1%E3%83%B3%E3%82%B2%E3%83%AA%E3%83%B2%E3%83%B3%E6%96%B0%E5%8A%87%E5%A0%B4%E7%89%88
(by ウィキペディア)

公開当日に見てきましたTakumaです。
売り切れまじかの席(前から二列目：見上げ決定)で何とか見てきました。

個人的結論：よかった
Death編のほとんどがテレビアニメの再編集だったが、今回は違う！！
細部まで書き込まれたディテールのクオリティに加え、使途のデザインが格段に「使途」という「何か」を深くしていた印象が強いです。
(特にラミエル)

以下、テンション上がりっぱなしのネタバレとなります。

▼その海は「青」じゃなくて赤いものだった。
前の世界とちがい「赤」い海が当たりまえの世界。

⇒前回と同じスタートラインでは無いと思った。
　シンジの心、行動もどこか力強さを各所に感じた。
　シンジ自身も世界も何かを越えてきたのではないか？

▼ミサトが知る。セントラルドグマの秘密・意味。
　前回、加持の死と引き換えに手に入れた真実の欠片。

⇒ヤシマ作戦前の戸惑い、孤独にさいなまれるシンジに伝えようとするミサト。
　開かれる扉はヘブンズドア。その前には、リリスの姿があった。

　仲間の覚悟と思いをミサトの手の力と共に預けられ、
　シンジは戦いの中で自分の想いと重ね合わせ、そして勝つ。
　
▼月で目覚めたカオルの呟き

「わかっているよ。あちらの少年が目覚め、概括の段階に入ったんだろ？ 　また三番目とはね。変わらないな君は。会える時が楽しみだよ、碇シンジ君」
　(※うる覚え。)
⇒「また三番目」このセリフが意味する新劇場版の世界のあり方に心が躍り止らない。


▼第6のエヴァ
　予告編の「月から舞い降りる第6のエヴァ」そして、「眼鏡の少女」
「破」とされる次回作から、新しい世界の歯車がスピードを加速していく。

だめだ。エヴァが止まらない。
日付か変わり今日から仕事だが、アートモード(右脳)からデザインモード(左脳)に切り替わらない。

今週はどうなるやら。。。

￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣

Takuma Saitou Works site - 私的展示・アトリエ空間(PC)
[ http://www.geocities.jp/takuma_saitou/ ]
ブログ(PC・モバイル)
[ http://takumasaitou.blog114.fc2.com/ ]