loopshoot.comラボ

loopshoot.com開発の記録

2011年11月23日
by tetsu
0 comments

WebTitleQuizはfluxflexで動いています。(レンタルサーバとの比較)


英語学習サイトとして展開しているWebTitleQuizは、fluxflexを使っています。

fluxflexは、TechCrunchにも紹介されたクラウド・ホスティング・サービスです。
(詳しくは紹介記事を)

perl,phpが使えて、DBもMySQLだし、価格も驚くほど安かったので使ってみることにしました。

fluxflexはGithubとの連携が強みですが、WebTitleQuizのような個人サイトの場合は、Githubに公開プロジェクトを持つようなことはしないので、ローカルのgitで連携しています。

今まで主にレンタルサーバで開発していましたが、
個人サイトを作る上で、レンタルサーバにくらべたfluxflexの利点は

  1. 導入が簡単(ほんとに数分でスタートできる)
  2. 安い (1ドル/月のStanderdプランで十分)
  3. サーバのリソースがわかる
  4. オートスケーリング(料金上がるのが怖いので、使ってないけど)

逆に気を付けたいのが、

  1. Gitの知識が必要(使えてるけどまだよくわからん)
  2. ファイルをダウンロードできない(9ドル/月プランならできるみたい)
  3. 伝送量を気にする必要がある(画像は別サーバだね)
  4. もちろんcronは使えない
  5. fluxflexが落ちたら、サイトも落ちる…

ホスティングにしろレンタルサーバにしろ、軽いサイトを作れなければ苦労だけが残ります。
そういう意味では、制限は多いほどいいのかも知れません。
WebTitleQuizはこれまでに作ったサイトに比べてもシンプルに作れているので、fluxflexを使って正解だったと思います。

よかったらどうぞー WebTitleQuiz


2011年11月20日
by tetsu
0 comments

WebTitleQuiz | はじめてのiPhone対応

遅ればせながら、WebTitleQuiz をiPhone対応しました。

ニュースを題材したサイトなので、モバイルと相性がいいです。
隙間時間を「英語」+「ニュースチェック」に使えるようになりました。

技術的な話も少し。

対応のためにやったことを簡単に。
iPhone対応にはいろいろと方法はありますが、WebTitleQuizの場合は、ページの構成がシンプルなので、
iPhone用のページを用意して、iPhoneからのアクセスをそっちに流すように設定しました。

まず、/m/ にiPhone用のディレクトリを作ったので、.htaccessの設定はこうなります。

RewriteCond %{HTTP_USER_AGENT} iPhone
RewriteRule ^$ /m/ [L]

さらには、iPhone用のページはページの幅をmeteタグで指定して、

<meta name = "viewport" content = "width = device-width">

幅320pxのデザインにしました。

また、ホーム画面に追加された時用の画像を一応用意しました。

<link rel="apple-touch-icon" href="/apple_touch_icon_wtq.png"/>

あと、テストはsafariのユーザーエージェント変更機能を使います。
さらに、google Analyticsはそのままでいいけど、adsenceはモバイル用に変更する必要がありますね。

loopshoot.comはモバイル対応の流れに遅れてしまいました。
これから他のサイトも急ピッチで対応を進めて行きます。

それではiPhoneからもどうぞ → WebTitleQuiz | 注目ニュースのタイトルを日本語に訳す英語学習サイト


2011年11月12日
by tetsu
0 comments

TED RANDOM 「tsuduketerへ記録する」ボタン追加

tsuduketerへの連携

TED RANDOM に新しい機能を追加しました。

TEDの視聴記録をtsutduketerに簡単できるようになりました。

上の画像にあるように、専用のボタンを押すと、tsutduketer向けの書式でツイートできるようになっています。

これを記録していくと、カレンダーになったり、
tsuduketerへの連携

視聴時間がグラフ化されたりします。
tsuduketerへの連携

TEDは強制されたり、モチベーションを作って見るようなものではないですが、
記録することで、どのくらいのペースでTEDを見ているかわかるのはいいですね。

よろしかったらどうぞ → TED RANDOM


2011年10月16日
by tetsu
0 comments

価値あるアイディアとの偶然の出会い – TED RANDOM  リリース!


新しいサイトのリリースをお知らせします。

