与えられた時間はたった1日 --ウェブサービス企画から公開まで--

シドニー生活も残り少ないのに何やってんだって感じですが、
突然挑戦したくなったので、やってみました。
なんか作ってみたいと思っている人に参考になれば。

ちなみに技術的な話ではありません。
“与えられた”と言っても単に自分が自分に与えた時間です。

作るサービスを決める

前提

1日でアイデアを決めて、サービス公開までやる。
「とにかく何かをつくって世に出してみたい」という欲求を満たすためなので、
ビジネスモデルとかはあったらいいねくらい。深く考えない。

自由であること

自由って難しいです。
なんでもいいと言われると何もできない、、、て人は多いのでは？
ホントに何でもいいんですが、
ウェブサービスというくらいだから何らかの価値を提供しなければ。

人を喜ばせるとか、笑わせるとか、役に立つとか。
簡単なのは、既に世の中に定着しているサービスをちょっと別の視点でつくってみる。
たとえば、レシピの共有サイト、プログラムコードの共有サイト、メール配信サービス、デジタルコンテンツ販売サービスなどなど。
とりあえずベースは真似しちゃいましょう。少し自由から解き放たれます。
なんか逆説的ですね。

自分の強みを発見する

提供できる価値なんて無い！っていう人は、
本当にそうなのか落ち着いて考えてみるといいかも。
なんでもいいのです。べつに大金を稼ぐわけでは無いので。。。
友達にうまい棒が死ぬほど好きっていうヤツがいましたが、いいですよね。
そういうのも価値です。
実際のところ自分の強みってあんまり自分で分かっていないことが多いと思う。

サービス企画

海外に住んでたら強みなんていっぱいあるんじゃないの？と言われそうですが、意外とないです。まぁ前述の通り分かってないだけかもしれません。気づいてないだけかも。
でも、単に海外ってだけですから。現地の情報なんかをブログにも書いたりしますがその程度。
しかもオーストラリア。物価高いしね。海外で安く仕入れてネットで転売なんてのもおいしくない。

ということで半ば無理矢理にサービスを設定しました。
　↓
ここにしかない風景

日々の生活ではまったく意識しないけど、海外生活の何気ない日常も、日本の人からすると非日常（仮定）。そんな風景を写真にして提供すれば、誰か欲しい人いるんじゃないの？（仮定）しかもデザイナーだから、デザイナーの欲しがる写真ってこんな感じかなって撮れるかもしれない。（仮定）じゃあ普段の生活撮った写真をフリー素材として提供するサイトをつくろう。

まぁ見て分かる通り全部仮定です ^{^}

景色の凄いところにいつも行ける訳ではないし、写真だってプロでないので、デザイナーが広告なんかで使えるクオリティを撮れるとも思っていない（頑張るけど）。しかもみんな海外旅行とかよく行ってるみたいだから、そんなに需要ないかもしれない。。。

と否定しようとすればいくらでもできますが、いいのです。
ポイントはそれが間違っててもいいので仮説をたてて何を実行すればいいのか決めること。
何かつくりたいんだから、それがないと始まりません。

サイト構築

ウェブサービスを構築する方法は沢山ありますが、誰でもお気軽にできるということでWordpressでやります。
余談ですが、プログラマーが本業の人ってWordpressでサイト構築したことない人多い気がする…。偏見？
CakePHPでもRuby on Railsでもまったく問題なくてむしろ本気ならそっちの方がいいとは思うけど、気軽につくるんだったらワードプレスめちゃくちゃ便利です。PHPやRubyのフレームワーク使っても同じものは一日じゃ絶対できない。いろいろあるけど、上手に使いましょ。楽できるところは楽しないと。

つくるのはフリー写真素材のサイトです。
必要な機能はのは、こんな感じ。

写真をアップロードする機能
写真を検索する機能
写真を一覧で表示する機能
写真の詳細情報を確認する機能
写真をダウンロードする機能
関連画像を表示する機能

1. 写真をアップロードする

1.に関してですが、写真素材のサイト/ストックフォトとか呼ばれるサイトになるわけですから、写真の枚数が重要です。
10枚の中からお選びください、じゃ話になりません。
100枚、1000枚、10000枚とか増えていかないと。
ただ、これを1枚1枚アップロードしていくのはちょっと気が遠くなります。
絶対やりたくない。めんどくさい。= 続かない。

ワードプレスには画像をドラッグ&ドロップするだけで、自動的にアップロードしてくれる機能があります。あまり知られていないかもしれませんが、写真をアップロードするという行為は単に画像がアップされるだけでなく、その時に記事もいっしょにつくられます。なので1000ファイルアップすれば1000記事が自動的に作られる。この記事を画像の詳細ページとすることで、面倒な更新作業を一気に楽にしようと思いつきました。

