uiux

단위 테스트 수행 작성된 체크리스트에 따라서 단위 테스트를 수행할 수 있다 단위 테스트 수행한 결과의 오류 여부를 확인하여 반영할 수 있다 단위 테스트에 대한 이해 1. 단위 테스트의 개념 UI 기반의 단위 테스트는 사전에 정의된 테스트 시나리오별로 테스트를 수행한다. 테스트 를 통해 시스템의 안정성, 견고성, 사용성을 검증할 수 있으며, 사용자에게 편의성을 제공 할 수 있다. 2. 단위 테스트의 특징 단위 테스트의 특징 특징 설명 시나리오 기반 테스트임. UI 기능의 액티비티별 시나리오 작성 및 테스트 테스트 케이스를 생성함 테스트 식별자, 항목, 기법 기반으로 생성 다양한 테스트 기법이 존재함 명세 기반 테스트, 베타 테스트 기법, Record&Replay 테스트 케이스 설계 기법 UI 기반의 단위 ..

UI 제작 UI 화면 제어기능을 어떤 방법으로 할 것인지 선택할 수 있다 자가 검증을 위하여 단위별 상세 체크리스트를 작성할 수 있다 UI 구현 표준에 따라서 GUI 디자인 가이드를 기반으로 UI를 제작할 수 있다 UI 개발환경 수립 1. UI 디자인 및 퍼블리싱 환경 수립 UI 제작을 위하여 시스템의 목표 및 범위에 따라 그래픽 저작도구 및 퍼블리싱 도구를 PC에 설치하여 이미지로 만들고, HTML 및 CSS로 웹 문서화하는 퍼블리싱을 수행한다. 그래픽 및 퍼블리싱 도구 (예시) 구분 저작도구 설명 그래픽 저작도구 PPP - 미국의 A사가 발표한 저작도구 - 비트맵을 기반으로 다양한 사진과 이미지 처리 III - 미국의 A사가 발표한 저작도구 - 벡터를 기반으로 아이콘스케치 퍼블리싱 도구 아톰 텍스트 ..

저작도구 이용하여 프로토타입 UI 제작 • 선정된 저작도구를 이용하여 프로토타입 UI를 제작할 수 있다. 프로토타입(Prototype)의 개요 1. 프로토타입 개념 사용자의 요구사항을 충분히 분석할 목적으로 시스템의 중요 일부분을 우선 구현한 후 반 복하는 개발 모델을 프로토타입이라고 한다. 2. 프로토타입 특징 프로토타입은 사전에 UI를 시험제작하여서 이해관계자 간의 원활한 의사소통을 수행하는 개발 모델이다. UI를 통해서 프로토타입을 개발한 후에는 이해관계자 간에 평가 및 수정 과정을 반복하면서 요구사항을 검토한다. 프로토타입 특징 특징 설명 UI 시험제작 - UI를 시험제작하여서 사용자의 요구사항을 도출 - 사용자 요구사항이 불명확할 경우 사용 원활한 의사소통 - 개발자와 사용자 간 원활한 의사소통..

UI 저작도구 선정 UI 구현 표준 검토 결과를 바탕으로 저작도구를 선정할 수 있다. UI 구현 표준 검토 결과 파악 1. 사이트의 특성을 고려한 UI의 요소와 패턴으로 정의되어 있는가 사이트의 특성을 고려한 UI의 요소와 패턴으로 UI가 정의되어 있는지 파악하고, 통일되고 일관되며 재사용이 가능하도록 UI의 표준이 작성되어 있는지 파악한다. 2. 웹 호환성을 위해서 다양한 브라우저에서 실행되는가 HTML5 기반의 웹 표준을 준수하여 다양한 브라우저(예: 인터넷익스플로러, 크롬)에서 실 행되고, 다양한 형태(예: 네이티브 앱, 하이브리드 웹, web, 웹 앱)로 실행되는지 파악한다. 3. 장애를 가진 사람과 장애를 갖지 않은 사람 모두가 웹사이트를 이용할 수 있게 웹 접근 성을 준수하는가 대체 텍스트, ..

UI 저작도구 파악 개발환경에 적합한 저작도구를 파악할 수 있다. UI 개발환경 파악 1. WEB 개발환경(JSP 기준) 파악 WEB 애플리케이션 개발을 위해서 구축해야 하는 개발환경을 파악한다. 보통 자바 실행을 위한 JDK(Java Development Kit), 자바와 JSP(Java Server Page) 통합 개발을 위한 Eclipse (자바 개발 프로그램), JSP로 구축된 웹사이트 파일을 실행시켜 주는 엔진 역할의 톰캣 (Tomcat)을 개발 환경에 설치한다. 2. App 개발환경 파악 App이 실행될 운영체제는 대체로 디바이스에 따른 안드로이드와 iOS로 구분된다. 안드로 이드는 구글에 의해 개발되고 배포되는 운영체제이며, iOS는 애플의 스마트기기에 내장되 어 있는 운영체제이다. 스마트기..

