マッシュアップアワード6で受賞いたしました。

レコメガール 』 が、マッシュアップアワード6で、サイブリッジ賞、サントリービジネスエキスパート賞、TokyoArtBeat賞の3賞を受賞しました。感想くださった方々、ツイッターでRTしてくださった方々、はてぶしてくださった方々など、本当にありがとうございました。

MashupAwards6 レコメガール 作品説明ページ

マッシュアップアワード6 レコメガールで、3賞受賞させていただきました。

今回は、summerwindさんといっしょに作らせていただきました。特に動画と画像の合成部分は、わずか1日ほどで基本となるものを作ってくださり、スピード感のある、いい意味で緊張した関係で開発をすすめることができたと思います。さすがでした。
自分は、デザインや表面のマークアップ、細かい動きのjsなど、見た目周りを中心に担当しました。

動画と画像の合成部分の作り方を簡単にいうと、AfterEffects CS4からバンドルされているMochaというソフトを使い、1フレームごとの動画を解析し、そのデータを元にAPIで引っ張ってきた画像をHTML5のcanvas上で合成しています。
(近いうちに、AEPで詳しい作り方を書きます)

個人的な反省点としては、コンテンツとしての厚みが足りなかったと思います。
HTML5でできているという技術的な点を抜かしてしまうと、薄いコンテンツに感じてしまい、もう1,2段、深い意味と厚みを持たせたコンテンツにできたかなと思いました。

今回、感じたことや反省点を、次回作るものに生かしていこうと思います。
受賞でき、とてもうれしかったです。
常日頃、お世話になっているみなさまのおかげです。本当にありがとうございました。

safariでiPhoneやiPadの表示を確認する方法

右の一般設定の表示ボタン(歯車みたいなの)
 ↓
設定
 ↓
一番右の詳細タブ
 ↓
メニューバーに”開発”メニュー表示

設定終了して、

safariのメニューを表示
 ↓
開発
 ↓
ユーザーエージェント

ここでsafariのiPadやiPhoneの各バージョンを選び確認できます。

HTML5でできたサイトのアクセス内容

2週間ほど前、『FlashとHTML5と…』 という、主にHTML5で書かれたサイトを作りました。

ありがたいことに、ツイッターで多くRTしてくださったり、ホッテントリに入ったりと、多くのアクセスをいただきました。

時間もたって落ち着いてきたので、HTML5と名のつくサイトに、「どれくらいの人がくるのか?」 「くる人のブラウザの比率は?」 「ホッテントリに入るとどれくらいの人が来るのか?」 などを、お礼の変わりにご報告したいと思います。

まずは、アクセス数周りから。

図.アクセス数と訪問者の参照元
FlashとHTML5と… 訪問者の参照元

図にも書いてありますが、UUは5000件ほどでした。
6、7年前、当時日本で有名だったらランキングサイトReadme!で2位になったことがありまして、そのときは一日15万ほどのアクセスがあったのですが、インターネットの人口も増えた今、はてぶのトップ(下のほうだけど)で、UU5000件は、想像よりは少なかったです。
(もちろん、特定の分野の人にしか興味がないサイトなので、当たり前なのかもしれませんが)

ホッテントリからの訪問者は800人ほどのようです。最高で、総合ホッテントリの上から30番目くらいでした。

図.訪問者のブラウザと OS
FlashとHTML5と… 訪問者のブラウザ比率

ブラウザ比率 IEは10%、はてぶだからかFirefoxが一番多かったです。
chromeも多いですが、Firefoxで一度見た人が、chromeに変えてみているのでカウントされてしまっているのもあるのかなと思っています。

気になったのが、iPhoneからのアクセスが1割近くあるということですね。実際に、周りのエンジニア寄りな人からも、「iPhoneだと見れなかった」と言葉いただいたので、技術的なサイトを作る際は、スマートフォン対応は、必須に近いかなと思いました。

まとめ

サービスではなくコンテンツなので、あまり参考にならないデータかもしれません。

内容が内容だけに、ブラウザ比率などは一般の数字とちょっと違うデータになりました。
最初、IEの比率は、5%ほどだったのですが、日を追うごとに少しずつ増えていき、いまでは10%近くになっています。これは、最初エンジニア寄りの人から情報がくだっていって、普通のユーザにも情報が少しは届いていったかなと考えました。

