[포트폴리오] 비움의 미학, 프리미엄 공간 컨설팅 'Urban Archive' 웹사이트 제작 (반응형 웹)

홈페이지 개발

뒤죽박죽J 2026. 1. 6. 11:46

오늘은 제가 최근에 작업한 또 하나의 포트폴리오 사이트를 공개합니다. 이번 프로젝트의 주제는 **"공간의 가치를 찾아주는 프리미엄 홈스타일링 브랜드"**입니다.

사이트 이름은 **'Urban Archive(어반 아카이브)'**라고 지었습니다. ※ 안내: 이 사이트는 실제 운영 중인 업체가 아니라, 저의 **웹 퍼블리싱 및 디자인 구현 능력을 보여드리기 위해 기획하고 제작한 '가상의 브랜드'**입니다.

"단순히 물건을 정리하는 것을 넘어, 삶의 방식을 제안합니다."

화려하고 복잡한 디자인보다는, 여백의 미를 살린 미니멀리즘(Minimalism) 디자인을 컨셉으로 잡았습니다. 텍스트와 이미지 사이의 간격을 넓게 배치하여, 사용자가 사이트를 볼 때 시각적으로 편안함을 느낄 수 있도록 의도했습니다.

HTML5 시맨틱 마크업과 CSS3를 활용하여 모던한 레이아웃을 구현했습니다.

1. 감각적인 타이포그래피와 레이아웃 프리미엄 브랜드의 느낌을 주기 위해 폰트 선택(Pretendard 사용)과 자간, 행간에 신경을 썼습니다. 특히 메인 비주얼 영역(hero section)에서 텍스트와 배경 이미지가 조화롭게 어우러지도록 배치했습니다.

2. 그리드(Grid)를 활용한 갤러리 'Curated Works' 섹션에서는 CSS Grid를 활용하여 이미지들이 정형화되지 않고 리듬감 있게 배치되도록 구현했습니다. 마우스를 올렸을 때 은은하게 정보가 나타나는 호버(Hover) 효과도 적용했습니다.

3. 정보 전달을 위한 저널(Journal) 섹션 단순한 홍보 사이트가 아니라, 유용한 정보를 제공하는 브랜드 이미지를 심어주기 위해 썸네일과 텍스트가 정돈된 리스트 형태의 뉴스 섹션을 구성했습니다.

데스크탑, 모바일 화면

제가 기획한 '도심 속의 휴식' 같은 웹사이트, 직접 눈으로 확인해 보세요. PC와 모바일 어디서든 최적화된 화면으로 보실 수 있습니다.

👉 [Urban Archive 샘플 사이트 바로가기] https://changjunyun.github.io/sample_test2/

본 포트폴리오에 사용된 고품질의 인테리어 및 공간 이미지는 상업적 무료 이용이 가능한 Unsplash의 이미지를 사용했습니다.

이번 프로젝트처럼 깔끔하고 감성적인 디자인의 기업 홈페이지나 포트폴리오 사이트 제작을 원하시나요?

"내 브랜드도 이렇게 만들고 싶다"는 생각이 드셨다면, 언제든 편하게 연락 주세요. 아래 오픈채팅으로 문의하시면 빠르고 친절하게 상담해 드립니다.

[카카오톡 1:1 제작 문의] 👇👇👇 https://open.kakao.com/o/sizsMV9h

여러분의 소중한 공간(Web)을 가장 아름답게 지어드리겠습니다. 감사합니다!