프로젝트 쇼핑몰 기획

1. 구현할 기능

 

2. 담당 페이지

• 최00-백엔드
• 박00-장바구니 페이지 구현
• 김00-주문페이지, 관리자 페이지 구현
• 정00-상품 상제 페이지 구현
• 신혜지-메인페이지, 카테고리, 마이페이지 구현

 

3. 코드 컨벤션

• 공통 : 상대 경로를 사용한다.
• import * as Colors from '../styles/colors';

 

• case Description example

kebob-case	소문자만 사용. 띄어쓰기 대신 '-' 사용	what-do-you-want
lowerCamelCase	소문자 사용. 띄어쓰기 대신 대문자 사용	whatDoYouWant
PascalCase	첫문자 대문자 사용. 띄어쓰기 대신 대문자 사용	WhatDoYouWant
snake_case	소문자만 사용. 띄어쓰기 대신 '_' 사용	what_do_you_want
UPPER_CASE	대문자만 사용. 띄어쓰기 대신 '_' 사용	WHAT_DO_YOU_WANT

• 변수명, 함수명 : 카멜케이스
• 파일명, 폴저명 : 케밥케이스
• CSS선택자 : 케밥케이스 

 

4. 커밋 컨벤션

*태그 : 제목의 형태이며, :뒤에만 space가 있음에 유의한다.

• feat : 새로운 기능 추가
• fix : 버그 수정
• docs : 문서 수정
• style : 코드 포맷팅, 세미콜론 누락, 코드 변경이 없는 경우
• refactor : 코드 리펙토링
• test : 테스트 코드, 리펙토링 테스트 코드 추가
• chore : 빌드 업무 수정, 패키지 매니저 수정

5. CSS 기재 순서

• Layout Properties (position, float, clear, display)
• Box Model Properties (width, height, margin, padding)
• Visual Properties (color, background, border, box-shadow)
• Typography Properties (font-size, font-family, text-align, text-transform)
• Misc Properties (cursor, overflow, z-index)

6. 페르소나(상세)

페르소나란?
⚡️ 특정 사용자 범주를 대표하는 가상의 인물 ‐ 비슷한 배경, 목적, 의도, 행동방식을 공유하는 복수의 사람들을 합쳐 놓은 것
- 특정 사람을 위해 디자인한다는 느낌 (생각을 축소시켜서 고민을 수월하게 함)자연스러운 사용자 중심의 설계 - - -  “Persona라면 어떻게 사용할까?”팀 내부 커뮤니케이션 도구로 활용 가능
‐ 디자인 과정에서 가이드라인과 평가 지표로 활용 가능

⚡️ 사용자 범주가 여러 개일 경우 복수의 Persona 활용이 가능하다.

⚡️ 실존하는 인물인 것처럼 구체적인 사용자 특성을 구성 (수집된 데이터에 기반)

• 배경(이름, 나이, 직업, 지역 등 인구 통계학적 정보, 기타 관련 배경적경험)
  • 20대 중반 ~ 30대 초반의 여성
• 제품 사용 경험 수준(숙련도)
  • 배달 어플 및 오프라인 매장 이용 경험 있음
• 동기
  • 식단 관리
  • 건강한 라이프 스타일 추구
• 슬로건
• 역할 (현재 하고있는 직업등)
• 태도(성격, 세대, 라이프 스타일)
• 제품 사용 환경/맥락
• 목표