厳選・オープン・無料

Erno Works

ロジック、明瞭さ、craft を重視する、多分野のデザインディレクターの洗練されたポートフォリオ。

01

デザイン DNA

ハイエンドなデザイン作品を展示するミニマリスト・ギャラリー

02

カラー

ミニマリストで厳格に機能的。モノクロームに近いパレットに依存し、作品を目立たせる。

03

タイポグラフィ

humanist-sans

• display57px · 400
• h243px · 400
• body21px · 400

すべてのテキストに一貫したヒューマニスト・サンセリフを使用 · 大きなディスプレイ・タイプには tightened letter spacing を使用 · 洗練された見た目のために、light から regular のウェイトを優先

04

余白

落ち着いた、息の続くようなレイアウトを生むための、豊かな余白と垂直リズム

05

サーフェス (角丸 / 影 / 罫線)

セクションの微細な区切りとして使用される、thin な 1px のライン

06

レイアウト

モバイルのシングルカラム・レイアウトから、デスクトップのマルチカラム・ショーケースへと変化する、レスポンシブなグリッド

07

モーションとインタラクション

要素のための微細なフェードインと不透明度のトランジション

インタラクティブ要素の微細な不透明度の変化 · 標準的なリンク動作

08

コンポーネント

• button ボーダーや背景のない、最小限のテキスト・リンク
• card 画像と、クリーンなテキスト・オーバーレイ、または隣接テキストからなるプロジェクト・カード
• hero 豊かなネガティブ・スペースを持つ、大きく支配的なタイポグラフィ・ステートメント

09

文体と禁止事項

• トーン 專業的、自信に満ち、控えめ
• 見出し デザイン哲学についての、率直な一人称のステートメント
• CTA シンプルな、飾り気のないテキスト・リンク

• bold なフォント・ウェイトを使用しない — スクリーンショットでは light から regular のウェイトのみが使用されている
• プロジェクト画像にドロップ・シャドウを適用しない — スクリーンショットでは完全にフラットな画像が使用されている
• カードやコンテナに丸みを帯びた角を使用しない — スクリーンショットでは鋭く、長方形のエッジが使用されている
• 彩度の高いアクセント色を導入しない — スクリーンショットでは厳格にモノクロームで、控えめなパレットが使用されている
• レイアウトを密集したテキストで雑然としない — スクリーンショットでは豊かな余白と息の続く空間が確保されている
• 装飾的な背景パターンを使用しない — スクリーンショットでは、無地の、平面的な背景色が使用されている
• 避ける: 過度に複雑または装飾的な要素
• 避ける: 明るく彩度の高い色
• 避ける: 密集したテキストの塊
• 避ける: コンテナの丸みを帯びた角
• 避ける: UI要素のドロップ・シャドウ
• 避ける: bold で太いフォント・ウェイト

10

パック内の実スクリーンショット

実ページから取得 · 実 computed styles

11

System Prompt

en · zh-CN · zh-TW · ja · ko