FOR · 포트폴리오

포트폴리오에 어울리는
디자인 스타일 8

포트폴리오는 사이트 자체가 작업물입니다. 방문자는 올려둔 프로젝트를 보러 오지만, 그 프로젝트를 감싼 화면에서 이미 실력을 판단합니다. 그래서 여기서는 '안전한 선택'이 오히려 손해일 때가 있습니다 — 아무 인상도 남기지 않는 화면은 아무 말도 하지 않은 것과 같습니다.

두 갈래가 있습니다. 작업물을 앞세우는 쪽이라면 미니멀리즘·모노크롬·스위스 디자인처럼 화면을 격자와 타이포로만 잡고 색은 작업 이미지에서만 나오게 하는 방향, 그리고 이미지가 사진·영상 위주라면 다크 모드가 콘텐츠를 가장 또렷하게 띄웁니다. 반대로 본인의 감각을 앞세우는 쪽이라면 브루탈리즘·맥시멀리즘·오로라처럼 화면 자체가 발언하는 방향이 맞습니다.

뉴모피즘은 대비가 낮아 실서비스에는 권하기 어렵지만, 쇼케이스와 컨셉 데모라는 포트폴리오의 성격에서는 오히려 제자리를 찾는 스타일입니다. 시스템 층은 최소한만 — 무드를 자주 갈아끼울 계획이면 테마 팩 구조의 Astryx, 구조를 빨리 세우고 콘텐츠에 시간을 쓰고 싶으면 Bootstrap 정도면 충분합니다.

어울리는 스타일

아래 화면은 캡처 이미지가 아니라 지금 이 자리에서 실제로 그려진 화면입니다. 같은 포트폴리오 씬에 스타일 규칙만 갈아입혔습니다.

Minimalism

"적을수록 좋다"는 철학으로, 불필요한 요소를 제거하고 본질에 집중합니다.

Monochrome Design

단일 색상의 다양한 톤과 음영을 사용하여 세련되고 일관된 느낌을 줍니다.

Swiss Design (국제 타이포그래피 양식)

스위스에서 발전한 그래픽 디자인 스타일로, 명료성과 객관성을 강조합니다.

Dark Mode Design

어두운 배경을 사용하여 눈의 피로를 줄이고 배터리를 절약합니다.

Brutalism

거칠고 날것 그대로의 디자인으로, 전통적인 미학을 거부합니다.

Maximalism

풍부한 색상, 패턴, 장식으로 시각적으로 압도적인 경험을 제공합니다.

Aurora Design

오로라 현상에서 영감을 받은 화려하고 몽환적인 그라데이션 스타일입니다.

Neumorphism

소프트 UI라고도 불리며, 요소가 배경에서 부드럽게 돌출된 듯한 효과를 만듭니다.

기준선으로 삼을 디자인 시스템

처음부터 그리지 않아도 되는 부분입니다. 표·폼·내비 같은 기본 부품이 이미 완성돼 있는 시스템을 기준선으로 두면 만들어야 할 목록이 줄어듭니다.

Astryx (Meta 디자인 시스템)

Meta가 공개한 오픈소스 디자인 시스템으로, StyleX 원자 CSS와 깊게 통합된 시맨틱 토큰 아키텍처가 핵심입니다. 따뜻한 크림 배경과 니어블랙 모노크롬 강조의 절제된 기본 테마(neutral) 위에 butter, matcha, gothic, y2k 등 테마 팩을 얹어 코드 수정 없이 전혀 다른 무드를 만들 수 있습니다.

이 쓰임새 안에서 비교하기

둘 다 어울리는데 어느 쪽인지 갈릴 때 — 같은 랜딩 한 페이지에 두 스타일을 나란히 입혀 무드 좌표와 장단점을 대조합니다.

고른 것을 브리프로

마음에 드는 스타일을 픽에 담아 두면 개발자·디자이너에게 그대로 넘길 수 있는 디자인 브리프로 묶어 드립니다. 아직 고르기 어렵다면 취향 테스트가 여섯 문항으로 셋을 골라 드립니다.