본문 바로가기
Web/HTML5 & CSS

HTML5(8) - SB

by SeleniumBindingProtein 2022. 1. 28.
728x90
반응형

1. 벤치마킹
    1) 사례 분석을 통해 기존에 발견하지 못했던 새로운 포지셔닝을 도출하기 위해 실시

2. 정보구조 설계
    1) 메인 화면
        - 검색
        - 서비스
        - 설정
        ....
    2) 계층 구조
        - 레비블링
        - 내비게이션

3.화면 레이아웃 구성            
    1) 해더 
        - 페이지 상단
        - 로고, 홈, 회원가입, 로그인, 마이페이지, 장바구니, 검색 등 메뉴 위치
    2) LNB
        - GNB 하위 계층의 서브 메뉴 영역
    3) 콘텐츠 영역
    4) 푸터
        - 페이지 최하단의 위치
        - 회사명, 전화번호, 사업자 등록번호, 이용약관...   

4. SB (Story Board)  
    1) 화면 설계서 
    2) 화면 구성, 내용, 흐름, 동작 방식, 기능을 설계하고 정의하는 것
    3) 각 화면 상세 설계를 통해 가이드라인 역할 수행
    4) 구체적인 디자인 작업 이전 프로토타이핑 작업.
    5) 프로젝트에 참여하는 모든 구성원들과의 효과적인 커뮤니케이션을 하기 위해서 필요함.       

5. SB의 구성
    1) 서비스 흐름도
        - 회원가입, 로그인, 결제와 같은 각각의 메뉴와 상세 프로세스를 파악할수 있는
          서비스 흐룸도가 표시.
    2) 화면 설계     

728x90
반응형

'Web > HTML5 & CSS' 카테고리의 다른 글

HTML5(7) - BS  (0) 2022.01.28
HTML5(6) - CSS 기본문법2  (0) 2022.01.28
HTML5(5) - CSS 기본문법  (0) 2022.01.28
HTML5(4) - 문서구조  (0) 2022.01.28
HTML5(3) - review  (0) 2022.01.28

댓글