모바일 웹페이지 디자인을 통한 중의양생학 (中醫養生學) 대중화 방안 연구 : 중의학 전적 『준생팔전·사시조섭전 (遵生八笺·四時調攝笺)』을 중심으로 = Popularizing Traditional Chinese Medicine Health Preservation through Mobile Web Design —Centered on the Classical Text ‘Zunsheng Bajian: Sishi Tiaoshe Jian

국문 초록 (Abstract)

중의학은 중국 전통 의학의 총칭으로 오랜 역사를 가지고 있으며 풍부한 함의를 담고 있다. 중의학은 중화 민족의 지혜와 문화를 포함하고 있어 인류 문명의 소중 한 유산이다. 그 중에서도 전통 중의양생학은 중국 전통 문화의 중요한 구성 요소 로서 풍부한 이론과 실천 경험을 갖추고 있다. 현대 사회의 발전과 생활 리듬의 가 속화로 인해 사람들의 건강 의식이 점점 높아지면서 양생에 대한 관심도 증가하고 있다. 본 연구는 인터넷 데이터 분석을 통해 사람들이 과학적이고 효과적인 양생 방법을 찾는 과정에서 중의양생학이 점점 더 필요하다는 사실을 확인하였다. 그러 나 인터넷 상의 중의양생학 자료가 많아 사람들은 그 신뢰성을 판단하는 데 어려움 을 겪고 있으며 중의양생학 이론에 대해 단편적이고 체계적이지 않은 이해를 가지 고 있다. 본 연구는 중국 전통 중의양생학 전적인 『준생팔전:사시조섭전(遵生八笺:四時調 攝笺)』를 연구 대상으로 삼아 그 내용을 모바일 웹페이지 형태로 전달하고자 한다. 이 전적은 중국 고대 양생학의 집대성으로서 풍부하고 소중한 문화적, 의학적, 사회 적, 미학적 가치를 지니고 있다. 명나라 만력 년간의 간본과 2010년 황산서사에서 정리하고 출판한 종이본을 연구 대상으로 하여 고문과 현대 문자를 대조하면서 책 내용의 정확성과 완전성을 확보하였다. 또한 서적의 문자, 내용, 이미지 등의 요소 를 심층 분석하여 고서의 심층 내포를 드러내고자 한다. 그리고 관련 분야의 연구 와 실천에 새로운 시각과 방법을 제공할 뿐만 아니라 대중의 전통 중의양생학에 대 한 인식과 이해를 높이는 데 도움이 된다. 동시에 전통 중의양생학을 전승하고 발 전시키는 새로운 방안이 된다. 논문의 본론 부분에서는 문헌 연구, 사례 분석, 데이터 분석 등의 방법을 사용하 였으며 구체적으로 세 부분으로 나누어진다. 첫 번째 부분은 2장과 3장에서 관련 문헌을 고찰하고 사례 분석을 통해 모바일 웹페이지의 개념을 소개하고 현재 유행하는 H5 웹페이지의 개념을 도입하였다. H5 웹페이지의 기능 및 대중화 특성을 분석하고 모바일 인터넷에서의 과학적 정보 대 중화의 특성을 분석하였다. 대중화 디자인 방안을 진행하는 과정에서 디자이너와 수용자의 관점에서 대중화 효과를 비교함으로써 H5 웹페이지 디자인을 통해 『준 생팔전:사시조섭전』의 양생 내용과 사상을 대중화하는 방식을 확정하였다. 이러한 방식은 중의양생학 지식을 더욱 직관적이고 생동감 있게 이해하기 쉽게 전달할 수 있다. 두 번째 부분은 논문의 4장으로 논문의 핵심 장이다. 문헌 연구를 통해 중의양생 학 이론과 H5 페이지 디자인을 결합하였다. 사용자들이 콘텐츠의 신뢰성을 높이기 위해 본 연구자는 『준생팔전:사시조섭전』의 내용을 심층 분석하였다. 시각적 표현 에서 중의양생학 이론과 실천 방법을 합리적이고 정확하게 제시하면서도 책의 원래 모습을 유지해야 한다. 먼저 『준생팔전:사시조섭전』의 내용을 중의양생학 기본 이 론과 결합하여 사계절 총괄 조섭 내용, 사계절 장부(臟腑) 보양 원칙, 계절 양생에 적절한 음식, 계절에 맞는 활동, 그리고 동작 도인 등을 분류하고 내용을 정리하였 다. 다음으로 『준생팔전:사시조섭전』의 문자, 삽화 등의 요소를 분석하고 분석한 후 H5 웹페이지 인터페이스의 시각적 디자인을 수행하였다. 여기에는 사계절 스타 일, 색상, 표준 글꼴, 삽화, 레이아웃 디자인, 동적 상호작용 디자인의 원칙 및 음향 효과 디자인의 원칙을 포함한다. 세 번째 부분에서는 작품을 제작한 후 사용자를 대상으로 하여 설문 조사를 실시 하였다. 수집된 응답지를 통계 방법을 사용하여 데이터를 분석하였다. 우선, H5 웹 페이지를 보기 전에 사용자들이 전통 중의양생학 지식에 대한 이해도와 인터넷에서 제공하는 중의양생학 내용에 대한 수용 정도를 조사하였다. 다음, 제작한 H5 웹페 이지를 본 다음에 설문 조사를 통해 지식 전달의 유효성에 대한 피드백을 수집하고 모바일 웹페이지에서의 시각적 디자인에 대한 인식과 평가를 조사하고 분석하였다. 이를 통해 전통 중의양생학 정보가 모바일 웹페이지에서 시각적으로 디자인되고 전 달되는 효과를 분석하고 그 영향을 미치는 요인을 도출한 후 적절한 최적화 전략과 제안을 제시하였다. 이는 전통 중의양생학 지식의 대중화를 촉진하기 위함이다. 이상의 연구를 통해 전통 중의양생학 정보는 모바일 웹페이지를 통한 시각적 디 자인을 통해 효과적으로 전달될 수 있으며 사용자들에게 유익하다는 결론을 도출하 였다. 또한 중국의 중의양생학 고전을 콘텐츠 개발의 원형으로 삼을 경우 사용자들 이 콘텐츠의 효용성에 대한 의구심을 해소할 수 있다는 점도 확인하였다. 본 연구 의 접근 방식과 디자인 계획은 전통 중의양생학의 발전과 전승에 새로운 방향을 제 시하며 현대인의 건강 상태를 개선하고 전통 중의양생학에 대한 대중의 인식과 이 해를 높이는 데 기여할 수 있다.
주제어: 중의양생학, H5 웹페이지, 대중화 방안, 정보 시각화

