세상의 모든 일을 아주 제대로. 멋지게. 해결하기 위해 연구합니다.

워프로 웹기획 매뉴얼

[toc]

프로젝트 공지

현재 프로젝트 관리는 [플로우]를 사용하고 있습니다. 플로우에 [프로젝트 만들기]로 프로젝트를 생성한 후 아래의 프로젝트 공지 목록에 맞춰 글을 작성합니다.
프로젝트 공지는 [글 상단 고정]을 통해 공지사항으로 공지해 둡니다.
[프로젝트 공지 목록]

  • 신규프로젝트 : 프로젝트 명과 프로젝트에 대해 간략한 설명
  • 사전 정보 : 기존 사이트/경쟁 사이트/참고 사이트
  • 샘플테마 : 테마 샘플 URL
  • 개발 이슈  : 특별한 개발 이슈가 있을 경우 작성
  • 접속 정보  : 아래 정보 작성
    FTP/SSH 주소
    FTP/SSH 아이디
    FTP/SSH 포트
    MySQL DB 주소
    MySQL DB 아이디
    MySQL DB 포트
    관련 정보 관련 블로그글 : http://wor-pro.com/?p=4324
  • 도메인정보 : 도메인 구입처/아이디/비번/FTP 비번
  • 관리자 : 관리자 URL / 관리자 로그인 아이디와 비번
  • 담당자 : 기획/디자인/퍼블리싱/개발자 등 프로젝트 담당자

[잔디 공지사항]
기획자는 아래 내용이 업데이트 될 때마다 프로젝트 잔디 토픽에 공지사항으로 게재합니다.

  • 사내 토픽 : 스토리보드 URL / 사이트 URL  / 관리자화면 URL
  • 고객사 토픽 : IA(고객공유용) / 스토리보드 URL / 사이트 URL 

테마 선정 및 구입

고객이 원하는 홈페이지 구성에 따라 가장 적합한 프리미엄 테마를 3~4개 정도 고객에게 안내하고, 최종 결정된 테마를 구입 후 프로젝트를 진행합니다.

일정 작성 및 컨펌

오픈 일정이 정해진 프로젝트의 경우 오픈 일정에 맞춰 일정을 작성합니다.
오픈 일정이 정확하게 정해지지 않은 프로젝트의 경우 프로젝트의 구성에 맞게 일정을 작성한 후 고객과 협의하여 일정을 작성합니다.
일정은 플로우의 각 프로젝트 [업무]영역에 작성합니다.
일정 작성이 완료되면 플루우의 전체업무>묶어보기>프로젝트 기준을 체크한 후 해당 화면을 캡쳐 받아 내부 컨펌 후 고객 컨펌 과정을 진행합니다.
일정을 작성할 때 아무리 촉박한 프로젝트일지라도 테스트 기간은 반드시 확보합니다. 충분한 테스트를 거치지 않을 경우 많은 문제가 발생할 수 있기 때문입니다.

IA 작성

IA는 엑셀로 작성 후 [드롭박스 > 1.진행중 프로젝트 > 프로젝트명] 폴더에 공유합니다.
IA 샘플 파일 위치 : 드롭박스 > 1.진행중 프로젝트 > 1. 업무매뉴얼 > 기획 > [IA_샘플 파일] 참고
[IA 메뉴 작성]
IA 메뉴는 고객의 메뉴구성도를 참고하거나, 참고 사이트, 현재 사이트 수정 등 다양한 경로를 통해 확인된 내용을 정리합니다.
[IA 테마페이지 작성]
IA 메뉴 작성 후 테마가 선정되면 테마에서 해당 페이지로 사용할 테마 샘플 테이지 URL을 작성합니다.
테마 샘플 페이지는 개발자가 메뉴을 세팅할 때 사용함으로 작성을 합니다. 그러나 기획 중에 테마 샘플 페이지가 변경되는 경우는 스토리보드에 표시해야 합니다.
[고객 공유용 IA 작성]
진행상황을 고객과 한 눈에 알아볼 수 있도록 고객 공유용 IA를 작성하여 공유합니다.
샘플을 기준으로 필요한 부분은 추가하거나 필요없는 부분은 삭제해서 사용합니다.

원고 및 자료 요청

고객이 사전에 제공한 파일이 있는지 확인 후 필요한 내용들은 원고요청서에 작성하여 고객에게 요청합니다.
받은 원고는 표시해 두고, 필요한 원고가 발생하면 원고요청서를 수정하여 재 요청합니다.
고객에게 받은 원고는  [드롭박스 > 1.진행중 프로젝트 > 프로젝트명 > 고객에게받은 파일] 폴더에 반드시 공유 합니다.
원고는 엑셀로 작성 후 고객에게 요청합니다.

