TODAY’S DESIGN · 2026-11-01 · portfolio

余白に残る、輪郭。— Ren MoriLess, but felt. — Ren Mori

言葉の輪郭と深い緑だけで印象をつくる、独立系デザイナーの静かなポートフォリオです。

A quiet designer portfolio with a single typographic focal point and a deep-green palette.

minimal-monochrome · two-column · portfolio / negative-space / typography / monochrome / green / serif / art-direction / minimal

構成と活用のポイントComposition and adaptation

冒頭は淡いミント色の大きな余白に、二行のセリフ体コピーをひとつ配置。
左上の名前と右上のナビゲーションを端に寄せ、視線を中央の言葉へ導きます。
その下は細い罫線と小さな番号を手がかりに、二列構成の作品紹介、プロフィールへ進みます。
作品の図版も写真ではなく文字で構成し、濃緑の面と明るい面で強弱をつけています。

ブランド設計やアートディレクションを依頼したい相手へ、少数の仕事と姿勢を伝える用途に適しています。
幅が狭くなると作品とプロフィールの二列を一列にし、冒頭の高さ、余白、文字サイズを縮小。
作品の説明は静的なサンプルで、上部のリンクはページ内を移動します。

参照プロンプトを調整するなら、架空の氏名、専門領域、二つの作品名と説明を自身の内容に置き換えてください。
見出しは短い二行に収まる言葉を指定し、作品数を増やす場合もカードではなく同じ罫線付きの行を繰り返すと、この密度を保ちやすくなります。

A two-line serif statement floats in mint-colored space, with the name and navigation held at opposite edges.
Fine rules lead into two-column project rows; oversized letterforms replace photography.
The profile closes with the same measured spacing.

Suited to independent branding practices, this static example presents two concepts and a short introduction.
On narrow screens, project and profile columns stack, while the opening height, gaps and type shrink.
Navigation links jump to sections.

Adapt the reference prompt with your name, discipline and two project stories.
Keep the opening phrase short enough for two lines.
Add work as ruled rows rather than cards, and specify whether your own projects need photographic assets.

デザインの条件Design conditions

対象 / Audience: prospective-clients
目的 / Purpose: profile-introduction
トーン / Tone: confident
主な色 / Primary color: #166534
補助色 / Secondary color: #F0FDF4
構成 / Sections: hero / projects / about

参考プロンプトの対象・目的・色・構成を、ご自身の内容に合わせて変更してください。このpreviewは静的な参考作品です。

Adapt the audience, purpose, colors and sections in the reference prompt to your own content. This preview is a static example.

MAKE IT YOUR OWN

参考プロンプトReference prompt

似たWebデザインを作るための参考プロンプト

A reference prompt for creating a similar web design.

独立系ブランドデザイナー「Ren Mori」の静的ポートフォリオを制作してください。深緑 #166534 と淡いミント #F0FDF4 を使い、静かな夜の余韻を、広い余白と明確な明暗差で表現します。写真は使わず、文字を主役にします。

ファーストビューは大きな余白の中に「Less,」「but felt.」という二行のセリフ体コピーを置き、二行目を少し右へずらしてください。名前は左上、小さな Work / About のページ内リンクは右上。下端に専門領域とページ内リンクを控えめに置きます。コピーの隣に画像や説明列を足さず、ひとつの焦点を保ってください。

続く Selected work は、左に番号・作品名・領域・短い説明、右に文字だけの図版を置く二列の行で構成します。架空の作品は、文化施設のアイデンティティ「Still House」と、編集プロジェクト「FIELDNOTES」。前者は濃緑の地に大きなセリフ文字、後者は淡い地に罫線と大きな斜体文字を使います。角丸カードや影は使わず、細い罫線と余白で区切ります。各作品は静的な紹介で、詳細ページや操作機能は設けません。

About は左に小さなセクション名、右に短いプロフィールと専門領域を配置します。本文は固定のシステムサンセリフ、主な言葉は Georgia 系のセリフ体。モバイルでは作品・プロフィールを一列へ変更し、冒頭の高さと余白を縮めつつ低密度を維持します。氏名や作品はサンプルとして扱い、実在の実績や受賞歴は示さないでください。

