기획 문서가 없는 상태에서 확정한 사이트 구조가 실제 화면으로 어떻게 서는지 담았습니다.
스토리보드란?
스토리보드는 개발 전에 서비스의 화면을 실제 모습에 가깝게 미리 그려 보는 문서입니다. 요구사항이 어떤 화면과 순서로 만들어지는지 눈으로 확인하실 수 있습니다.
마지막까지 보시면 개발자 없이도 조합이 직접 운영하는 홈페이지의 모습이 머릿속에 그려지실 것입니다.
조합을 처음 접한 사람이 교육과정을 보고 신청하고, 조합원이 되어 커뮤니티에 머무는 경로입니다.
검색이나 안내 링크로 들어와 조합·사업·운영진 소개를 훑어봅니다. PC와 모바일 어느 쪽이든 같은 구조로 보입니다.
운영 중인 과정 목록에서 모집 상태를 보고 상세 내용을 읽습니다. 수강 신청·결제는 1차 범위에서 제외했습니다.
컨설팅 문의 또는 지자체·기관·기업의 교육 위탁 사업 신청을 폼으로 넣고 접수번호를 받습니다.
커뮤니티를 이용하려면 계정을 만듭니다. 비회원은 목록만 볼 수 있고 글쓰기는 잠겨 있습니다.
게시글과 댓글로 조합원끼리 이야기하고, Q&A로 문의를 남겨 사무국 답변을 확인합니다.
기획 문서가 없는 상태에서 우리가 먼저 확정하는 사이트 구조(IA)를 화면으로 보여 드리는 대표 페이지입니다. 상단 메뉴가 조합 소개·사업 소개·운영진·교육과정·컨설팅 신청·커뮤니티로 고정되고, 본문은 히어로와 소개 블록 4개, 운영 중인 교육과정 목록으로 이어집니다.
오른쪽에 같은 페이지의 모바일 화면을 나란히 두었습니다. 반응형은 기기별로 따로 만드는 것이 아니라 한 페이지가 폭에 맞춰 접히는 것이라, 나중에 모바일 수정이 따로 발생하지 않습니다.
홈페이지가 소개 책자가 아니라 업무 창구라는 점을 증명하는 화면입니다. 탭 하나로 개인·단체의 컨설팅 문의와 지자체·기관·기업(B2G, B2B)의 교육 위탁 사업 신청을 나눠 받습니다.
오른쪽에 접수 직후 화면을 함께 뒀습니다. 접수번호가 발급되고 사무국 담당자에게 알림 메일이 나가는 것까지가 한 세트입니다. 알림이 없으면 문의가 며칠 방치되기 때문입니다. 개인정보 수집 동의와 자동 등록 방지는 필수로 두어, 연락처를 받는 폼의 법적 요건과 스팸을 함께 막습니다.
회원가입·로그인을 거친 조합원이 글과 댓글을 남기는 게시판, 그리고 문의를 등록하면 사무국 답변이 달리는 Q&A를 한 화면에 담았습니다.
게시판은 분류(공지·자유·정보·질문)가 늘어날 수 있는 구조로 설계해, 나중에 '교육과정 후기' 같은 게시판을 추가할 때 개발이 다시 들어가지 않습니다. Q&A는 문의와 답변을 한 덩어리로 보여 주어 같은 질문이 반복되는 것을 줄입니다. 비회원에게는 목록만 열고 글쓰기는 잠가 스팸 유입을 막습니다.
개발자 없이 사무국 담당자가 매주 실제로 하게 될 일의 순서입니다.
사무국 계정으로 관리자 화면에 들어옵니다. 권한은 담당 업무 단위로 나눌 수 있습니다.
밤사이 들어온 컨설팅·사업 신청을 열어 보고 처리 상태를 신규에서 확인중으로 바꿉니다.
연혁이나 교육과정 내용을 직접 고치고 미리보기로 확인한 뒤 저장하면 홈페이지에 바로 반영됩니다.
Q&A 답변을 쓰고, 신고된 글을 숨기고, 회원 상태를 확인합니다.
도메인과 보안 인증서 연결 상태를 보고, 화면 설계서·소스코드·관리자 매뉴얼을 넘겨받습니다.
조합 담당자가 매일 가장 먼저 여는 화면입니다. 오늘 신규 접수와 확인중 건수를 위에서 보고, 아래 목록에서 컨설팅과 사업 신청을 유형·상태로 걸러 처리합니다.
목록에서 연락처를 가려 두고 상세를 열 때만 전체를 보여 줍니다. 화면 캡처나 공유 과정에서 개인정보가 새는 가장 흔한 경로를 막기 위해서입니다. 엑셀 내려받기를 둔 것은 지원사업 보고서에 접수 실적을 붙여야 하기 때문이고, 이 화면의 캡처가 그대로 관리자 사용 매뉴얼에 들어갑니다.
소개·연혁·운영진·교육과정 내용을 담당자가 직접 고치는 화면입니다. 왼쪽 편집 대상 목록이 홈페이지 메뉴 구조와 똑같이 놓여 있어, 고칠 페이지를 찾는 데 시간이 들지 않습니다.
오른쪽 미리보기로 저장 전에 결과를 확인하고, 되돌리기를 위해 최근 10개 버전을 보관합니다. 잘못 고쳐 홈페이지가 깨지는 것이 비개발자 운영에서 가장 흔한 사고이기 때문입니다. 원고가 늦는 항목은 임시 내용으로 먼저 열고 이 화면에서 교체하면 됩니다.
Q&A 답변과 신고 글 처리, 회원 확인을 한 화면에서 끝내고, 오른쪽에서 배포 상태와 넘겨 드릴 문서를 함께 봅니다.
운영과 인계를 한 화면에 둔 이유는 납품이 '소스코드를 보냈다'로 끝나지 않기 때문입니다. 도메인이 연결되어 실제 주소로 열리고, 인증서와 백업이 켜져 있고, 문서가 담당자 손에 들어간 상태까지가 완료 기준입니다.