[내일배움캠프TIL] 본캠프44일차 - 데이터 드리븐 기획 실전

데이터 드리븐 기획 실전

1. 들어가며
2. 데이터 드리븐 기획 실전
3. 마치며

---

📝 서론

1. 들어가며

내일부터는 자율 과제를 해볼 예정이라, 오늘은 실전 강의에서 배운 내용을 바탕으로 간단한 기획안을 직접 만들어보며 마무리한다. 👨🏻‍💻

---

🔍 본론

2. 데이터 드리븐 기획 실전 

 

🧾 로그인 및 회원가입 기획안

 

[화면 1] 로그인 화면 기능 명세

항목	기능 정의 및 설명
아이디 입력 필드	- 플레이스홀더: 아이디- - 입력 시 placeholder 사라짐, 커서 활성화 - 최근 로그인 이력이 있다면 자동완성 기능 제공 가능
비밀번호 입력 필드	- placeholder: 비밀번호 - 입력 시 ● 또는 * 마스킹 처리 - 비밀번호 오류 시 에러 메시지 표시 (비밀번호를 확인해주세요)
자동 로그인 체크박스	- 클릭 시 ✅ / ⬜️ 상태 토글 - 체크 시 로컬에 로그인 토큰 저장 - 보안 우려로 기본값은 비활성화
로그인 버튼	- 아이디/비밀번호 입력 완료 시 활성화 - 유효성 실패 시 에러 메시지 (로그인 실패) - 성공 시: 메인 페이지로 이동
하단 링크 3종	- 아이디 찾기, 비밀번호 찾기, 회원가입 각 기능 화면으로 이동 - 각 링크 클릭 시 새 화면으로 전환되며 백버튼 포함
SNS 로그인 버튼	- 구글, 애플, 페이스북, 네이버, 카카오 순으로 정렬 - 각 버튼은 브랜드 가이드 컬러 및 로고 사용 - 클릭 시 외부 OAuth 인증창으로 이동 후 리다이렉트
예외 처리	- 로그인 실패 시 아이디 또는 비밀번호를 확인해주세요. 문구 상단 노출 - 서버 오류 시 현재 로그인할 수 없습니다. 잠시 후 다시 시도해주세요. 안내

 

[화면 2] 회원가입 화면 기능 명세

항목	기능 정의 및 설명
아이디 입력	- placeholder: 아이디 (필수) - 중복 검사 자동 수행 또는 “중복 확인” 버튼 제공 가능 - 유효성 조건: 영문/숫자 조합 5~20자
비밀번호 입력	- placeholder: 비밀번호 (필수)- 보이기/숨기기 토글 버튼 제공 (보기) - 유효성 조건: 최소 8자, 영문/숫자/특수문자 포함
이름 입력	- placeholder: 이름 (필수) - 실명 여부는 검증하지 않음, UI상 필수값 체크만
휴대폰 번호 입력	- 국가코드 선택 드롭다운 (기본값: 대한민국 +82) - 입력 후 인증 버튼 클릭 시 인증번호 발송 - 인증 완료 시 “인증되었습니다” 표시
이메일 주소 입력	- placeholder: 이메일주소 (필수) - 아이디/비밀번호 찾기에 활용됨 명시 - 이메일 형식 유효성 검사 적용
약관 동의 체크박스	- 3개 항목: 제3자 제공 동의(선택), 마케팅 수신(선택), 만 14세 이상(필수) - 선택 항목은 미체크 가능, 필수 항목 미체크 시 버튼 비활성화
동의하고 가입하기 버튼	- 모든 필수 항목 충족 시 활성화 - 클릭 시 가입 요청 서버로 전송 - 실패 시 에러 메시지 안내 (중복 아이디, 잘못된 전화번호 등)
예외 처리	- 각 입력 항목 아래에 실시간 에러 메시지 표시 - 인증 실패 시 “인증번호가 틀렸습니다” 메시지 - 누락 항목 있을 경우 "필수 항목을 모두 입력해주세요" 안내

---

🎯 결론

3. 마치며

오늘은 앱 화면을 기준으로 로그인 및 회원가입 프로세스를 분석하고 기능 명세서를 작성해보았다. 단순히 UI를 나열하는 것이 아니라, 유효성 검증, 예외 처리, 사용자 흐름까지 고려한 구조화된 기획의 중요성을 체감할 수 있었다. 🚀