galleryやworksのページがあるサイトを集めてみました。
自分の備忘録のようなものです。
きれいな写真を魅力的に見せるシンプルなギャラリー構成
全体がモノトーンの配色で、石の冷たい温度が伝わってくるような落ち着いた写真の色合いが素敵です。
このサイトのギャラリーページ、とにかく写真がきれいなので、余計なものは入れずに、しかし配置は工夫されてます。
写真のサイズにも変化があり、綺麗かつ見やすい構成になっていると感じました。
visit site:https://stonestyle.co.th/gallery/
グリッドデザインで整えられた見やすいwork（制作実績）ページ
綺麗に整ったグリッドデザインです。
見やすさ重視の大変シンプルなデザインでした。こういう見せ方もいいなって思います。
カテゴリー分けされていて使いやすい構成です。
詳細のページのデザインがそれぞれで全部違っていたのがすごいですね。
visit site:https://springsummer.dk/work
ギャラリーでは無いですが…、写真の使い方が上手いと思ったサイト
ギャラリーページとかではないですが、写真の上に別の写真を配置するっていう使い方がなるほどなと思わせてくれるサイト。
こういう使い方があるんですね、勉強になります。
visit site:https://www.asnova.co.jp/
お芋の品種（項目）の見せ方がいいなと思ったサイト
トップページの、お芋の品種の紹介のセクションの見せ方がいいなと思いました。
中央で紹介しているお芋にきちんとフォーカスを当て、中央のお芋以外の部分の写真を暗くして、あえてきちんと見せないことで、他のお芋はどんななんだろうと思わせてくれるようになっているのかなと感じました。
丸い枠と、お芋の構図がとてもマッチしています。
visit site:https://japapo.co.jp/
縦構図や横構図、サイズの違う写真が混在する見せ方
横構図や縦構図、サイズの違う写真がきれいに２列に並べられています。
撮影写真の実績を眺めることに徹することができると感じたサイトです。
なんとこのサイト、ページを更新するたびに表示される写真がランダムに入れ替わるみたいなんです。面白いですね。
visit site:https://noir-e.com/photo
見せたい。っていうのが伝わる写真構成。
上記のサイトは、実績を眺められるという印象のサイトでしたが、こちらは車をしっかり魅力的に見せたい！っていう考えがあるのかなと個人的には感じられた写真構成になっていました。
１枚１枚、しっかり見ることが出来るような配置と、写真のサイズ感です。
やはり、どう見せたいかっていう思いによって、レイアウトやサイズ感、いろいろなデザインが考えられますね。
visit site:https://www.mercedes-benz.jp/special/cla/coupe/
実績のカテゴリーの見せ方
実績ページの実績一覧の紹介の仕方がいいなと感じました。
一つの実績に１画面を使う見せ方で、今見ているものからスクロールしていくと、今見ているものが暗くだんだん小さくなっていき、退場していく様を表現していて、逆に次に紹介するものがだんだん大きくなって明るくなり、登場の様を表現するアニメーションがいいです。
ただ切り替えるのではなく、そういった登場と退場を感じられる演出がいいなと思います。
visit site:https://www.reformcollective.com/work/
アニメーションで写真を見せる
ここの実績のページは、まずテキストだけで一覧が並んでおり（カテゴリー）、それぞれのテキストにマウスを置くことで該当の写真が文字の後ろに出現するアニメーション。
visit site:https://spatzek.studio/work
全画面ギャラリー
このサイト、めちゃめちゃ動きます。
ギャラリーページも参考にしたいところですが、サイト全体で、要所要所でインスピレーションがもらえるかもしれません。
visit site:https://k24moscow.ru/en/gallery/
左右に交互配置の丁寧なギャラリー
全体の雰囲気は、テキストで見せる感じのデザインになっています。
特定のページだけ背景の色変えたりとかそういえばできるなと今更ながらに実感。
visit site:http://hungry2018.jp/works/
アニメーションで魅せる
構成自体はとてもシンプル。
アニメーションがいい感じ。スクロールするとふわんふわんです。
visit site:https://www.akaru.fr/works
【第２弾】に続く！
