웹사이트 플랫디자인의 Composition에 관한 연구 : 몬드리안의 조형원리를 중심으로

국문 초록 (Abstract)

웹 환경은 소프트웨어 혹은 하드웨어의 영향으로 빠른 변화를 보이고 있다. 그 변화에 맞추어 웹 사이트 UI(User Interface) 또한 빠르게 변화하고 있다. 웹 사이트는 유행에 민감하여 어떠한 인터페이스 디자인이 이슈가 되면 비슷한 디자인이 빠르게 생겨나게 되며, 현재 플랫디자인이 그러한 현상을 보이고 있다.

플랫디자인은 말 그대로 평평한 평면디자인으로 꼭 필요한 요소만 사용하여 무의미한 컷은 배제하는 직관적인 디자인이라 할 수 있다.
이러한 플랫디자인은 MS(MicroSoft)사의 윈도우 8에서 선보인 메트로 UI와 애플의 아이폰 UI의 디자인이 큰 영향으로 작용했다고 볼 수 있다.
애플의 아이폰 UI의 변화는 애플에서 오랫동안 고수해오던 스큐어모픽 디자인을 과감히 버리고 iOS7 버전부터 플랫디자인을 채택하였으며 이 변화는 애플의 디자인 혁명이라 해도 과언이 아닐 것이다.

애플의 아이폰UI 디자인이 그러하듯이 플랫디자인으로의 변화는 모바일 환경의 변화가 가장 큰 영향을 끼치고 있는 것으로 보여 진다.
스마트폰의 사용이 확산 되면서 사용자들은 PC로 하던 어떠한 행동들을 그대로 스마트폰에서도 할 수 있기를 원했고 그러한 사용자의 니즈를 충족시키기 위해 플랫디자인 UI가 더욱 확산되고 있다고 할 수 있다.
플랫디자인은 불필요한 요소를 제거한 심플한 디자인 형태와 수직 수평에 의한 면 분할 구성으로 기기에 대한 확장성이 좋기 때문이다.

최근 1~2년(2013년 초) 전만해도 PC용 웹사이트 UI와 모바일상의 웹사이트 UI는 디자인이 완전 별개였으며 속도나 작은 화면 등을 고려하여 PC용 웹사이트의 많은 내용들을 줄여서 필요한 메뉴들만 심플하게 모바일 환경에 맞게 재구성 하는 것이 모바일 웹에서는 일반적인 형태였다. 하지만 모바일 기기들의 해상도도 다양해지고 성능 또한 향상되었으며, 무엇보다 사용자들이 PC용 웹에서 하는 모든 행동들을 모바일 웹에서도 하기를 원하는 욕구가 모바일 UI 변화의 가장 큰 이유라고 할 수 있을 것이다. 모바일에서도 PC용 웹사이트 UI를 최적화된 화면으로 볼 수 있게 하면서 플랫디자인이 더욱 확산 되었다고 할 수 있으며, 현재 플랫디자인이 트렌드로 자리를 잡아 가고 있다는 것은 간과할 수 없는 부분이다.
하지만 플랫디자인이 이렇게 유행을 하다 보니 최근 오픈 또는 리뉴얼 되는 웹사이트의 대부분이 플랫디자인의 수직 수평에 의한 컴포지션을 띠고 있고 사이트의 특성 또한 미미한 경우가 많다.

본 연구에서는 플랫디자인이 사이트마다 비슷한 시각적 효과를 주고 있다는데 문제를 제기하고 색의 조화, 심플함, 다양한 면 분할 등의 구성이 몬드리안의 컴포지션과 비슷하다는데 착안하여 몬드리안의 조형원리를 중심으로 플랫디자인의 조형성을 연구 하였을 때, 사용자들의 인지성, 직관성, 가시성, 정보전달성 등의 시각적 효과뿐만 아니라 선호도에는 어떠한 영향을 미치는지 알아보는데 의의가 있다.

목차 (Table of Contents)

• 목 차
• I. 서 론 1
• 1. 연구 배경 및 목적 1
• 2. 연구 범위 및 방법 3
• II. 웹사이트 UI에 대한 이해 5
• 1. UI의 정의 및 특징 5
• 2. UI의 디자인 원리와 구성요소 7
• 3. UI의 조건 및 평가 기준 16
• 4. 사용자 인식에 따른 UI의 변화 23
• 1) 스큐어모픽 디자인 24
• 2) 플랫 디자인 27
• 3) 플랫디자인의 특징 31
• III. 몬드리안의 조형원리에 대한 고찰 36
• 1. 몬드리안의 추상 이론 및 조형원리 36
• 2. 몬드리안 조형의 형태, 색채 및 공간 40
• 3. 몬드리안의 컴포지션 46
• IV. 플랫디자인 컴포지션 분석 61
• 1. 플랫디자인 컴포지션 현황 61
• 2. 몬드리안 조형적 측면에서의 분석 67
• 1) 사례 분석 67
• 2) 1차 설문 조사 73
• 3) 2차 설문 조사 81
• V. 결론 86
• 참고문헌 89
• Abstract 91
• 부록
• 1차 설문지 94
• 2차 설문지 99