• LIGの広告成功事例
WEB

デザインの参考にしたい、写真と文字を半分重ねた雑誌風のWebサイト15選

デザインの参考にしたい、写真と文字を半分重ねた雑誌風のWebサイト15選

こんにちは、デザイナーの佐藤タカアキ(@sato_tkaaki)です。
最近読んだ本は、桜庭一樹の「私の男」です。
少しブルーな気持ちになりました、よろしくお願いします。

さて、Webデザインの表現の幅が広がってきた昨今では、徐々に紙媒体、特に雑誌に近いサイトデザインが増えてきたように感じています。

そこで今回は、以前からあったデザイン手法の1つではありますが、写真と文字を半分重ねた雑誌風のデザインのサイトを紹介していきたいと思います。
それでは、いってみましょう!

写真と文字を半分重ねた雑誌風のWebサイト15選

企業サイトから個人のポートフォリオサイトまで、ビジュアルも目的もさまざまです。

1. R+Co

356

マイアミ発祥のヘアースプレーやオイルを生産している企業であるR+Coのサイトです。
動画の上に文字を配置するデザインに目をひかれます。
ローディングごとに文字の色が変わる遊びも良いですね。

2. Arrière-garde

3

カルチャー・アート・デザイン・建築などをテーマとしたWebメディア。
先ほどのR+Coとは打って変わって、白と黒の二色を基調としたサイトデザインです。

3. Kenji Okabe Photography

名称未設定-1

株式会社ニアノアに所属し、撮影やWeb制作などをおこなっている岡部健二さんのポートフォリオサイト。
現代の日常のワンシーンの切り取りなのに、どこか懐かしい気持ちになれるサイトです。

4. RTA Studio

6

世界的な賞をいくつも獲得している、ニュージーランドの建築事務所のサイトです。
さて、この数字には果たしてどのような意味があるのでしょうか。

5. Pop Projects

4

オークランド(ニュージーランド)のクリエイティブプロジェクト。
泡のような丸い図をふんだんに取り入れることでPOPなイメージを表現しつつも、モノクロで引き締まったデザインとなっています。

6. NOORD

5

ドイツで主にエディトリアルデザインを仕事としている会社です。
制作物の1つ1つが綺麗で、思わず見入ってしまいます。

7. DESIGN + DIRECTION

7

ルーマニアで、インタラクティブデザインを中心とした情熱的なグラフィックデザイナーとして活動しているジョージ・バデアさんのポートフォリオサイト。
カラー・メッセージ・写真がすべてシンプルで非常に見やすいサイトです。

8. いいオフィス

2

先日オープンしたばかりのLIGがプロデュースするシェアオフィス&コワーキングスペース
いい空間で、いい仕事。上野で始めてみませんか。

9. MANUEL TOCANNE

1

ロンドンでアートディレクターとして活躍しているMABUEL TOCANNEさんのポートフォリオサイト。
基調となっているブラック感が、写真のホバー時の印象をさらに鮮やかなものにしてくれます。

10. NZ Festival

1

ニュージーランドやオーストラリアで開催されるさまざまなフェスティバルやイベントの情報サイト。
サイトのデザインもいいですが、アーティストのためのフェス、いいですね。海外の大規模な芸術祭に行ってみたいです。

11. P & T

1

ベルリンの紅茶専門店のサイトです。
職人さん手作りのグリーティングカードやティーセットなども綺麗で魅力的です。

12. 灸PLUS

1

北海道のお灸・はり治療室「灸PLUS」さんのサイト。
縦書きの文字がうまく取り入れられており、パンフレットのようなデザインになっています。

13. Choregate,Inc.

名称未設定-1

インパクトのあるメインビジュアルに文字を大胆に重ねたデザインのサイト。
パッと見、海外のデザイン会社のサイトかと思いきや、日本でコンサルティングなどをおこなっている会社のサイトです。

14. 株式会社サル

名称未設定-1

一度見たら忘れられないメインビジュアルのお猿さんのインパクトと、全体のイエローカラーが企業イメージを表現しています。
…などと書いてると、THE YELLOW MONKEYを思い出しました。

15. GODSBANEN

名称未設定-1

デンマークのオルフスで、講演やワークショップ、スタジオなどの文化活動を支援する機関のサイトです。
おしゃれでありながらも、全体的にごちゃごちゃした印象を恐らくあえて感じさせるデザインだけに、どのような制作意図があったのか想像が膨らみます。

まとめ

いかがでしたでしょうか。

写真の上に少しだけ文字を重ねるようなデザイン手法は、クリエイターのしっかりとしたコンセプトがなくては、なかなか伝わりづらいものになってしまうと思います。

表現の幅が広がれば広がるほど、それに伴う表現方法が必要になってくるのがWebデザインの世界です。このピードについていけるよう、私自身日々の勉強を怠らないようにしようと思いました。

それではまた。

この記事を書いた人

佐藤タカアキ
佐藤タカアキ デザイナー 2014年入社
3年目に突入したのですが、デザイナー兼カメラマン的なフワフワした立ち位置で、良くも悪くも毎日多忙な日々を送っているフリをしています。

こちらもおすすめ

現場のプロが教える WEBデザイン 新・スタンダードテクニック37

現場のプロが教える WEBデザイン 新・スタンダードテクニック37

  • 著者秋元 英輔,安藤 真衣子,五十嵐 亮太,稲葉 聡,大串 肇,小見 祐介,日下部 忠之,倉持 友喜,小杉 厚太,後藤 寛一,シオミ ユタカ,菅原 のびすけ,清野 奨,高遠 和也,高橋 としゆき,中村 大騎,羽野 めぐみ,肥田 真紀子,松本 奈央,miccweb,宮崎 優太郎,森崎 嘉友
  • 価格¥ 3,024(2015/12/24 17:03時点)
  • 出版日2015/08/18
  • 商品ランキング77,594位
  • 単行本256ページ
  • ISBN-104844365185
  • ISBN-139784844365181
  • 出版社エムディエヌコーポレーション