takumaの「デザインはあれでアートはそれで」

Google技術進歩 早すぎです。
Googleはどこまで行くのだろう。
Takumaです。
　

【GoogleMap】
Google マップ（英:Google Maps、ぐーぐる-）は、検索エンジンのGoogleが提供しているローカル（地域）検索サービス。地図、航空写真、地形の3つの方式で、ズームを調節し、全世界を見ることができる（航空写真については、地図情報を航空写真に重ね合わせた表示と、航空写真のみ表示とで2種の表示方法が用意されている）。アメリカ国内のみ渋滞情報の表示ができ、またアメリカと一部のヨーロッパ地域のみ経路検索もできる。サンフランシスコやニューヨーク、ラスベガスの一部では、主要な道路からの風景を見ることもできる。日本のテレビ各局では、ニュース番組において、事件・事故の現場の位置などを指し示す際、Google マップを引用することが増えてきている。(by ウィキペディア辞書)

というわけで、久々の晴天の霹靂的なインパクトをくらったツールなので、二日連続で調べてみました。

とりあえず・・・・埋め込んでみようか。

■GoogleMapストリービュー写真の埋め込み方■■■■

(1)前日に記載した手順

http://www.takumart.net/wordpress/archives/561

の「どんな機能なの？ストリートビュー」をみながら、まずは埋め込みたい場所へ移動して写真を表示してください。

(2)画面右上の「リンク」という部分をクリックします。
（※画像の丸く囲ってある部分）

(3)すると、転載用URLの書いてあるウィンドウが立ち上がります。
（※画像の四角で囲ってある部分）

(4)ここに書いてある「HTML を貼り付けてサイトに地図を埋め込みます」の下のソースをコピペしましょう。

大きな地図で見る

するとこんな感じになります。

(＋α：メールに貼り付け)
「HTML を貼り付けてサイトに地図を埋め込みます」の上にある「このリンクをメールに貼り付けて地図を共有できます」のソースをコピペしましょう。

■公式サイトが出来たみたいです■■■■■■■■■■

Googleさんは「使いたきゃ使え！！ヘルプをみてわかんなきゃ頑張っていじって覚えろ」というツール開発と公開が中心ですが、今回はigoogleぐらい一押しなのでしょう。紹介ムービーまで作っています。

▼オンラインで街を歩こう。Google マップのストリートビュー▼

http://www.google.co.jp/help/maps/streetview/

んでムービーはこれ。

「Googleのクリス君：人間」が黄色い人のキグルミを着て使い方を紹介してくれます。
(猛暑の中、お疲れ様です・・・クリスの日本語のイントネーションは微妙ですがご愛嬌です)■どうやって撮影しているのかしら■■■■■■■■■というわけで、反響の大きさが凄いGoogleMapストリートビューですが、いろいろ面白い記事が各所で出てきたので、ちょっと集めてみました。▼Googleの駐車場に「Street View」撮影車の大部隊らしきものが準備されていた▼
http://gigazine.net/index.php?/news/comments/20070718_google_car/
ストリートビューの画像撮影用の車両達。
これが近所を走っていたら、ピースしてみましょうｗ

■こんなサービス展開ができるのね■■■■■■■■■

▼お約束な不動産情報連携▼
http://www.trulia.com/

⇒米国ではストリートビューを組み込んだWebサービスも登場している。Trulia.comは不動産物件情報の提供サービスで、実際の物件の周辺状況をストリートビューで把握できるみたいです。

それにも触れている記事がこちら。
▼グーグルが「ストリートビュー」日本版を開始、特定地点の360度パノラマ写真を公開▼
http://itpro.nikkeibp.co.jp/article/NEWS/20080805/312222/

Googleの河合プロダクト・マネージャーのインタビューも書いてあるけど、一つの都市の撮影に3～4カ月かかるらしい。大変だ。

それと、その連携の仕方とマッシュアップについての解説は以下の記事にありました。

