blk

iPhoneから音楽を30秒間試聴できる「30sec.fm」

投稿日: 2011年10月4日作成者: beryu

iPhoneで楽曲が30秒間試聴出来るサービス「30sec.fm」をリリースしました。
iPhoneに標準搭載されているiTunes Storeアプリと違い、Wi-Fi環境の無い場所からも利用出来る点が大きな特徴です。
（iPhoneのブラウザから http://30sec.fm にアクセスしてご利用ください。）

…実はコレ、新サービスではなく2010年にリリースした「Music Preview 3G」をリニューアルしたものですｗ（当時の記事はコチラ）
なぜ作り直したのかというと、Music Preview 3Gには以下のような改善の余地があったからなのでした。

1.UIの改善

旧サイトは機能がシンプルな割に、「タッチすれば音楽が再生される」という主機能を説明するデザインが出来ておらず、ユーザを迷わせてしまう可能性がありました。
そこで新サイトでは、曲のアートワークに再生ボタンの画像を重ねて、そこに触れれば再生される事が直感的に分かるデザインにしました。
更にjQuery Mobileを採用した事で、使い心地（滑らかなアニメーション等）が改善したのも個人的には大きなポイントですｗ

2.処理速度の改善

旧サイトでは、iPhoneの性能が追いつかずにスクロールの途中でひっかかるような感覚がありました。
これには、HTML5の<audio>タグの使い方が大きく影響していたようです。

旧サイト（Music Preview 3G）の場合

このサービスは検索結果の行をタッチするとその曲が再生され始める仕組みなのですが、Music Preview 3Gでは「曲:audio要素＝n:n」の関係になっています。
つまり、検索結果の数だけaudio要素が必要なわけです。

新サイト（30sec.fm）の場合

30sec.fmでは「曲:audio要素＝n:1」の関係になっています。
つまり、検索結果が何件あろうと、一つのaudio要素を全曲で共有するような仕組みになっています。
この改善策を採った結果、新サイトではスルスルとスクロールしてくれるようになりました。

どうやらaudio要素は「再生していなくても配置しているだけで負荷がかかる」みたいなので、極力audio要素の数を抑えるのが動作を重くしないコツのようです。

3.読み込み時間の改善

スマートフォンはPCに比べて回線速度が遅いため、その読み込みに時間がかかる傾向があります。
そこで、とり～たのチームメイトでモバイル向けウェブサービスに詳しい@BoBppくんに最適化をお願いしました。

詳細は正直よく分かっていないのですがｗ、Closure Compilerを使って「CSSとJavaScriptの難読化・結合」をしてくれたみたいです。
その結果、ページの表示にかかる時間が以下のように改善しました。
　最適化無し：約10.8秒
　　↓
　最適化有り：約7.4秒
　（手動で3回計測した時間の平均値）

と、いうわけで

もともとは僕がTSUTAYAにCDを借りに行った時に気になった曲を聞くために作ったサービスですが、ぜひ皆さんにも使って頂ければ幸いです！
http://30sec.fm

カテゴリー: iPhone, Topic, Web(Design), Web(System) | コメントをどうぞ

原宿 THE TERMINALの感想

投稿日: 2011年8月5日作成者: beryu

本日2011/8/5（金）に原宿にオープンしたTHE TERMINALに行った感想です。
（少し前までコーディング作業によく利用していた秋葉原制作所との比較コメントも各項の末尾に入れています。）

雰囲気

良くも悪くもカフェの雰囲気。
誰かがギャーギャー騒いでいる訳では無いけれど、音楽や人の話し声が結構大きくてあまり落ち着けませんでした。
まぁ、こういう雰囲気だと話もしやすいですよね…。

（秋葉原制作所は各席が簡易パーティションで区切られていて、小企業のオフィスのような無骨な部屋になっています。あちらには全くオシャレ感は無いものの、集中は出来ます。）

BGM

割とBGMの音量が大きめ。人によっては耳障りな音量かもしれません。
ボーカル無しのアコースティック曲や、レトロな雰囲気の洋楽が多かった気がします。

（秋葉原制作所でも謎のアニソン風音楽が流れていたものの、凄く小さな音量なので邪魔になりませんでした。）

椅子

一番不満なのが椅子でした。
仮にも”外オフィス”として売り込んでいる施設なのに、なぜ長時間座りにくい椅子が設置されているのか…。
硬い上に、僕が座った椅子は若干グラついていて、あまり落ち着けませんでした。

