ちょっと当ブログの読者層とは違ったターゲットへのサービスですが、久しぶりにガッツリとwebサービスを作ったのでご紹介！

アマチュアミュージシャン、特にバンドマンにとって「信頼しあえるメンバーとの出会い」というのは、一番重要なんですが、一番難しいんですよねー。

メンバーを探すバンドマン達は、友人のツテを回りつつ、バンドメンバー募集サイト（通称：メン募サイト）に登録して、気になるユーザーに片っ端からコンタクトを取る、ってのが王道なんですが、この「メン募サイト」っちゅーのが結構クセモノで。

というのも、勘違いした出会い厨や宣伝業者が紛れ込んでたり、全くの初心者が上級者のフリしてメンバー募集してたり、そしてソレを運営側では大して対処してなかったり。

出会い厨や業者は別として、もちろん趣味レベルでバンドをやるのも全然良いし、初心者だけどバンドを組みたいってのも全然アリなんですが、そんな彼らと「ホンキでメンバーを探している、中級者以上のプロ志向ミュージシャン」が同じトコでメンバーを探し回るってのは、マッチングサービスとしてターゲットニーズに適応しにくくなるし、そもそも同じ土俵じゃないような気がするし。

元ミュージシャンとして、実際に出会えない苦労を腐るほど経験したからこそ作れるモノがあるんじゃないかと思い立ち、約１ヶ月で作ったのが、この「バンドメンバー募集サイト | vibe U」です。

自分自身の経験を基に、「登録時にデモ音源の登録が必須」「年齢・性別は敢えて非公開」など、今までのメン募サイトでは考えられないような縛りを設けつつ、「ファーストコンタクトはワンクリックで完結」「youtube動画も登録OK」といった機能性も加え、「twitter型のコミュニケーションツール」を設置することで、既存サービスでは難しかった「サービス上での濃密なコミュニケーション」を計っています。

もし当ブログ読者の方で、ご本人やその友人諸氏が”ホンキの”バンドメンバーをお探しなら、是非とも「vibe U」をご利用 or ご紹介くださいまし☆

「ホンキのバンドメンバー」を募集・検索するサービス「vibe U」

「vibe U」の機能概要について

基本機能としては、メンバー検索はもちろん、プロフィール閲覧やデモ音源の試聴をはじめ、気になったメンバーに対して「私はあなたに興味を持ちました」という意思表示をワンクリックで送信する「vibe!」ボタンや、メンバー同士がお互いに「vibe!」ボタンを押した場合に本人達にだけ開かれるtwitter型コミュニケーションツール「synergy」ページなどを装備しています。

「vibe U」のいろいろな仕組みについて

当ブログ読者の皆様にはこっちの方が興味アリだと思うんですが。

作成スキルとしては、Illustrator / Photoshopを使ってデザインを進め、HTML / CSS / jQuery / PHP / MySQLを使って組み立てました。

中でもユニークなんじゃなかろーかと思う施策は、メンバー登録時に記入してもらった郵便番号から住所を取得するのに、日本郵政のHPを独自にAPI化させてみたトコとか、「vibe!」ボタンを押した際に画面遷移させずAJAX（jQuery）で処理させたトコとか、キャンペーンページを作ってみたコトとか、デモ音源の試聴システムに「SoundManager 2」ってヤツを使ったトコとか、でしょーか。

まず最初の「日本郵政のHPを独自にAPI化」については、API化なんてゆーほど往々しいモンじゃなくて、単純に日本郵便HPの「郵便番号検索」ページの検索クエリに、登録フォームに記入された郵便番号を入れて file_get_contents() して、必要な箇所を正規表現でゲット！って感じです。

次に「画面遷移させずAJAX（jQuery）で処理」ですが、これもカンタンな話で、jQuery標準搭載の $.ajax 関数を使って該当プログラムにアクセス、該当プログラム上ではアクセス元やセッションなどの整合性を確認した後、処理して結果を echo するようにしといて、それをそのまま $.ajax の戻り値として表示させてます。

続いて「キャンペーンページ」に関しては、そもそもこーゆーサービスの場合は初期段階でそれなりの登録人数がいないと、「（ユーザーが少ないから）使われない → （使われないから）ユーザーが増えない → （ユーザーが少ないから）使われない」っちゅー無限回廊に陥る危険性があると思ったので、どんなネタにせよ何らかのキャンペーンを打って人目に付くようにした方が良いなーと思い立ってすぐに作成、完成と同時に「ランディングページあつめました。」というサイトにセルフ推薦し、数日後に掲載して頂きました。ありがとーございますっ！

デモ音源の試聴システム「SoundManager 2」は、色々この手のJSやFLASHを探し回った（その時に集めた情報のまとめ記事はコチラ）結果、最もシンプルで扱いやすそうだったので、結構すんなり決めちゃいました。

「vibe U」の制作スケジュール感について

まず最初にこのアイディアが浮かんだのが8月6日、10年来の友人と久しぶりに近所のガストでお茶した深夜の出来事。

お互いに元ミュージシャン同士、当時のコトなどわぁわぁ言ってるうちに「いまだにメンバー募集サイトは変わってない」みたいな話になり、そこから「こんなメン募サイトがあったらいいな」って話が異様に盛り上がって、じゃー作ってみようか、と。

翌日には「基本機能の割り出し」とか「必要になりそうなコンテンツのピックアップ」を行い、基本的なDB設計を考えるなど。

その後はザックリとですが、まずデザイン作業に入るとともに、ほぼ平行してHTML / CSSコーディングも行っていき、主要ページの静的コーディングがある程度出来上がったのが8月19日ごろ。

そっから本格的にプログラミングに入るんですが、ここで数々の問題に苛まされるのでありました。

というのも、最初の方で勢い込んじゃって、必要となるコンテンツの抜き出しやリレーションを考慮したDB設計など、いわゆる「仕様設計」みたいなトコを俄然アバウトにしすぎちゃった結果、いざプログラム組み始めるとアレが足りないだのコレが無いだの、続々と抜けや漏れが出てきて、作っては戻ってを繰り返すハメに。

教訓！「サービス構築とは『設計が８割』と心得るべし！」

そんな紆余曲折を乗り越え、予定していた機能も実装できて、サイト紹介文や利用規約などのテキスト文言以外が出来上がったトコで、仮サーバにアップして前述の友人に見せたのが、ちょうど開始から１ヶ月マイナス１日の9月7日。

そこでいくつかのフィードバックを得て、さらに機能追加やデザインの微調整を行い、各種ブラウザチェックや挙動テストを行い、テキスト文言を書き、ドメインを取得し、サーバの設定を行い、そこにファイルを上げて最終チェックをしたのが9月16日。

その日のうちにgoogle webmasterに登録したので、一応9月16日をオープン日として、６週間で企画から公開までとなりました。

これが早いか遅いかはよく分かりませんが、とりあえずこの程度の期間があればこの程度のサービスは作れますよ♪ってコトで、お仕事お待ちしてますｗ

おまけ

初期QUEEN好きとしては、敢えて言いたい。

「No Frameworks！」

でっていうｗｗｗ

メン募サイトの新定番！
今まで無かった、ホンキのバンドメンバー
募集サイト「vibe U」