今、私が意識的に時間を割いていることが、TEDのプレゼンを見ることです。
TEDのプレゼンが、どれも素晴らしいことがわかってくると、見るプレゼンを探すこと自体が面倒になってきました。
そこで考えたのが、この「TED RANDOM」というサイトです。
このサイトは、TEDのプレゼンをランダムに3つ選びます。
現在のところは日本語に翻訳された約700のプレゼンが対象です。
ランダムでいいんです。むしろ、ランダムにして、偶然の出会いを楽しみたいと考えました。

実際に使ってみると、「偶然の出会い」は予想していた以上に素晴らしいものでした。
見るものを検索することは、現代では当たり前のことになっています。
もちろん、検索できることは素晴らしい。
しかし、TEDのようなどれも素晴らしいコンテンツを前にすると、それは情報を制限することにもつながります。
検索は無意識のうちに、自分の興味のある情報しか手に入れられない状況を作り出す行為でもあることを忘れてはいけません。

「TED RANDOM」を使うときには、是非、興味が無いと感じたものこそ優先的に選んでみてほしいと思います。
それが、自分の知識の枠を破って、新しい視点を手にする方法だと思います。
このサイトにはそんな想いを込めました。

それでは、偶然の出会いを楽しんでください。
よかったらどうぞ → TED RANDOM


2011年9月18日
by tetsu
0 comments

注目ニュースのタイトルを日本語に訳す英語学習サイト WebTitleQuiz リリース!


新しいサイトのリリースをお知らせします。
サイト名は「WebTitleQuiz」。
注目ニュースのタイトルを日本語に訳す英語学習サイトです。
誰でも一度は、ニュースを使って英語を勉強しようと思ったことがあるのではないでしょうか。

しかし、この勉強の一番の問題は、日本語訳を確認できないことです。
私も何度も挑戦しましたが、日本語訳がないと、自分の英語力が向上する実感が得にくく、どうしても面白くありません。

そこで、WebTitleQuizを作りました。
WebTitleQuizは、注目ニュースの英文とその日本語訳を同じページに表示します。
つまり、プロの日本語訳を確認できるのです。

データは以下の4サイトから取得しています。

それぞれの日本語サイトのデータと繋げることで、日本語訳を表示できるようにしています。

どう訳すかは、人それぞれですので、表示される日本語訳はあくまでも、ひとつの回答例と位置づけています。

目指したのは、面白くて、気軽な英語学習サイトです。

あなたならどう訳す? ぜひ試してみてください。

それではどうぞ → WebTitleQuiz 注目ニュースのタイトルを日本語に訳す英語学習サイト


2011年6月19日
by tetsu
0 comments

SoccerHacker サッカーハッカー リニューアル!


SoccerHacker をリニューアルしました。
このサイトの前身は、同じ名前の[SoccerHacker][loopshoot Suggest Search]という2つのサイトです。
過去の経緯はいろいろとありますが、
新しいSoccerHackerが何ができるのか、もう一度整理したいと思います。

SoccerHackerは、日本人サッカーファンのための、サッカーコンテンツ検索サイトです。
以下の3つの特徴を持っています。
1.日本語を英語に自動変換するため、英語圏のコンテンツが検索できます。

2.動画、画像に加え、ツイートやフォーメーション、プレーエリア、ニュースなど様々な検索ができます。




3.独自のフォーメーションにより、チームメイトや所属チームも知ることができます。

すこしマニアックに見えるかも知れませんが、
ターゲットユーザーはむしろ、サッカー入門者で、国内サッカーだけでなく海外サッカーへ目を向けるきっかけとなるサイトになれればと思っています。
また、今回のリニューアルでは、ソーシャル機能にも力を入れました。
いろいろ調べる中で、ソーシャルへの時代の方向転換も感じたし、facebookのソーシャルプラグインの威力もわかってきました。
SoccerHackerのファンページはこちらです。
ソーシャル機能はこれからうまく使っていきたいと思います。
それでは、新しくなったSoccerHackerをお試しください → SoccerHacker 海外サッカー動画・画像日本語検索


2011年5月10日
by tetsu
0 comments

世界のレビュー知ろう 「原書検索サイト Gensyo search」 リリース!


新しいサイトをリリースしました。

Gensyo search

