Archives of Design Research

본 연구에 앞서, 기존 자동차 TFT 클러스터 내의 모션그래픽들을 대상으로 사전 분석과 만족도 평가를 수행하였다. 이를 통해, 주 실험에 필요한 차량 내 주요 모션그래픽들을 파악하고 주요 품질요소(예. 프레임 수, 프레임 속도, 완료시간, 이동거리, 이동패턴 등)를 결정하였다.

시중에 판매 중인 대표적인 자동차 TFT 클러스터에 대한 인터넷 조사를 통하여 고급형 자동차인 KIA K7, Audi A6, BMW 735(B7), Range Rover(RR)의 TFT 클러스터를 모션그래픽 조사 대상으로는 삼았다. 이들 자동차를 렌트하여 TFT 클러스터 내의 모든 모션들을 파악한 후, 팝업, 탭 이동, 리스트 이동, 실행, RPM계, 도어오픈, 시작애니메이션 등의 각 차량에 공통적으로 존재하는 대표 모션들을 선정하였다 (Figure 3).

Figure 3 Representative motion graphics in TFT cluster of K7

모션그래픽에 대한 분석방법은 촬영된 모션그래픽에서 단위시간 당 이동프레임 수를 도출하여 이를 시퀀스 타임라인 형태로 표현하여 모션그래픽의 패턴을 분석한 이승제(Lee, 2010)의 연구방법을 기반으로 하였다. 본 연구에서는 각 모션그래픽을 초고속카메라(200Hz)로 촬영하였고, 해당 영상을 동작분석 SW인 Dartfish Prosuite을 활용하여 0.02초 단위로 느리게 재생하면서 변화(거리, 밝기 등)가 뚜렷해지는 시점을 기준으로 시간당 화면 변화율(100% 기준)을 그래프로 정리하여 분석하였다(Figure 4). 그리고 이러한 분석 결과를 토대로 프레임 수, 프레임 속도, 완료시간, 이동패턴을 도출하였다.

Figure 4 Analysis method of motion graphics in this study

분석된 모션그래픽의 패턴에 따른 만족도 차이 및 이를 유발하는 품질 영향요소를 살펴보고자 사용자를 대상으로 한 만족도 평가를 수행하였다. 실험에는 13명(1년 이상 운전자; 20~30대 6명, 40~50대 7명; 남성 7명, 여성 6명)이 참여하였다. 실험참여자들은 앞선 분석에 사용된 자동차 TFT 클러스터 내의 탭과 리스트 이동 모션그래픽들에 대해 “부드럽고 유연한, 역동적이고 경쾌한, 자연스럽고 친숙한” 이란 세 가지의 감성형용사를 기반으로 한 감성평가를 9점 척도로 수행하였다. 이 세 가지의 감성언어는 다양한 감성언어 표현 중에서 모션에 대한 공통요인을 찾아내어 유형별로 집단화시킨 반상희 (Ban, 2004)의 연구를 기반으로 하였다.

만족도 평가는 실제 차량 내 TFT 클러스터를 직접 보면서 세 가지 감성언어별로 평가하는 절대평가와 동영상으로 촬영된 모션그래픽들을 두 개씩 쌍대로 비교 평가하는 상대평가 둘 다를 수행하였다. 모션그래픽의 동영상 촬영 시에는 동일 조도 환경을 위해 자동차를 가림막으로 가린 후 삼각대에 고정된 60Hz 고화질 캠코더(Sony HDR-PJ580)로 촬영하여 실험의 노이즈를 최대한 줄이고자 하였다. 이렇게 촬영된 모션그래픽은 상대평가 시에 Figure 5와 같이 47인치 TV에 두 개씩 재생되며 실험참여자들은 상대적으로 어떤 모션그래픽이 더 감성적으로 “부드럽고 유연한지, 역동적이고 경쾌한지, 자연스럽고 친숙한지”를 평가하였다. 평가 시 실험참여자들에게 컬러나 디자인적인 요소는 배제하고 움직임만을 평가하도록 강조하였다. TV에 보이는 모션그래픽 동영상의 크기와 TV와 실험참여자 사이의 거리는 일반적인 운전환경인 7인치 클러스터와 1m 거리를 기준으로 1.7배 정도 수준이 되도록 조정하여 적절한 가독성을 확보하였다.