▼Google Mapsにストリートビューとマッシュアップ・ツール▼
http://journal.mycom.co.jp/news/2007/05/30/007/index.html

■■■■■■■■■■■■■■■■■■■■■■■■■

使い方次第では、いろいろリアルと絡めた面白い事が出来そうですね。
ちょくちょくチェックしてコンテンツ企画案とかにアイデアを入れたいなーと思っている今日この頃です。

Google技術進歩 早すぎです。
Googleはどこまで行くのだろう。
Takumaです。
　

【GoogleMap】
Google マップ（英:Google Maps、ぐーぐる-）は、検索エンジンのGoogleが提供しているローカル（地域）検索サービス。地図、航空写真、地形の3つの方式で、ズームを調節し、全世界を見ることができる（航空写真については、地図情報を航空写真に重ね合わせた表示と、航空写真のみ表示とで2種の表示方法が用意されている）。アメリカ国内のみ渋滞情報の表示ができ、またアメリカと一部のヨーロッパ地域のみ経路検索もできる。サンフランシスコやニューヨーク、ラスベガスの一部では、主要な道路からの風景を見ることもできる。日本のテレビ各局では、ニュース番組において、事件・事故の現場の位置などを指し示す際、Google マップを引用することが増えてきている。(by ウィキペディア辞書)

うーんと・・・　Google マップ日本版に「ストリートビュー」機能が追加されました。米国では2007年5月から提供されていたサービスなのですが、やっぱり凄い。凄すぎる。

■どんな機能なの？ストリートビュー■■■■■■■■

自分が、とある道に立っているとします。
静止画像ですが、そこから見える上下左右360度の世界が見えてしまうサービスです。

