
CSS 단위 1. px: px단위는 화소 1개의 크기를 의미한다. 이 px의 크기는 디바이스에 따라 제각각이기 때문에 명확하지가 않습니다. 2. %: % 는 백분율 단위의 상대 단위이며 요소의 지정된 사이즈(상속이나 기본값)에 상대적 사이즈를 설정합니다. 3. em: em은 배수 단위로 상대 단위이며 요소의 지정된 사이즈(상속이나 기본값)에 상대적 사이즈를 설정한다. 지정된 사이즈에 em의 값만큼 곱해서 계산합니다. 4. rem: rem에서 r은 root(최상위)를 뜻한다. 최상위의 태그에서 지정한 사이즈에 rem의 값만큼 곱해서 계산한다. 5. vh: vh는 Viewport height의 축약어이며, Viewport는 웹사이트에서 보이는 영역을 뜻합니다. 속성 값이 1vh 일 경우 뷰포트 넓이의 1%만..

닫는 태그가 없는 태그 일반적인 태그는 처럼 시작하면 처럼 닫아 주어야 합니다. 하지만 일부 태그는 닫지 않는 경우가 있는데 이를 닫는 태그가 없는 태그라고 합니다. 닫는 태그가 없는 태그들 등의 태그는 닫는 태그가 없는데, 그 이유는 태그 내부에 넣을 값이 없기 때문입니다. 기본적으로 HTML은 코드 가독성 향상을 위해 줄 바꿈을 해도 줄 바꿈이 화면에 출력되지 않습니다. 줄 바꿈을 하려면 직접 줄 바꿈을 한다는 명령을 적어 주어야 하며, HTML에서는 를 통하여 줄 바꿈을 합니다. 요소에 이미지를 넣습니다. src특성과 함께 사용해야 하며, 포함하고자하는 이미지로의 경로를 지정합니다. 하이퍼텍스트(Hyper text) 생성 언어 HTML 문서의 맨 위쪽에 위치하는 태그(tag)로 HEAD 태그 사이 ..

window.alert() : 알림 창 표시하기 호출하면 알림 창에 미리 입력된 텍스트가 출력됩니다. 확인 버튼만 있으며 alert는 리턴하는 값이 없어 알림용으로 사용됩니다. window.confirm() : 확인창 표시하기 호출하면 알림 창에 미리 입력된 텍스트가 출력됩니다. 확인 버튼과 취소 버튼으로 구분되어 있으며, 각 버튼의 리턴 값이 존재합니다. 확인 버튼을 클릭하면 리턴 값으로 true 값을 돌려주고 취소 버튼을 누르면 리턴 값으로 false 값을 돌려줍니다. window.prompt() : 입력창 표시하기 호출하면 알림창에 미리 입력된 텍스트가 출력됩니다. 알림 창에 텍스트를 입력받을 수 있는 박스가 생성되어 사용자들에게 데이터를 입력받을 수 있습니다. 텍스트를 입력 후 확인 버튼을 클릭하..

프로토타입 (Prototype) 프로토타입은 상품/서비스가 출시되기 전 만들어진 원형(archetype)을 의미한다. 프로토타이핑(prototyping)은 사용자의 요구사항, 사용자리서치를 통해서 도출된 니즈, 아이디어 등의 개념(Concept)을 담은 모형을 만들어 이후 사용자와 상품/서비스가 제공하는 기능의 추가, 변경 및 삭제 등을 요구사항에 대해 소통하는 도구, 개발이 진행되는 동안 개발 참여자간에 개념을 공유하는 도구를 만드는 설계과정이다. 요구사항 등을 반영한 개념 모델로 프로토타입을 1회 제작한 후 검증이 끝나면 이후 개발 업무를 진행하는 경우도 있으나 일반적으로 프로토타입을 활용하는 경우 지속적으로 프로토타입을 재구축하며 개선시켜 나가는 반복적인 접근법-지속적 프로토타이핑을 적용한다. 프로..

UI/UX 콘셉트 아이디어 도출하기 요구사항분석(requirement analysis) 요구사항 분석은 제품 또는 서비스의 사용자를 포함한 이해관계자들의 요구사항을 파악하고 이를 고려하여 제품 또는 서비스가 이와 부합하도록 하기 위한 조건을 결정하는 과정이 주가 되는 업무로 이후 개발 생명주기(SDLC, Software Development Life-Cycle)의 시발점이 되며, 아래와 같이 정의 된다. 시스템이나 소프트웨어 요구사항을 정의하기 위해 사용자의 요구 사항을 조사하고 확인하는 과정. 시스템이나 소프트웨어 요구사항의 검증과정. 요구사항의 도출 : 요구사항이 무엇인지를 파악하기 위해 고객 및 사용자 등 이해관계자와 인터뷰 등을 수행하는 작업 요구사항의 분석 : 도출된 요구사항이 명확한지를 판단하..