Figure 5 The experimental environment for pairwise video comparison

타임라인 시퀀스 형태로 분석하여 비교한 결과, 각 차량의 모션 간에는 프레임 수, 프레임 속도, 완료시간, 이동패턴에 있어 차이가 존재하였다.

이동패턴의 경우, 대표적으로 선형, 지수, 로그, S자 형태의 패턴(총 31개의 모션 중 선형은 15번, 로그 형은 9번, S자형은 4번, 지수 형은 2번, 역S자형은 1번 나타났음)이 많이 나타났다(Figure 6). 동일한 패턴이라도 프레임 수가 적거나 속도가 느릴 경우 부드럽지 못하게 끊기는 느낌을 주는 경우도 있었다. 모션그래픽의 완료시간은 이동하는 모션의 경우 0.04~0.6초, 페이드 되는 모션은 0.5~1.5초 수준인 것으로 분석되었다.

Figure 6 Typical moving patterns of analyzed motion graphics

각 모션그래픽에 대한 만족도 평가 결과는 앞서 설명한 바와 같이 절대평가와 상대평가 둘 다를 진행하였으나 실제 자동차 내에서 진행한 절대평가의 경우 자동차를 렌트하여 진행하다 보니 하루에 모든 차종을 빌리지 못해 모션그래픽에 대한 비교평가가 이뤄지지 못하였고 여러 날에 걸쳐 하나씩 평가가 이뤄져서 그 날 참여자의 컨디션이나 날씨 등이 결과에 영향을 미칠 수도 있음을 배제할 수 없었다. 따라서 본 논문에서는 동영상을 기반으로 한 상대평가 결과만을 정리하였다.

탭 이동 모션그래픽에 대한 동영상 평가에서는 Figure 7과 같이 RR이 가장 부드럽고, K7이 가장 역동적이라는 평가를 받았다(부드럽고 유연한 p=0.000, 역동적이고 경쾌한 p=0.000, 자연스럽고 친숙한 p=0.127; 각 모션그래픽을 9점 척도로 절대평가한 것이 아닌 두 개씩 쌍대로 보면서 우위를 비교한 것이어서 가장 나쁜 경우 점수를 전혀 얻지 못하여 0점이 나온 경우도 있음). 세 형용사 관점에서 남녀나 연령에 따른 차이는 보이지 않았다(p > 0.8). RR의 모션그래픽은 페이드 효과의 지수형 패턴을 보였고 다른 차의 모션그래픽보다 느리게 움직여서 부드러움의 만족도가 높은 것으로 평가되었다. A6의 경우, 선형 패턴으로 프레임 수가 적었고 빠른 속도로 움직여서 부드럽지 못하나 역동적이고 자연스럽다는 평가를 받았다. K7의 경우, 로그형 패턴을 따랐고 빠른 속도로 움직여 세 가지의 모든 감성형용사 측면에서 좋은 평가를 받았다.

Figure 7 Emotional satisfactions on motion graphics of tab movements (there was no 'Tab' UI in B7)

리스트 이동 모션그래픽에 대한 동영상 평가에서는 Figure 8과 같이 RR이 가장 부드럽고, B7, K7은 역동적, K7, A6, RR은 자연스럽다고 평가 되었다(부드럽고 유연한 p=0.000, 역동적이고 경쾌한 p=0.000, 자연스럽고 친숙한 p=0.000). 세 형용사 관점에서 모두 남녀나 연령에 따른 차이는 보이지 않았다(p > 0.8). 각 모션그래픽의 패턴을 살펴본 결과, K7은 역S자형 패턴을, RR과 B7은 선형 패턴을 보였다. RR은 페이드 효과로 인해 부드러우면서 자연스럽다는 평가를 받았다. 그에 반해, B7은 유사한 페이드 효과에도 불구하고, 속도가 지나치게 빨라 역동적이지만 부드럽지도 자연스럽지도 못하다는 평가를 받았다. A6의 경우, 지수형 패턴을 보였는데 자연스럽다는 평가를 받았다.

