ZAPAnet総合情報局 > ZAPAブログ2.0 > とあるWebサービスが完成するまでの道のり〜3マッチ棒編〜

とあるWebサービスが完成するまでの道のり〜3マッチ棒編〜

2007年07月06日 プログラミングTIPS

ブックマークされたサイトだけから検索してくれる「3マッチ棒」
この「3マッチ棒」というWebサービスが完成するまでの長い長い道のりを、サイト公開から1ヶ月半経った今、開発者の視点から語ってみることにします。

3マッチ棒」の完成までには、構想3分、プログラミング30分、テスト・バグ修正・改良に30分かかりました。
そんな「3マッチ棒」開発者の苦悩の物語を、開発者自ら語ります。

1. 2007年5月22日、50 MATCHESに出会う
2. ソーシャルブックマークで人気のサイトの検索方法
3. ネーミングを考える
4. プログラミング開始
5. 魅力的なマッチ棒の撮影
6. 3マッチ棒のテスト・バグ修正・改良
7. 2007年5月22日、3マッチ棒の完成とスタート
8. 3マッチ棒を完成させたのに、本当は悔しかったこと
9. Webサービスはネーミングもデザインも重要
10. 実現できなかった経験は、今後に生かす





1. 2007年5月22日、50 MATCHESに出会う

2007年5月22日、100SHIKI.COM
ブックマークされたサイトだけから検索してくれる『50 MATCHES』 | 100SHIKI.COM(5月22日10:39投稿の記事)
が投稿され、「50 Matches.com」の存在を知りました。
「なるほど、ソーシャルブックマークされた人気のサイトからのみ検索できるのか」
「でも対象のサイトは基本的に英語のサイトだし、日本語版のサービスがあったら便利そうだなぁ」
と思いました。
英語では抵抗感があって使いにくくても、日本語版にローカライズしたら便利そうだなぁ、と。

便利そうだなぁと思ったのなら、自分で作ってしまえば良い!」ということで、早速このWebサービスの実装方法について頭の中で考えてみることにしました。


2. ソーシャルブックマークで人気のサイトの検索方法

日本で一番のソーシャルブックマークサイトと言えば「はてなブックマーク」。
幸い、はてなブックマークでは、ブックマークされたサイトに付けられた「タグ」で検索した結果を、RSSフィードで配信しています。
このフィードを利用すれば、ソーシャルブックマークで人気のサイトを検索できるだろうと考えました。

次に、検索されたサイトのブックマークコメントも見られるようにすれば便利だと考えました。
そこで、日本のSBMサイトとして人気のあるはてなブックマークlivedoor クリップBuzzurlのソーシャルコメントページへのリンクとブックマーク数を表示することに決めました。
基本的な機能はこれで十分だと考え、次にWebサービスに重要なネーミングを考えることにしました。


3. ネーミングを考える

「diggやdel.icio.usでブックマークされた人気のサイトを対象に検索する50 Matches
「外国人にはわかりやすくても、日本人にとってはわかりにくいなぁ」
と率直に思いました。
Matches」という複数形の単語が、日本人が利用する上での取っつきやすさを奪ってしまいます。
「マッチス」なんて口に出して言うのさえちょっと難しいし、日本人の全世代向けに適しているネーミングとは思えませんでした。

それで、頭をフル回転させて、ネーミングを考えてみました。
「マッチ、マッチ…」
マッチと言えば、近藤真彦。
近藤真彦と言えば、近藤 真茶彦(マチャ彦)。
マチャ彦と言えば、セクシーコマンド外伝 すごいよ!!マサルさん

「ん、ダメだ、この連想からのネーミングはやめよう」

もう一度、気を取り直して、ネーミングを考えてみました。
「マッチ、マッチ…」
マッチと言えば、マッチ棒。
マッチ棒と言えば、火が付く!
よし、Matchesをマッチ棒にしよう!
と決めました。
ブックマークのしきい値を「3」にする予定だったので、じゃあ、「3マッチ棒だ!」と。

Webサービスのイメージとして、
暗がりの中で、一つ、また一つと、小さく明るく輝き燃えている火の付いたマッチ棒を見つけ出すイメージ
を実現させようと考えました。
真っ暗闇で光を見て希望を持つような、あるいは暗闇の中で光り輝く宝物を見つけるような、そんなイメージにしようと思いました。
サイト全体を暗くして、検索結果でサイトが見つかった場合のみ、マッチ棒が明るく燃えあがるサイトを作ろうと思いました。
Flashか何かを使って、検索結果ページでは、見つかったサイト数に合わせて、マッチ棒が「ボッ、ボッ、ボッ」と明るく輝き出す表現を実現できれば、と考えました。


4. プログラミング開始

以上、はじめて「50 Matches」を見てから、3分でサイト構想を固めました。
「3マッチ棒」というネーミングが決定したので、今度は実際にプログラミングできるかどうか、プロトタイプの作成に取りかかりました。
「うん、これはいけそう!」
と手応えをつかんだところで、サイトの肝である「マッチ棒」の撮影に取りかかりました。


5. 魅力的なマッチ棒の撮影

「3マッチ棒」というサービス名である以上、その姿を映し出す「マッチ棒」の姿は魅力的でなければいけません。
まずは、機材の用意。
暗闇で撮影する写真ということで、
暗い部屋
デジタル一眼レフカメラ
三脚
マッチ
マッチに火を付け、魅力的な角度でマッチ棒を持てる人
が必要になります。
また、写真を撮ってから、火の付いたマッチ棒を魅力的にデジタル加工し、Flashで仕上げる技術も必要になります。

