플러스프로젝트 배경
모델 프로필·광고 캠페인·에이전시 기사라는 세 갈래 콘텐츠와 전체화면 배경 영상, 스크롤·마우스 오버 반응 애니메이션 등 광고·미디어 산업 웹사이트가 요구하는 화면 구성을 먼저 파악하고, 공개 사이트 10개 화면부터 관리자 콘텐츠 등록·노출 관리까지 실제 동작하는 결과물을 사전 구현했습니다. 모델 등록, 기사 본문에 이미지 끼워 넣기, 메인 배경 영상 교체 등 실제 운영 시나리오 6가지를 미리 검증해둔
프로젝트 성과
공개 10개 화면·관리자 3개 화면 모두 정상 동작
모델 7명 로스터와 광고·기사 목록, 상세, 문의까지 공개 화면 10개와 로그인·콘텐츠 목록·에디터를 실제 서버에서 오류 없이 확인
노출 전환 클릭 3회에서 1회로 단축
기존 설계는 목록에서 편집 화면에 들어가 저장까지 3번 눌러야 했지만, 목록 행의 토글 하나로 공개·비공개가 즉시 바뀌도록 개선
첫 화면 로딩 자바스크립트 44kB 감소
애니메이션 라이브러리를 화면에 필요할 때만 내려받도록 바꿔 첫 로딩 용량을 158kB에서 114kB로 줄임
전체 스크롤 구간 끊김 0건, 첫 화면 0.12초
메인 페이지를 끝까지 훑는 동안 화면이 멈추는 구간 0건, 가장 큰 콘텐츠가 그려지기까지 0.12초로 실측
광고·기사 목록 2건에서 6건·5건으로 확장
3열 그리드로 바꿔 광고 6건이 한 화면에 모두 들어오도록 조정하고, PC·모바일에서 빈 칸 없이 채워지는 것을 확인
핵심 기능
전체화면 배경 영상과 관리자 직접 교체
메인 배경 영상이 자동 재생되고, 관리자가 파일을 올려 바로 교체합니다. 용량 초과·형식 오류를 올리기 전에 알려 잘못된 파일이 공개되지 않게 했습니다
진행 단계
화면 구성과 인터랙션 범위 정의
2026.08.
공개 10개 화면과 관리자 화면의 구성도를 먼저 확정하고, 배경 영상·스크롤 반응·오버 효과·페이지 전환의 적용 위치를 화면별로 지정
프로젝트 상세
모델 매니지먼트 에이전시의 공개 웹사이트와 자체 콘텐츠 관리 시스템을 함께 구축했습니다. 전체화면 배경 영상, 스크롤 반응 페이드, 마우스 오버 확대·색 반전, 페이지 전환 효과를 적용한 공개 화면 10개와, 개발 지식 없이 텍스트·이미지·영상을 기사 형태로 등록하는 관리자 환경을 만들었습니다. 모델 7명 로스터와 광고·기사 목록 모두 새로고침 없는 카테고리 필터와 이미지·영상 모달을 제공하고, 업로드한 미디
