건축 디자인 스튜디오 포트폴리오 홈페이지 제작

건축 디자인 스튜디오 포트폴리오 홈페이지 제작

건축·인테리어 디자인 스튜디오 KNOB Design의 포트폴리오 홈페이지를 처음부터 끝까지 맞춤 제작했습니다. 브랜드 정체성을 살린 감각적인 UI 디자인, 검색엔진 상위 노출을 위한 SEO 최적화, 작품을 직접 관리할 수 있는 관리자 페이지, 고객 문의 메일 자동 발송 연동까지 전 범위를 담당했습니다.

HiSoft를 파트너로 선택한 이유

KNOB Design Studio는 건축·인테리어 디자인 스튜디오로, 기존에는 별도의 홈페이지 없이 SNS와 지인 소개만으로 클라이언트를 유치하고 있었습니다. 포트폴리오를 체계적으로 보여줄 공간이 필요했고, 검색을 통해 새로운 고객이 자연스럽게 유입되길 원했습니다. 템플릿 기반 빌더로는 브랜드 고유의 분위기를 표현하기 어렵다는 판단 하에 처음부터 맞춤 제작으로 방향을 잡았습니다.

직면했던 문제들

핵심 목표

단순히 예쁜 홈페이지를 만드는 것을 넘어, 검색으로 새로운 고객이 유입되고 대표가 직접 콘텐츠를 운영할 수 있으며, 고객 문의가 놓치지 않고 접수되는 실질적으로 비즈니스에 기여하는 사이트를 구축하는 것이 목표였습니다.

주요 구현 내용

맞춤형 브랜드 UI/UX 디자인

템플릿 없이 스튜디오의 감성과 철학을 담아 처음부터 디자인했습니다. 여백과 타이포그래피 중심의 절제된 레이아웃으로 작업물이 돋보이도록 구성했습니다.

• 브랜드 컬러·폰트 시스템 정립
• 포트폴리오 갤러리 그리드 레이아웃
• 모바일·태블릿·PC 완전 반응형 구현
• 스크롤 기반 인터랙션 및 페이드인 애니메이션

SEO 최적화 — 검색 상위 노출 구조

Next.js의 서버사이드 렌더링을 활용해 검색엔진이 콘텐츠를 완전히 읽을 수 있도록 구성했습니다. 지역·업종 키워드 중심으로 메타데이터를 설계했습니다.

• 페이지별 title·description·OG 태그 최적화
• 구조화 데이터(JSON-LD) 마크업 적용
• sitemap.xml·robots.txt 자동 생성
• 구글 서치 콘솔·네이버 웹마스터 도구 등록
• Core Web Vitals(LCP·CLS·FID) 개선

관리자 페이지 — 콘텐츠 직접 운영

대표가 개발자 없이 포트폴리오 작품, 소개 텍스트, 연락처 등을 직접 수정·등록할 수 있는 전용 관리자 화면을 구축했습니다.

• 작품 등록·수정·삭제·순서 변경
• 이미지 업로드 및 최적화 자동 처리
• 사이트 소개글·연락처 정보 편집
• 비밀번호 인증 기반 접근 제어

문의 메일 자동 발송 연동

홈페이지 문의 폼 제출 시 고객과 스튜디오 양쪽으로 확인 메일이 자동 발송되도록 연동했습니다. 문의 누락과 대응 지연 문제를 근본적으로 해결했습니다.

• 문의 접수 시 대표에게 즉시 알림 메일 발송
• 고객에게 접수 확인 자동 회신 메일 발송
• 문의 유형별 메일 템플릿 구성
• Nodemailer + SMTP 연동