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

余韻をかたちに — Nao Moriの作品集Feeling Takes Form — Nao Mori

感覚を起点にしたデザインを、余白と彫刻的な図形で見せるポートフォリオ。
淡いピンクと深いベリー色で、夜の展覧会のような静かな強さをつくります。

A tactile portfolio where oversized type meets sculptural graphics, in pale pink and deep berry.

natural-warm · hero · portfolio / editorial / asymmetric / typography / pink / art-direction / svg / warm

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

大きなセリフ体の見出しが左右のトラックを横断し、その二段目から右側のビジュアルが始まります。
左側の紹介文はさらに一段下に置き、読ませる密度と空白を非対称に配分。
作品一覧も大きさと開始位置をずらし、図形、作品名、制作領域の順に視線を導きます。

アートディレクションやビジュアルアイデンティティの紹介に適した構成です。
狭い画面では見出し、紹介文、ビジュアルの順に並べ替え、作品も一列に配置。
文字サイズの差は残しながら、左右の余白を縮めます。
ナビゲーションはページ内の各節へ移動します。

参照プロンプトを使うときは、作家名と二つの作品名、制作領域を自分の内容に置き換えてください。
図形を作品写真に変える場合は、見出しと競合しない明暗やトリミングを指定し、紹介文は短い一段落にまとめると、この余白のリズムを保てます。

The serif headline spans both tracks; the artwork enters beside its second line, with the introduction one row lower.
Uneven whitespace carries into two staggered project studies.
Small sans-serif captions anchor the large shapes.

Suited to identity and art-direction work.
On narrow screens, the opening reads as headline, introduction, then artwork; projects become one column while type retains its scale contrast.
Navigation links jump to page sections.

Adapt the reference prompt with your name, project titles and disciplines.
If replacing graphics with photography, specify a quiet crop that will not compete with the headline.
Keep the introduction brief to preserve the open rhythm.

デザインの条件Design conditions

対象 / Audience: creative-peers
目的 / Purpose: work-showcase
トーン / Tone: expressive
主な色 / Primary color: #BE185D
補助色 / Secondary color: #FCE7F3
構成 / 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.

クリエイティブ業界の同業者に向けた、架空のデザイナーNao Moriのポートフォリオを作成してください。テーマは「Feeling takes form.」。淡いピンク #FCE7F3 の紙のような背景、ベリー色 #BE185D、暗いワイン色の本文、暖かなクリーム色の図形を用い、夜の展覧会のような静かな緊張感を表現してください。

冒頭は非対称なエディトリアル構成にします。大きなGeorgia系セリフ体の見出しを左右のトラックにまたがらせ、二段目の「form.」はイタリックに。右の抽象的な彫刻ビジュアルは見出しの二段目から始め、左の短い紹介文はその下の行に置きます。通常の左右分割ヒーローや中央寄せの縦積みにはしないでください。図形はSVGで、ベリー色の面にクリーム色の重なる楕円と曲線を描きます。

上部には作家名とWorks、Aboutのページ内リンク。続いてSelected worksとして「Soft Assembly」と「After Hours」の二作品を、大きさと開始位置を変えて配置してください。一つ目は抽象彫刻のアイデンティティ、二つ目は文字と円を中心にした文化イベントのポスターという静的な作例です。最後に短いプロフィールと制作領域を置きます。角丸カードや写真は不要です。

モバイルでは見出し、紹介、ビジュアルの順に読み進められる一列構成にし、作品も縦に並べます。見出しと本文のサイズ差、細い罫線、広い余白を残してください。自分の作品に応用するときは、名前、作品名、年、制作領域、紹介文を差し替え、図版の色数と静かな密度を維持してください。

クリエイティブ業界の同業者に向けた、架空のデザイナーNao Moriのポートフォリオを作成してください。テーマは「Feeling takes form.」。淡いピンク #FCE7F3 の紙のような背景、ベリー色 #BE185D、暗いワイン色の本文、暖かなクリーム色の図形を用い、夜の展覧会のような静かな緊張感を表現してください。

冒頭は非対称なエディトリアル構成にします。大きなGeorgia系セリフ体の見出しを左右のトラックにまたがらせ、二段目の「form.」はイタリックに。右の抽象的な彫刻ビジュアルは見出しの二段目から始め、左の短い紹介文はその下の行に置きます。通常の左右分割ヒーローや中央寄せの縦積みにはしないでください。図形はSVGで、ベリー色の面にクリーム色の重なる楕円と曲線を描きます。

上部には作家名とWorks、Aboutのページ内リンク。続いてSelected worksとして「Soft Assembly」と「After Hours」の二作品を、大きさと開始位置を変えて配置してください。一つ目は抽象彫刻のアイデンティティ、二つ目は文字と円を中心にした文化イベントのポスターという静的な作例です。最後に短いプロフィールと制作領域を置きます。角丸カードや写真は不要です。

モバイルでは見出し、紹介、ビジュアルの順に読み進められる一列構成にし、作品も縦に並べます。見出しと本文のサイズ差、細い罫線、広い余白を残してください。自分の作品に応用するときは、名前、作品名、年、制作領域、紹介文を差し替え、図版の色数と静かな密度を維持してください。

Create a portfolio for fictional designer Nao Mori, aimed at creative peers, around the phrase “Feeling takes form.” Use a paper-like pale pink #FCE7F3 background, berry #BE185D, dark wine text and warm cream graphics. The mood is cinematic and quietly bold, like an exhibition viewed after dark.

Use an asymmetric editorial opening. A very large Georgia-style serif headline spans the text and visual tracks. Set its second line, “form.”, in italic. Start the right-hand sculptural artwork beside this second line, then place the short left-hand introduction a grid row lower. Distribute whitespace unevenly rather than using a conventional split hero or centered stack. Make the artwork with SVG: overlapping cream ellipses and curves against a berry field.

Place the designer name and local Works/About navigation at the top. Follow with two selected projects, Soft Assembly and After Hours, staggered in size and vertical position. These are static concept studies: a sculptural identity and a cultural poster built from type and circles. Finish with a concise biography and a list of disciplines. Use fine rules, restrained sans-serif captions and generous spacing, without rounded cards or photography.

On narrow screens, show the headline, introduction and artwork in that order, followed by a single column of projects. Retain varied type scale. To adapt the design, replace the designer name, project titles, years, disciplines and biography, keeping the artwork palette restrained and the introduction short.

Create a portfolio for fictional designer Nao Mori, aimed at creative peers, around the phrase “Feeling takes form.” Use a paper-like pale pink #FCE7F3 background, berry #BE185D, dark wine text and warm cream graphics. The mood is cinematic and quietly bold, like an exhibition viewed after dark.

Use an asymmetric editorial opening. A very large Georgia-style serif headline spans the text and visual tracks. Set its second line, “form.”, in italic. Start the right-hand sculptural artwork beside this second line, then place the short left-hand introduction a grid row lower. Distribute whitespace unevenly rather than using a conventional split hero or centered stack. Make the artwork with SVG: overlapping cream ellipses and curves against a berry field.

Place the designer name and local Works/About navigation at the top. Follow with two selected projects, Soft Assembly and After Hours, staggered in size and vertical position. These are static concept studies: a sculptural identity and a cultural poster built from type and circles. Finish with a concise biography and a list of disciplines. Use fine rules, restrained sans-serif captions and generous spacing, without rounded cards or photography.

On narrow screens, show the headline, introduction and artwork in that order, followed by a single column of projects. Retain varied type scale. To adapt the design, replace the designer name, project titles, years, disciplines and biography, keeping the artwork palette restrained and the introduction short.

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

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