
Bpco
コンクリート板で作られたタイポグラフィのマニフェスト。特大のヘルベチカフォントが写真のように見せかけ、メインの書体の下にあるしわくちゃの紙一枚だけが唯一の質感となっている、白黒のプレスキット。
Bigpictureはモノクロ編集システムを採用しており、ウェブページを未加工の紙にレイアウトされた印刷物のように扱います。インターフェースには色は一切なく、黒インク、余白、細い線、そしてしわくちゃの紙のような均一な質感のみで雰囲気を作り出しています。タイポグラフィは作品そのものです。見出しはHelvetica Neue 700で274pxまで伸び、文字間隔をかなり広くとることで、テキストがあらゆる画面で圧倒的な視覚的ボリュームとなっています。等幅のキャプション([01-N INTRODUCTION]、CREATIVE/AGENCY)は印刷物の署名のような役割を果たし、4つの角を持つ光沢のあるアイコンがセクション間の唯一の装飾となっています。レイアウトはゆったりとしており、自主出版を彷彿とさせます。セクション間の間隔は72px、水平方向の余白は144~250px、角が288pxの全幅画像ブロックにより、ページはソフトウェアではなくギャラリーの壁のようにゆったりとしています。
最大幅は約1440ピクセルで、セクション密度に応じて水平方向のパディングが40~144ピクセルで中央揃えになっています。ヒーロー画像は、テキストが重ねられた全幅画像です。画像の下には、中央揃えのテキストブロックと端まで広がるタイポグラフィが交互に表示されます。ページの下部60%は、スクロール式の長いマニフェストで、大きな文字がビューポートの幅全体に一行ずつ表示され、光沢のある区切り線で区切られています。ナビゲーションは、全幅パネルではなく、ビューポート上部中央に配置されたフローティングバーです。フッターは、細い枠線が付いた1本の帯です。
メイン画面は写真で埋め尽くされ、丸みを帯びた角を持つ大きな建築物や屋外広告(看板、建物の外壁、路面広告など)の画像がフルサイズで表示される。ページの下部には、しわくちゃになった紙の質感が重ねられ、触覚的な感触を生み出し、印刷された雑誌のようなインターフェースを演出している。線で描かれた小さな地球儀のアイコンが、唯一のイラスト要素だ。3D効果も、抽象的なグラデーションも、製品のモックアップも一切なく、画像はドキュメンタリー風で工業的な性質を持ち、広告代理店の屋外広告ポートフォリオに基づいている。
パレット
中性
- Press Ink
#121212— 本文、細線、セクションの境界線、アイコンの輪郭、フッターのテキストはすべて、単一の暗い色調を使用しており、前景情報の95%をその色調で表現しています。 - Paper White
#ffffff— ページキャンバス、段ボール表面、ナビゲーションバーの背景、タイトルフレームのある表面。 - Newsprint
#f1f1f1— 繊細な表面の塗りつぶし、柔らかな境界線、細い仕切り、しわくちゃの紙の質感の裏に隠された色調。 - Foil Gray
#e1e1e1— ライトフレーム、アイコンの輪郭線などのアクセント、追加の仕切り。 - Mute Gray
#c5c5c5— 二次テキスト、障害ステータス、低コントラストの表面線
タイポグラフィ
13ピクセルから274ピクセルまで · 6段階
- Helvetica Neue — 交換: Inter · 概要 400, 500, 700 · 汎用ツール - 本文テキストは17px/1.29、見出しは最大サイズで75~274px、文字間隔は-0.04em、ナビゲーションラベルは15px
- PPSupplyMono — 交換: JetBrains Mono · 概要 400 · メタタグや括弧付きラベル(例:[01-N INTRODUCTION])、セクションタグ(ADVERTISING、CREATIVE/AGENCY、OFFLINE MARKETING)は、Helveticaの単調さを打ち破る唯一のタイポグラフィ上のアクセントです。
- PPSupplySans — 交換: Inter · 概要 400 · 異なるサンセリフ体フォントが必要な、フッター内の二次ナビゲーションおよびマイクロコピー。
音程と形式
| 目的 | 意味 |
|---|---|
| 密度 | 平均 |
| 基本的なステップ | 50px |
| ボタンの半径 | 8px |
| カード半径 | 20px |
| 影 | いいえ - 影の代わりに境界線 |
| セクション間 | 72px |
| ページ幅 | 1440px |
AI がBpcoスタイルであなたのウェブサイトを構築し、
- リンクから商品や投稿を追加してください - Instagram 、 TikTok 、 Facebook 。
- 古いサイトからコンテンツを移行するには、アドレスを指定するだけです。
- 最高のエンジンであるReact ( Next.js )上で動作するモダンなデザイン。サーバーレンダリングとSEO最適化が標準搭載されています。
- 検索結果のSEO最適化とニューラルネットワークによるレコメンデーションを完全に自動化。
類似のスタイル
- Steep — 温かみのある紙におけるセリフ体フォントの分析
- Newformcap — 更衣室にある社説新聞
- Claude — 温かい羊皮紙に印刷された工芸品――骨紙にインク、粘土だけが唯一の色彩の息吹
- 11x– Digital workers — 映画のような編集上の荒廃地――風景のパノラマ写真が、高級雑誌の見開きページのような巨大なセリフ体の見出しを背景に配置されている。
- Revolut — 雲の写真をもとにしたモノクロの編集作品。白いインク、ピルボックスボタン、そしてモノクロの世界の中にぽつんと浮かぶ一本の青い線。
- Scheduling — クリーム色の紙に編集用インクで印刷
- Titan — 温かみのあるモノクロームアーカイブ
- Programa — 正午のスイスのデザインスタジオ。白いギャラリーの壁は、たった一つの黄色いテーブルランプによって照らされている。すべてがグレーの濃淡で統一されているが、ボタンやアイコン、あるいはアクセントとなるものが目に留まると、そのたった一つの黄色いアクセントが部屋全体を決定づける。
- Sana Agents — 白い背景にライムの輝きを放つ、編集記事
- Visual — 温かみのある編集版サミズダート。クリーム色の紙、セリフ体のポスター、モノクロの余白、黄色のマーカー1本。
- Midday — 羊皮紙に印刷された編集用パンフレット - 温かみのある石色の背景に72pxのセリフ体見出し、間隔を空けたサンセリフ体本文、ピル型のコントロール、影なし
- Chat for impact — 森のような緑色のクリニックに、パステルカラーの部屋が並んでいる。