(1)Google Mapにアクセス(http://maps.google.co.jp/)

(2)右上の「ストリートビュー」ボタンを押す。

(3)対応エリアの道が青になるので、ある程度までの地域表示倍率までズームする。

(4)黄色い人形が現れるので、見たい場所へドラッグ＆ドロップ。

・みたい場所(青いライン)をクリックしてもヨロシ。

(5)人形からフキダシが現れて、その場所の写真が表示される。

・画像には上から道のラインが表示され、矢印をクリックするとその方向の次の写真が表示される。

・写真をドラッグしながら縦横無尽に動かすと、その通りに写真が360度回転する。

・画像の拡大/縮小が可能。

(＋α：印刷)
印刷ボタンを押すと、「ストリートビューのみ」か「ストリートビュー＆地図」かが選べる。加えて、メモまで書き込めるようになっている。

⇒画像自体に書き込み(ペイント見たいな感じ：Ajaxで既に独立してならある)が出来るようになるとより便利かもしれない。

使い方の詳細は以下を参照。

▼Google マップ日本版にも「ストリートビュー」機能–道路に立って街中を見渡せる▼

http://japan.cnet.com/news/media/story/0,2000056023,20378334,00.htm

なによりも、知っている場所で試して欲しい。
その凄さを実感できるはずだ。

現在、東京や、大阪、兵庫、仙台市など都市部を中心にこのサービス対象

どんなに方向音痴でも、迷いそうな箇所の目印を印刷したものに赤ペンで書いて
ここを左とか書いて渡してあげれば、目的地に辿りつけるはずだ。
(夜の写真だと画像が荒いが、サービス開始時だからご愛嬌か。)

■プライバシーは大丈夫なの？■■■■■■■■■■■

以前からGoogle earthの頃から、プライバシー問題は個人や企業レベルおろか、国家レベルでクレームを受けていた。

(軍事兵器が写ってる!! 機密領域が写ってる!! UFOが写ってる!! 等など)

よーくみるとわかるのだが、今回のストリートビューでグーグル側の対策は、人の顔や自動車のナンバープレートをぼかすという形で配慮している。

しかし、横顔の人とか後ろからのショットは加工されていないのが実情である。

いちおうGoogleはユーザーからの報告も受け付けている。ヘルプにある「不適切なストリートビューを報告」というリンク先から、不適切な理由、写真の箇所などを指定すれば、問題のある画像が存在していることをグーグルに教えられるようになっている。

自分の行動範囲をテストがてら、知り合いが写ってないか探してみるのもいいかも知れない。

■■■■■■■■■■■■■■■■■■■■■■■■■

というわけで、衛星画像にとどまらずローカル写真までやり始めたGoogleだが、後輩と話た中に「動画」というキーワードがあった。

当然、インフラの関連から考えれば、当面無理だとは思うが・・・不可能ではない。
というかネットという無限の力を駆使して「まさか」を実現するのがGoogleだ。

宇宙 > 地球 > 深海 > 街 > 知ってる近所

まで迫ってきたGoogleの恩恵？ 脅威？
新規構築のディレクターとしてサービスの活用よりも、この先にあるネットの未来の姿に不安を覚えざるおえない、今日この頃です。

写真好きです。
色彩関連大好きです。
Takumaです。
　

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

以前にもピックアップいたしました、カラーマネージメントサイト。
おもしろいサイトがまたまたありましたのでご紹介。

▼colr.org▼

http://www.colr.org/

例えば、海の家のサイトなら、その概観や周りの風景の写真や、ロゴなどから、サイトカラーを決定したいときに使えたりしますよね。

以前なら、Flash以外では考えられなかった挙動。
Ajaxで動いているのですから時代の流れの早さを感じます。

触るだけでも面白いので、一度ご利用してみてはいかが？

美しい法則好きです。
黄金比大好きです。
Takumaです。
　

【黄金比】
線分を一点で分けるとき、長い部分と短い部分との比が、全体と長い部分との比に等しいような比率。1対1.618をいう。古代ギリシアで発見以来、人間にとって最も安定し、美しい比率とされ、美術的要素の一つとされる。外中比。中外比。(by Yahoo辞書)

マヨネーズと醤油の混ぜたソース(通称：マヨショー)の比率は2:1がベストだと経験則で広めています。だけどサラダはドレッシング派のTakumaです。

どうでもいい内容から始まりました今回のお題は「黄金比」

世界的に有名な芸術作品名や建築物に潜んでいることが多数確認されている法則。
つまりは美しいのルールの一つといわれています。

デジタルコンテンツの設計者の端くれであるTakumaですが、デザイナーでもあります。
例えばサイトのいたる所に黄金比を埋め込めたら・・・と考えた事が過去にあったのですが、あったｗ

▼Golden Ratio Calculator▼
http://goldenratiocalculator.com/

黄金比でカラムの幅を計算してくれるサイトです。

黄金比の約1:1.6の比率にしたがって、入力した数値を基にカラムの幅を計算してくれる。まー、端数は当然出ますわな。「●●1px」とかｗ

実際のデザインや設計時には、端数は割愛したほうがいいかも。
そうしないと、ある日コーダーさんに暗い道で・・・
(((ﾟДﾟ;)))ｶﾞｸｶﾞｸﾌﾞﾙﾌﾞﾙ

Ajax好きです。
リッチ表現大好きです。
Takumaです。
　

【ぐるぐる】
１ 物が続いて回るさま。「―（と）腕を回す」
２ 物をいく重にも巻きつけるさま。「縄を―（と）巻きつける」(by ウィキペディア辞書)

すみません。忙しくて更新が滞っておりました。Takumaです。
同僚が「すごいよ～次世代過ぎるよ」って教えてくれたスクリプトを紹介。

▼mooVRotatingMenu▼
http://www.virtual-gadjo.com/mooVRotatingMenu.php

画像をマウスの動きに合わせて、縦・横方向に3D回転できるスクリプトです。
（※なんでサイトがドクロなのかは分かりませんがw）

mooVRotatingMenuはmootoolsのプラグインで、動作にはmootools.js 1.2が必要らしいです。

といえど、じつはグルグルをTakumart.netでもやっています。

▼Takumart.net:sitemap▼
http://www.takumart.net/sitemap/

すげーグルグルしてるっていって、導入したのに・・・・
もう、もっとアッパーなのが出てきたよ。
（※なんでカーソルが手の骨なのかは分かりませんがw）

ふふふ・・・製作者のエゴ全快でなにかのコンテンツ化したいｗ

地理苦手です。
宮崎県最近、覚えました。
Takumaです。
　

【宮崎県】
宮崎(by Yahoo!辞書)

東国原 宮崎県知事が就任して、いく年月。
「どげんとせんといかん」のキャッチフレーズの元、彼の展開するキャンペーンで宮崎県の場所を覚えたTakumaです。

そんな地理の弱いTakumaですが、グラフィカルな面はまだ改善が待たれるにしろ、県名の入力補助Ajaxのツールがありましたのでご紹介。

▼jsmap(▼
http://jsmap.cognitom.com/

以前、教習所のポータルサイトを作った事があるのですが、当然 地域が深く密接しているサービスのポータということでマップツールをつくった事があります。
おもいっきりFlashですが・・・

地域まで、選択可能ということだったので全国の地域明を「天気予報」や「地域密着型サイト」とかいろいろな所から引っ張り出して・・・すぐ忘れました。

というわけで、ブラッシュアップされて汎用化されれば、きっと白地図に恐怖を覚えるTakumaのような人間には強い味方となるはず！！

北海道、秋田、岩手・・・うっ。

ゲーム好きです
Ajax大好きです。
Takumaです。
　

【マリオカートシリーズ】
マリオカートシリーズ (MARIO KART series) は、任天堂より発売されたマリオシリーズの世界を舞台にしたレースゲームのシリーズである。(by ウィキペディア辞書)

覚えているか・・・あの日の感動
覚えているか・・・あの面白さ！
覚えているか・・・あの完成度！！

マリオカートのお話です。
TakumaはちゃんとやりこんでいたのはＳＦ版なのですが、かなりがんばってましたね。
（ものすんごくドリフトを壁ぎりぎりまでして攻めの走りをしてました。）
当時はゲーム番組でタイムアタック企画をやってたり、大ヒットしていました。
（一番最初の会社ではGCがヒットしており、会社に住んでいる部長陣が連日連夜やっているのを仕事をしながら、傍観してましたｗ・・・）

そして最近ではWiiがそのシリーズを引き継いでいますね。

そんな、思ひ出ぶかいＳＦ版のマリオカートですが「Ajax」で動いてます。
しかたない。もうそんな時代になったのですね！！
（本日。モンスターハンターフロンティアを12時間以上やった人間ですが＞＜）

みよ！！この完成度！？

▼nihilogic:javascript Super Mario Kart▼
http://www.nihilogic.dk/labs/mariokart/

たしかに
・キャラ同士のあたり判定がない。
・アイテム仕様がまだない。
・相手は2人しかいない。
・ドリフトがない。（←これはちょっと悲しい）
けど、意外とスムーズに動いているのです。

ちなみに、砂を走っても減速しないのでコース1で最終コーナー前の砂漠地帯を無視して横切ると、簡単にショートカットできました。（どうでもいい！？）

google好きです。
wiki大好きです。
Takumaです。
　

【wiki】
Webブラウザから簡単にWebページの発行・編集などが行なえる、Webコンテンツ管理システム。WebサーバにインストールしてWebブラウザから利用する。複数人が共同でWebサイトを構築していく利用法を想定しており、閲覧者が簡単にページを修正したり、新しいページを追加したりできるようになっている。編集者をパスワードなどで制限したり、編集できないよう凍結したりすることもできる。HTMLの知識がなくてもリストやリンクを簡単に作成できるように、独自の「整形ルール」が定められている。電子掲示板(BBS)に近いシステムだが、BBSが時系列に「発言」を積み重ねるコミュニケーションツールであるのに対し、Wikiは、内容の編集・削除が自由なこと、基本的に時系列の整理を行なわないことから、誰もが自由に「記事」を書き加えていくコラボレーションツール、もしくはグループウェアと言える。(by Yahoo！辞書 より 一部抜粋)

様々なゲームの攻略ページの基盤と近年なっているwiki系サイト。
みなさんご存知でしょうか。ゲームは生活の一部。Takumaです。

どんな形態のサイトか？というのは上記の抜粋をご覧あれ。
(検索で「MHF」「wiki」と打つとすぐに数サイトでてきます。)

そんな感じで、みんなでサイトを(HTMLなくても)情報追加して作っていけるサイト形態「wiki」ですが、なんとGoogleがまたこのジャンルに一石を投じます。

詳しくは以下のニュースをご覧あれ。

▼builder：だれでもWikiサイトを構築できる「Google Sites」が正式提供▼
http://builder.japan.zdnet.com/news/story/0,3800079086,20373802,00.htm

当然、オープンに誰でも書き込めるような「ゲーム攻略サイト」しかり、ビジネスでの共通見解を共有するための「情報ステーション」しかり、家族や学校や友達の間での「だべり場」しかり、可能性は秘めています。

それだけでエンターテイメント性は低いので単独での娯楽的アプローチは、まだ早いでしょうが・・・googleですよ。絶対、何かと絡めて他のサイト形態を圧倒する仕掛けをしてくると思います。

ふふふ・・・今後の展開に乞うご期待。

サイト運営好きです。
Google Analyticsしないと気持ち悪い。
Takumaです。
　

【破損】

［名］スル壊れたり、傷ついたりすること。また、壊したり、傷つけたりすること。「塀が―する」「器物を―する」(by Yahoo！辞書)

Google Analyticsを一日、最低一回は見ているちょっとしたヘビーユーザーTakumaです。
先日、いつもどうりログインすると見慣れない表記がありました。
もっと広い条件でデータ提供を許可しろ
っていう感じかな、いつもの感じなら。とおもったら・・・

こんな内容だったらしいです。

■原文：英語■

System Message:Analytics Processing Delay from April 30th to May 5th

Google Analytics experienced a data processing error from April 30th to May 5th.Almost all of the data has been recovered and is currently being reprocessed.The recoverd data will bie reflected in your reports within a few days.Please note that a small percentage of data, particularly in the area of e-commerce reporting, was not recoverable from those dates.

We sincerely apologize for this precessing issue and are taking every precaution to prevent such disruptions from occuring again in the future.For more information, please read through our common questions.

The Google Analytics Team

■翻訳：日本語■

Google Analyticsでは4月30日～5月5日までの間に、データ処理においてエラーが発生しました。ほぼ全てのデータはすでに復旧済みです。復旧されたデータは数日以内にレポートに反映されます。しかし、ごく数%のデータ、特にイーコマースの範囲のレポートは復旧不可能であったことに注意願います。

我々はこの問題に対し心から謝罪し、このような問題によって2度と混乱が起きないよう、あらゆる防止策をとってまいります。

■■■■■■■■■■■■■■■■■■■■■■■■■

まー。無料なんで文句いえませんよね。(税金で運営しているわけでもないし)
お仕事で導入している所を知ってますがECとかもやってるところは冷や汗物ですね。

やっぱり、本格的にアクセス解析するなら、高くてもビジョナリストとかの方が安心なんですよね。

ちなみにTakumart.net的には・・・今度はなるべく気をつけてね。
って感じですw

WEB設計好きです。
WEBデザイン大好きです。
Takumaです。
　

【ユーザビリティ】
ソフトウェアやWebサイトの「使いやすさ」のこと。様々な機能になるべく簡単な操作でアクセスできることや、使っていてストレスや戸惑いを感じないことなどが、優れたユーザビリティにつながる。(by Yahoo!辞書)

設計をしていてデザインまで領域とするディレクターの皆様。

デザインに加えて設計まで手を広げているデザイナーの皆様。

ユザビリ設計＆デザインについて回る問題。
客観的な導線設計の正しいという証拠の裏づけは、かなりの手間とお金が必要ですよね。
フルパックでやると当然ながら、大きな案件でないと予算上できないのですが
なんと、これらの内「ヒートマップ」については無料で簡単に検証できるサービスサイトが以下にありました。

▼Fegu-GUI▼
http://www.feng-gui.com/default.aspx

まずは画像をアップして検証してみましょう。

実際のところ、独自のアルゴリズムに基づいて、ユーザーの視線（導線）がどのようにページ内で移動するかとその頻度をヒートマップという形で作成してくれるサービスなのですが、やってみると面白い。
（設計⇒ラフデザインの段階でチェックできるから、下記で紹介する他のサービスより個人的には使い勝手がいいと思います。）

とはいえ、上のTakumart.netのサンプルはあんまり参考にならんかも・・・
（プライベートぐらいノリと勢いで作りたいので、ちゃんとした設計してない orz）
（お仕事でやったサイトもいくつかチェックしたけど8割方ストライクでしたよ。いや、ホントにw）

というわけで、
■Yahoo!Japanをちょっと検証みよう！！■■■■■■■■■■■

ちなみに、ファーストビュー(縦：600px想定)で画像アップしてやってみました。

■アイコンや画像にはやっぱり目がいきますよね■

当然ながら、注目させる為と完結にイメージを伝えるために配置されるこれらの要素ですが、数が多すぎると情報氾濫がおきますけど、Yahooぐらいの量はかなり妥当なのではないでしょうか。
（ちなみに人間の顔とかはカナリ目を引きますよね。）

マージンも適切にとってあるので、全体的に見やすいし。
（最近、ポータルサイトのトップリニューアルが次々と行われたけど、かなり見づらいものもありました。例えばbigl○beとか。）

■ロゴの隣に主要サービスが並んでいる■

当然、ロゴにまずは注目させ左右両方にアイコン化してしっかり主要サービスをアピールし、導線を構築してますよね。ポータルという情報が多いサイトの宿命ですが他の情報との差別化の為に工夫してますね。

■導線の途中には検索ボックスがある■

ポータルなので、ここ重要だと思います。ヒートマップを見る当たりかなりの頻度で導線の通り道に検索ボックスがある設計になっています。さすが！！

■ファーストビュー■
あと、ファーストビューとそれ以降の情報設計を見ても、サイトのサービスやコンテンツとしてプライオリティが高い窓口のリンクは殆どファーストビューに収まっています。
（なのでサイトに来た一目でスクロールしなくても分かるし導線もしっかりしてる。）

■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■

いやー、Yahoo!さすがという感じです。
皆様も気になるサイトをレッツ テスト！！
（ちなみに、ブランディングサイトよりは情報提供ベースのサイトを試してみると面白いと思います。）

P.S：調べてみると他にもユザビリ検証サービスが結構あるもんですね。
（海外サービスばかりですが。）

▼ClickHeat▼
http://www.labsmedia.com/clickheat/index.html
⇒クリック結果のヒートマップ集計、表示用オープンソースツール。ヒートマップ解析をPHP＆MySQLで設置可能らしく日本語化もされているみたい。

▼Crazy Egg▼
http://crazyegg.com/
⇒ヒートマップ解析用のASP版。登録で使えるので設置の手間要らずでだけどタグの挿入が必要。無料で使える回数には制限があるので、お仕事なら有料アップグレードした方がよさそうです。

⇒解説している日本語ブログ記事：
http://website-usability.info/2007/08/entry_070804.html

▼Clicky▼
http://getclicky.com/
⇒Spy という機能でリアルタイムに利用者のログが見れる部分が特徴的。