■ビジュアルブログ検索エンジン[Blogopolis]

ブログランキングサービス『TopHatenar』に登録された20万件超のブログを3Dの仮想都市景観に凝縮したサイト、『Blogopolis』を公開しました。

NewsgraphyはAJAXで実装されていましたが、BlogopolisはFlashで実装されているようですね。動きがスムーズです。

300件弱しかはてなブックマーク頂いてないにも関わらず、このブログもBlogopolisの住人にしてもらえていました。
■はてなブックマーク – 新着ブックマーク – takamorry.com

とても実用的ですね。自分のブログには自分の興味の対象や、自分そのものを表現しているわけで、その隣の地主の方も自分の属性に似ているはず。その方のブログを読んでみると、やはり興味の対象が似ているので、思わずRSSリーダー登録してしまう。飽きないですね。

このブログは、「WordPress」区画に分類されていました。確かに、はてなブックマークを頂いているのはWordPressネタが多いですから。

openidに対応したサイトなら、区画に立つビルの屋根を好きな画像でペイント出来るそうです。

↑ペイントしてみた。
http://blogopolis.jp/view/http://takamorry.com/

何事も可視化することって大切ですね。

もし、気に入ったエントリーがあったら、ポチっと↓から、はてブして下さいね。ちなみに下のソーシャルブックマークパーツは、これを使わせて頂いています。
■WordPressにSBMボタンを加えるプラグイン、SexyBookmarksの日本Ver.をリリースしました – かちびと.net

１．まずはおめでとうございます！

このイベントは、2008年Mashupアワード最優秀賞の福井県勝山市在住フリーランスエンジニア、山健太郎さんの受賞祝いを兼ねて開かれました。おめでとうございます。このニュースを知ってから、何度かChamapでチャットしたり、ブログでコメントを送り合ったりしてた山さんにようやくお会いすることが出来ました。

↑山 健太郎氏（DA-Studio）
■ケンタローの開発日記: Mashup Seminar in FUKUI – みんなありがとう

受賞作品はこちら。
■Chamap – Enjoy Geo Communication!

講演内容で刺激されたのは以下の通り。（多少脚色してるかも）

• 何とPowerPointでプレゼン作るのは初めて！
• AJAXのフレームワークは一切使っていない！自分で作った。最近jQuery勉強してみて、これ使えば3分の1のコード量で済んだかも。
• Mashupのコツは以下の２つをよく知ること。
  (1)データベース系API
  じゃらんやホットペッパーなど、データベースコンテンツはMashupで拝借。
  (2)テクノロジ系API
  GoogleMapなど、自分では組めそうにもないクオリティの高いもの。これらはフレームワーク感覚で使う。
• 知っていくとAPIの組み合わせや見せ方で、よいサイトが出来る。
• 出来たら公開。恥ずかしがらずに公開。（福井人は照れ屋なので特に強調）
• 公開すれば周りからアドバイスがもらえる。良いも悪いも。
• さらにMashupが高度化する。
• それが楽しいのだ！

そして何と、Chamapで実装したWebサービス１１個の表示機能をライブラリ化して、惜しげもなく公開してくれました。参考にします。デザイナーの方（って区別するのがイヤですが）にも分かりやすく書かれていると思いますよ。
■MashMap Library

そしてさらに、講演の中で音声変換サービスを紹介して頂きました。で、早速セミナーの休憩中に取り込んだのが、先日紹介した「voice delivery system」ってわけです。あなたのブログしゃべり出しますよ！
■ブログタイトルを読み上げる機能をつけてみた「voice delivery system」 – 本質思考道場

２．Mashupは社内向けにも役立つ

Mashupアワードの主催の１社、リクルートさんの石橋さんからは、Mashupが社内向けにも役立つということを教わりました。リクルートさんのWebビジネスは多岐に渡り、データベースとして豊富。これらのデータを取り出すAPIをそれぞれ用意しておき、新たなサービスを作り出す時にパパっとMashupしてデモサイトを作ることで、社内向けにも役立つということでした。なるほどなー。こんなにありますもんね。
■世の中の不思議がちょっとわかるサイト | R25.jp
■L25.jp ： 世のなか見晴らすきっかけマガジン
■大学・短期大学・専門学校情報／リクルート進学ネット
■ひとり暮らしＮＡＶＩ [学生の一人暮らしのお部屋探し応援サイト]
などなど