Gensyo searchは、原書検索サイトです。
原書とは、翻訳本のオリジナルを指します。
日本人向けサイトですので、翻訳本=和書、原書=洋書となります。
このサイトでは翻訳本の原書を探し出すこと、そして、そのレビューを比較することの2つができます。
まず、探すこと。
日本のamazonでは、翻訳本のタイトルを洋書の中から検索すると、原書が見つかる場合があります。
その機能を使い、クリックのみで、原書を探すことができます。

ただし、これですべての洋書が見つかるわけではありません。
その場合の補助として、本の表紙の画像を表示します。
大抵の場合、原書のタイトルは、表紙に書かれているものです。
次にレビューを比較すること。
左側に翻訳本、右に原書を並べて表示します。
評価の違いが一目瞭然です。

また、表紙の画像、Allreviewsでの評価の違いも比べることができます。
このサイトを作ったきっかけは
純粋に、原書のレビューを見たいと思ったからです。
いい本に出会い、その本について、日本だけでなく、世界の反応を知りたいと思いました。
しかし、どういうわけか、原書にたどり着くのは簡単ではありませんでした。
探し方に工夫が必要で、私のように困っている、または、見つからずに探すのをやめてしまう人がいるのではないかと考えました。
Gensyo searchの原書を探すシステムは完全ではありません。
見つかりにくい原書もあるかもしれません。
適切な原書が見つかった場合には、是非、Twitterなどで広めてください。
きっと他の誰かの世界の知るきっかけとなるはずです。
それではどうぞ → 原書検索サイト Gensyo search


2011年5月7日
by tetsu
0 comments

続けた時間をグラフ化します | 小さな積み重ね管理ツール tsuduketer ver2.5


小さな積み重ね管理ツール tsuduketer に新しいページを追加しました。
追加したのは”時間集計”のページ。
各ユーザーのアクションごとにツイートに含まれた時間を日別にグラフ化するページです。

このグラフは、クリックすると、そのツイートが表示されます。

tsuduketerへのツイートに「○時間○分」と、時間を含めると、このグラフは作成されます。
時間の登録の書式は
「○時間」、「○分」、「○秒」 、または、「00:00:00」 が有効です。
尚、同じツイート内に、複数の時間が含まれる場合は1番はじめにあるものが有効となります。
時間集計するとかなり前から宣言していましたが、ようやくグラフを作りました。
長らくお待たせしました。
是非、時間を可視化して、モチベーションにつなげてください。
それではどうぞ → 例えば loopshootのジョギングの時間集計


2011年5月3日
by tetsu
0 comments

クッリカブルグラフ導入 | Twitterでジョギング記録 jogmemo ver1.1


Twitterでジョギング記録 jogmemoに新しいページを追加しました。
新しいページの名前は「グラフ」。
月別に、走行距離を棒グラフとして確認することができます。

ジョギング管理サイトであれば、あって当たり前のページ。ようやくできました。
棒グラフの画像にはgoogle chart api を使っています。
グラフはクリックすると、ツイートの内容が見れます。

そのために、グラフの画像の上にクッリッカブルなエリアを乗せました。これが1番苦労したところ。
表示は月別のみにしています。
自由に変更できるのもいいのですが、逆に選ぶのが大変ですし。
テーブルのページはいろいろと条件を指定できるのでグラフのページはシンプルにしておきました。
<作ってみた感想>
自分のジョギング記録でグラフが出来ていくのは、やはりおもしろい。
グラフを隙間なく、きれにしたいという想いが、ジョギングへのモチベーションにつながりますね。
それではどうぞ → 例えば、loopshootの2011年04月のジョギンググラフ


2011年5月1日
by tetsu
0 comments

シンプルさを求めて、デザインリニューアル | Twitterでジョギング記録 jogmemo ver1.0


Twitterでジョギング記録 jogmemoのデザインをリニューアルしました。
新しいjogmemoは、3カラムのデザインとなり、
今までもダイレクトに見たいページへ行けるようになりました。
一足先にtsuduketerをリニューアルしていたのですが、
ページビューが予想以上に上がっているので、jogmemoへも展開します。
改めて考えてみると、前の2カラムのデザインはわかりにくかったなと思います。
リニューアルできてよかったです。
それではどうぞ → 新デザイン jogmemo