最後に、参考にさせていただいたclockmakerさんのブログの 『Flashだとここまでできる! HTML5とFlashの機能比較』 からリンクを貼っていただきました。ありがとうございました。

遅いお礼になってしまいますが、RTやリプライくださった方、はてぶに入れてくださった方、コメントくださった方、本当にありがとうございました。

MacBookPro メモリ8GBにしました

ノートパソコンが必要になり、ちょっと日常に変化をということで、winノートではなく、MacBookProを購入し、bootcampでwin7を入れております。

早速、メモリを8Gにしてみました。

純正ではなく、ドスパラで購入してみました。4Gを2枚です。DDR3 SO-DIMM PC3-8500 4GB

Macを購入するのはじめてで、メモリの相性など怖かったのですが、無事に動いているようです。

ためしに、メモリ4Gのとき、AEでレンダリング50分かかっていた2分ほどの動画を8Gでしてみると、31分で済みました。
Premiereでのカット編時などでも、体感できるほどスムーズになればいいなと期待しております。

skypeを使ったオンライン英会話をはじめてみました

最近、ニューヨークに行ったり、知り合いの海外出張の話を聞いたりしていたら、
英語しゃべれるようになりたい熱が、本格的になってきました。(英語しゃべりたい熱というか、海外に仕事で行きたい熱)

そんな時に、たまたまネット英会話のことを聞きまして、始めてみました。

スカイプを使った英会話で、フィリピンなどの国の人を相手に話をします。
レアジョブが一番の大手のようですが、自分はぐんぐん英会話を選んでみました。

受講料も1時間数百円と激安(ちょっといろいろ考えるところですが…)で、更に時間も融通が利くので、社会人にとってはとても都合がいいサービスです。

まだ、始めたばっかりで、単語だけで会話しているような状態なのですが、インターネットの話は世界共通で通じるので、話しやすいですね。
英会話に慣れるはじめの一歩として、インターネットの話題はいいなと思いました。

例えば、
・検索エンジン何使ってる?
・facebookやってる?
・ebayやってる?
・携帯電話、iPhone使ってる?
などなど。

ちなみに、フィリピンでは、検索エンジンは、googleが一位でyahooが二位。
facebookは、今まで話したほとんどの講師がやってました。
twitterは知ってる人はいても、アカウント持ってる人はあんまりいないみたいです。
アップルとsony製品は、あちらでも高級品だと。
日本のsonyをはじめ、東芝、日立、パナソニックは、あちらでも電化製品使ってる人が多いので、ちょっとうれしかったです。

そういえば、昨日、amazon(というかネットショッピング)の悪口を30分間しゃべり続ける講師に当たりました…。でも、それも楽しかったです。

1日1時間まで授業を受けることができるので、忙しい日でも30分は受講して、なんとか来春までには話せるようになろうと思います。

CamStudio 動画画面キャプチャソフト

スクリーンショットを撮る様に、PCの画面上を動画で撮るソフトです。
「動画キャプチャ」 で検索すると、いくつか出てくると思いますが、下記のソフトを使いました。

CamStudio 日本語版

操作方法も分かりやすく、ダウンロード後すぐに使うことができました。
ただ、aviで保存したものをAfter Effects などで編集しようとすると、コーデックが少し違うのか綺麗にいかないことがありました。その場合は、保存を swf に切り替えてすることで対応しました。

また、最近ではゲームプレイ動画を公開することにも使われているようです。
参考: HD時代のゲームプレイ動画のつくり方

iPad keynote VGAケーブルを使ってモニター出力

iPadのkeynoteでプレゼンを作成し、VGAケーブルをつないでモニターに出力してみました。

これがkeynoteを立ち上げたときの画面。
iPad keynote

このように画像周りの装飾もいくつものパターンから選べます。
iPad Keynote 画像装飾

VGAケーブルをつなぎプレゼン画面にすると、iPadのほうはコントロール画面になります。
iPad keynote VGAケーブル接続画面

iPadでプレゼンテーション(Keynote for iPad)

ニューヨークへ行った際、iPadとKeynote for iPadを購入しました。
早速、プレゼンを簡単ですが作ってみました。
Keynoteほとんど使ったことなかったのですが、ほんの2時間ほどでプレゼンをゼロから作れました。(プレゼンの内容を考える時間も含めて2時間なので、実作業はほんの数十分です)

ちなみに、iPadでは動画などへの書き出しはできないので、PCにファイルを転送し動画に書き出ししました。