厳選・オープン・無料
Taiki Murayama
大きなタイポグラフィ、高コントラストの画像、最小限のUI装飾を重視し、作品を紹介する、大胆で編集的なデザインポートフォリオ。
PortfolioStudioCleanTypographyEditorial
01
デザイン DNA
デザインポートフォリオミニマル編集的ハイエンド
大胆なタイポグラフィと抑制されたエレガンスで提示される、デザイナーワークのキュレーションされたギャラリー。
02
カラー
#42ff00Accent
#0b0b0fInk
#bbbbbbInk soft
#f7f7f7BG
rgba(11,11,15,1)Line
単一の鮮やかなアクセントを持つ高コントラストのモノクロームパレット。明るいニュートラル背景を用い、作品画像を際立たせます。
03
タイポグラフィ
geometric-sans · humanist-sans · monospace
- display
110px · 400 - heading
54px · 400 - subhead
34px · 400 - body
28px · 400 - caption
16px · 400
04
余白
4px
8px
16px
24px
32px
48px
64px
96px
ゆったりとした編集リズム。十分なpaddingと間隔を設け、開放的で息のできるレイアウトを生み出します。
05
サーフェス (角丸 / 影 / 罫線)
sm · 4px
md · 15px
lg · 300px
pill · 999px
コンテンツセクション間の主要な区切りとして、ほぼ黒の細い実線が使用されます。
06
レイアウト
1440container
12columns
24pxgutter
768 / 1024breakpoints
重なり合う画像と大きなテキストブロックを持つ、従来のカラム構造を崩す非対称な編集グリッド。
07
モーションとインタラクション
140msmicro
200mssmall
600msmedium
cubic-bezier(0.4, 0, 0.2, 1)easing
インタラクティブ要素の滑らかなスケールと不透明度のトランジション · 画像クラスターのparallaxライクな動き
要素はhover時にわずかにスケールアップします。 · すべてのインタラクティブ要素で標準のポインターカーソルを使用。
08
コンポーネント
- button 最小限のテキストベースナビゲーション。アクティブな項目が鮮やかなグリーンの背景ブロックで強調表示されます。
- card 画像は厳格なコンテナなしで、ゆったりと重なり合うクラスターとして提示され、背景の上に浮遊します。
- chip 未使用。
- input 未使用。
- hero 大きな重なり合う写真と、大胆でオーバーサイズのタイポグラフィを特徴とする、ダイナミックなコラージュスタイルの構図。
09
文体と禁止事項
- トーン 自信に満ち、プロフェッショナルで、芸術的にも大胆。
- 見出し 超大型で字詰めの詰まったジオメトリックsans-serifの名前とタイトル。
- CTA 最小限。伝統的なボタン形状ではなく、テキストと単一のアスタリスクアイコンに依存。
- ドロップシャドウを使用しない — スクリーンショットではクリーンなエッジを持つフラットな画像が示されています。
- 画像にカードコンテナを使用しない — スクリーンショットでは画像が自由に浮遊し、重なっています。
- 強調のために複数のフォントウェイトを使用しない — スクリーンショットではほぼウェイト400のみが使用され、階層付けにはサイズが頼りにされています。
- 見出しを中央揃えにしない — スクリーンショットでは左揃えまたは非対称に配置されたテキストが示されています。
- 複数のアクセントカラーを使用しない — スクリーンショットでは1色の鮮やかなグリーンのハイライトのみが使用されています。
- 密な段落テキストを使用しない — スクリーンショットでは短くインパクトのある文とリストが使用されています。
- 避ける: 装飾的な筆致やスクリプトフォントは避ける
- 避ける: 複数のアクセントカラーは避ける
- 避ける: 密なテキストブロックや雑然としたレイアウトは避ける
- 避ける: カードやモーダルなどの標準的なUIコンポーネントパターンは避ける
- 避ける: 雑然とした背景やgradientは避ける
- 避ける: ドロップシャドウによる奥行き表現は避ける
10
パック内の実スクリーンショット
桌面首屏(hero)
桌面滚动分段(90% viewport 步进,作为视觉证据)
桌面滚动分段(90% viewport 步进,作为视觉证据)
桌面滚动分段(90% viewport 步进,作为视觉证据)
移动首屏実ページから取得 · 実 computed styles
11
System Prompt
これは、クリエイティブディレクターのためのハイエンドデザインポートフォリオです。大胆で編集的な自信を持ってポジショニングされています。デザインDNAは厳格で高コントラストのモノクロームパレットに構築されています:非常に明るいグレーの背景(#f7f7f7)、ほぼ黒のインク(#0b0b0f)、そして控えめに使用される単一の鮮やかなグリーンアクセント(#42ff00)。タイポグラフィは、非常に大きなスケール(最大110px)と字詰めの詰まったジオメトリックsans-serif表示フォント(Helvetica Neue)が支配的で、本文テキストにはhumanist sansが使用されます。レイアウトは、十分な余白を持つ非対称でグリッドを崩す構図です。重要な注意点:ドロップシャドウは決して使用せず、画像をカードコンテナに入れず、複数のアクセントカラーを使用しないこと。サイトはゆったりとした編集リズムと、インタラクション用の滑らかなトランジション(cubic-bezier(0.4, 0, 0.2, 1))を使用しています。
en · zh-CN · zh-TW · ja · ko