UI 구현 표준 수립실제 페이지 제작을 위하여 아이콘, 레이아웃, 화면 개발 환경에 적합한 표준을 검 토할 수 있다.UI 구현 표준을 이해관계자와 검토하여 최종 표준안에 반영할 수 있다.UI 구현 표준 수립1. 웹 표준 및 웹 호환성 고려한 표준 수립웹 호환성이란 사용자 단말기의 하드웨어 및 소프트웨어 환경이 다른 경우에 동등한 서비 스를 제공받을 수 있도록 구현해야 하는 것으로 다양한 웹브라우저에서 동등한 서비스를 제공받을 수 있도록 해야 한다.웹 호환성 확보를 위해서는 웹 페이지마다 표준 문법을 준수하여 구현해야 한다. 문법 선언웹 페이지 문법선언하고, 문법을 올바른 방식으로 구현UTF-8 사용웹페이지 문자를 부호화 하는 방식을 UTF-8로 사용하는 것으로 원칙DOM표준 및 ECMA-262 표준웹페이..

UI 표준 관련 기준 파악 고객 요구사항, 접근성 기준, 플랫폼에 대한 UI표준 관련 기준을 파악할 수 있다. UI 구현 표준의 정의 UI 구현 표준은 사용자의 사용성 향상과 개발자의 개발 효율성을 높이기 위하여 프로젝트 초기에 정의한다. 화면 간에 공통으로 구성되는 화면구성(예: 내비게이션, 고정영역, 가변 영역) 및 화면요소(예: 버튼, 폰트 등의 크기 및 색상)에 대하여 최소한으로 정의해 두는 공통 규격이다. UI 구현 표준의 구성 요소 1. UX 원칙 시스템 및 제품의 UX는 사용자 제어가 가능하고, 사용자와 편리한 상호작용이 가능하며, 사용자의 시행착오를 최소화할 수 있는 원활한 사용성을 제공하고, 일관성 높은 인터페이 스를 제공 시 직관적이고 예측 가능한 기능 및 서비스 제공이 가능해야 한다...

UI 검토 의견서 작성 UI 구현 표준 수립을 위하여 UI 검토 의견서를 작성할 수 있다. 검토 대상 UI에 대한 이해 1. 검토 대상 UI의 서비스 목적 파악 목표 서비스의 사용 목적을 이해하기 위하여 타깃 사용자층(예: 연령, 성별)과 서비스 용 도(예: 전자상거래사이트, 검색포털)를 파악함으로써 UI의 검토 기준을 적절하게 수립한다. 2. UI의 주요 검토 대상에 대한 이해 레이아웃 한정된 UI 공간 내에서 각종 UI 리소스들(예: 버튼, 시스템 바, 텍스트 등)을 일관성과 가시성을 유지하면서 효율적으로 배치하는 화면 구조를 레이아웃이라고 한다. UI는 시스템을 시각적으로 바라봤을 때 좌 상단, 우 하단 부분을 보면서 전체적인 크 기를 인식한다. 그 다음으로 여백, 폰트, 색상, 위치, 배열 등을 ..

UI 디자인 가이드 이해 UI 제작을 위하여 GUI 디자인 가이드를 이해하고 이를 기반으로 구현 가능성 여부를 검토할 수 있다. 구현 환경에 따라서 구체적인 UI 프로세스의 이해와 설계 변경 여부를 파악할 수 있다 UI 디자인 가이드에 대한 이해 1. UI 디자인 가이드의 필요성 UI 디자인 시, UI에 적용되는 프로젝트 및 서비스를 정확하게 이해해야 사용자의 요구에 부합하고 만족도 높은 결과물을 만들어 낼 수 있다. 이때, 디자이너가 설계한 이미지와 구 성을 개발자가 이해할 수 있는 형태의 문서로 개발자에게 전달해야 일관성 있고 사용자 만족도가 높은 최종 결과물이 나올 수 있으므로, 상세하고 일관된 UI 디자인 가이드가 필 요하다. 2. UI 디자인 가이드의 개요 정의 UI 디자인 가이드란, 디자이너가..

UI 디자인이 성공하기 위한 모델링 GUI 콘셉트 기획서에 따라서 화면의 인터랙션 요소를 디자인할 수 있다. UI 구현을 위하여 GUI 디자인 가이드 문서를 작성할 수 있다 UI 디자인이 성공하기 위한 모델링 UX에서 리서치 결과를 토대로 모델링을 한다는 의미는 결국 사용자 저변에 깔려 있는 마 음속 모형을 드러내 보인다는 얘기와 일맥상통한다. 사용자가 자신들의 마음속에 가지고 있는 대사에 대한 모형을‘멘탈모델’이라고 한다. 다음의 3가지 모델로 구분된다 구조모형 대상의 구체적인 세부요소를 머릿속에서 묘사하는 모형 주로 정보의 분류나 구조적인 형태로 표현된다. 사용자유형별로 구조모형에 큰 차이가 존재하기 때문에 구조모형은 Persona를 통해서 표현될 수 있다. 기능모형 사람들이 제품/서비스를 어떻게 이..