왜 포트폴리오 홈페이지는 ‘작업이 주인공’이어야 하는가
포트폴리오 홈페이지 제작에서 가장 먼저 푸는 문제는 화면을 꾸미는 일이 아니라 작업을 돋보이게 하는 일입니다. 프리랜서·디자이너를 찾는 사람은 “이 사람이 무엇을 만들었나, 믿고 맡길 수 있나, 어떻게 연락하나” 단 세 가지를 봅니다. 그래서 이 디자이너의 페이지는 작업·신뢰·연락이라는 세 기둥만 또렷이 세우고, 나머지 장식은 모두 덜어냈습니다. 본질은 결국 ‘작업이 말하게 하는 것’입니다.
색: 흑백 바탕, 라임 한 포인트
바탕은 거의 검정에 가까운 다크(#0e0e0f) — 작업 썸네일의 색이 튀어 보이도록 화면을 비워 둡니다. 포인트 컬러는 라임(#d6ff3f) 하나뿐입니다. CTA·강조·필터 활성 상태처럼 ‘여기를 보라’는 자리에만 절제해 써서, 시선이 분산되지 않고 작업과 다음 행동에만 모이게 했습니다. 색을 줄일수록 작업이 또렷해진다는 미니멀의 원칙을 그대로 따랐습니다.
구조: 작업 필터로 빠르게 좁히기
작업 위에 분야 필터(아이덴티티·웹·패키지·SNS)를 두어, 보러 온 사람이 자기 관심사로 결과물을 한 번에 좁혀 보게 했습니다. 외주를 맡기려는 사람은 “내가 필요한 종류의 작업을 이 사람이 해봤나”를 가장 빨리 확인하고 싶어 하기 때문입니다. 필터는 페이지를 새로 부르지 않고 그 자리에서 카드가 추려지므로, 기다림 없이 탐색이 이어집니다.
라이트박스: 케이스를 깊게, 페이지는 가볍게
작업 카드를 누르면 라이트박스가 열리고, 그 안에서 더 큰 이미지와 ‘무엇을·왜·어떻게’의 케이스 설명을 보여 줍니다. 목록은 가볍게 훑게 두고, 관심 가는 작업만 깊이 들여다보게 나눈 구조입니다. 덕분에 첫 화면은 빠르게 열리고, 진짜 보고 싶은 작업은 충분히 자세히 전해집니다. 포트폴리오 홈페이지 제작에서 ‘목록의 속도’와 ‘케이스의 깊이’를 동시에 잡는 방법입니다.
모바일에서 시작되는 문의
의뢰를 고민하는 사람은 대개 책상 앞이 아니라 휴대폰으로 디자이너를 찾습니다. 그래서 이 사이트는 모바일을 먼저 설계했습니다. 작은 화면에서도 작업 그리드가 한 줄로 또렷이 흐르고, 필터·라이트박스가 손가락에 맞게 동작하며, 화면 어디서든 한 번의 터치로 문의로 이어집니다. 일하는 방식과 응답 속도를 정직하게 적어 ‘맡겨도 되겠다’는 신뢰를 채우고, 그 신뢰가 식기 전에 바로 연락 동선으로 잇는 것 — 그것이 예쁜 화면보다 중요한 배려입니다. 데스크톱에서는 여백과 큰 타이포로 작업의 무게를 키우고, 모바일에서는 속도와 문의 동선을 키워, 같은 페이지가 두 맥락 모두에서 제 역할을 하도록 맞췄습니다.
정직과 발견(GEO)
샘플 속 인물·작업·수치는 시연을 위한 가상 설정임을 페이지에 분명히 밝혔습니다(과장·사칭 금지). 대신 “디자이너 포트폴리오”, “프리랜서 작업 의뢰”처럼 사람들이 실제로 검색하는 질문에 답하는 구조와 FAQ, 구조화 데이터를 넣어 — 검색엔진과 AI 답변 양쪽에서 포트폴리오 홈페이지 제작 사례로 발견되게 했습니다. 보기 좋은 사이트가 아니라, 찾아지고 문의로 이어지는 사이트를 목표로 했습니다.