부품을 눌러 문의까지 가는 바이어 화면과, 담당자가 직접 운영하는 관리 화면을 담았습니다.
스토리보드란?
스토리보드는 서비스의 화면을 실제 모습에 가깝게 미리 그려 보는 문서입니다. 바이어와 담당자 두 유형으로 나눠, 쇼룸 진입부터 문의·운영까지의 순서로 배치했습니다.
마지막까지 보시면 생각하고 계신 시스템의 모습이 머릿속에 그려지실 것입니다.
첫 화면 쇼룸에서 부품을 고르고, 제품을 확인한 뒤 이메일 문의로 이어집니다.
첫 화면에
가방 이미지가 바로
버클·핸들·바스켓
점을 누름
같은 유형 제품을
사양으로 좁힘
사진과 사양표
확인
제품 코드가 채워진
문의 메일 발송
바이어가 들어오자마자 가방 이미지를 봅니다. 부품 위 점을 누르면 부품명과 제품 수가 뜨고, 한 번 더 누르면 해당 제품으로 갑니다. 메뉴는 쇼룸·제품·회사 소개·문의 4개입니다.
점 위치는 사진 크기에 대한 비율(%)로 저장해 PC·모바일에서 같은 부품 위에 놓입니다. 점과 오른쪽 유형 목록은 모두 관리 화면에서 담당자가 정한 값을 그대로 읽습니다.
버클 점을 누르면 버클 86종 목록으로 옵니다. 웨빙 폭·소재로 좁히고, 사진이 아직 없는 신제품은 사진 대기로 표시돼 목록이 비어 보이지 않습니다.
유형은 분류(taxonomy)로 관리해 새 유형을 추가하면 왼쪽 목록에 자동으로 생깁니다. 필터 항목은 제품 입력폼의 고정 선택지를 그대로 씁니다.
사진과 사양표를 보고 바로 옆에서 문의합니다. 제목에 제품 코드와 이름이 미리 들어가 바이어는 이메일만 적으면 됩니다. 쇼룸 첫 화면에서 3클릭째입니다.
문의는 담당자 메일로 보내지고, 필수 칸을 비우면 빨간 테두리로 알립니다. 이 제품이 연결된 가방 영역도 함께 보여 쇼룸과 제품이 이어져 있음을 확인할 수 있습니다.
비개발자 담당자가 매뉴얼만 보고 제품과 부품 영역, 유형, 회사 소개를 고칩니다.
관리 화면
4개 메뉴
사진 올리고
칸만 채움
가방 사진 위를
드래그
유형 또는 제품을
골라 저장
바이어 화면에
바로 반영
담당자가 가방 사진 위 부품을 드래그해 네모를 그리고, 오른쪽에서 연결할 유형이나 제품을 고릅니다. 저장하면 쇼룸 첫 화면의 점이 그 자리에 생깁니다.
영역마다 연결됨·그리는 중·미연결 상태를 보여 빠진 곳을 바로 찾습니다. 좌표는 비율로 저장되고, 사진을 바꿔도 같은 비율 위치에 영역이 남습니다.
제품 한 건은 사진·이름·코드·유형·사양 칸만 채우면 됩니다. 초기 300여 종은 엑셀에 채운 파일을 한 번에 반영하고, 사진이 빠진 행만 따로 표시합니다.
사양은 자유 입력이 아니라 고정 선택지라 표기가 흩어지지 않습니다. 기존 사이트 제품 사진은 파일명과 제품 코드를 맞춰 일괄 이관합니다.
새 유형을 추가하고, 더 이상 쓰지 않는 유형은 토글로 숨깁니다. 회사 소개 문구와 사진도 같은 관리 화면에서 고치며, Wix 기본 이미지를 실제 공장 사진으로 바꿉니다.
비노출은 삭제가 아니라 숨김이라 제품 정보가 남습니다. 기존 도메인 연결과 매일 자동 백업 상태를 한 곳에서 확인합니다.