↑石橋 利真氏（メディアテクノロジーラボ）
■Mashup Seminar in FUKUI – 福井のIT/Webは熱い！ : Media Technology Labs (MTL) : メディアテクノロジーラボ ブログ

３．3分プログラミングでMobile Mashup!!

福井県鯖江市jig.jpの福野社長は、jigブラウザのjigletを使ったホットペッパーとのMashupアプリを、なんと3分で作るというのを実演してくれました。ちょっと時間オーバーでしたが、他の人がプログラムを書くのを眺めるのは勉強になっていいですね。みんなから突っ込み入るのでテストが速い。

↑福野 泰介氏（株式会社jig.jp）
■めがね会館、IT社長 – 福野泰介@jig.jpのブログ : jig.jp 3分プログラミング@Mashupセミナーin福井

参考になったキーワードは以下。

• Mashupは、プログラムの無限連鎖。
• 私達がプログラミングに飛び込んだゲームの世界は、今やハイクオリティすぎて手が出せないが、WebAPIなら楽しんでプログラミング。
• モバイルはサッと出して、サッと使えて、出して恥ずかしくないもの。
• クールじゃないとモバイルじゃない。No Cool, No Mobile.
• iPhone、Androidは開発や配布段階で有料だが、Jigletは完全無料。
• Mashupは、作り手の想像を超えて、さらにMashupされてゆく。だから楽しい。
• WebAPIのまとめAPIが欲しい。

さらに、Jigletを作るための教材β版を公開してくれました。Java出来る人はどうぞ。（公開いいんかな？あかんかったらゆってやー福野さん）。早速Jigブラウザいじり始めましたよ。
■はじめてのプログラミング

さらにさらに、Mashup開発者のためのSNSなんてのも出来ました。ぞくぞくと福井エンジニアが登録中。
■Mashup開発者SNSβ

４．エンジニアよ、ちまちませず王道を行け！

サン・マイクロシステムズの藤井さんからは、これからのＩＴ、みたいなことを教わりました。実はこれが一コマ目でしたが、私としてはこの順番で書いた方が分かりやすいかと思い、変えています。

↑藤井 彰人氏（サン・マイクロシステムズ株式会社）
お姿映ってなかった。。。

メモしたポイントを挙げておきます。

• Mashupアワードはこれで4回目。かつての受賞者たちは受賞後、いろいろ人生が変わっている。
• Quality of Developer’s Lifeの向上を目指している。
• マルチスレッド、スケーラブルなプログラムを書けるように。（↓辺りのクラスかな）
  ■java.util.concurrent (Java 2 Platform SE 5.0)
• Amazonも使っている「Right Scale」。スケーラブルにインスタンス数を変える。（↓の辺りで始める参考になるかな）
  ■実際にアマゾンが使っているのと同じ仮想サーバを無料で試せる「Right Scale」を使ってみた – GIGAZINE
• 負荷が低ければ安く、年間12万くらいかな。
• メッセージ（西川意訳）

Think Global – テクノロジーは世界共通
Technology Matters – テクノロジーに地域の情報格差はない
Be Open – 早めに公開
Start Today – 思いたったら今から
Think Big, Have Fun! – ちまちませず王道を行け!

いやぁ、アツいお方ですね。学生さんにはこんな大盤振る舞いも。
■学生向け無償e-Learningプログラムの利用の仕方 : 日々是新 Akihito Fujii’s Weblog

５．学生さんからも発表

「ふくいソフトウェアコンペティション2008」に入賞された学生さんの作品も紹介されました。ういういしくてよかったな。

５．１．CUBE（キューブ）

福井工大 角間さん他
ルービックキューブを３Ｄで。

５．２．センゴクグンユウ

アイビーテクノカレッジ 山形さん
アニメーションで1500年～1600年の国盗り様子が分かる。データがきめ細やか。

５．３．ツカエルゼロハチ

