PORTFOLIO
SAESOL TECH 반응형 웹 플랫폼 구축
V2X 보안 기술을 비주얼로 재해석하고 CMS를 통합한 반응형 웹 플랫폼 구축 프로젝트입니다.
- V2X 보안
- 기술 비주얼
- CMS 통합
- 반응형 웹
과제: V2X 보안 스택·PKI 인증 같은 핵심 기술이 텍스트 위주로만 소개됐고, 제품·뉴스·문의를 내부에서 바로 갱신할 관리 체계가 없어 글로벌 파트너 응대에 한계가 있었습니다.
한 것: 국·영문 반응형 기업 웹사이트 + 헤드리스 WordPress CMS + 글로벌 문의·기술 백서 관리 백오피스
결과물
프로젝트 정보
- 클라이언트·업종:
- 기간: 2024.05 ~ 2024.07
- 담당 범위: 기획 · 디자인 · 프론트엔드 · 백엔드
- 주요 산출물: 국·영문 반응형 웹, 솔루션 아카이브·스펙 비교 테이블, 인터랙티브 테크 맵, 문의·백서 관리 CMS
- 플랫폼:
- 기술 스택:
어떻게 풀었나
운영자는 WordPress로 쓰고 Laravel API가 React로 공급하는 헤드리스 구조
콘텐츠 등록은 운영자에게 익숙한 WordPress에서 하고, Laravel API가 이를 받아 React 프론트엔드에 공급하는 헤드리스 구조로 나눴습니다. 편집 도구는 익숙한 것을 쓰되 화면 디자인은 프론트엔드가 맡기 때문에, 제품 사양이나 전시회 소식을 코드 수정 없이 바꿔도 톤앤매너가 흐트러지지 않습니다. 국문·영문 콘텐츠는 다국어 매니저 로직으로 함께 동기화했습니다.
SW·HW·Service로 나눈 솔루션 아카이브와 스펙 비교 테이블
솔루션을 SW·HW·Service 세 카테고리로 나누고 카테고리마다 아이콘과 컬러 라인을 달리해, 첫 화면에서 제품군이 구분되도록 했습니다. 상세 사양은 TanStack Table로 정렬·필터·비교할 수 있는 표로 정리했고, 가용 상태(Available/Upcoming)와 문서 종류는 배지로 표시했습니다. V2X 보안 인프라의 동작 원리는 인터랙티브 테크 맵으로 시각화해 텍스트 설명에 기대는 부분을 줄였습니다.
대기 → 검토 중 → 답변 완료로 추적하는 글로벌 문의와 백서 다운로드 승인
홈페이지로 들어오는 기술 지원·파트너십·일반 문의는 PENDING → REVIEWING → RESPONDED 단계로 상태를 관리해, 담당자가 놓친 건을 바로 확인할 수 있습니다. 기술 백서는 권한에 따라 다운로드를 승인하고 이력을 남겨, 어떤 문서를 받아 간 방문자인지를 영업 리드로 이어 볼 수 있게 했습니다.
- 기술 기업 국문 영문 홈페이지 리뉴얼
- 워드프레스 헤드리스 CMS 리액트 홈페이지 구축
- B2B 홈페이지 문의 관리와 기술 자료 다운로드 관리
Q. 관리자가 제품과 뉴스를 직접 수정할 수 있나
가능합니다. 제품 사양, 이미지·기술 문서, 보도자료·전시회 소식은 WordPress 기반 CMS에서 등록·수정하며, 변경 내용은 Laravel API를 거쳐 사이트에 반영됩니다.
Q. 구축 기간은 얼마나 걸렸나
이 건은 3개월이었습니다(기간 기준, 금액과 무관). 기획, 디자인, 개발을 순서대로 진행한 기간입니다.
비슷한 프로젝트를 고민 중이라면, 상담만 받아보셔도 됩니다.
기획 범위, 디자인 시스템, 개발 핸드오프까지 필요한 내용을 함께 확인해 드릴게요.