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

エヴァンゲリオン好きです。
Twitterやってます。
Takumaです。
　

【新世紀エヴァンゲリオン】
『新世紀エヴァンゲリオン』（しんせいきエヴァンゲリオン、Neon Genesis EVANGELION）は、日本の連続テレビアニメ作品。1995年10月4日から1996年3月27日まで全26話にわたりテレビ東京系列 (TXN) で放送された。(by ウィキペディア)

　

Twitterのような仕様で140文字程度の投稿をすることを「つぶやき」とか一般的にいってましたが、Twitterが自サービス上での「つぶやき」に新しい名前を付けたそうです。

▼ピックアップサイト▼
日本版Twitter、「つぶやき」から「ツイート」に　米国版と表記統一 - ITmedia News

「つぶやき」⇒「ツイート」
だそうです。ブランド化の一種でしょうね。

ということで本題。

■エヴァンゲリオンのキャラがツイート■■■■■■■■■■■■

なんか、いろいろ遊んでたらこんなのみっけた。

▼ピックアップサイト▼
碇シンジ (ikarisinji) on Twitter
まずは主人公。「6月6日生まれのふたご座です。得意なものはないけれど、料理が好きです。」とシンジくんらしい自己紹介。次に、

式波アスカ (sikinamiasuka) on Twitter

「新劇場版では散々な目にあった式波アスカよ。隔離されてる間、暇だからツイッターてのをやってみようと思うの。」と自己紹介。隔離中でもネルフはTwitterを許しているらしい。意外と理解のある組織？

真希波・マリ・イラストリアス (makinamimari) on Twitter

劇場版「破」での新キャラですが「人の身を捨ててこそ・・・浮かぶ瀬もある！なーんてにゃ♪」と自己紹介。なぜかフォローしてるのはアスカのみ。

というような、人がキャラになりきってやるようなタイプが一つ。

■エヴァンゲリオンのキャラbot ■■■■■■■■■■■■■■■

他にもこんなタイプがあります。

▼ピックアップサイト▼

葛城ミサト (misato_k) on Twitter

渚カヲル (kaoru_nagisa) on Twitter

仕組みとしては、

エヴァのキャラクターになりきって誰かに話しかけると、指定したキャラクターがあなたにつぶやき返してくれるコンテンツ。コンテンツのフォームに特定事項を入力送信するとTwitterにポストする仕組みだそうです。

詳細は、下記参照。

▼ピックアップサイト▼
エヴァつい

ちなみに、「@takumart そっか…苦手なのね、お父さんが。私と同じね。」と言われてしまった。ドキッとしたｗ

■エヴァンゲリオンのキャラbot ■■■■■■■■■■■■■■■

最近、スパム関連でTwitter業界をさわがしている「bot」しかし、こんなコンテンツならおもしろいのではないでしょうか？

▼ピックアップサイト▼
伊吹マヤ (Ibuki_jp) on Twitter
青葉シゲル (Aoba_jp) on Twitter
日向マコト (Hyuga_jp) on Twitter

仕組みとしては、

アニメでのセリフをランダムポストするというものと、拡張版(※リプライ版)として特定の正規表現に対して用意されているコメントを返す事も可能だそうです。

詳細は、下記参照。

▼ピックアップサイト▼
2009-10-25 - 陽を裂く木々の鳥

■まとめ■■■■■■■■■■■■■■■■■■■■■■■■■■

キャラ系を利用したプロモーションや、コンテンツにしてしまっての集客等にはいいかもしれません。

ただ、人を雇ってつぶやかせるだけでなく、面白サービス化としてのTwitterの今後の展開利用に期待な今日この頃です。


■P.S:今日の気になったサイト■■■■■■■■■■■■■■■■

▼ピックアップサイト▼
レゴ エデュケーション センター｜レゴ社公式教室サイト

●んで、一言

レゴといえばブロック。小さい頃は情操教育として赤いバケツを丸ごと一個買ってもらい組み立てては崩してを繰り返してました。

レゴにオフィシャルの情操教育教室があるって知ってました？
年齢別(3歳〜10歳)のレッスンになっていて、たとえば7・8歳のカリキュラムなら
・コミュニケーションスキル
・創造性スキル
・科学・テクノロジースキル
・数学的理解に関するスキル
だそうです。すげーなレゴ教室。