Figure 8 Emotional satisfactions on motion graphics of list movements

팝업 모션그래픽은 빠른 이동을 보일수록 역동적인 느낌을 제공했으며, 다소 느린 페이드 효과는 부드럽고 자연스러운 느낌을 제공하였다. K7과 A6는 동일한 선형 패턴을 가졌으나, 인터뷰 결과 서로 다른 팝업 형태(크기, 컬러)에 의해 역동적임과 자연스러움에 있어 다른 결과를 보였다.

RPM 계기판의 경우, 부드러움에 있어서만 B7이 유의하게 가장 좋았다(p=0.007). 흥미로운 것은 아날로그 계기판인 A6보다 B7이 더 부드럽다고 평가되었다는 점이다(실제 참여자들은 자세히 들여다보기 전에는 아날로그인지 디지털인지 잘 구분하지 못했음). 이외에도 색의 차이(ex. 빨간색-역동적), 바늘의 길이/폭(ex. 짧음-빠름), 숫자 확대효과(역동적) 등이 만족도 평가에 영향을 미친 것으로 인터뷰 결과 분석되었다. 이외에도 B7의 시작 애니메이션의 경우 모션그래픽에 갑작스러운 변화 구간이 있어 부드럽지 못한 느낌을 제공하였으나 움직임에 변화가 많아 역동적이라는 느낌을 주었다.

세 가지 감성형용사 평가점수와 모션그래픽의 여러 설계변수간의 상관관계를 분석해본 결과, 프레임 수가 많을수록, 프레임속도가 느릴수록, 완료시간이 느릴수록 다소 더 부드럽다고 평가되었다(r=0.424, -0.393, 0.688). 또한 역동적임은 프레임 속도와 약한 상관관계를 보였다(r=0.302). 자연스러움은 프레임 수와 약한 상관관계가 있으나(r=0.339) 이보다는 이동패턴이나 전환효과에 더 영향을 받아 평가한 것으로 보였다. 당연한 결과지만 모션의 완료시간은 프레임 수가 많을수록, 프레임속도가 느릴수록 길어졌다(r=0.702, -0.702).

정리하자면, 프레임 수와 속도가 만족도에 영향을 미치며, 대표적으로 선형, 지수, 로그, S자 패턴이 많이 나타나는 것으로 분석되었다. 하지만 사전조사 결과만으로는 이동패턴에 따른 사용자가 느끼는 감성의 차이를 도출하기는 어려웠다. 이는 부드러움/역동적임 등의 모션그래픽에 대한 감성이 전환효과, 요소의 크기, 컬러, 모양 등의 디자인 요소에도 영향을 받았기 때문이며, 프레임 수나 속도 등의 설계변수도 동일하지 않았던 실험환경 때문이었다. 따라서 동일한 설계변수 하에서 여러 디자인 요소들을 배제한 채 순수하게 모션그래픽 이동패턴만의 차이에 따른 효과를 추가적으로 살펴볼 필요성이 있었다.

주 실험의 목적은 동일한 디자인의 서로 다른 패턴(사전조사에서 나온 선형, 로그형, 지수형, S자형, 역S자형 패턴)으로 이동하거나 페이드되는 모션그래픽에 대한 사용자의 만족도와 감성적인 느낌을 평가하는 것이다. 실험 I은 이동하는 모션그래픽의 패턴, 실험 II는 페이드되는 모션그래픽의 패턴으로 구분하여 진행하였다.

실험 I에는 20~40대 남녀 18명(남녀 동일 비율; 평균 24.5세)이 참여하였다. 실험을 위해 다섯 종류의 서로 다른 이동패턴으로 움직이는 아이콘을 완료시간과 크기를 달리하여 조종할 수 있는 실험시스템을 플래쉬 (Flash)로 제작하였다(Figure 9). 프레임속도(fps, frame per second)는 인간이 부드러운 모션으로 지각하는 일반적 프레임 속도인 30fps(함혜연(Ham, 2004))를 기준으로 하였고, 아이콘의 종류는 기존 차량들에서 자주 사용되는 아이콘을 기준으로 하였다.

