프로젝트 설명
작업 과정
방문자가 어떤 순서로 읽을지부터 정했습니다. 기업 홈페이지는 소개→기술→브랜드→파트너십→소식 순으로 브랜드 페이지는 문의→서비스 범위→사례→자주 묻는 질문 순으로 배치했습니다.
그다음 각 구간이 스크롤에 맞춰 나타나게 하고 브랜드 구간은 화면을 고정한 채 넘어가도록 움직임을 넣었습니다. 마지막으로 휴대폰에서 볼 때와 컴퓨터에서 볼 때의 화면을 따로 짜서 글자가 깨지거나 버튼이 눌리지 않는 구간이 없게 맞췄습니다.
결과물
기업 홈페이지는 소개 영상 기술 영역 4개 브랜드 3개 파트너십 공지·보도자료까지 6개 구간입니다. 브랜드 페이지는 첫 화면에 상담 폼을 두고 신청이 접수되면 담당자 화면으로 넘어가는 과정까지 보여줍니다.
서비스 범위와 자주 묻는질문을 포함해 8개 구간입니다. 두 사이트 모두 검색에서 바로 찾을 수 있도록 기본 설정을 마쳤습니다.
기술 스택
JavaScript/TypeScriptJavaReact/Next.jsNode.jsPostgreSQLCloud (AWS/Azure/GCP)jQueryNestJSVercelFigmaHTML/CSS