鏡の中のミニマムコンテンツ
制作概要 美容室のWebサイト制作。 なんと必須のお題目が「髪の毛1本も見せてはいけない」というもの。スタイリングの写真もなく写真素材も無しでつく …
制作概要
美容室のWebサイト制作。
なんと必須のお題目が「髪の毛1本も見せてはいけない」というもの。スタイリングの写真もなく写真素材も無しでつくるというものでした。当時は「なんでこんなお題を・・」と感じていましたが、お店に来てくれた方がすべてのターゲット。最近でいうと「リアルからネットに来てもらって、プル(心を確実に掴む)する」というものだったんですね。
ミニマムでも見た人に驚きを
jqueryも登場まもなく、スマホもない時代です。画面の解像度サイズも多様化してきた時代です。「ミニマム」に作ることでそんな不安要素はすべて無くなります。ですが、小さく作るだけではひとつも面白くないのでPjaxがまったく定着していませんでしたが、コンテンツ部分に導入。
コンテンツ部分は美容室の「鏡」と「照明」をライントレースしているのですが、Pjaxで読み込まれるのは「鏡の中」にしました。こんな多角形な形の中にコンテンツが読み込まれるのですが、HTML5ではないのでCANVASでマスクをすることは出来ません。
ものすごく単純なのですが、白い鏡(真四角)の透過ピングの下にDIVを配置してそこにPjaxでコンテンツを読み込んでいるだけです。そのせいでリンク設定などはコンテンツエリアには設定できないという難点があったのですが、別にリンクさせるものはなかったので良しとしました(汗)。
2011 / Web