정보구조 설계하기 학습목표 - 결정된 콘텐츠와 기능에 따라서 정보 구조를 설계할 수 있다. - 사용자가 사용하는 언어를 고려하여 메뉴 및 UI 구성요소에 대하여 레이블링 (Labeling) 할 수 있다. - 사용자의 접근성, 사용성을 위하여 네비게이션(Navigation) 구조를 설계할 수 있다. 1. 정보구조 설계 (1) 정보구조 설계에서의 모호성 분류 시스템은 언어 기반 위에서 성립되는 것이며, 언어는 하나의 단어로 여러 가지 뜻을 나타내는 경우가 많다.‘배’라는 단어도 먹는 배와 타는 배 그리고 사람의 배와 같이 다양한 뜻이 있다. 이와 같이 단어의 모호함은 정보를 분류하는 시스템을 구축하는 데 불안정한 요소로 작용한다. 홈페이지에서 우리는 정보의 그룹을 설명할 때 대부분의 경우 단어를 사용해서 표..
이해의 용이성 (2) 학습목표 1. 콘텐츠 선형화를 이해하고 콘텐츠를 제공할 수 있습니다. 2. 표의 구성 항목을 이해하고 콘텐츠를 제공할 수 있습니다. 3. 레이블 제공 항목을 이해하고 콘텐츠를 제공할 수 있습니다. 4. 오류 정정 항목을 이해하고 콘텐츠를 제공할 수 있습니다. 웹 접근성 검사항목 - 이해의 용이성 콘텐츠의 선형 구조: 콘텐츠는 논리적인 순서로 제공해야 한다. 표의 구성: 표는 이해하기 쉽게 구성해야 한다. 레이블 제공: 입력 서식에 대응하는 레이블을 제공해야 한다. 오류 정정: 입력 오류를 정정할 수 있는 방법을 제공해야 한다. 콘텐츠 선형 구조 1. 콘텐츠 선형 구조의 개념 웹 문서를 제작할 때 뼈대가 되는 HTML 마크업 언어로 먼저 논리적인 순서에 맞게 개발하고 이에 CSS를 적..
사용자 리서치 수행 학습목표 - 리서치 실행계획의 방법론에 따라서 리서치를 수행할 수 있다. 사용자 리서치 수행 기법 목표한 사용자 리서치 결과를 도출하기 위해 여러 기법이 혼용되기도 하며, 사용자 리서치를 수행한 조직과 제품/서비스의 특성에 따라 고유의 기법을 개발하고 사용하기도 한다. 경우에 따라서는 사용자 리서치의 진행에 따라 계획한 기법 외에 보다 적합할 것으로 예상되는 기법을 적용하면서 계획을 수정해 진행하거나, 이를 반영하여 반복/점진적 프로세스에 따라 추가적인 사용자 리서치를 수행하기도 한다. 1. 개별 인터뷰 사용자와의 1:1 대화를 통해 조사를 수행하는 방법 직접대면 또는 유선상의 대화 사용자의 업무, 일상생활 등 맥락과 경험, 태도, 희망사항 등의 정보를 얻을 수 있다. 인터뷰 방법 (..
사용자 리서치 계획수립 학습목표 - 리서치의 목적과 목표 고객, 내용, 범위, 방법, 일정 등을 포함한 리서치 실행계획을 수립할 수 있다. - 조사 목적과 얻고자 하는 자료의 특성 및 가용시간과 예산에 따라 자체 수행 또는 아웃소싱을 선정할 수 있다. 사용자 리서치 사용자 리서치는 사용자와의 직/간접적인 접촉을 통해 사용자의 식별을 포함하여 사용자에 대한 정보, 사용자가 갖는 정보를 조사하는 활동이다. (Tulathimutte, Tony and Nate Bolt) 1. 마케팅 리서치 통계분석이나 설문조사를 통하여 현상적인 정보를 조사한다. 사람들의 의견, 선호도를 알 수 있다. 마케팅 리서치의 주안점 브랜드와 서비스/제품에 대한 사용자들 반응 조사 서비스/제품의 사용자 유형별 선호도 파악 새로운 서비스/..
이해의 용이성 (1) 학습목표 1. 기본 언어 표시를 이해하고 콘텐츠를 제공할 수 있습니다. 2. 사용자 요구에 따른 실행 항목을 이해하고 콘텐츠를 제공할 수 있습니다. 이해의 용이성(Understandable) 콘텐츠는 이해할 수 있어야 한다. 웹 접근성 검사항목 - 이해의 용이성 기본 언어 표시: 주로 사용하는 언어를 명시해야 한다. 사용자 요구에 따른 실행: 사용자가 의도하지 않은 기능 (새 창, 초점 변화 등)은 실행되지 않아야 한다. 기본 언어 표시 1. 기본 언어 표시의 개념 기본언어(웹 사이트에서 주로 사용하는 언어)를 명시해야 한다. 기본 언어를 명시할 경우 화면 낭독기와 음성 지원 소프트웨어가 해당 언어의 정확한 발음으로 콘텐츠 이해를 도울 수 있다. 2. 기본 언어 표시의 필요성/목적 ..
운용의 용이성 (1) 학습목표 1. 깜빡임과 번쩍임 사용제한을 이용하고 콘텐츠를 제공할 수 있다. 2. 반복영역 건너뛰기 항목을 이해하고 콘텐츠를 제공할 수 있다. 3. 제목 제공 항목을 이해하고 콘텐츠를 제공할 수 있다. 4. 적절한 링크 테그트 항목을 이해하고 콘텐츠를 제공할 수 있다. 웹 접근성 검사항목 - 운용의 용이성 깜빡임과 번쩍임 사용제한: 초당 3~50회 주기로 깜빡이거나 번쩍이는 콘텐츠를 제공하지 않아야 한다. 반복 영역 건너뛰기 제공: 콘텐츠의 반복되는 영역은 건너뛸 수 있어야 한다. 제목 제공: 페이지, 프레임, 콘텐츠 블록에는 적절한 제목을 제공해야 한다. 적절한 링크 텍스트 제공: 링크 텍스트는 용도나 목적을 이해할 수 있도록 제공해야 한다. 깜빡임과 번쩍임 사용 제한 1.깜빡임과..
운용의 용이성 (1) 학습목표 1. 키보드 사용 보장에 대해 이해할 수 있다. 2. 초점 이동과 조작 가능에 대해 설명할 수 있다. 3. 응답시간 조절에 대해 설명할 수 있다. 4. 정지 기능에 대해 이해할 수 있다. 운용의 용이성(Operable) 어떤 사용자나 환경에서도 키보드 만으로도 자유롭게 웹 사이트에서 제공하는 모든 콘텐츠의 기능을 이용할 수 있게 해야 한다. 웹 접근성 검사항목 - 운용의 용이성 키보드 사용 보장: 모든 기능은 키보드 만으로도 사용할 수 있어야 한다. 초점이동: 키보드에 의한 초점이 논리적으로 이동해야 하며 시각적으로 구별할 수 있어야 한다. 조작 가능: 사용자 입력 및 컨트롤을 조작가능하도록 제공되어야 한다. 응답시간 조절: 시간제한이 있는 콘텐츠는 응답시간을 조절할 수 있..
인식의 용이성 (2) 학습목표 1. 인식의 용이성을 높이기 위한 검사항목 중 색에 무관한 콘텐츠 인식을 이해하고 콘텐츠에 제공할 수 있습니다. 2. 명확한 지시사항 항목을 이해하고 콘텐츠를 제공할 수 있습니다. 3. 텍스트 콘텐츠의 명도 대비 항목을 이해하고 콘텐츠를 제공할 수 있습니다. 4. 배경음 사용 금지 항목을 이해하고 콘텐츠를 제공할 수 있습니다. 웹 접근성 검사 항목 - 인식의 용이성 색에 무관한 콘텐츠 인식: 콘텐츠를 색에 관계없이 인식될 수 있다. 명확한 지시사항 제공: 지시사항은 모양, 크기, 위치, 방향, 색, 소리 등에 관계없이 인식될 수 있어야 한다. 콘텐츠 명도 대비: 텍스트 콘텐츠와 배경 간의 명도 대비는 4.5 : 1 이상 이여야 한다. 자동 재생 금지: 자동으로 재생되는 배경..
인식의 용이성 (1) 학습목표 1. 대체텍스트와 멀티미디어 대체수단의 개념을 이해할 수 있다. 2. 대체텍스트와 멀티미디어 대체수단의 취지와 내용을 설명할 수 있다. 3. 대체테스트와 멀티미디어의 대체수단 제공방법을 설명할 수 있다. 인식의 용이성(Perceivable) 모든 콘텐츠는 사용자가 인식할 수 있어야 한다. 웹 접근성 검사 항목 - 인식의 용이성 적절한 대체 텍스트 제공: 텍스트가 아닌 콘텐츠는 그 의미나 용도를 인식할 수 있도록 대체 텍스트를 제공해야 한다. 자막 제공: 멀티미디어 콘텐츠에는 자막, 대본 또는 수화를 제공해야 한다. 대체텍스트 1. 대체텍스트의 개념 - 텍스트가 아닌 콘텐츠들 즉, 이미지, 이모티콘 문자, 영상, 음성 콘텐츠 등에 대하여 이를 텍스트 정보로 대체해주는 것 - ..
장애인의 웹 사용과 장애인차별금지법 학습목표 1. 장애인의 인터넷 이용환경을 이해할 수 있다. 2. 장애인차별금지법에 대해 이해할 수 있다. 3. 웹 접근성 의무적용 시기, 대상 및 진정사례에 대해 알 수 있다. 무지의 베일 특정한 정책안의 선택을 둘러싸고 관련 이해당사자들이 어떠한 대안이 자신에게 유리하고 불리한지 모르는 상황 장애인과 인터넷 이용환경 우리 나라는 정보통신의 발달로 인터넷 뱅킹, 전자상거래 등이 활발하게 이용되는 등 인터넷은 우리 삶의 중요한 수단이 되었고 모바일 시대를 맞아 더욱 중요한 요소가 되었다. 따라서 장애인 사용자에게 웹 접근성을 높여 이용 가능하게 하는 것이 더욱 중요해졌다. [참고] 네이버 '널리' - 온라인 웹 접근성 체험(온라인 장애 체험) GO - 모바일 장애 체험 ..
작업방법 및 수행계획 수립 학습목표 - UI/UX 개발에 적용할 프로세스를 수립하고 작업 수행에 필요한 지침, 방법 등을 작성 할 수 있다. - 수행 작업 별로 작업의 순서를 위해 작업의 우선순위를 정의하고 작업 간의 연관 관 계를 도출할 수 있다. - 프로젝트 수행 시 발생할 수 있는 위험요소를 식별하고 이를 관리하기 위한 계획을 수립할 수 있다. 프로세스 개념 및 유형 UI/UX 디자인 프로세스는 UI/UX를 개발하기 위해 필요한 과정 또는 구조이다. 일반적으로 프로세스란 주어진 목적을 위해 수행할 일련의 절차를 의미하는 것으로, 절차뿐만 아니라 투입 인력, 필요 기술을 통합하여 의미한다. 프로세스를 정의함을 문제 해결에 필요한 활동과 그들간의 순서를 명확하게 정의하는 것이다. 일반 소프트웨어 개발에..
목표 및 범위 수립 학습목표 - 환경분석 결과를 토대로 UI/UX 개발을 수행하고자 하는 목적 및 목표를 정의할 수 있다. - 목표에 따라서 수행하고자 하는 범위를 수립할 수 있다. 목표 수행하려는, 성취하려는, 개발하려는 것을 기술한 것이다. 목표 달성정도가 프로젝트 성공을 평가하는 기준이기 때문에 명확한 목표 설정은 중요하다. 1. 목표 설정 규칙 - SMART 기법 무엇을 달성한 것인가 분명하게, 어느 정도 달성되었는지를 분명히 알 수 있게, 목표 달성을 위해서 무엇을 해야 하는지를 명확하게, 현실적으로 적절하고 실현 가능하게, 적절한 시간과 시기가 설정되어야 한다는 것 (1) Specific: 구체적 개념: 구체적이고 확실한 것이어야 한다. 내용: 세부목표는 상세한 성과요건이므로 구체적으로 설정되..
UI/UX 트렌드 분석 학습목표 UI/UX 경쟁 분석을 위하여 국내외 경쟁사의 제품을 분석할 수 있다. 트렌드(Trend) 1. 정의 - 트렌드의 정의는 학문적으로건 실무적으로건 명확하게 제시되어 있지 않음 - 사전적 정의는 추세, 경향, 흐름이지만 단순히 흐름이나 경향이라는 의미로만 해석되지는 않음 - '미래에 어떠한 상황이 도래할 것'이라는 의미지향성이 강하게 내포되어 있음 - 사전적 정의와 상관없이 뉘앙스만으로 수식하는 명사에 생동감을 부여함 UI/UX 트렌드의 이해 인간 중심의 디자인(Human-Centered Design)이 보편화 되면서, 전체 시스템에서 UI가 가지는 중요성은 점점 더 커져가고, 그 개념 또한 광의 의 인터랙션, 서비스를 포함하는 보편적인 가치로 받아들여지고 있다. 또한 다양..
웹 접근성의 이해 학습목표 1. 웹 접근성의 의미를 이해할 수 있다. 2. 웹 접근성의 정확한 범위를 설명할 수 있다. 3. 접근성에 대한 관련 용어를 구분할 수 있다. 웹 접근성이란? 웹(웹 콘텐츠)에 쉽게 접근할 수 있는 능력 " 접근하기 쉽다 = 이용하기 쉽다 " 1. 웹 접근성에 대한 다양한 정의 2. Web for All 웹 접근성의 범위 모든 사용자 환경과 모든 기술 환경을 포괄하는 의미에서 해석되어야 한다. - 비장애인에 대한 일시적 장애 환경 고려 (고령자, 주변 소음 등) - 다양한 기술 환경 고려 (다양한 단말기와 소프트웨어 등) 하지만, 아직까지 통용되는 의미는 좁은 의미의 웹 접근성인 장애인 접근성에 가깝다. 그 예로 '한국형 웹 콘텐츠 접근성 지침'이나 '웹 접근성 품질마크의 기준..
사용자 라이프 스타일 분석 학습목표 UX 콘셉트를 도출하기 위하여 사용자의 라이프스타일을 분석할 수 있다. UI/UX 개념 이해 1. UI(User Interface) - 사용자가 직관적으로, 무엇을 하면 어떻게 될지 예측할 수 있게 하고, 쉽게 조작할 수 있도록 도와주는 것 - 사용자가 원하는 곳으로 찾아가게 하기 위해 일련의 정보를 제공하는 개념 UI의 형태 명령행 기반(Command-line interface) 사용자가 키보드에서 명령을 입력하여 프로그램을 작동시키는 것 메뉴 기반(Menu-driven interface) 메뉴선택에 의한 명령으로 작동시키는 것 Graphic User Interface(GUI) 위치지정도구(광전펜, 마우스, 컨트롤볼, 조이스틱 등)를 사용하며 도형표시 프로그램을 작동..