목차 (Table of Contents)

• 목 차 i
• 표목차 iv
• 그림목차 vi
• 국문요약 x
• I. 서론1
• 1. 연구 필요성 및 목적 1
• 2. 연구 내용 및 방법7
• II. 이론적 배경 9
• 1. 모바일 웹 디자인 9
• 가. 모바일 웹페이지의 개념 HTML5 웹 디자인의 개념 10
• 나. H5 웹페이지가 구현할 수 있는 기능 및 표현 형식 15
• 다. H5 웹페이지의 특징과 장점 19
• 라. H5 사용자 행동 분석 20
• 2. 전통 중의양생학 지식 시각화에 관한 연구 26
• 가. 전통 중의양생학 지식 정보화 현황 26
• 나. 정보 시각화 디자인33
• 다. 중의양생학의 대중화를 위한 정보 시각화 디자인의 가치37
• III. 모바일 웹에서 정보 대중화 방식 비교 40
• 1. 정보 대중화 방식의 유형 41
• 가. 그래픽 및 텍스트46
• 나. 영상과 음향 50
• 다. 동적 인터랙션50
• 2. 대중화 효과 비교51
• 가. 정보 생산자 입장51
• 나. 수용자의 입장52
• IV. 『준생팔전:사시조섭전』의 모바일 웹 디자인54
• 1. 『준생팔전:사시조섭전』의 가치 분석54
• 2. 『준생팔전:사시조섭전』 H5 웹페이지 디자인의 목적 및 의의 56
• 3. 중의양생학 전적 『준생팔전:사시조섭전』의 원형 내용 분석 57
• 가. 중의양생학의 기초 이론58
• 나. 봄철 양생 60
• 다. 여름철 양생 65
• 라. 가을철 양생 71
• 마. 겨울철 양생 76
• 바. 『준생팔전:사시조섭전』의 원형 내용 분석의 역할 81
• 4. 『준생팔전:사시조섭전』의 자료 수집 및 정리 84
• 가. 전적의 글씨체85
• 나. 삽화 분석 88
• 5. 모바일(H5) 웹페이지 디자인 방법 및 과정 98
• 가. 웹페이지 구조 디자인 99
• 나. 스타일 및 색상 설정 100
• 다. 모바일 웹페이지 색상 배치 방안103
• 라. 폰트 디자인 104
• 마. 장면 디자인107
• 바. 레이아웃 디자인 기법 108
• 사. 인터랙션 디자인 원칙 119
• 아. 음향 디자인 120
• V. 효과 검증 122
• 1. 설문지 응답 상황 122
• 2. 데이터 분석 및 H5 웹페이지 최적화 127
• 가. 데이터 분석 127
• 나. H5 웹페이지의 최적화 129
• VI. 결론 135
• 참고문헌 139
• 1. 국내문헌139
• 2. 국외문헌140
• Abstract145
• 부 록 150
• ◆ 표 목 차 ◆
• <표 1> HTML의 발전 과정 12
• <표 2> 웹페이지의 사용자 행동 분석 25
• <표 3> 2018-2021년 4월 전 세계 웰빙 산업 발전 통계32
• <표 4> 정보 그래픽의 종류 40
• <표 5> TOP 10 셀미디어 계정 분석43
• <표 6> 각종 인터넷 미디어 플랫폼 및 특징 44
• <표 7> 그래픽 및 텍스트 유형과 영상 및 음향 유형의 전달 요소 비교 · 51
• <표 8> 사물의 오행 분류59
• <표 9> 전적의 글씨체 특징 분석85
• <표 10> 봄철 동작 도인도 정리 및 개발 89
• <표 11> 여름철 동작 도인도 정리 및 개발91
• <표 12> 가을철 동작 도인도 정리 및 개발93
• <표 13> 겨울철 동작 도인도 정리 및 개발96
• <표 14> 모바일 웹페이지 메인 메뉴 100
• <표 15> 응답자의 성별 연령 분포123
• <표 16> H5 작품을 보기 전 중의 양생 지식학에 대한 이해 정도 123
• <표 17> H5 작품을 본 후 중의 양생 지식학에 대한 이해 정도124
• <표 18> 전통 중의양생학『준생팔전사시조섭전』H5의 지식 신뢰도124
• <표 19> 전통 중의양생학『준생팔전사시조섭전』추천 의향 124
• <표 20> 모형 요약 1 125
• <표 21> 모형 요약 2 125
• <표 22> 사용자 경험이 양생 지식 대중화 유효성에 미치는 영향125
• <표 23> 웹페이지를 보기 전후의 중의양생학에 대한 이해도 차이 126
• ◆ 그 림 목 차 ◆
• <그림 1> 두 가지 플랫폼에서 작품을 공유하는 화면 14
• <그림 2> H5 웹페이지의 6가지 주요 기능 16
• <그림 3> 사용자가 모바일 웹 로딩 시간에 대한 태도 조사21
• <그림 4> 사용자 모바일 웹 이용 시간 분포 21
• <그림 5> 사용자 웹페이지의 계층별 방문 횟수 통계22
• <그림 6> 사용자 웹페이지의 계층별 이용 시간 비교22
• <그림 7> 전시형 페이지와 기능형 페이지23
• <그림 8> 웹페이지에 버튼 이름별 클릭률 24
• <그림 9> 웹페이지에서의 상호작용 디자인 24
• <그림 10>『준생팔전』(명나라 만역시기) 고전 원본 28
• <그림 11>『준생팔전:사시조섭전』, 시대출판사와 황산서사, 2010 30
• <그림 12>『도해준생팔전』 현대 중국어판 pp.28-29.30
• <그림 13>『중국 인터넷 의학 수직 콘텐츠 산업 인사이트』 보고서의 “인터
• 넷 의학 수직 콘텐츠 시장 산업 체인”차트33
• <그림 14> 정보와 그래픽의 관계도 34
• <그림 15> “둔황 클라우드 투어” 스크린샷 36
• <그림 16> “과학 보급 중국” 시나 웨이보 계정의 순수 텍스트 내용47
• <그림 17> 롱포맷 텍스트 48
• <그림 18> 롱포맷(애니메이션) 텍스트48
• <그림 19> 숏포맷 텍스트48
• <그림 20> 롱포맷 텍스트 형식(포스터 형식) 49
• <그림 21> 소셜 미디어 시대 정보 전달의 새로운 특징 53
• <그림 22> 명나라, 대진(戴進) 『답설심매도(踏雪尋梅圖)』 55
• <그림 23>『준생팔전:사시조섭전』 HTML5 웹페이지 디자인 과정57
• <그림 24> 중의 장부(臟腑) 이론도 59
• <그림 25> 봄 권 조섭의 총괄 내용 61
• <그림 26> 간(肝) 삽화 62
• <그림 27> 담(膽) 삽화 62
• <그림 28> 여름 권 조섭(調攝)의 총괄 내용 66
• <그림 29> 심신도(心神圖) 68
• <그림 30> 심장 삽화 68
• <그림 31> 비신도(脾神圖) 69
• <그림 32> 비장 삽화 69
• <그림 33> 가을 권 조섭 총괄 내용 72
• <그림 34> 폐신도 74
• <그림 35> 폐 삽화74
• <그림 36> 겨울 권 조섭 총괄 내용 77
• <그림 37> 신신도(腎神圖) 78
• <그림 38> 신장 삽화 78
• <그림 39> 봄철의 주요 정보에 따른 삽화 디자인82
• <그림 40> 여름철과 장하 주요 정보에 따른 삽화 디자인 83
• <그림 41> 가을철 주요 정보에 따른 삽화 디자인 83
• <그림 42> 겨울철 주요 정보에 따른 삽화 디자인 84
• <그림 43> 사계절과 오장 관계 삽화 디자인 84
• <그림 44> 모바일 웹페이지 구조도 99
• <그림 45> 사례 스타일 분석 결과 102
• <그림 46> 스타일 키워드 103
• <그림 47> 모바일 웹페이지 주색 표준104
• <그림 48> “遵生八笺(준생팔전)” 폰트 디자인 방법 105
• <그림 49> 작품 폰트 디자인 106
• <그림 50> 내비게이션 폰트 디자인106
• <그림 51> 2단계 하위 페이지의 내비게이션 폰트 디자인 107
• <그림 52> 봄철의 장면 108
• <그림 53> 모바일 H5 웹페이지 시각적 초점 109
• <그림 54> “준생팔전사시조섭전” 단일 페이지의 시각적 초점110
• <그림 55> 웹페이지에 따른 초점 변화 예시 111
• <그림 56> 작품에서 웹페이지에 따른 초점 변화 112
• <그림 57> 3단계 레이아웃 기법 113
• <그림 58> 다중 페이지 디자인 제시 115
• <그림 59> “준생팔전사시조섭전” 다중 페이지 디자인 116
• <그림 60> 영화 감정 시간표 117
• <그림 61> H5 웹페이지 감정 시간표118
• <그림 62>『준생팔전:사시조섭전』 봄철 양생의 감정 시간표 118