Figure 9 The experimental system

실험은 HP Elitebook 12.1”(1280x800, 1px=0.20mm)와 다섯 개의 버튼으로 구성된 조작키를 이용하여 진행하였다. 실험참여자가 키를 누르면 서로 다른 조건의 해당 모션이 재생된다(동시에 키를 누르면 모션그래픽이 동시에 재생됨). 피실험자와 디스플레이 간의 거리는 실제 TFT 클러스터와 운전자간의 거리인 1m를 기준으로 하였다. 전반적인 실험 환경은 Figure 10과 같았다.

Figure 10 Experimental environment

실험참여자들은 세 가지의 완료시간(0.2, 0.4, 0.6초) 중 하나에 대해 아이콘의 크기(대, 소)와 이동거리(긴, 짧은)의 네 개 조합으로 구성된 모션그래픽에 대해 임의의 순서로 평가했다. 이 때, 아이콘 모양의 차이에 따른 효과도 검증하고자 네 개 조합의 모션그래픽은 네 개의 아이콘(주행, 설정, 도로, 주의) 중 임의의 하나로 나타나게 하였다. 완료시간은 Between subject 인자이며, 아이콘 크기, 이동거리, 아이콘 모양은 Within-subject 인자인 실험디자인이어서 각 참여자의 학습효과를 완전히 배제하지는 못하나, 각 실험조합의 수행을 임의의 순서로 함으로써 순서효과는 상쇄되도록 하였다.

실험참여자들은 각 모션그래픽을 보고 느낀 감성을 감성형용사 맵(Figure 12 참고; 반상희(Ban, 2004)의 맵을 근간으로 함)에 펜으로 직접 타점하였다. 그 후, 다섯 개의 이동패턴에 대한 만족도 점수(100점 척도)를 만족스러운 순서대로 부여하였다.

Table 1은 이동패턴 별로 네 가지 인자(완료시간, 이동거리, 아이콘의 크기 및 종류)의 수준 간 유의차에 대한 분석 결과를 보여준다. 아이콘의 크기, 종류, 이동거리는 모션그래픽에 대한 만족도 차이에 미치는 영향이 없었으며(p>0.4), 이들 간의 교호작용도 존재하지 않았다.

이동패턴에 따른 만족도는 로그, S자, 지수, 선형, 역S자 순으로 높았으며, 이동 패턴에 따라 만족도에 유의한 차이가 존재하였다(평균 74.6, 74.0, 69.7, 61.9, 37.0점; p=0.000). 이동 패턴별 완료시간 수준에 따른 만족도 그래프는 Figure 11과 같았다. 로그 패턴의 경우 모션그래픽 완료시간의 길이에 무관하게 만족도가 거의 일정하였다(p=0.160). 그러나 선형, 지수, S자는 완료시간에 따라 만족도가 유의하게 달랐는데 (p=0.039, 0.012, 0.089 < 유의수준 0.1), 완료시간이 짧을수록 만족도가 높은 경향을 보였다. 역S자 패턴은 모든 경우에 만족도가 극히 낮았고 완료시간의 길이에도 영향을 받지 않았다(p=0.320).

Figure 11 Satisfactions on motion times in terms of moving patterns

이동패턴 별 감성형용사에 대한 실험참여자들의 타점 결과를 하나로 요약 정리한 결과는 Figure 12와 같았다. 선형패턴은 맑음과 온화함, 지수패턴은 경쾌함과 화려함, 로그와 S자 패턴은 경쾌함과 내츄럴함, 화려함, 역S자 패턴은 모던함과 점잖음의 결과가 도출되었다. 선형에 비해 지수, 로그, S자 패턴은 동적인 느낌을, 역S자 패턴은 딱딱하고 끊기는 느낌을 주는 것으로 보인다.

Figure 12 The result of marking on the adjective map for each moving pattern

주 실험 II의 목적은 주 실험 I과 달리 단순하게 이동하는 모션그래픽이 아닌 페이드 되는 효과를 가진 모션그래픽의 다섯 가지 페이드 패턴에 대한 만족도와 감성을 평가하는 것이었다.

