본문 바로가기

전체 글62

변형툴, 패스파인더 2020. 5. 18.
JS개념, class선택자, id선택자 2020. 5. 15.
카카오 뱅크 상단메뉴 구현 HTML 하나의 .top-bar안에 .logo와 .menu-box-1 .go-submit-document를 넣어준다. .logo에 이미지 주소를 넣어주고 .go-submit-document와 .menu-box-1에는 각각의 메뉴아이템을 넣어준다. .con으로 감싸주는 이유는 넓이를 같게 놓아주기 위함이고 .row는 .cell에 float을 넣어주어 .row라는 부모함수를 만들어 줘야하기 때문이다. .cell는 왼쪽정렬, .cell-right는 오른쪽 정렬이다. CSS 1. body, ul, li, a 노말라이징과 폰트를 적용시켜준다. 2. 라이브러리로 이 페이지의 모든 것을 정리해준다. 3. 총 넓이를 지정해준다. 4. 로고의 위치와 메뉴아이템의 마지막을 뺀 나머지의 위치를 지정해준다. 5. 메뉴아이템의.. 2020. 5. 14.
와이어 프렘 스토리보드 / HTTP 와이어 프레임과 스토리보드란? 와이어 프레임 (wireframe) - 설계도- 웹, 앱 플로젝트를 진행할때 필요한 설계도 - 디자인 들어가기전 선(Wire)을 이용해 윤곽(Frame)을 잡는 것/ 정리하여 한눈에 표현해주는 툴 - 의사소통을 위해 관계자들과 레이아웃을 협의 하거나 서비스의 간략한 흐름을 공유 하기 위해 사용하며 UL,UX 설계에 집중되어있다. - 툴 : 손그림 , 파워포인트, 키노트, 스테치 , 일러스트, 포토샵 등 스토리보드(storyboard) - 개발의 설계도-구조도/ 작업의 지침서 - 구성의 전체적인 흐름과 더불어 텍스트와 모든 구성들이 어떻게 조합되어 보여지게 될것인지의 세부적이고 구체적인 사항들이 모두 담기게 됩니다. - 스토리보드는 정확하고 상세하여야 하며, 제대로 된 스토리.. 2020. 5. 14.