jiho__1010 jiho__1010

Background-blend-mode normal | multiply | screen | overlay | darken | lighten | color-dodge | saturation | color | luminosity Porperty Description normal 배경색의 기본 값을 정의합니다. multiply 더 어두운 색으로 변경됩니다. screen 더 밝은 색으로 변경됩니다. overlay 원래 색상의 농도와 밝기를 변경합니다. darken 어두운 색으로 변경됩니다. lighten 밝은 색으로 변경됩니다. color-dodge 기본 색상을 밝게 합니다. saturation 채도의 변화로 색상이 변경됩니다. color 색을 통해 색상을 변경합니다. luminosity 밝기를/ 통해 색상을 ..

Background Property Sample Description background background: #000 url(background.gif) no-repeat top center 배경 속성 단축형 background-image background-image: url(이미지 경로) 배경 이미지 설정 background-repeat background-repeat: no-repeat 배경 반복 여부 설정 background-attachment background-attachment : fixed 배경 고정 여부 설정 background-color background-color: #fff 배경 속성 단축형 background-position background-position: top 배경 이미..

Border-Radius border01 border02 border03 border04 border05 border06 border07 border08 border09 border10 .border01 {border-radius: 0;} .border02 {border-radius: 5px;} .border03 {border-radius: 10px;} .border04 {border-radius: 15px;} .border05 {border-radius: 20px;} .border06 {border-radius: 25px;} .border07 {border-radius: 30px;} .border08 {border-radius: 35px;} .border09 {border-radius: 50px;} ...

Box-Shadow box-shadow : [h-shadow] [v-shadow] [blur] [spread] [color] [inset] / none; Property Description h-shadow 그림자의 수평(X)축 거리를 나타냅니다. v-shadow 그림자의 수직(Y)축 거리를 나타냅니다. blur 그림자의 흐림정도를 나타냅니다. spread 그림자의 거리를 나타냅니다. color 그림자의 색을 나타냅니다. inset 그림자의 효과를 내부로 나타냅니다. bow-shadow shadow01 shadow02 shadow03 shadow04 shadow05 shadow06 shadow07 shadow08 shadow09 shadow10 .shadow01 {box-shadow: 0px 0px 5p..

UI/UX 설계 계획시 고려사항 설계에 적용될 프로세스 설 계시 협업 상황 설계 문서에 대한 보고 및 공유 설계문서 상세함의 적절성 문서의 수명 : 프로젝트 중에 업데이트 되지 않는 문서는 죽은 문서이다. 각 문서 독자(수요자) 해당 설계 문서와 관련된 타 문서 참고 정보 설계문서 작성의 난이도(어느 정도의 노력을 필요로 하는가?) 설계 문서 작성 일정에 영향을 미치는 요소 다수의 디자이너와 작업하는가?

모바일 서비스 사용자 인터페이스 설계 지침 기본원칙은 스마트폰과 태블릿PC를 통한 서비스를 기획하고 설계하는데 반드시 준수해 야 할 기본사항들을 정의하고 있다. 공공기관 모바일 서비스의 발주자와 설계자는 다음의 기본원칙을 숙지하고 기본원칙에서 제시하는 필수사항과 권장사항, 제약사항을 고려하여 개 발한다. 1) 사용자 경험에 초점을 맞춘다. 2) 소수의 핵심기능에 집중한다. 3) 디바이스의 호환성, 확장성을 고려한다. 4) 정보소외계층의 접근성을 고려한다. 5) 웹표준을 준수하여 개발한다. 6) 일관성을 유지한다. 7) 이미지를 제한적으로 사용한다. 1. 사용자 경험에 초점을 맞춘다. 사용자가 서비스를 사용하는 목적과 상황을 이해한다. 사용자가 누구인가, 나이, 숙련도, 문화 등에 대해 충분한 이해가 바탕..

UI/UX 콘셉트 아이디어 도출하기 UI/UX 개발 과제의 목표 충족을 위하여 사용자 리서치 결과를 토대로 UI/UX 콘셉트 아이디어를 도출할 수 있다. 프로토타입 제작을 위하여 도출된 아이디어를 분석하고 UI/UX 개발(제품)에 적합한 아이디어를 선별할 수 있다. 패스트 프로토타입 제작을 위하여 선별된 아이디어를 문서화할 수 있다. 요구사항분석(requirement analysis) 요구사항(Requirement) 요구사항은 제품, 서비스 등의 개발의 결과물이 충족하여야 할 대상으로 아래와 같이 정의 된다. 어떤 문제를 해결하거나 특정의 목적을 위하여 사용자가 필요로 하는 조건이나 능력. 계약, 표준, 명세 또는 다른 형식으로 제시된 문서에 맞추어 시스템이나 시스템 구성 요소가 갖추어야 할 조건이나 능..

사용자 리서치 계획하기 Wizard of OZ 참가자들이 실제로 작동하는 시스템 프로토타입을 사용하고 있다고 믿도록 설정하고, 실제로는 연구자가 배후에서 시스템 역할을 대신하는 방법이다. 참가자를 프로토 타입 앞에 위치 시키고, 참가자가 볼 수 없는 곳에 시스템 역할 대행자가 될 연구자를 위치시킴 시스템 역할 대행자가 다양한 역할과 행동을 연기힘 유저가 취한 행동들을 기록함 기록된 결과를 분석하고 공유함 5 Whys 문제의 원인을 파악하기 위해 “왜(Why)?”라는 질문을 5번 반복하여 질문한다는 의미로 5 번이라는 숫자는 상징적 의미이다. 친화도법(Affinity Diagramming) 사용자리서치의 수행 결과로 방대한 양의 노트, 사진, 음성 기록, 영상 기록 등 자료가 사 용자로부터 수집되고 이로부..