실험에는 20~40대 남녀 16명(남녀 비율 동일; 평균 24.4세)이 참여하였다. 실험환경은 주 실험 I과 동일하였으나 실험시스템은 완료시간, 페이드 교차시점, 아이콘 크기 및 위치에 따라 모션그래픽의 움직임이 변하도록 플래쉬로 시스템을 구현하였다. 아이콘의 위치는 사라지는(페이드 아웃) 아이콘과 나타나는 (페이드 인) 아이콘이 동일한 위치에 나타나는 경우와 다른 위치에 나타나는 경우로 구분하였다. 페이드의 교차시점은 Figure 13과 같이 페이드되면서 사라지고 나타나는 아이콘의 시점이 동시적, 순차적, 교차적인 경우로 구분하여 그 효과를 살펴보고자 하였다.

Figure 13 The graphs and examples according to cross timing of two motion graphics (Simultaneous, Sequential, Crossed)

실험참여자들은 두 가지의 완료시간(0.4, 1.0) 중 하나에 대해 아이콘의 크기(대, 소), 위치(동일, 다른), 페이드 교차시점(동시적, 순차적, 교차적)의 조합으로 동시에 보이는 다섯 페이드 패턴의 모션그래픽들을 임의의 순서로 평가했다. 이 때, 아이콘 모양의 차이에 따른 효과도 검증하고자 네 개의 아이콘(주행, 설정, 도로, 주의) 중 임의의 하나로 나타나게 하였다.

Table 2에서 보여주듯이 페이드 되는 아이콘의 크기나 위치, 종류에 따른 만족도 차이는 존재하지 않았다. 모션그래픽의 완료시간과 페이드 교차시점에 있어서는 지수 패턴에서만 만족도 차이가 존재하였다(p=0.065, 0.065). 즉, 지수패턴에서는 완료시간이 짧은 경우와 동시적인 페이드 교차시점이 나머지 인자수준일 때에 비해 만족도가 높았다.

실험 I에서의 이동패턴과 동일하게 다섯 페이드 패턴에 따른 만족도는 로그, S자, 선형, 지수, 역S자 순서로 높았으며, 유의한 차이가 존재하였다 (평균 73.8, 69.1, 69.5, 66.7, 41.7점; p=0.000). 특히 Figure 14에서 보여주듯이, 완료시간의 길이에 무관하게 로그와 S자 패턴의 만족도가 높았다. 즉, 다른 패턴과 달리 모션그래픽의 완료시간이 길어져 페이드 패턴이 명확하게 보여도 로그와 S자 패턴의 만족도는 일정하였다.

Figure 14 Satisfactions on motion times in terms of fading patterns

로그 패턴일 때, 크기(대, 소)에 무관하게 동시에 페이드 시키는 것이 만족도가 높았고, 그 다음으로 교차적 페이드가 좋았다(Figure 15). 또한 동일 위치에서 페이드 될 때에는 페이드 교차 시점에 따른 차이가 없었으나, 다른 위치에 페이드될 때는 동시 > 교차 > 순차 순으로 만족도가 높았다.

Figure 15 Satisfaction on 'Log' pattern in terms of size and location

다른 위치에 페이드 되면서 나타나는 모션그래픽의 패턴 별 감성 형용사의 조사 결과는 Figure 16과 같았다. 선형과 지수는 내츄럴함과 우아함, 로그와 S자는 경쾌함과 화려함, 역S자는 모던함과 점잖음의 결과가 도출되었다. 실험 I의 이동 모션그래픽과 유사하게, 선형 패턴에 비해 지수, 로그, S자 패턴은 동적인 느낌이 더 강하며, 역S자는 딱딱하고 끊기는 느낌을 주었다. 동일 위치에 페이드 되면서 나타나는 모션그래픽의 경우, 역S자 패턴은 명확하게 딱딱한/끊기는 느낌을 주는 것으로 구분되었으나 그 외 패턴들은 다양한 느낌이 섞여 있어 명확한 차이를 알아보기 어려웠다.

Figure 16 The result of marking on the adjective map for each fading pattern in the case of different location