アイビーテクノカレッジ 前田さん他
いろいろ便利なデスクトップAIRアプリ。
キャラクター「ツカエル君」が相当かわいい。

残念ながら、どれも公開はされていないようで。。。Be Open!!

６．まとめ

そんな感じで、大変内容の濃い５時間でした。もちろん、時間オーバーぎみでww。懇親会でも色々情報交換出来ました。

doodleの石丸さんも遠路はるばるいらしてました。
■GOGA – doodle開発記: なぜ凄い人がみな鯖江なのか？

いやぁ、手前味噌な感じですが、福井のIT界すごいですね。今回はお会い出来ませんでしたが、他にもこんな方々が。
■渋谷ではたらく社長のアメブロ
■秀まるおのホームページ(サイトー企画)
■An Agile Way : ITmedia オルタナティブ・ブログ
■くまひげ照れ日（び）

ということで、ふくい産業支援センターさん、いつもありがとうございます。
■アップグレードふくい[ugf]担当者ブログ: [Mashup Seminar in FUKUI]アンケート結果をまとめました。

P.S.
微力ながらお知らせに協力。
3/13(Fri),14(Sat)にCSS niteが福井にやってくるよ。東京ではすぐに満席になるセミナー。興味のあるかたはぜひ。まだ募集は始まってないようです。こちらのサイトをチェックしてくださいね。
■CSS Nite公式サイト

↑スピーカーアイコンを押すと、タイトルが音声で流れる。

使ったのはこちら。株式会社ナレッジクリエーションのサービス。
■Web音声配信システム：vds

無償版では1ヶ月あたり50,000語までの制限つきですが、ちょっと面白いかも。

組み込むのは実に簡単。head部にJavaスクリプトの準備、body部で読み上げたい部分をdivタグでid指定する。ただそれだけ。サイトの方に組込方が丁寧に解説されているので、誰でも組み込めると思いますよ。

WordPressに組み込む場合の作業ログを紹介しておきます。

１．vdsにユーザ登録

こちらからユーザ登録して、認証コードを取得します。
■vdsフリー（無償）利用登録

登録したメールアドレスに認証コードが届きます。

２．head.phpにスクリプト挿入

お使いのテーマのhead.phpにスクリプトを挿入します。
先頭の「key=XXXXXXXX」のところは、上記１で取得した認証コードにしてください。

<script type="text/javascript" src="http://api.vdsapi.ne.jp/cgi-bin/vds.cgi?key=XXXXXXXX">
</script>
<script type="text/javascript">
// <![CDATA[
   var vdsp;
   var vds;
   window.onload=function(){
     try{
       vdsp = new VoiceDeliveryPlayer("vdsp");
       vds = new VoiceDelivery(vdsp, "vds");
       vds.setCast("TakashiJPm");
     } catch(e) {
       alert("Cannot Create Object");
     }
   }
   function readOut(){
     buf = (document.getElementById("readOutHere")).innerHTML;
     vds.speak(buf);
   }
//]]>
</script>

↑vds.setCast()に"KeikoJPf"を指定すると、女性の声になります。

３．single.phpにdivタグとボタンを挿入

お使いのテーマのsingle.phpに読み上げ範囲を示すdivタグと、読み上げを指示するボタンを挿入します。vds公式サイトの説明ではinputボタンでしたが、私はスピーカーアイコンにしてみました。

まずは、タイトルにreadOutHereのidをつけます。

<div id="readOutHere">
  <?php echo $title; ?>
</div>

次に表示したい箇所にスピーカーアイコンを置きます。

<a href="#" onclick="readOut()" />
  <img src="/image/speaker.png" alt="タイトルを読み上げる" style="border: 0px">
</a>

最後に、body部のどこかにvdsのFlashをロードする場所を作ります。どこでもいいですが、body部最後が良いと思います。

<div id="vdsp"></div>

４．まとめ

仕組みは、読み上げ文字がvdsサーバに送られて、サーバ側で音声に変換し、vdsのFlashクライアントが読み上げるということです。重そうな音声変換処理はサーバでやってくれるので、パソコン側が多少非力でも問題なさそうです。

こういうのを簡単に組み込むプラグインってのも作ると面白いかな。候補に挙げておこう。