各所にレゴをあしらったサイトになっていて、全体的にはシンプルで信頼感を保ちつつパンチのある商材をうまいバランスでアクセントとして利用しています。

ちなみに、3歳時のカリキュラムには同年齢時にtakumaが得意だった、「人形の頭を食べる」というスキル習得はありませんでした。

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

東京ビックサイトいってきました。
デザインフェスタがやってたので。
Takumaです。
　

【デザインフェスタ】
オリジナルであれば、誰もが参加できるインターナショナルアートイベント!1994年より始まり毎年2回開催、次回で31回目を迎えます。会場は、ブースエリア(2,700以上)・ライブステージ・ショースペース・ミニシアタースペース・レストラン&カフェ・バーエリアなど、様々な表現とドラマで満ちあふれています。(by オフィシャルサイト)

　

ということで、先日デザインフェスタ(通称：デザフェス)にいってきました。

▼ピックアップサイト▼
アートイベント デザイン・フェスタ[東京ビッグサイト]

なんか、全国規模から集まったプロも交った学園祭という感じのイベント。

vol.30 Promo from Design Festa on Vimeo.

もうおわってますが、「vol,30」でした。ようすは下記を参照。

▼ピックアップサイト▼
アートイベント デザイン・フェスタ[東京ビッグサイト] | 過去の様子
んで、ビデオレポートは以下から。
designfesta on Vimeo

「とんぼ玉」がきれいだったりとか、
「球体間接人形」がいい雰囲気だしてたりとか、
「フェイクスイーツ」がやたら多かったりとか、
「コレジャナイロボ」があったりとか、
なぜか、「占い」が点々と。。。。

オリジナルキャラクターとかの出店が数々ありましたが、プロ(もしくは、プロ並み)のクオリティか、実用性がないと売れないようですね。見てて痛感しました。

なんか、今回はレベルが高かったそうで、「その値段でいいのか！？」というお得系な出店もたくさんありました。あんまりパフォーマンス系は見なかったけどね。

次回は、2010年5月の15日＆16日のvol.31。出店は、以下の内容でできるそうです。

▼ピックアップサイト▼
アートイベント デザイン・フェスタ[東京ビッグサイト] | ブースエリア

また足を運ばねば。

■P.S:今日の気になったサイト■■■■■■■■■■■■■■■■

▼ピックアップサイト▼
「スタイルハンディ シュシュ」スペシャルサイト | ダスキン

●んで、一言

ダスキンの「スタイルハンディ シュシュ」という商品のキャンペーンサイト。
家のイラストを俯瞰図で用意して、キャラクターが家の各所で「スタイルハンディ シュシュを使うというもの。デザインがシンプルテイストかつ、イラストは作りこまれているので、世界観がある。

その中でユーザーが家で使う際に商品がどう考えられて作られていて便利かを動画で解説する。シンプルな構成で分岐等もないが、適切にコンテンツ量をおさえて、主題の表現コストに予算を回した感じのバランスのいいサイトに思える。

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

はてなブックマーク利用してます。
Twitter同じく利用しています。
Takumaです。
　

【連携】
［名］(スル)互いに連絡をとり協力して物事を行うこと。「他団体と―して運動を進める」[類語] 共同。(by Yahoo！辞書)

　

以前、こんな記事を書きました。

▼takumart.net：過去記事▼
「はてブからTwitterへの自動投稿はじめました」 | takumaの「デザインはあれでアートはそれで」

つまりは、「はてなブックマーク」の投稿内容のRSS情報を「twitter」へと自働投稿サービスを利用して自動転送するというテクニック。簡単な関連図にすると以下になります。

「はてなブックマーク」⇒(経由：twitterfeed)⇒「Twitter」

しかし、はてなが「はてなブックマーク」に、Twitter連携機能を追加したというのです。

つまりは。

「Twitter」⇒「はてなブックマーク」

という事。さっそく試してみました。

■設定の方法は？■■■■■■■■■■■■■■■■■■■■■■