원고요청서 샘플 파일 위치 : 드롭박스 > 1.진행중 프로젝트 > 1. 업무매뉴얼 > 기획 > [원고요청서_샘플] 참고

스토리보드 작성

아이린앤컴퍼니에서는 스토리보드를 오븐( https://ovenapp.io/ )을 사용하여 작성하고 있습니다.
고객에게는 URL로 컨펌을 받고 있기 때문에 [공유옵션>링크를 전달받는 모든 유저]를 꼭 체크해줘야 합니다.
오븐 스토리보드 확인이 불편한 고객들도 있으므로 PDF 파일로 변환해서 고객에게 제공합니다.
프로젝트 담당자들에게는 원본 파일을 공유하기 때문에 공유옵션에서 해당 담당자의 이메일을 추가하여 공유합니다.

좀 더 원활하고 빠른 진행을 위해 먼저 메인 작성 후 컨펌 단계를 거치고, 메뉴별로 기획이 완료되면 바로 바로 컨펌 단계를 거칩니다.
내부 컨펌을 통해 수정하고 고객 컨펌을 진행합니다.

[스토리보드에 표시 되어야 하는 내용]

  • 디자인 관련 요소
    메인 배너 및 이미지 : 디자이너에게 요청할 구체적인 이미지 내용
    폰트 사이즈 : 디자인 가이드에 따른 사용할 폰트 타입 작성
    사용할 색상 : 디자인 가이드에 따른 메인/서브/포인트 컬러 색상 작성
    그 외 디자이너에게 요청할 내용
  • 개발 관련 요소
    테마 샘플 페이지 : 기본적으로 사용한 테마 샘플 페이지 URL
    샘플 소스 : 페이지에 사용한 샘플 페이지 URL 또는 숏코드

    플러그인 : 게시판 또는 플로그인 사용 시 해당 플로그인 URL
    웹용 이미지 : 이미지 영역의 샘플 이미지(웹용 사이즈로 정리한 후 드롭박스에 공유) *테마샘플을 캡쳐하거나 참고 이미지가 있다면 웹용 사이즈로 정리하여 개발자에게 제공

[스토리보드 작성 시 주의사항]

  • 내부 소통을 위한 내용은 메모장 사용 : 디자이너, 개발자에게 요청할 내용이나 협의할 내용은 반드시 메모장에 작성해서 전달
  • 각 텍스트별 사용 폰트 정리 : 폰트 또한 메모장에 작성하여 전달

디자인 디렉팅

디자인 디렉팅은 다음 몇 단계로 나뉩니다.

[메인 디렉팅]
메인 스토리보드 고객 컨펌이 완료되면 디자이너에게 메인 페이지 디자인을 요청합니다.
메인 디자인 고객 컨펌이 완료되면 디자이너에게 폰트와 색상 등 디자인 가이드를 요청해서 받은 다음, 기획자는 스토리보드에 디자인 가이드를 정리해 둡니다.
메인 디자인이 완료되면 PSD 원본파일을 진행중인 프로젝트 공유 폴더에 넣어두고, 개발을 요청하면 됩니다.
아이콘이 사용되었을 큰 이미지로 된 아이콘.png 파일을 디자이너에게 따로 요청해서 퍼블리셔에게 전달합니다.  PSD 파일을 그대로 잘라서 사용할 경우 PC에서 번져보이는 현상을 없애기 위해 큰 이미지가 필요합니다.

[서브 디렉팅]
메인 외 스토리보드 고객 컨펌이 완료되면 서브 디자인이 필요한 페이지를 정해(일반적으로 2페이지 정도) 디자이너에게 요청합니다.
서브페이지 디자인을 토대로 다른 페이지에 적용되므로, 서브페이지는 메인 외 모든 페이지의 가이드가 될 수 있는 페이지를 선정하여 디자인을 요청합니다.
서브페이지를 통해 디자인 가이드가 추가 되어야 할 부분이 있다면 디자이너에게 요청한 후 스토리보드에 디자인 가이드를 수정합니다.
서브페이지 또한 디자인 컨펌이 완료되면 PSD 원본파일을 진행중인 프로젝트 공유 폴더에 넣어두고, 개발을 요청하면 됩니다.
서브페이지 또한 아이콘이 사용되었을 큰 이미지로 된 아이콘.png 파일을 디자이너에게 따로 요청해서 퍼블리셔에게 전달합니다.

[그 외 디렉팅]
기본적인 서브페이지 외에 필요한 부분들을 정리해서 디자이너에게 요청합니다. 서브 상단 배너, 아이콘, 다이어그램 등등 디자인이 필요한 부분만 정리해서 요청합니다.

[홈페이지 전체적인 디렉팅]
개발 완료 후 디자이너에게 사이트의 전반적인 디렉팅을 요청합니다.

디자인이 완료되는 단계마다 내부 컨펌 후 고객 컨펌을 진행합니다.
고객 컨펌까지 완료된 파일은 PSD 원본과 함께 [드롭박스 > 1.진행중 프로젝트 > 프로젝트명 > 디자인] 폴더에 공유합니다.

[디자인 디렉팅 관련 주의사항]
디자인이 완료된 후 텍스트와 위치 변경 등 디자인이 변경되는 부분이 있으면 스토리보드에 반드시 표시해 두어야 합니다. 디자인 파일보다도 스토리보드가 우선이 될 수 있도록 합니다.
그리고 변경된 사항은 메모장이나 다른 커뮤니케이션 소통을 통해 변경되었다고 개발자에게 전달해야지 원활한 진행이 가능해 집니다.

개발 세팅

개발 진행 일정이 되면 개발자 또는 퍼블리셔에게 개발 관련 세팅을 요청합니다.
워드프레스 및 테마 설치, 플러그인 설치 및 세팅, 메뉴 구성 및 페이지 세팅이 개발 관련 세팅에 포함됩니다.
각 홈페이지 개발 시 설치해야하는 필수 플로그인 입니다.

퍼블리싱 및 개발

고객 컨펌이 완료된 메뉴는 퍼블리싱과 개발을 요청합니다.
퍼블리싱은 크게 PC 퍼블리싱과 모바일 퍼블리싱으로 나뉘는데, PC 퍼블리싱이 완료 된 후 모바일에서 테스트 후 수정이 필요한 부분을 수정하는 것이 모바일 퍼블리싱입니다.

사내 테스트

개발이 완료되면 사내 테스트를 진행합니다. 사내 테스트는 아래 3가지로 구분하여 진행합니다.
[기능 테스트]
고객 요청대로 개발 되었는지, 기능적 오류는 없는지 확인하고, 오타나 오류는 없는지 확인합니다.
[디자인 디렉팅]
디자인은 제대로 적용되었는지, 전체적으로 디자이너에게 디렉팅을 요청합니다.
[환경 테스트]
가급적이면 아래 점검 대상 모두 이상이 없는지 확인합니다.

  • 브라우저 환경 : Internet Explorer. Chrome, Safari
  • 운영 체계 : Windows, Mac
  • 디스플레이 환경 : PC, 노트북, 태블릿, 모바일
    가끔 반응형을 하드코딩 하는 경우가 있기 때분에 태블릿이나 모바일은 http://troy.labs.daum.net/ 에 접속해서 반드시 확인하기 바랍니다.

[내부 컨펌]
기능 테스트, 디자인 디렉팅 및 수정이 끝나면 내부 컨펌을 진행합니다.

업무매뉴얼 작성

업무매뉴얼은 고객이 직접 유지보수를 하기 위한 매뉴얼을 의미합니다.
기능테스트를 진행하는 기간 동안 업무매뉴얼을 작성합니다.
고객에게 사용할 아이디와 비밀번호가 있는지 확인하거나, 호스팅에서 사용하는 아이디와 비번이 공유되어 있다면 해당 아이디와 비번으로 관리자화면에서 사용자를 생성한 후 업무매뉴얼을 작성합니다.
기본적인 업무 매뉴얼에는 아래 내용이 포함되어야 합니다.

  • 관리자화면 로그인 방법
  • 페이지 수정 및 관리 방법
  • 블로그나 포토폴리오 등 컨텐츠 업로드 방법

기본적인 내용 뿐만 아니라 지속적인 업데이트가 필요한 메뉴나 고객이 요청한 부분은 추가하여 제공합니다.
업무매뉴얼은 PPT을 사용하여 작성하고 완료되면 PDF로 변환하여 고객에게 제공합니다.
오픈 전에 고객이 업로드 해야 할 컨텐츠가 있다면 고객 테스트 시작 전에 업무매뉴얼을 제공합니다.

업무매뉴얼 샘플 파일 위치 : 드롭박스 > 1.진행중 프로젝트 > 1. 업무매뉴얼 > 기획 > [업무매뉴얼_샘플] 참고

고객 테스트

사내 테스트 및 수정이 끝나면 고객 테스트를 진행합니다. 수정 요청 사항이 발생하면 정리하여 각 작업자들에게 요청하고 확인합니다.
수정이 완료되면 고객에게 완료 되었음을 알립니다.

오픈

고객이 오픈을 요청하면 개발자에게 도메인 연결 및 오픈을 요청합니다.
홈페이지가 오픈 되면 정상적으로 완료 되었는지 확인합니다.

완료보고

고객에게 프로젝트가 완료되었음을 보고합니다.
완료보고서는 PPT를 사용하여 작성하고 완료되면 PDF로 변환하여 고객에게 제공합니다.

완료보고 샘플 파일 위치 : 드롭박스 > 1.진행중 프로젝트 > 1. 업무매뉴얼 > 기획 > [완료보고서_샘플] 참고