しかし、あれだな。Googleが「じーおーおーじーえるいー」と読まれ、WordPressは「ワードプレス」と読まれる。この違いは何だろう。。。

イベントの内容はこちら。ふくい産業支援センター佐藤さんのブログから抜粋させて頂きつつ、出演者様のリンクを追加しました。
■アップグレードふくい[ugf]担当者ブログ | 財団法人ふくい産業支援センター アップグレード福井 UGF

イベント名：Mashup Seminar in FUKUI

□日 時：平成21年 1月17日(土) 15:00 ～
□時 間：[セミナーの部］15:00-18:50［交流会の部］19:00-20:30
※セミナーのみの参加もOKです。
□定 員：100名(事前登録制)
□参加費：2000円(当日払い）
※セミナー参加料、交流会飲食費を含みます。
□会 場：Aossa(福井県福井市手寄1丁目4)
□主 催：(財)ふくい産業支援センター
□公式サイト：http://www.fisc.jp/mashup/
□申込ページ：http://www.fisc.jp/learning/ugf/index.html

□出演者（出演順）：
・藤井 彰人氏（サン・マイクロシステムズ株式会社）
・山 健太郎氏（DA-Studio）
・石橋 利真氏（メディアテクノロジーラボ）※株式会社リクルートの実証研究機関
・福野 泰介氏（株式会社jig.jp）
・ふくいソフトウェアコンペティション2008 入賞作品発表会 など

□主な講演タイトル
・Mashup Awards 4と最新IT事情について
・マッシュアップで技術革新！～MA4最優秀賞作品ChaMap～
・リクルートと “Web as a Platform”
・iPhone/Android/jiglet、モバイルマッシュアップセミナー
・ふくいソフトウェアコンペティション2008 入賞作品発表会

あなたがこのイベントに申し込む理由

福井でこれだけゴージャスなイベント、なかなかありませんよ。センターの佐藤さん曰く「300km以内の方はぜひ」というくらい。
藤井彰人さんは、Javaを作ったサン・マイクロシステムズの人。こちらの著者の方です。 見覚えのある表紙です。

はじめてのSun Java Studio Creator

posted with amazlet at 08.12.16

藤井 彰人 渡辺 弘之 平田 祥子
日経BP社
売り上げランキング: 532479

Amazon.co.jp で詳細を見る

山健太郎さんは、今年のMashup Award 2008で最優秀賞を受賞したChamapの発案・製作者です。何度かこのブログでも紹介してます。

■Chamap – Enjoy Geo Communication!

ただいま私がモニター中のケータイ会議でお馴染み、百式管理人田口さんのITmediaインタビューでも先週取り上げられていました。
■ひとりで作るネットサービス：田舎にいてもチャンスはつかめる――「Chamap」でコンテスト優勝、kentaroさん (1/2) – ITmedia Biz.ID

石橋利真さんは、こちらの本の著者の一人。（ってごめんなさい、これまだ読んでない）

Webプログラミング (ウェブの仕事力が上がる標準ガイドブック)

posted with amazlet at 08.12.16

後藤康成 貝畑政徳 田中正裕 深津貴之 坂井恵 太田良典 佐藤伸哉 面白法人カヤック 石橋利真 笠谷真也
ワークスコーポレーション
売り上げランキング: 17448

Amazon.co.jp で詳細を見る

福野泰介さんは、ケータイブラウザのjigブラウザはじめ、jigシリーズサービスのCEO。ご自身のブログがCNETのVenture Viewにも取り上げられています。
■福野泰介 jig.jp経営日記 – VENTURE VIEW

そんな方々のセミナーと交流会で来年のスタートを切ってみてはいかがでしょうか？私も申し込み済み。100名の定員オーバーは必至。抽選か先着かは分からないのですが、とにかく申込ページへ急げ！
■お申し込み | アップグレードふくい

▼関連記事
■世界中の人たちと音声チャット出来る「World Chamap」 | 本質思考道場
■祝！福井県勝山市のKentaroさん作「ChaMap（チャマップ）」がMashupアワード最優秀賞 | 本質思考道場
■Webデザインの現場を変える「CSS Nite in Fukui」 | 本質思考道場

P.S.
正月休みを利用してWordPress2.7に引越す予定。このイベントの時にはそうなっていると思います。という決意。

「Here!」で入ると、こちら画面に。自分の母国語を選びます。

そして、選んだ母国語で世界中の人のチャットが聴けるというわけ。逆も同じで、私が打った内容は相手には相手に分かる言葉で伝わる。翻訳にはGoogle翻訳を使っているようで、ちょっと「その訳はどうなのよ！」ってのもご愛嬌で面白い。まだまだ世界中には広まっているわけではなさそうで、しばらく待ってもネイティブな外国人の方とチャットすることが出来なかったのが残念。

と思っていたら、開発したKentaroさんが入ってきて、念願のご対面！

福井話題で盛り上がったよ。
今レビュー中のF-01Aフルブラウザでアクセスしてみたが、さすがにこれだけのAjaxは動かず。「スクリプト読込中」のまま止まってしまいました。iPhoneだとどうなんでしょうね。
これがモバイル端末で動いたらすごいな。海外旅行に行って現地の人とネットでおしゃべりしながら、おいしいお店を教えてもらったり、ちょっとした通訳機に使えたり。なんだか便利そうです。
コミュニケーションに語学力は大切ですが、伝えるコンテンツの源泉はハート。そんな風に思っているから今年も英語が上達しないのだろうか。ええぃ、日常会話は伝わるからいっか。いや、いずれプレゼンとかやってみたいかも。その時に備えて。。。

▼関連記事
■祝！福井県勝山市のKentaroさん作「ChaMap（チャマップ）」がMashupアワード最優秀賞 | 本質思考道場
■自分のペースで英語を学ぶSNS「iKnow!」 | 本質思考道場
■相撲を見る時に知っておくとタメになるTips10 | 本質思考道場

最優秀賞は我が福井県勝山市のプログラマ「Kentaro」さんによる、「ChaMap」。
■ケンタローの開発日記
■Chamap – Enjoy Geo Communication!

いわゆるチャットサイトなのですが、ユーザインタフェースが実に面白いです。特に以下の２点。

１．地図に吹き出す
発言した方の辺りに吹き出しで表示されます。通常の時系列の見え方も右サイドにあります。自分の場所の指定は、地図上でクリックして鉛筆マークを置くことで指定できます。さらに、PlaceEngineというサービスでお使いのパソコンが捕まえたWiFi信号を元に場所を予測することも出来るとのこと。私が住んでいる福井市の場合は、まだPlaceEngineのデータベースが対応していないのか、「位置が特定できません」となってしまいましたが。

２．しゃべる
驚いたのはこれ。打ち込んだ文字をしゃべってくれます。打ち込んだ文字をサーバ側で音声にしてブラウザ側で再生するということです。ロボットのような無機質な声なのですが、パソコン側で初音ミクなんかの音声に指定できたらさらに面白そう。開発ログを読んでいくと、実はそれほど難しくないそうで、他のサイトにも使えそうですね。例えば、RSSリーダーと連携して、フィード記事を音声で読み上げてくれるとか、フィード記事を音声のPodcastにしてくれるとか。朝のニュースチェックが着替えながら出来ると良いですね。

他の受賞者の方の作品もアイデアに富んだものばかり。皆さんいつ時間作るのだろうと感心します。

それにしてもKentaroさん、おめでとうございます。同じ福井出身として誇らしいです。きっとどこかの県内イベントでご一緒しているのでしょうが、まだしっかりお話出来ていないのでお会いしたいです。

福井県は県の財団法人ふくい産業支援センターさんが結構頑張ってくれていて、「アップグレードふくい」というイベントが年に数回あって今年もCSSniteを呼んでくれたり、実はかなり恵まれた環境なのですよね。東京だとどのイベントもすぐ定員になって行けないと嘆いているデザイナーやプログラマーも多いのですよ。来年は福井でブロガーイベントなんかもやってみたいものです。その時はぜひ。

▼関連記事
■Webデザインの現場を変える「CSS Nite in Fukui」 | 本質思考道場
■食べ歩き写真を日本地図に載せました「Google Picasa ウェブアルバム」 | 本質思考道場