小笠原諸島about音楽ライブレポWEBつれづれ旅行記skydropWEBメモ【WEBメモ】固定背景でフレームや透過フィルム的な演出をし、スクロールすることで演出が展開するサイト【WEBメモ】固定背景でフレームや透過フィルム的な演出をし、スクロールすることで演出が展開するサイト2016年3月13日riviTweet手段を目的に変えてしまう。構成次第でそれを可能にしているサイトっていいですね。コンテンツを見るためにスクロールしているはずが、その演出次第でスクロールする事=楽し!に繋がる。スクロールが楽しいサイトって面白いPCにしろスマホにしろ、横スクロールよりも縦スクロールの方が操作性が高く、実装されていることの多い今日この頃。サイトを閲覧していたら、スクロールすることで演出が展開していくタイプのサイトに出会ったので備忘録的にまとめました。縦長すぎるサイトは、ユーザーの離脱に繋がりがちですが、この演出のつけ方は関心を持たれた時点で最下層まで見てみたい気持ちを引き出してくれる類だなぁと感じました。参考サイト・フレームが固定。スクロールすると、その画面内で展開しているように演出http://dept.drxlr.com/ちょっと何言ってるのかわからないですね?みたいな見出しを付けていますが、とりあえず一回アクセスして画面を見てもらった方がわかりやすいです。スクロールバーが非表示になっている+背景画像が固定となっているため、ベースとなる画面内では上下に動くものがなく、フレームが固定になっているような印象を受けます。その中で下にスクロールしていくと、コンテンツ(ピンクの●とか、グリーンの■に文字とか)が徐々に表示。画面の中腹部から、ぬぬっと表示されていく動き、どういう作りなんだろうなー。一度表示されたコンテンツは特定の位置でさらに固定表示。この表示のされ方が、個人的にフォトショのレイヤーを背景画像に重なるような印象で面白いなーって。デザイン重視、ユーザービリティ度返しだとは思っているので、完全に飛び道具かな。・背景画像はアーティストの写真。森山直太朗オフィシャルサイトスクロールすると、情報が掲載されている枠と背景透過でピエロの顔や落書きされた目などが交代で並んでいる。寝ているアーティストの顔にそれらが乗っかるようなユニークさ。下までスクロールすると、起きた写真が出てくる。こちらは、アーティストというキラーコンテンツがメインのサイトなので、アプローチ方法としては飛び道具どころか、他のアーティストでもやってくれたら面白いのに...とか正直思いました。いろんな一面が見たい!という心理は普通にありますもの。まとめ他にもみつけたら追加したいのですが、意外とないものですね。どちらかというと、デザイン重視的な要素が強く、サイトの目的に一致することが多くないんだろうなぁとは思いました。個人的にはとても好き。コメントをキャンセルメールアドレスは公開されることはありません。コメント氏名[必須]メールアドレス[必須]次回のコメントで使用するためブラウザーに自分の名前、メールアドレス、サイトを保存する。検索:管理人riviLIVE、音楽が心の支え。写真やラジオを聞くのも趣味。WEBをお仕事にしていますが、ここでは面白そうなことを試したり残したいものを書いてます。へっぽこWEBディレクターですが技術も知識もへっぽこです。