厳選・オープン・無料
Wieden+Kennedy
immersiveな写真と大規模なタイポグラフィを通じ、高インパクトのクリエイティブ・ワークを紹介する、大胆で映画的なエージェンシー・ポートフォリオ。
agencyadvertising
01
デザイン DNA
クリエイティブ大胆グローバルアーティスティック広告
映画祭のプログラム
02
カラー
#FFFFFFInk
#ADB5BDInk soft
#000000BG
#6C757DMuted
rgba(108,117,125,0.3)Line
ハイコントラストの映画的パレット。深い黒と豊かな写真の背景に、ストリックな白のテキストを配置
03
タイポグラフィ
grotesque-sans
- display
68px · 300 - h2
32px · 300 - body
16px · 300
フォントウェイトは主に300（ライト）。洗練され、軽やかな印象を演出 · インパクトのため、68pxの大型ディスプレイサイズを使用 · ディスプレイ見出しにはタイトなレタースペーシング
04
余白
4px
8px
16px
24px
32px
48px
64px
96px
75px、96pxの大きなパディングブロックを用いた非対称レイアウト。映画的な開放感を生み出す
05
サーフェス (角丸 / 影 / 罫線)
sm · 0px
md · 0px
lg · 0px
pill · 999px
1pxの細いボーダーを控えめに使用。主に構造的な分離のため
rgba(0, 0, 0, 0.25) 0px 0px 5px 0px
06
レイアウト
1920container
12columns
24pxgutter
768 / 1024breakpoints
テキストをオーバーレイしたフルブリードの写真ヒーロー。その後、ワークのショーケース用の構造化されたグリッド・レイアウトへと遷移
07
モーションとインタラクション
250msmicro
500mssmall
750msmedium
cubic-bezier(0.25, 0.1, 0.25, 1)easing
コンテンツのトランジションには、opacityフェード（0.75秒） · スクロールに応じた演出には、トランスフォーム・ムーブメント（0.5秒） · インタラクティブな状態には、カラートランジション（0.25秒）
インタラクティブ要素でカーソルがポインタに変化。微細な色やopacityの変化 · 標準のポインターインタラクション
08
コンポーネント
- button テキストベースのミニマルなボタン。時折、大文字
- card 可視ボーダーなしの大写真カード。イメージのエッジに依存
- chip 未確認
- input 未確認
- hero ビューポート全体を覆う映画的なイメージ。左下に大きなライトウェイトのタイポグラフィをオーバーレイ
09
文体と禁止事項
- トーン 自信に満ち、控えめで、アーティスティック
- 見出し 大きなライトウェイト（300）、小文字またはタイトルケース。句読点は最小限
- CTA クリーンな大文字テキストリンク
- 重いフォントウェイトを使用しない — スクリーンショットではライトウェイト（300）が支配的
- 明るく鮮やかなアクセントカラーを適用しない — スクリーンショットではモノクローム/写真のパレットが使用されている
- カードやコンテナに角丸を使用しない — スクリーンショットではシャープで四角いエッジが使用されている
- 要素をタイトなスペーシングで詰め込まない — スクリーンショットでは大きなパディングとホワイトスペース（75px-96px）が使用されている
- 装飾的またはセリフの書体を使用しない — スクリーンショットではクリーンなグロテスク・サンズが使用されている
- 複雑な背景テクスチャに依存しない — スクリーンショットでは純色の黒または写真の塗りつぶしが使用されている
- 避ける: 雑然としたレイアウトや複雑な背景パターンを避ける
- 避ける: 重い太字ウェイトを使用しない（300-500の範囲に留める）
- 避ける: 明るいネオン色や鮮やかなアクセントカラーを避ける
- 避ける: 複雑なナビゲーションメニューを避ける。ミニマルに保つ
- 避ける: 装飾的なセリフフォントを避ける
- 避ける: プライマリUI要素に角丸を使用しない
10
パック内の実スクリーンショット
桌面首屏（hero）
桌面滚动分段（90% viewport 步进，作为视觉证据）
桌面滚动分段（90% viewport 步进，作为视觉证据）
桌面滚动分段（90% viewport 步进，作为视觉证据）
桌面滚动分段（90% viewport 步进，作为视觉证据）
桌面滚动分段（90% viewport 步进，作为视觉证据）
桌面滚动分段（90% viewport 步进，作为视觉证据）
桌面滚动分段（90% viewport 步进，作为视觉证据）
桌面滚动分段（90% viewport 步进，作为视觉证据）
桌面滚动分段（90% viewport 步进，作为视觉证据）
移动首屏実ページから取得 · 実 computed styles
11
System Prompt
これはWieden+Kennedyのエージェンシーウェブサイトであり、エージェンシーをプレミアムで映画的なクリエイティブの巨匠として位置づけるポートフォリオ主導のサイトです。デザインは、UIテキストのための深い黒（#000000）とストリックな白（#FFFFFF）のモノクローム・ベースに依存し、大規模な写真イメージがすべての色彩と感情を提供します。タイポグラフィはクリーンなグロテスク・サンズ（Univers LT Std）のみを使用し、ほぼすべてが300のライトウェイトで設定。インパクト最大化のためにディスプレイサイズは68pxに達します。レイアウトはフルブリードでimmersive最大96pxの広々としたパディングが洗練され息の通ったリズムを生み出しています。重要な禁止事項：ウェイト500以上の太字フォントは絶対に使用せず、写真と競合する明るいアクセントカラーは追加せず、構造部品に角丸は使用しないこと。
en · zh-CN · zh-TW · ja · ko