2. 写真を検索する

アップロードしただけでは、ユーザーが検索できません。自分の欲しい写真があるかどうか知るために、サイト内の写真をすべてくまなく見る人はいませんよね。検索するためには写真にキーワードをつけないといけない。でも1つ1つの記事を開いてタグ付けしていくのは絶対やだ。何度もいいますが、めんどくさい…。
で、ググると便利なプラグイン発見。

Media Tagger

WP MediaTagger
記事ではなくて、画像とか動画とか、メディアファイルにタグ付けを可能にしてくれるプラグインです。

3. 写真を一覧で表示する

検索結果のページでは、前述のMediaTaggerがやってくれます。
トップページ（検索前）でもある程度は一覧にさせたいので、それにはワードプレスに標準でついているギャラリーを使いました。

4. 写真の詳細情報を確認する

詳細ページですね。先ほど画像がアップされると記事が1つ作られるといいましたが、その記事専用のテンプレートというものが存在します。ワードプレスでサイト作った人は分かると思いますが、single.phpとかpage.phpとかありますよね。それと同じ要領でimage.phpというファイルを作ってあげると、画像の記事（正確にはpost_typeがattachmentでMIMEタイプが画像形式の記事）が表示される時は自動的にimage.phpがテンプレートとして読み込まれます。
詳しくはテンプレート階層を参照してください。
個人的にこの仕組みは凄い好きです。お手軽で便利。

5. 写真をダウンロードする

単にリンクが貼ってあるとか、大きな画像が表示されて右クリックで保存するみたいな感じだと、なんだかそれっぽくないので、工夫することにしました。単に見た目とか、ユーザーの体験が変わるだけであって、最終的に得られるものに変わりはないんですが、こういうのって超重要です。

ということで、ダウンロードボタンを押すと、「利用規約に同意してダウンロードしてね」みたいなウインドウが出てきて、さらにその中のダウンロードボタンを押すとダウンロード開始みたいにしたく、jQueryで動くいい感じのモーダルウインドウを探しました。

popeasyモーダルプラグイン
Pop Easy | by Thomas Grauer

6. 関連画像

これはワードプレス使っていたらかなり楽勝♪プラグインいっぱいあるから！と思っていたんですが、post_type = attachmentってほとんど記事として認められていないらしく、対応したプラグインを見つけることができませんでした。そりゃそうだよね。クリックしたら画像1枚だけの記事が表示されましたってのは意味ないもんね。
なので、既存のプラグインをpost_type = attachment用にカスタマイズしてます。プラグインのバージョンアップには対応できなくなりますが、仕方ない。無いもの無い。インターネット広しと言えど、どんなに探しまわったって無いものは存在します。いつかだれかが作ってくれるのに期待するのも時間の無駄無駄無駄… 今やりたいんですから。
使ったプラグインはこちら。
WordPress Related Posts
関連付けプラグイン

コンテンツ制作

もちろんコンテンツは写真です。
準備が整ったのでアップロード！
まずはできる限りワードプレスでの作業をなくすために、ファイル名をローカルコンピューター上で変えます。こうするとWordpressはファイル名を添付ファイルのタイトルとして認識、保存してくれます。
wordpress uploading

※この時、WP Multibyte Patchが無いと保存されるファイル名が文字化けするのでリンク切れを起こした。。英語版のWordpressを使ってたからデフォルトで入っていなかったというオチ。

で、
想定していた通り写真をまとめてドラッグ&ドロップするだけ！！
いや〜簡単。らくー。画像ファイルサイズが大きいのでアップロードには時間がかかりますが、基本なにもしなくてもいい。ちなみにアップロードの際に自動的にサムネイル画像も生成してくれます。一覧表示とかはサムネイルじゃないと重くてサイトが使い物にならないです。

運営

ユーザーが検索できるようにするために、タグ付けです。
前述のプラグインMediaTaggerのおかげで、ひとつずつ記事を開かなくても画像にタグ付けできる！らく〜！
Media Tagger

あらかじめ登録しておいたタグをティックしておくだけ。
ティックして次へ、ティックして次へ、ティックして次へ、、とひたすらやっていくだけでタグ付け完了！タイピングも要らないし最高です。

以上で終了。いろいろ整えたり、動作チェックしたりで結構時間とられたけど、なんとか1日で作業完了しました。

よかったら覗いてみてください。
無料ダウンロード大歓迎です！
~~iiimg.net | 商用利用も大丈夫♪ 無料の写真素材サイトです。~~

※ 2014/1/31 サイトを閉鎖しました。
iiimg無料の写真素材サイト