상류공정 - 기본설계

먼저 화면설계부터하면 비즈니스, 엔지니어간에 서로간에 커뮤니케이션이 쉬워진다.

화면설계

UX UI의 차이
    자판기를 예로들면
        - UX(화면설계의 목적)
            => 오른손잡이가 사용하기 쉽게하고 싶다
        - UI(UX를 실현하기 위한 수단)
            => 오른손잡이가 조작가능한 설계

테스크 중심 UI
    유저가 하고싶은것 중점으로 설계
        ex1)은행ATM 첫화면
            => 인출, 입금, 송금, 잔고조회 등
        ex2)부동산 검색
            => 역으로부터, 지도에서, 주소에서 등

오브젝트 중심 UI
    유저의 흥미중심으로 설계
        ex1) UberEats
            => 음식을 선택한 후에 주문, 장바구니 등 선택
        ex2) 메일
            => 메일을 연다음에 답장, 삭제 등 선택

잘못된UI의 예
    예를들어 메일 첫화면이
        메일확인, 메일답장, 메일삭제로 되있다면 NG

화면설계의 3-Step

    Step1 - 항목 리스트업
        - 등장하는 오브젝트 (물건, 정보)등 추출
        - 유저의 테스크(조작)을 추출
            예를들어 강좌사이트의 경우
                코스: 찾기, 카트에넣기, 구입하기
                영상: 보기, 완료하기

    Step2 - 뼈대 만들기
        - 오브젝트 중심 UI or 테스크 중심 UI 결정
        - 화면전이도 작성
            예) 로그인 -> 코스리스트 -> 코스상세 -> 카트 -> 결제화면 -> 구입한 코스리스트 -> 영상시청 페이지

    Step3 - 구체화
        - 추출한 테스크(조작)을 각화면에 할당
            코스리스트 화면: 찾기
            코스상세 화면: 카트에넣기
            카트 화면: 구입하기
            영상시청 화면: 보기, 완료하기

        - 정보(오브젝트)의 배치를 정해서 레이아웃 작성
            오브젝트: 코스리스트
                수강중인코스, 추천코스, 신착코스
                => 타이틀, 평가, 금액
            테스크: 코스검색창

기능설계

기능설계의 3-Step

    Step1 - 변동항목 리스트업
        - 매번 변하는 정보는 무엇인가?
        - 데이터취득에는 어떤 데이터베이스가 필요한가?
            예) 코스정보DB, 학습관리DB, 추천관리DB 등

    Step2 - 유저조작 리스트업
        - 유저조작에는 어떤 처리가 필요한가?
        - 데이터 보존에는 어떤 데이터베이스가 필요한가?

    Step3 - 기능설명 작성
        - 필요한 데이터베이스, 처리를 리스트화
            DB) 코스정보, 학습관리, 추천관리, 코스평가, 카트관리, 검색이력, 열람이력, 구입이력, 유저정보
            리스트화면: 코스리스트 표시, 코스검색, 상세화면 이동
            상세화면: 코스상세 표시, 평균평가계산, 카트에 추가
            카트화면: 카트내코스 표시, 합계금액계산, 결제페이지 이동
        - 화면전이와 데이터처리를 연결

데이터설계

마스터 테이블: 항목정보 데이터
트렌젝션 테이블: 축적되는 데이터
ER도: 테이블 관계도

데이터설계의 3-Step

    Step1 - 데이터구조의 명확화
        - 마스터, 트렌젝션 테이블 분리
        - 테이블의 구체적 내용 결정

    Step2 - 데이터간의 관계성 정의
        - 테이블 참조관계를 정리
        - 참조관계를 간단한 ER도로 표시

    Step3 - 전체를 가시화
        - 시스템 전체데이터, 처리의 흐름을 가시화
        => 화면설계 x 기능설계 x 데이터설계를 연결