（秋葉原制作所の方はまともなオフィスチェアが置いてあったので、椅子にストレスを感じたことはありませんでした。）

客層

オープン初日（金曜日）の20時頃の様子ですが、人口密度はギリギリ圧迫感を感じない程度でした（この記事の一番上の写真の状態）。
客層は20代中心ですが、たまに40〜50代のおっちゃんが混じってます。
男女比は9:1で男が多い。

（秋葉原制作所の人口密度は、せいぜい多くても上の写真の半分くらいの時しか見たことがありません。イベント前は多くなるのかな？簡易パーティションで周囲の人の顔が見えないので、年代や男女比は気にした事すら無いです。）

フリードリンク

コーヒーやコーラ、お茶などが飲み放題になっていて、セルフサービスで汲みに行く形になってました。

（秋葉原制作所にもフリードリンクはあります。）

料金

会員制で、入会金が150円。使用料金は30分毎に190円ずつ課金されます。
オープン直後の今だけかもしれませんが、公式サイトで仮会員登録をしてから店で本登録をすると、30分無料券がもらえました。
詳細は公式サイトを参照ください。

（秋葉原制作所の料金（15分100円）とほぼ同じ価格帯ですね。3時間パックはTHE TERMINALが1050円、秋葉原制作所が1200円。）

今後も使うかどうか

あまり良い印象のことを書いてきませんでしたが、実は結構気に入っています。
フリードリンクで、無線LANとコンセントが揃っていて、値段も高くなく、更に内装もオシャレだなんて…これだけ聞いたら最高です（笑）。
まだオープンしたばかりなので今後洗練されることを期待して、次回は1〜2ヶ月後くらいに行ってみます。

カテゴリー: Life, Topic | コメントをどうぞ

自分の環境でMac OS X Lionにしたら動かなくなったアプリ

投稿日: 2011年7月21日作成者: beryu

自分のMacは仕事に使ってないので特に心配することも無く、リリース当日深夜に好奇心の赴くままMac OS X10.7 Lion をインストールしました。
で、動作しないアプリケーションがちょこちょこあったのでメモっておきます。

Spaces: Snow Leopard時代には標準機能として搭載されていたSpaces機能が削除されて、Mission Control機能に置き換わってしまいました。
Spacesでは出来た複数行の画面の並び（2×2とか）が実現出来なくて、1行の並び（上のスクリーンショットでは1×4）しか設定できないぽい…
画面移動に矢印キーの左右を連打しないといけなくなって、少し面倒。
Visor: ホットキーで素早くターミナルを呼び出せるツール。
Lionインストール直後、ホームフォルダの”互換性のないソフトウェア”フォルダに移動されてました。
かなり使ってたので、正直ちょっとキツイ。
…とか思ってたら「TotalTerminal」に改名してLion対応されてた！ありがたやー。
Happy Hacking Keyboard Professional JP: アプリじゃなくて周辺機器だけど、ドライバが対応していないらしい。
日本語配列キーボードなのに英字配列キーボードとして認識されてて超不便ｗ
公式によると「ドライバ・ソフトウェアの対応予定時期は、2011年8月初旬です。」だそうで。。
（2011.07.21 15:00 追記）
コメント欄で教えて頂いたのですが、「 Mac OS X v10.7（Lion) Preview4対応版」のドライバが存在するようです。
私の環境ではこのバージョンで問題なく動作しているようなので、お困りの方は自己責任でお試しください。
Mac用ドライバ（HHKB Professionalシリーズ専用）
（mizukiさん、ご助言ありがとうございます！）

今のところ、妙な動作を見つけたのは上記のアプリだけ。
最初PhotoshopCS3の起動時に画面が固まって焦ったけれど、すぐ勝手に出てきたJavaランタイムのアップデートを実行したらPhotoshopCS3も使える状態になりました。
（2011.07.22 12:00 追記）
全てのAdobe製品が完全に動作する訳ではないみたいです。
Mac OS X 10.7 Lion で確認されている問題

多少の問題はあるけれど、全体にiOSっぽさがあって気持ち良い（端までスクロールしたときに”ポヨンッ”と弾んだりｗ）ので、慣れるまで頑張ってみます！

カテゴリー: Mac | 4件のコメント

blk