Live Spots Today (今日のライブスケジュール)、新装開店しました
Live Spots Today (今日のライブスケジュール)という、ライブスケジュール情報を集約するサイトを運営してるんですが、先だってこのページデザインを一新しました。今回は、その作業の内訳を備忘録的に纏めておきます。
Live Spots Today (今日のライブスケジュール)とは
このサービスは去年の4月頃に思いつきでえいやっとビルドしたようなものですが、その際、なんでかブログで告知することもなかったので(多分自信が無かったんでしょう)、少し説明を。サイトのトップページにもありますが(ていうかトップページしかありませんが、今のところw)、外出先での「この近くで良いライブでもやってないかなー」という状況へのソリューションを企図したものです。ケータイでライブハウス毎に調べられるといえばそうかも知れませんが、昔ならそんな時はキオスクあたりで「ぴあ」でも買って、その街のライブスケジュール欄をチェックすれば一発 OK でした。便利になったんだか不便になったんだか...てのも動機のひとつではありますな。
改修ポイント
では、改修点と利用したソフトウェア等を箇条書きで。下図は、デザイン変更前後のスクリーンショット比較と改修箇所です。
- ページレイアウトをこのブログでも何度か言及している BlueprintCSS を利用した手法に切り替えました。
- タイトルバナー画像(上図①)は、著作権制限なしの写真を Flickr から検索して Gimp で加工して作成しました。検索は igosso 画像検索が便利でした。
- ライブ情報がテキストだけだとパッと見、わかりづらいのでライブハウスのアイコンでも欲しかったのですが、これを収集するのは大変(無い場合もあるし)なので、Web サイトのスクリーションショットをアイコン化して加えました(上図②)。スクリーションショット画像の生成は、HeartRails Capture というサービスの API を利用しました。無料で使える素晴らしいサービスですね。
- ライブハウス位置の地図表示(上図③)は、以前はサイドバーの固定位置にあった GoogleMap を操作していましたが、これだと下にスクロールした際に地図がスクロールアウトしてしまうので、ポップアップ表示に変えました。当然のようにこの処理周りは jQuery + GooleMaps API です。地図表示のボタンは、SexyButtons という jQuery UI ライブラリを使わせて貰いました。Cool !!