●Step.1：はてブにログイン
(※アカウントがない場合はサービス登録後)
↓
●Step.2：ヘッター右上の「設定」をクリック
↓
●Step.3：遷移すると現れるタブから「Twitter との連携」を選択
↓
●Step.4：「Twitter からブックマークを追加する」にチェックを入れる
↓
●Step.5：「Twitter アカウント名」にTwitterアカウント名を入力
↓
●Step.6：「つぶやき形式」を選択。
(※Twitterでつぶやいた全URL or 「B!」の後にURLをつぶやけいた時のみ)
↓
●Step.7：「変更する」をクリックして終了

■試した感想は？■■■■■■■■■■■■■■■■■■■■■■



たとえば、Twitterで「B!」と記載したもののみ自働連携する際の記載フォーマットは以下らしいです。

※つぶやき例:『 はてなブックマークのサイト B! http://b.hatena.ne.jp/ 』

やってみましたが、即時反映というわけではないですね。ちょっと時間がかかります。
(※テストしてみたら、5分くらい)

連携結果、人の顔のようなアイコンでTwitterで投稿されたURL記事が自働連携(投稿)されますが、アイコンはかわいくありません(←これポイントｗ)
(※参照元URLの欄には「bit.ly」と記載されます)

■思わぬ罠が！？■■■■■■■■■■■■■■■■■■■■■■

まー、すでに気づいている方もいるとは思いますが、上記で書いた、twitterfeedを利用した自働投稿すると。。。二重投稿になるのですな。

つまりは、

「はてなブックマーク(一つ目：自分)」⇒(経由：twitterfeed)⇒「Twitter」⇒「はてなブックマーク(二つ目：bit.lyクローン)」

というわけ。その結果が画像のありさま。
なんか不明なコードみたいなタイトルになってるやつもあるし。

というわけで、体験のみで長期利用はしませんが、本サービスのみ利用の方には簡単な設定のみで使えるのでオススメです♪

■P.S:今日の気になったサイト■■■■■■■■■■■■■■■■

▼ピックアップサイト▼
I LOVE BIO | ダノンビオ スペシャルファンサイト

●んで、一言

ヨーグルトのダノンビオのキャンペーンコンテンツ。
ランキング形式の「瞬間記憶(神経衰弱)」「フレーバーチョイス(パッケージ柄組み込み)」「早解きクイズ(商品関連クイズ)」で構成されるクイズコンテンツ。

デザインがポップで可愛いいFlashで作られているが、コンボ仕様がある等結構、この手のコンテンツにしては、ポイント周りの作りこみがされている。

なによりも、展開商品のグラフィックをつい覚えてしまうように、クイズの構成内容が考えられているという点でも、シンプルながらクイズコンテンツとしての企画がしっかりしているFlashサイトだと思います。

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

WEBクリエイティブの特徴。
解析改善が可能な点ですよね。
Takumaです。
　

【トップページ】
インターネットのウェブサイトを構成するページのうち、最も上位にある「入り口」に相当するページ。(Yahoo！辞書)
　

デザイナー兼ディレクションアドバイザーのはずが、2案件のディレクションも事実上兼任してバタバタ。
片方の案件がリリース対応で休日出勤も実施という訳で、最近の更新頻度低下のいいわけです。takumaです。

まあ、別に忙しさは事実上かわらないのですが。ちょっと前の記事で定期チェックを怠らない！！
という希望的観測(？)的な発言をしたわけですが、3日坊主になる可能性大ですが、その初回。

▼takumart.net：過去記事▼
「無料アクセス解析ツールのユーザーヒート」 | takumaの「デザインはあれでアートはそれで」

にて、「また後日にそのご報告でもｗ」といっていたのを思い出したのでご報告。

「ユーザーヒート(User Heat) 」を導入しているのはブログだけなのですが、いろいろとチェックしてみました。


■検証されるページはどこなのか？■■■■■■■■■■■■■■■■■■■

ちなみに、検証されるページの抽出に関してですが、条件としては
・１つのページに対して、1000〜1500PV程度が必要になります。
・１アカウントあたり、約1000種類のページ分を分析できます。それ以上のページを分析することはできません。
があるようなのです。さっそくGoogle Analyticsのデータを照合してみました。

●User Heat：2009/9/29 〜 現在(解析対象コンテンツ)