独立系ブランドデザイナー「Ren Mori」の静的ポートフォリオを制作してください。深緑 #166534 と淡いミント #F0FDF4 を使い、静かな夜の余韻を、広い余白と明確な明暗差で表現します。写真は使わず、文字を主役にします。

ファーストビューは大きな余白の中に「Less,」「but felt.」という二行のセリフ体コピーを置き、二行目を少し右へずらしてください。名前は左上、小さな Work / About のページ内リンクは右上。下端に専門領域とページ内リンクを控えめに置きます。コピーの隣に画像や説明列を足さず、ひとつの焦点を保ってください。

続く Selected work は、左に番号・作品名・領域・短い説明、右に文字だけの図版を置く二列の行で構成します。架空の作品は、文化施設のアイデンティティ「Still House」と、編集プロジェクト「FIELDNOTES」。前者は濃緑の地に大きなセリフ文字、後者は淡い地に罫線と大きな斜体文字を使います。角丸カードや影は使わず、細い罫線と余白で区切ります。各作品は静的な紹介で、詳細ページや操作機能は設けません。

About は左に小さなセクション名、右に短いプロフィールと専門領域を配置します。本文は固定のシステムサンセリフ、主な言葉は Georgia 系のセリフ体。モバイルでは作品・プロフィールを一列へ変更し、冒頭の高さと余白を縮めつつ低密度を維持します。氏名や作品はサンプルとして扱い、実在の実績や受賞歴は示さないでください。

Create a static portfolio for fictional independent brand designer Ren Mori. Use deep green #166534 and pale mint #F0FDF4, with an atmospheric evening mood conveyed through empty space and contrast rather than photography.

Make the opening a spacious field containing one serif statement on two lines: “Less,” and “but felt.” Offset the second line slightly to the right. Place the name at the upper left and small Work / About anchor links at the upper right. Keep a discipline label and an in-page link along the bottom edge. Do not add an image column or a competing text block beside the statement.

Follow with Selected work: two generously spaced, ruled rows, each with a number, project name, discipline and short description on the left, and a typographic specimen on the right. Use fictional projects Still House, a cultural identity concept, and FIELDNOTES, an editorial concept. The first specimen has mint serif lettering on green; the second uses green italic lettering and fine rules on mint. Avoid rounded cards and shadows. These are static project examples, not links to case studies.

Close with an About section using a small label on the left and a concise profile and disciplines on the right. Use Georgia-based serif typography for the expressive statements and a fixed system sans-serif stack for supporting text. At mobile widths, stack project and profile columns and reduce opening height, gaps and type sizes without filling the negative space. Keep the identity and project details clearly fictional; do not invent awards or client credentials.

Create a static portfolio for fictional independent brand designer Ren Mori. Use deep green #166534 and pale mint #F0FDF4, with an atmospheric evening mood conveyed through empty space and contrast rather than photography.

Make the opening a spacious field containing one serif statement on two lines: “Less,” and “but felt.” Offset the second line slightly to the right. Place the name at the upper left and small Work / About anchor links at the upper right. Keep a discipline label and an in-page link along the bottom edge. Do not add an image column or a competing text block beside the statement.

Follow with Selected work: two generously spaced, ruled rows, each with a number, project name, discipline and short description on the left, and a typographic specimen on the right. Use fictional projects Still House, a cultural identity concept, and FIELDNOTES, an editorial concept. The first specimen has mint serif lettering on green; the second uses green italic lettering and fine rules on mint. Avoid rounded cards and shadows. These are static project examples, not links to case studies.

Close with an About section using a small label on the left and a concise profile and disciplines on the right. Use Georgia-based serif typography for the expressive statements and a fixed system sans-serif stack for supporting text. At mobile widths, stack project and profile columns and reduce opening height, gaps and type sizes without filling the negative space. Keep the identity and project details clearly fictional; do not invent awards or client credentials.

参考プロンプトの使い方・変更例How to adapt a reference prompt

完全な再現を保証するものではありません。 / Exact reproduction is not guaranteed.