それで、実際に「魅力的なマッチ棒の撮影」に取りかかろうとしましたが…
デジタル一眼レフカメラを持ってない、三脚を持ってない、マッチに火を付け魅力的な角度でマッチ棒を持てる人がいない、写真を加工できる人もFlashで仕上げられる人もいない。

というか、そもそも「マッチ棒が無い!」。

ということに気付き、「魅力的なマッチ棒の撮影」は断念しました。
マッチ棒なんて、小学校の理科実験の時、アルコールランプに火を付けたくらいの経験しか無いことに気付きました。
身近なようで身近でない。
そんなマッチ棒の存在を可哀相にも思いました。

マッチ棒は買いに行けば済むことですが、そのほかの技術を揃えるのは大変だったため、「魅力的なマッチ棒の撮影」は断念しました。


6. 3マッチ棒のテスト・バグ修正・改良

魅力的なマッチ棒を撮影できなかったからといって、「3マッチ棒」というサービス自体が消えてしまうわけではありません。
「マッチ棒の姿抜き」で作り上げることにしました。

「暗闇の中で浮かび上がる火の付いたマッチ棒」のイメージで作り上げることができなくなってしまったため、「最新情報」で使っているデザインを流用することにしました。
プロトタイプ版のソースコードを「最新情報」のデザインに組み込み、テスト版を作りました。

(後に、SBMサイトで人気のサイトからのみ検索できるだけではつまらないと感じて、「注目のキーワード検索」や「関連キーワード検索」を搭載しました)


7. 2007年5月22日、3マッチ棒の完成とスタート

2007年5月22日、「3マッチ棒」のテスト・バグ修正・改良を完了させました。

構想3分、プログラミング30分、テスト・バグ修正・改良に30分かかった壮大なプロジェクトでした。

ブログで「3マッチ棒」を作ったことを報告するために、「ブックマークされたサイトだけから検索してくれる「3マッチ棒」」というエントリも書きました。

Webサービスはスピードが重要!」という人が多いのはまさにその通りで、このように短期間でも便利なWebサービスを作ることはできます。
今回の例で言えば、昼休みに上記ブログを読み、急いでプログラミングすれば昼休み時間内でも完成させることができます。(昼ごはんを食べる時間はないので、パンでも食べながら)
短期間で作ることで、無駄な開発費もかかりません。
思い付いたら即作成」して、後は実際に使いながらサービスとしての完成度を高めていくこともできます。


8. 3マッチ棒を完成させたのに、本当は悔しかったこと

3マッチ棒」を作ろうと思いつき、完成させ、発表することはできましたが、自分の中でとても悔しいことがありました。
それは、自分以外の人たちにとって「3マッチ棒のネーミングが意味不明」だったことです。
開発当初の自分のイメージとしては、新着順で検索したときに「被ブックマーク数のしきい値3にマッチしたサイト」と「マッチ棒」を引っかけたネーミングをイメージしていました。
ところが、肝心のマッチ棒が登場しないことで、「マッチ棒」という意味が不明で、ユーザーにわかりにくいネーミングになってしまいました。

だったら、「新たにマッチ棒の写真でも撮って載せれば?」と言われれば、そんな簡単な問題だとは思えませんでした。
当初イメージしていた「暗がりの中で、一つ、また一つと、小さく明るく輝き燃えている火の付いたマッチ棒を見つけ出すイメージ」が作れなかった以上、これ以上デザインに手を加えるのはやめにしておきました。

自分の構想していたサイトの半分しか実現できなかったことで、Webサービス自体は完成はさせたのに、とても悔しい気持ちでいっぱいになりました。


9. Webサービスはネーミングもデザインも重要

今回、「3マッチ棒」というWebサービスを作り、「Webサービスにはネーミングもデザインも重要」なんだと実感しました。
機能性だけでも、ネーミングだけでも、デザインだけでもダメで、それぞれが調和し合ってこそ、素晴らしいサービスになり得るのだと思いました。
こうやって口で言うのは簡単でも、実際に作るのはとても大変な作業になります。
システムを作る人とネーミングを考える人とデザインを作る人は、大抵それぞれの専門分野での優れた能力が必要になります。

個人でWebサービスを作る場合は、その辺りに弱点があると感じました。
もちろん、大企業であれば簡単に実現できるかというとそうでもなく、スピード感に欠けたり、権力の違いで意思疎通がうまくいかなかったりする弱点もあります。
ITの分野において、フットワークの軽いベンチャー企業の方が革新的なWebサービスを多く生み出している背景には、この辺りのことも影響しているのかもしれません。


10. 実現できなかった経験は、今後に生かす

3マッチ棒」では実現できなかったことがいくつかありました。
デザイン面にも、インターフェースにも、取っつきやすさ・わかりやすさにも課題が残りました。
なぜ実現できなかったのか?
どうすれば実現できるのか?
その辺りのことを胸に秘め、アンテナを張り巡らしていれば、ある時解決策は見つかるものです。
何事も諦めず、悔しいこと・実現できなかったことは、今後に生かせば良いのです。


次回、「とあるWebサービスが完成するまでの道のり〜ツンデレサーチ!編〜」に続きます。

関連リンク

とあるWebサービスが完成するまでの道のり〜おはようチューブ編〜
3マッチ棒
ブックマークされたサイトだけから検索してくれる「3マッチ棒」
「3マッチ棒」パワーアップ!