  |
はてなキーワード: レスポンシブデザインとは
エロが好きです。
ボクはDMM.R18のヘビーユーザーなのですが、どうしても自分の好みの中だけで、グルグル回ってしまい、
世の中にAVは山ほどあるはずなのに、知らないなんてもったいない！もっとたくさんのエロに出会いたいという思いがあって日々悶々としていました。。
そんな中、AVというのは毎日の気分によってオナニーしたい見たいものが違うわけだから（例えば毎日食べたいおかずが違うように）、
今の自分の気分を簡単に答えれば、それに対してオススメのAV動画を紹介してくれるというサービスはどうだろう？とモヤモヤと考えていました。
ある日、会社の人に相談したら、それ「いいね！」ということになって、「そういえばDMMのAPIってのが公開されたから、それ使ってできるんじゃね？」ってことになり、
本格的にサービス開発を行うことになりました。
そしてこの度無事リリースすることができました。
「今夜のおかず」
３つの質問に YES / NO で答えるだけで、今のあなたに最適なアダルト動画を紹介するサービスです。
・フレームワーク：express（node.jsのフレームワーク）
・クライアント：jQuery、CoffeeScript、SCSS
・ビルドツール：grunt
node.jsは少し趣味でやった程度で、今回やってセッション管理やルーティング周りが勉強になりました。
データベースにはMySQLを使っています。node.jsならばmongoDBというイメージが強いですが、質問をランダムに表示する機能で、
mongoDBは現時点で正式な機能としてはランダム検索が出来なかったので、MySQLを選びました。
あと、CoffeeScriptやSCSSはJavaScriptやCSSの記法を簡単にしてくれるやつで、慣れてしまうと離れられません。
あとはTwitter Bootstrap。これなしでは生きていられません。
スマホでもなるべく早く結果ページまでたどり着けるようにしたつもりです。
オススメの動画が表示された後に、今日はこの動画の気分じゃない！と思ったときはチェンジボタンにより、同じ条件で他の動画にチェンジ！できます。
質問からやり直したいときは、さいしょから！ボタンで他の質問からやり直せます。
一刻一秒を争うエロビ探しですのでパフォーマンスには気を配りました。
最初はサーバーサイドでHTMLテンプレートを使わずに完全にREST API化して進めていましたが、
最初の表示までの若干のライムラグとSEO対策の為、最初の質問だけnode.jsでHTMLテンプレートを使用して組み立てています。
また、シンプルなサイトなのでライブラリはjQueryのみ使用し、concat/minify化はgruntのタスクとして登録しています。gzip化はNginxで行なっています。
我らがDMM様への敬意を払い、白ベース＋ポイントで赤のシンプルなデザインにしています。
・CSS（SCSS）が初めてだったので、微調整するのが大変でした。
・質問のパターンを考えるのと、紹介する動画が偏りすぎないようにするのが難しかったです。（これはまだ要調整）
・質問に対するおすすめ動画の精度をもっとあげていく。 （ユーザーの癖を把握して、機械学習とかできればいいかなと）
・おすすめ動画を表示した後に、その商品を誰かにつぶやいたり。
今回、同じ会社に勤めるエンジニア3人が約2ヶ月で作成しました。
実験的なサービスでもありますので、今後も色々と機能追加をしていくつもりです。
・URLが分散してしまう（レスポンシブデザインでない場合）
といった問題があり、
多少の見やすさと引換えに、使いやすさを大きく低下させていることが多い。
今回の新はてブのように、リンクやボタンを大きめにして、カラム分けをきっちりするだけで、
タブレットやスマホでも快適にウェブサイトを閲覧できるようになる。
もちろん、今後、タッチデバイス向けウェブデザインに一大革新が起こる可能性はある。
何がなんでもダメだというわけじゃない、とは断っておこう。
iPadなんか使ったことないような連中なんじゃないの。
リンクを大きくするのがタッチパネル時代のウェブデザインの基本であることが分かっていない。
「そんなにusers数を強調したいのか」とか言ってる。見当違いも甚だしい。
あれはダブルタップによるフォーカスのためのデザインであって、
その次はおそらく「タブレット向けとPC向けのデザインを共通にするな」などと言ってくるんだろうが、
デバイスによってデザインが異なるほうがバッドノウハウであることは自明だろ。
むしろ b.hatena.ne.jp/touch を速やかに無くしていただきたい。
あとレスポンシブデザイン（）も滅びろ。
追記。
デザインというよりコンセプトの問題だよな。
しかも良し悪しじゃなく好き嫌いの。
hotentryやentrylistはそこまで情報量減ってないから、
＞視線移動
言うほど面倒か？