(1)www.takumart.net/wordpress/archives/912
(2)http://www.takumart.net/wordpress/
(3)http://www.takumart.net/wordpress/archives/502
(4)http://www.takumart.net/wordpress/archives/925
(5)http://www.takumart.net/wordpress/archives/929
(6)http://www.takumart.net/wordpress/archives/897
(7)http://www.takumart.net/wordpress/archives/927
(8)http://www.takumart.net/wordpress/archives/934
(9)http://www.takumart.net/wordpress/archives/855
(10)http://www.takumart.net/wordpress/archives/501
(11)http://www.takumart.net/wordpress/archives/931
(12)http://www.takumart.net/wordpress/archives/883
(13)http://www.takumart.net/wordpress/archives/792
(14)http://www.takumart.net/wordpress/archives/933
(15)http://www.takumart.net/wordpress/archives/701

●Google Analytics：2009/9/29 〜 現在(上位閲覧のコンテンツ)
※順位はブログ内のコンテンツのみを抽出しています。

(1)http://www.takumart.net/wordpress/archives/912
(2)www.takumart.net/wordpress/
(3)http://www.takumart.net/wordpress/archives/502
(4)http://www.takumart.net/wordpress/archives/925
(5)http://www.takumart.net/wordpress/archives/929
(6)http://www.takumart.net/wordpress/archives/897
(7)http://www.takumart.net/wordpress/archives/927
(8)http://www.takumart.net/wordpress/archives/934
(9)http://www.takumart.net/wordpress/archives/933(※上記ランク外)
(10)http://www.takumart.net/wordpress/archives/501
(11)http://www.takumart.net/wordpress/archives/855(↓9)
(12)http://www.takumart.net/wordpress/archives/792(↑13)
(13)http://www.takumart.net/wordpress/archives/931(↓11)
(14)http://www.takumart.net/wordpress/archives/883(↓12)
(15)http://www.takumart.net/wordpress/archives/920(※上記ランク外)

という結果に。集計時間の差異があるかもしれませんが、Google Analytics近い解析結果によりページのピックアップがされているようです。


■ヒートマップ検証結果■■■■■■■■■■■■■■■■■■■■■■■■

簡単な見比べですが検証対象としては
(1)www.takumart.net/wordpress/archives/912
(※最近のユーザー増加の原因ページ。攻略しているコンテンツの2つ下とか関連キーワードの上位に食い込んだ。)
(2)www.takumart.net/wordpress/
(※ブログのトップであり、多くのユーザーがここから新着記事やライブラリに分岐していく。)
をしてみます。

(1)に関しては、記事です。特徴として
○違い：ヘッター検索枠にアテンションが見られる。
○違い：本文冒頭に強いアテンション反応がでている。
○違い：記事の本丸である攻略文章とその前文に強いアテンション反応がでている。

●共通：対外サービスの領域(はてブ/Twitter/RSS)にアテンションがみられる。

つまり、記事の本文を読んだ上で、ほしい情報を探した形跡がみられる。
そして、次のアクションとして検索や対外リンク系元にアテンションがいったと考えられる。

一方、

(2)に関しては、トップです。特徴として
○違い：ヘッターロゴ枠にアテンションが見られる。
○違い：一番最新の記事にはアテンションがあるが、二番目以降は興味が薄れている。
○違い：全体的に右カラムのブログ概要情報の領域に、なだらかなアテンションが広がっている。
○違い：左カラムの鍵のグラフィックが見出し部分にアテンションを引っ張っている。

●共通：対外サービスの領域(はてブ/Twitter/RSS)にアテンションがみられる。

つまり、このブログはどんななのか？というのを全体的に把握しようとする動きが見られる。
そして、次のアクションとして検索や対外リンク系元にアテンションがいったと考えられる。


■ヒートマップ検証結果まとめ■■■■■■■■■■■■■■■■■■■■■



本ブログは、ほぼトップとセカンド以降の全体設計はWordpressの基本仕様にならって行なっていない。
つまりは、本検証結果は2ページに対する、ユーザーの目的とページ内での行動が比較的顕著にでる事例といっていいと思う。

という事でまとめ。

