생몰정보
소속
직위
직업
활동분야
주기
서지
국회도서관 서비스 이용에 대한 안내를 해드립니다.
검색결과 (전체 1건)
원문 있는 자료 (1) 열기
원문 아이콘이 없는 경우 국회도서관 방문 시 책자로 이용 가능
목차보기더보기
표제지
국문요약
목차
제1장 서론 12
1.1. 연구배경 및 목적 12
1.2. 연구 범위 및 구성 18
제2장 이론적 고찰 20
2.1. 멀티 플랫폼(Multi-platform) 20
2.1.1. 멀티 플랫폼의 개념 20
2.1.2. PC 웹과 모바일 웹 환경의 특성 22
2.2. PC웹과 모바일 웹에서의 사용자 인터페이스 27
2.2.1. 사용자 인터페이스(User Interface)개념 27
2.2.2. PC 웹의 사용자 인터페이스의 이해 28
2.2.3. 모바일 웹의 사용자 인터페이스의 이해 33
2.2.4. PC웹과 모바일 웹의 디자인 구성요소 38
2.3. 사용성과 일관성 40
2.3.1. 사용성(Usability) 40
2.3.2. 일관성(Consistency) 43
제3장 연구 방법 52
3.1. 연구 내용 및 목적 52
3.1.1. 연구 설계 53
3.2. 실증적 분석 평가 57
3.2.1. 참가자 57
3.2.2. 평가 방법 60
3.2.3. 평가 절차 62
3.2.4. 평가 결과 및 분석 64
3.3. 전문가 심층 인터뷰(In-depth Interview) 92
3.3.1. 인터뷰 목적 및 대상 92
3.3.2. 인터뷰 결과 및 분석 93
제4장 결론 96
참고문헌 99
ABSTRACT 103
[표 1] 국내 포털사이트 모바일 웹 화면 변화의 예 15
[표 2] PC 웹과 모바일 웹의 특징 비교 25
[표 3] PC 웹 사용자 인터페이스 디자인 요소 정리 29
[표 4] 모바일 웹 사용자 인터페이스 디자인 요소 정리 35
[표 5] 모바일 네이버 웹의 정보구조 분류의 예 36
[표 6] PC 웹과 모바일 웹의 디자인 구성요소 정리 39
[표 7] 사용성을 높이기 위한 방법 45
[표 8] 멀티 플랫폼에서의 일관성 고려 사항 48
[표 9] Nielsen의 10가지 사용성 평가 항목 54
[표 10] Think aloud 기법 연습 내용 55
[표 11] 자료수집 방법 56
[표 12] 참가자 프로파일 58
[표 13] 참가자 그룹 기준 59
[표 14] 태스크 내용 63
[표 15] 시지각적 연결성 결과 분석표 64
[표 16] 인지적 연결성 결과 분석표 72
[표 17] 기능적 연결성 결과 분석표 81
[표 18] 전문가 심층 인터뷰 참가자 기준 92
[표 19] 전문가 심층 인터뷰를 통한 제언 94
[그림 1] 주요 기기들의 연간 출하량 추이 12
[그림 2] 모바일에 최적화된 모바일 웹(좌), PC웹(우)의 풀브라우징의 비교 예 14
[그림 3] 논문의 구성도 19
[그림 4] PC 웹 해상도 점유 비율 22
[그림 5] 모바일 폰 디스플레이 화면 크기 변화 23
[그림 6] 모바일 폰 제스처 38
[그림 7] 사용성의 속성체계 41
[그림 8] PC 웹 플랫폼(좌)과 모바일 웹(우)의 예 49
[그림 9] 인간의 감각 양식과 행동 양식 50
[그림 10] PC 웹과 모바일 웹 UI 일관성 요소 도출을 위한 평가구성요소 52
[그림 11] Usability Test 참가자의 사용성 문제 발견에 관한 그래프 57
[그림 12] 참가자가 태스크를 진행하는 과정 60
[그림 13] 서울대학병원 PC 웹사이트(좌)와 스마트폰 웹 사이트(우)화면 61
[그림 14] 대상 웹사이트 로고를 시각 처리한 화면 62
[그림 15] PC 웹(좌)와 스마트폰 웹(우)사이트에서 본 색상과 아이콘 67
[그림 16] 스마트폰 웹 찾아오시는 길 아이콘(좌)와 PC 웹 아이콘(우) 68
[그림 17] 시지각적 연결성 결과 분석 그래프 70
[그림 18] PC 웹 아이콘(좌)와 스마트폰 웹 아이콘(우)의 혼돈 유발의 예 73
[그림 19] PC 웹 의료진 아이콘(좌)와 스마트폰 웹 아이콘(우) 화면 74
[그림 20] 인지적 연결성 결과 분석 그래프 78
[그림 21] PC 웹(좌)와 스마트폰 웹(우)의 사이트에서 본 로그인 위치 82
[그림 22] PC 웹(좌)과 스마트폰 웹(우)사이트에서 예약 혼돈의 예 82
[그림 23] PC 웹(좌)과 스마트폰 웹(우)사이트에서 본 진료과 순서 83
[그림 24] PC 웹(좌)와 스마트폰 웹(우)의 사이트에서 본 진료예약 날짜 화면 86
[그림 25] 기능적 연결성 결과 분석 그래프 90
초록보기 더보기
본 논문은 멀티 플랫폼 환경에서 UI 일관성을 위한 디자인 요소 도출에 관한 연구로써 다양한 멀티 디바이스의 확장 현황, 멀티 플랫폼 환경에서의 일관성의 중요성, PC 웹과 모바일 웹의 사용자 인터페이스에 대한 이해를 바탕으로 UI 일관성을 위한 디자인 구성요소를 알아보기 위해 평가구성요소를 도출하였다.
PC 웹과 모바일 웹의 도출된 평가구성요소로 '정보구조', '네비게이션', '텍스트', '색상', '아이콘', '인터렉션'의 6가지로 구분하였으며, 멀티 플랫폼의 일관성 고려요소인 '시지각적 연결성', '인지적 연결성', '기능적 연결성'의 각 단계에 적용하여 평가를 실시하였다. 평가 방법은 일반인 사용자와 전문가 심층 인터뷰로 나누어 진행하였으며, 평가 분석 결과는 다음과 같다. '시지각적 연결성'에서는 '색상', '아이콘', '텍스트'로 나타났으며, 사용자가 동일한 서비스로 느끼는 시지각적 영역에 대한 초점을 고려하였을 때 가장 필요한 요소로 '색상'과 '아이콘'으로 볼 수 있다. '인지적 연결성'에서는 사용자가 다른 플랫폼에서 동일 서비스를 사용할 때 생각하는 행위에 초점을 맞추어 평가를 진행하였으며, 그 결과로 가장 필요한 요소는 '텍스트', '아이콘'이 도출되었다. 그러므로 각 플랫폼에서 '인지적 연결성'을 위한 인터페이스 디자인은'텍스트'를 토대로 '정보구조'를 구조화하여 설계하는 것이 중요하다. 마지막으로 '기능적 연결성'에서는 '네비게이션', '텍스트', '정보구조'가 디자인 요소로 도출되었다. 사용자가 익숙한 플랫폼에서 본인이 하고자 하는 태스크 수행 위치를 기억하여, 다른 플랫폼에서도 동일한 위치를 통해 태스크를 수행하는 것으로 나타났다. 그러므로 사용자가 다른 플랫폼에서 동일한 기능을 수행하기 위해서는 어떤 위치에 배치하느냐가 일관성에 영향을 미치는 것으로 알 수 있다.
본 논문은 사용자에게 가장 최적화된 멀티 플랫폼의 UI 일관성을 위한 디자인 요소를 도출을 통해 실제 프로젝트에 적용할 수 있도록 디자인 연구자와 현 디자이너를 위한 웹/모바일 기획, 커뮤니케이션에 기여할 수 있을 것으로 보인다.
원문구축 및 2018년 이후 자료는 524호에서 직접 열람하십시요.
도서위치안내: / 서가번호:
우편복사 목록담기를 완료하였습니다.
* 표시는 필수사항 입니다.
* 주의: 국회도서관 이용자 모두에게 공유서재로 서비스 됩니다.
저장 되었습니다.
로그인을 하시려면 아이디와 비밀번호를 입력해주세요. 모바일 간편 열람증으로 입실한 경우 회원가입을 해야합니다.
공용 PC이므로 한번 더 로그인 해 주시기 바랍니다.
아이디 또는 비밀번호를 확인해주세요