(1)記事ページ：
ファーストビューでの模索的な検索よりは、本文内容の中でより強い関心のもと情報探索が行なわれている。
表題とリンクしている本文の攻略情報については、あきらかな強いアテンションが確認できる。

ちなみに他の記事ページについても「F字」の導線の痕跡は共通しており、下記のトップページとのユーザー目的の違いが明らかなアテンション分布の結果として見れる。

(2)トップページ：
ファーストビューでは「Z字」の導線痕跡がみられ、ブログの概要的な事が配置されている領域に全般的なアテンション分布が確認できた。
サイトのロゴや、検索領域についてもトップ来訪後の検索プロセスを担う要素を探している痕跡がある。

一般的に言われている導線法則に近い結果になりましたが、同時に記事の内容によって強くアテンションが変動している事を確認できました。

今回は、2ページでの簡易検証ですがアクセス解析の離脱率等とあわせた改善計画の仮説材料と結果解析に当然ながら利用できます。
このブログもこの結果を基に、ぼちぼち、ちょこちょこ改善できたらとｗ

またブログをいじくる事に、ウズウズし始めている今日この頃です。


■P.S:今日の気になったサイト■■■■■■■■■■■■■■■■■■■■■

▼ピックアップサイト▼
カスペルスキーとは｜アンチウイルス・アンチウイルスソフトの【 カスペルスキー 】

●んで、一言
キャラクターの使い方と、導線誘導をギミックで効果的に演出できているFlashサイト。
これ、アンチウイルスソフトのキャンペーンサイトです。

キャラクターもパッケージに登場するおじさんのイラスト。
カラー配分のバランスがよいのも、グッドなのですがFlashならではのギミックが素晴らしい。

通常、インタラクティブ性や高級感を演出するのに使われやすいギミックだが、本サイトでは、適切な導線誘導のために利用されている。
つまりは、イラストをただ配置するのではなく、要素を順番に表示していきストーリー性を持たせている。
そのストーリーもイラスト内で連動している等、非常によく考えられている。

Flashでこそ行なえる有効な導線誘導施策の実例として非常に勉強になった。

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

10本の指があります。
もっと自由に入力で活用できたら。
Takumaです。
　

【両手】
１ 左右両方の手。もろて。「―利き」
２ その指の数から10の数。(by Yahoo！辞書)

　

先日、CEATEC JAPAN 2009という先端IT技術の展覧会のピックアップを本ブログで行いました。

▼takumart.net：過去記事▼
「感じるユーザーインターフェイスへ：前半」 | takumaの「デザインはあれでアートはそれで」
「感じるユーザーインターフェイスへ：後半」 | takumaの「デザインはあれでアートはそれで」

どれも、次世代または次々世代の興味が絶えない情報ハードやインフラについての多くのアイデアや技術がありました。

当然ながら、先端IT技術の展覧会ですから、PC以外のハードや最新インターフェースが大半だったわけでして、次世代にはまだまだPCの多様性がなくなるわけでも無いわけでして。

PC大好きっ子のtakumaとしては、PCという極めて固定的な情報入力端末(キーボード＆マウス)から脱却してこの右手の腱鞘炎(デザイン作業をハイペースで行うと軽く痛い)が発生しない入力危機＆インターフェースが実現してほしいなって思っている矢先。。。


■次世代マルチタッチインターフェース■■■■■■■■■■■■

様々な革新的な技術の中でも実装レベルが現実味を帯びてきたマルチタッチインターフェースとハード。
・iphoneをはじめとするモバイル情報端末＆スマートフォン
・Windows 7のマルチタッチ対応

▼takumart.net：過去記事▼
「Windows7の目玉はマルチタッチ技術」 | takumaの「デザインはあれでアートはそれで」

等々、当初モバイルから一般化したこのインターフェース技術もPCという市場に本格的に浸透しようとしている昨今。より、現実的に日々利用できそうなマルチタッチインターフェースが提案されたようです。その名も「10/GUI」。



▼ピックアップサイト▼
10/GUI

正直ムービーをみて「驚いた！！」という印象は正直少ない感じ。

しかし、これなら日常利用に耐えうる可能性で「納得！！」が強かったです。

■10/GUIの提案■■■■■■■■■■■■■■■■■■■■■■■

まずは、ちょっと長いが一見の価値があるこの動画。

10/GUI from C. Miller on Vimeo.

簡単に「10/GUI」の提案を租借してみる。

●モニター上でタッチ操作をさせず、手元にタッチパネルを別実装
⇒手が邪魔でスクリーンが見えにくい状態を解消させる。

●固定的なマウス上の指の役割を解放する
⇒右利きの場合、人差し指と中指の利用率が高いマウス操作。
10本の指を利用できることでより自由な画面操作が可能になる。

●スライドタイプで移動するウィンドウ選択
⇒まるでブラウザのタブ自体がウィンドウになっているかのようなインターフェイス。
重なるウィンドウ選択のわずらわしさに、スライド式の整頓というアプローチがかけられており、全体像を把握するためのウィンドウグループ全体の縮小確認ができる。

おおー、具体的だ。具体的に腱鞘炎(手首負担)を始め首の負担にまで言及されている。
が、テキスト入力されている光景がムービーにない。

手元のタッチスクリーンで文字入力のキーボードを表示させるのだろうか？
もしくは、別の入力機器をプラスするのか？(←これは希望しないな〜)


■一体化されたハードのイメージ像！？■■■■■■■■■■■■

これをノートパソコンの形で実装できそうな提案が「CEATEC JAPAN 2009でのSONYブース」にあった。

▼ピックアップサイト▼
曲げることも可能な「フレキシブル有機EL」ディスプレイを使ったVAIOや腕時計型ウォークマンなどのコンセプトモデル - GIGAZINE

曲げることができるようになった薄くて軽くて柔らかい「フレキシブル有機ELディスプレイ」を採用したVAIOである。画面だけでなくキーボード側までもがディスプレイとなっているところをみると、この領域がタッチパネルか、マルチタッチである可能性に期待が持てる。

「10/GUI」に近いインターフェスを受け入れるハード側の次世代像は、これに近いのかもしれない！？


■まとめ■■■■■■■■■■■■■■■■■■■■■■■■■■

少し話がかわるが先日、友人のデザイナーと夜に軽い勉強会を行った。
彼は、紙のデザイナーであり有名企業のパンフレットデザインも行っているような、メイン級のデザイナーである。

彼がデジタルサイネージについて話を切り出したのは先月の事。

そして先日、彼との帰り道に見た「不動産情報」を検索できる街頭でのタッチパネル組み込み型のデジタルサイネージ。

目の前に、将来の物と認識されていたものが実装されている光景に驚いた彼と共に(別の場所ですでに体験済みだったが)興奮の共有する自分。一方、下記のイメージビデオを知っていた自分の中に二極化した印象がそこにはあった。

▼takumart.net：過去記事▼
「10年後は、どんな世界なのだろうか？」 | takumaの「デザインはあれでアートはそれで」

「10/GUI」のようなインターフェースが実装される時代もそう遠くはないだろう。
目の前にその実物が現れた時、彼とどのような会話をするのかが今から楽しみだ。


■参考記事■■■■■■■■■■■■■■■■■■■■■■■■■

次世代マルチタッチインターフェース『10/GUI』がなかなか興味深い - IDEA*IDEA 〜 百式管理人のライフハックブログ

10/GUIとマルチタッチインターフェイスの可能性 : could

10/GUI:未来のGUIはこうなるかも | Happy My Life

「Windows7のマルチタッチ技術の評論」 | takumaの「デザインはあれでアートはそれで」

「Windows 7の販売製品と実装インターフェース/機能」 | takumaの「デザインはあれでアートはそれで」

「Windows7スクリーンショット」 | takumaの「デザインはあれでアートはそれで」


■P.S:今日の気になったサイト■■■■■■■■■■■■■■■■

▼ピックアップサイト▼
ジアスニュース　Thinking about the Earth

●んで、一言

企業、NPO、行政、市民などがお互いに協力をつなぐ第三者機関による環境専門ニュースサイト・ジアスニュースというサイト。

日本のサイトではあまり見ないポップさを残しつつ、写真を白黒にした重厚感のバランスが面白いデザインのサイトです。カラー写真がありませんｗ

なかなか思い切ったデザインアプローチですが、そのサイトとしてのメッセージカラーは他のサイトにない統一間で訴えてくる印象です。

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