웹의 활용과 기술의 발전으로 웹 디자인 영역은 점차 확대되어 가고 있지만, 관련 연구는 미비한 실정이다. 이에 웹 디자인의 변천 과정을 연구함으로써 웹 디자인 시장의 중요성을 인식하고, 향후 디자인 방향을 제시하고자 한다. 본 연구에서는 디자인의 표현기법 발현과 진화 배경과 디자인에 영향을 주는 정보기술의 흐름을 고찰하고, 이를 바탕으로 웹 디자인 변천 과정 분석 연구를 수행하였다. 이는 앞으로의 웹 디자인 영역 확장을 위한 기초 연구 자료로서 의의가 있다고 판단된다. 연구 범위로는 웹의 역사 30년을 기준으로 1990년부터 2000년대 초까지는 당시 이슈가 되었t던 웹 사이트 자료를 대상으로 하였고, 2000년대 중반부터는 웹 어워드 코리아의 대상 수상작을 분석 대상으로 선정하여 디자인 표현기법의 조형적 특성과 웹 디자인에 영향을 준 정보기술 특성을 분석하는 방법으로 연구를 수행하였다. 연구 결과 디자인 표현기법의 변화는 미니멀리즘과 스큐어모피즘으로 크게 나눌 수 있었고, 정보기술이 발전함에 따라 영향을 받으며 웹 디자인을 표현하는 방식이 다양하게 변화하는 것을 알 수 있었다. 앞으로도 다양한 디바이스의 출현과 영상 콘텐츠 활성화로 이와 조화를 이룰 수 있는 미니멀리즘의 영향을 받은 디자인이 지속할 것으로 예측된다.
웹의 활용과 기술의 발전으로 웹 디자인 영역은 점차 확대되어 가고 있지만, 관련 연구는 미비한 실정이다. 이에 웹 디자인의 변천 과정을 연구함으로써 웹 디자인 시장의 중요성을 인식하고, 향후 디자인 방향을 제시하고자 한다. 본 연구에서는 디자인의 표현기법 발현과 진화 배경과 디자인에 영향을 주는 정보기술의 흐름을 고찰하고, 이를 바탕으로 웹 디자인 변천 과정 분석 연구를 수행하였다. 이는 앞으로의 웹 디자인 영역 확장을 위한 기초 연구 자료로서 의의가 있다고 판단된다. 연구 범위로는 웹의 역사 30년을 기준으로 1990년부터 2000년대 초까지는 당시 이슈가 되었t던 웹 사이트 자료를 대상으로 하였고, 2000년대 중반부터는 웹 어워드 코리아의 대상 수상작을 분석 대상으로 선정하여 디자인 표현기법의 조형적 특성과 웹 디자인에 영향을 준 정보기술 특성을 분석하는 방법으로 연구를 수행하였다. 연구 결과 디자인 표현기법의 변화는 미니멀리즘과 스큐어모피즘으로 크게 나눌 수 있었고, 정보기술이 발전함에 따라 영향을 받으며 웹 디자인을 표현하는 방식이 다양하게 변화하는 것을 알 수 있었다. 앞으로도 다양한 디바이스의 출현과 영상 콘텐츠 활성화로 이와 조화를 이룰 수 있는 미니멀리즘의 영향을 받은 디자인이 지속할 것으로 예측된다.
The domain of Web design gradually expands with the utilization of the Web and the development of technologies, but there are insufficient related studies. Thus, this study would recognize the importance of the Web design market and present the direction of designs in the future by investigating the...
The domain of Web design gradually expands with the utilization of the Web and the development of technologies, but there are insufficient related studies. Thus, this study would recognize the importance of the Web design market and present the direction of designs in the future by investigating the process of changes in Web design. This study investigated the background of the revelation and evolution of design expression techniques and the flow of the information technology affecting the design and conducted a study analyzing the process of changes of Web design based on this. It is judged that this study has significance as the baseline research material for the expansion of the Web design domain of the future. As for the scope of the research, based on 30 years of the history of the Web, this study was conducted with materials on Websites, which had become issues from 1990 through the early-2000s and selected the winners of a grand prize in Web Award Korea since the mid-2000s as the subjects of analysis. This study analyzed the formative characteristics of design expression techniques and the characteristics of the information technology that affected Web design. As a result of the research, changes in design expression techniques could be divided broadly into minimalism and skeuomorphism, and it was found that the methods of expressing Web designs changed in various ways, affected by the development of information technology. It is predicted that with the emergence of various devices and the vitalization of video contents, the designs affected by minimalism, which can harmonize with them, will continue in the future.
The domain of Web design gradually expands with the utilization of the Web and the development of technologies, but there are insufficient related studies. Thus, this study would recognize the importance of the Web design market and present the direction of designs in the future by investigating the process of changes in Web design. This study investigated the background of the revelation and evolution of design expression techniques and the flow of the information technology affecting the design and conducted a study analyzing the process of changes of Web design based on this. It is judged that this study has significance as the baseline research material for the expansion of the Web design domain of the future. As for the scope of the research, based on 30 years of the history of the Web, this study was conducted with materials on Websites, which had become issues from 1990 through the early-2000s and selected the winners of a grand prize in Web Award Korea since the mid-2000s as the subjects of analysis. This study analyzed the formative characteristics of design expression techniques and the characteristics of the information technology that affected Web design. As a result of the research, changes in design expression techniques could be divided broadly into minimalism and skeuomorphism, and it was found that the methods of expressing Web designs changed in various ways, affected by the development of information technology. It is predicted that with the emergence of various devices and the vitalization of video contents, the designs affected by minimalism, which can harmonize with them, will continue in the future.
* AI 자동 식별 결과로 적합하지 않은 문장이 있을 수 있으니, 이용에 유의하시기 바랍니다.
문제 정의
1. 스큐어모피즘 디자인 : 디지털 환경이 낯선 사용자를 위해 현실 세계의 메타포를 웹 디자인에 적용하는 노력이 이루어졌다. [그림 7]과 같이 Global MOMU는 퍼즐 형태, 기아차 SOUL은 자동차 외관을 3D 디자인으로 구현하여 사용자가 매장에서 보는 것과 동일하게 디자인 하였다.
특히, 이론적으로 웹 디자인의 변천 과정을 정의한 연구는 진행되지 않았다. 따라서 필자는 본 연구에서 디자인 기법과 정보 기술에 따라 웹 디자인이 어떻게 발전되었는가를 정리하고자 한다.
이처럼 앞으로 발전되고, 확장될 웹 디자인 영역의 중요성을 인식하고, 다양하고 깊이 있는 연구가 필요할 것이다. 본 연구에서는 웹 디자인 분야의 변천 과정을 고찰하고, 분석하여 연구를 수행함으로써 불분명했던 웹 디자인 역사를 정의하였다는 데 의의가 있다고 판단된다. 이는 웹 디자인을 공부하는 학생 및 디자인사를 연구하는 분야에 기초 자료가 될 것이다.
본 연구에서는 웹 초창기부터 현재까지 웹 디자인의 표현 기법 변화를 살펴보고, 이에 영향을 주었던 정보 기술 발전과 영향을 문헌을 통해 고찰하였다. 또한, 웹 디자인의 변천 과정을 알아보기 위해 과거 웹 사이트 디자인 자료를 조사하였다.
본 연구에서는 지각된 어포던스의 사용자가 어떤 것을 인지하고 생각하게 하는 데 도움을 주거나 유발하는 특성을 기준으로 연구를 수행할 것이다[2].
과거의 웹 디자인들은 이미 없어지거나 리뉴얼된 사이트들이 대부분으로 1990년부터 2003년까지는 웹 발전주기를 바탕으로 웹의 패러다임에 영향을 많이 준 사이트들을 구글 검색을 통해 자료를 조사하였고, 2004년부터는 웹 어워드 코리아 대상 수상작을 대상으로 자료를 조사하였다. 이를 바탕으로 다음 [표 2]과 같이 분석 대상을 선정하였고, 시대 별 웹 디자인 변천 과정 연구를 수행하고자 한다.
가설 설정
2018년 Gartner의 조사에 따르면, 약 46%의 소매업체가 2020년에 AR 기술을 쇼핑 기술에 적용할 예정이라고 예측하였다. 둘째, 스마트 디바이스의 새로운 인터랙션 형태가 등장할 것 같다. 전체 스크린, 듀얼 화면, 리프팅 카메라, 폴더블까지 새로운 제품은 지속적으로 출시되고 있으며 이러한 형태의 디바이스 등장은 웹 페이지의 크기 변화가 아닌 여러 콘텐츠를 한꺼번에 탐색할 수 있는 새로운 인터랙션을 제공해야 할 것이다.
제안 방법
2. 사진과 영상 : 3D 및 벡터 이미지 플래시 애니메이션을 사용하던 웹 디자인 2.0 시기와 다르게 전체 사진 및 동영상 배경을 주로 사용하였다. 현실과 유사한 어포던스를 적용한 스큐어모피즘 디자인이 아닌 실제 사진과 영상을 제공하여 사용자에게 사실적인 콘텐츠를 제공하고 있다.
2. 정형화된 그리드 레이아웃 : HTML의 table 태그를 사용하여 그리드를 맞추고 페이지 레이아웃을 디자인하였다. 편리하게 정보를 구성할 수 있다는 장점이 있었지만, table 태그로 이루어진 레이아웃은 정형화된 틀에 얽매이게 만들어 페이지를 유동적으로 만들기 어렵다는 단점을 갖고 있었다.
3. 브랜드 워드마크 및 아이덴티티 컬러 강조 : 비슷한 레이아웃의 한계점을 탈피하기 위해 각 브랜드는 워드마크 강조와 아이덴티티 컬러를 활용하여 개성을 부여하였다.
본 연구에서는 웹 초창기부터 현재까지 웹 디자인의 표현 기법 변화를 살펴보고, 이에 영향을 주었던 정보 기술 발전과 영향을 문헌을 통해 고찰하였다. 또한, 웹 디자인의 변천 과정을 알아보기 위해 과거 웹 사이트 디자인 자료를 조사하였다. 과거의 웹 디자인들은 이미 없어지거나 리뉴얼된 사이트들이 대부분으로 1990년부터 2003년까지는 웹 발전주기를 바탕으로 웹의 패러다임에 영향을 많이 준 사이트들을 구글 검색을 통해 자료를 조사하였고, 2004년부터는 웹 어워드 코리아 대상 수상작을 대상으로 자료를 조사하였다.
웹의 발전과정은 서비스의 특징에 따라 구분되지만, 각 연구자마다 시대와 특징을 다르게 정의하고 있다. 본 연구에서는 [표 3]와 같이 KT경제경영연구소 DigiEco자료의 웹 발전과정을 바탕으로 웹 정보기술의 출현 시기를 적용하여 재편집하였다. 웹 서비스 특징을 기준으로 웹 1.
본 연구의 분석 결과 디자인 표현기법 측면에서는 초창기 웹 디자인은 기술적 한계와 디자인 인식 부족으로 텍스트와 이미지를 정형화된 그리드 레이아웃에 맞추어 디자인하였다. 또한, 기술이 발전된 이후에는 디지털 환경이 낯설었던 사용자의 어포던스를 고려해 현실과 유사한 형태의 스큐어모피즘이 오랜 기간 사용되었다.
본 연구에서는 [표 3]와 같이 KT경제경영연구소 DigiEco자료의 웹 발전과정을 바탕으로 웹 정보기술의 출현 시기를 적용하여 재편집하였다. 웹 서비스 특징을 기준으로 웹 1.0, 웹 2.0, 웹 3.0으로 정의하였고, 웹 발전 주기별 정보기술은 본 연구의 핵심 주제인 웹 디자인의 변화와 직접적인 영향을 미치는 대표적인 기술로 한정하였다.
정보 기술적 측면에서는 초창기 하이퍼텍스트로 정보를 탐색하고, HTML의 Table 태그를 사용하여 정형화된 레이아웃을 제공하였다. 2000년대 초·중반에는 스큐어모피즘과 함께 플래시, 자바스크립트를 활용하여 실재감 넘치는 애니메이션이 확산하였고, 2007년 아이폰의 등장과 함께 멀티 디바이스에 대응할 수 있는 반응형 웹이 보급되기 시작하였다.
성능/효과
2. 플래시 애니메이션의 부흥 : 2000년대는 플래시 애니메이션이 부흥했던 시기로, 얼마만큼 다양한 애니메이션이 적용되었느냐에 따라 웹 사이트 디자인의 퀄리티가 결정되었던 시기였다. 같은 시기에 많이 사용되던 스큐어모피즘 디자인은 플래시 애니메이션을 통해 사실적인 효과를 극대화할 수 있었고, 서로에게 긍정적인 시너지를 주었다.
3. HTML과 CSS의 활용 : HTML과 CSS를 활용하여 [그림 7]과 같이 다양한 형태의 레이아웃 구현과 웹에서 사용할 수 있는 폰트체가 확대되었다. 컴퓨터 환경의 기본 폰트체가 아닌 다양한 웹 폰트체를 사용하게 되며 웹 디자인에서 타이포그래피의 중요성이 인식되기 시작했다.
4. 반응형 웹 : 2000년 후반, 모바일 사용률이 높아지며 기존의 PC 디자인만을 제작하던 방식에서 모바일, 태블릿, PC 해상도에 최적화된 디자인 적용 방식인 반응형 웹 레이아웃이 확대되며 시장의 변화를 가져왔다. 특히, [그림 7]의 현대자동차 기업문화 PR은 국내 반응형 웹 시장을 선도했다고 할 수 있을 만큼 파격적인 그리드 레이아웃을 선보이며 사이트를 구성하였다.
4. 애니메이션 효과의 시작 : 자바스크립트와 플래시를 활용한 애니메이션 효과를 사용하기 시작하였다. 1990년대에는 컴퓨터 성능의 한계로 웹 페이지의 극히 일부 영역에만 사용되었다.
웹 사이트는 운영자가 사용자에게 일방적으로 콘텐츠를 제공하는 형태로 이루어졌고, 오늘날과 같이 동적인 데이터를 제공하는 서비스는 존재하지 않았다. 기술의 한계로 웹 사이트를 구성하는 저장 공간이 충분하지 않았고, 속도 저하 현상이 보편적이었다. 따라서 웹1.
CSS는 플래시와 달리 HTML 구조를 유지하며 페이지를 디자인할 수 있고, 컬러, 타이포그래피, 레이아웃, 심지어 애니메이션까지 구현할 수 있다. 이러한 마크업 기술을 기반으로 스마트 디바이스에서 데이터 로드를 줄일 수 있는 그리드 시스템이 주를 이루게 되었고, HTML과 CSS를 포함하는 시각적 라이브러리인 부트스트랩과 같은 프레임워크가 출현하였다. 또한, 스마트 디바이스에서 미디어 쿼리 등을 사용하여 동일한 콘텐츠 및 페이지를 해상도에 맞추어 작동하도록 만드는 반응형 웹 기술이 보급되었다.
이러한 점들을 바탕으로 향후 웹 디자인의 방향에 대해서 두 가지로 예측해 볼 수 있다. 첫째, AR(augmented reality) 콘텐츠를 기반으로 간결한 메타포 형태의 디자인이 확대될 것으로 보인다. 이는 가상현실(virtual reality, VR)의 한 분야로 실제로 존재하는 환경에 가상의 사물이나 정보를 합성하여 마치 원래의 환경에 존재하는 사물처럼 보이도록 하는 컴퓨터 그래픽 기법이다[12].
후속연구
웹 사이트는 디자인적, 기술적으로 1990년대 초부터 30년가량 빠른 속도로 변화하고 있다. 더욱이 4차 산업 혁명 시대의 새로운 패러다임을 맞이하며 디자인에 대한 고찰도 필요하다고 생각된다. 이에 필자는 웹의 초창기부터 현재까지의 흐름을 이해하고 웹 디자인의 현재 트렌드를 정확히 이해하는 것이 미래에 나아가야 할 방향을 잡는데 필요하다고 생각된다.
따라서 웹 디자인을 할 때 어포던스(Affordance)의 고려가 중요해졌고, 이는 어떤 행동을 유도한다는 뜻으로 행동 유도성이라고도 한다. 본 연구에서는 도널드 노먼(Donald A. Norman)이 인간과 컴퓨터, 즉 상호작용 분야에서 사용하기 시작한 어포던스 개념을 기반으로 연구를 수행할 것이다. 도널드 노먼은 ‘지각된’ 이라는 의미를 부각시켜 사물의 인지된 속성이나 실질적 특성이 곧 어포던스이며 이것이 바로 사물이 어떻게 사용되는지 결정한다고 보고 있다.
하지만, 자료 조사의 한계와 시각적 요소의 정량적 분석을 진행하지 못한 한계점이 갖고 있다. 연구 대상을 메인 페이지만으로 하였기 때문에 서브페이지의 디자인 표현 기법 및 기술적 기법에 대한 추가적인 자료 조사가 이루어져야 한다. 이는 시각적, 기술적 수치를 바탕으로 한 정량적 분석을 위해 향후 지속적인 후속 연구가 필요하다.
연구 대상을 메인 페이지만으로 하였기 때문에 서브페이지의 디자인 표현 기법 및 기술적 기법에 대한 추가적인 자료 조사가 이루어져야 한다. 이는 시각적, 기술적 수치를 바탕으로 한 정량적 분석을 위해 향후 지속적인 후속 연구가 필요하다.
이처럼 앞으로 발전되고, 확장될 웹 디자인 영역의 중요성을 인식하고, 다양하고 깊이 있는 연구가 필요할 것이다. 본 연구에서는 웹 디자인 분야의 변천 과정을 고찰하고, 분석하여 연구를 수행함으로써 불분명했던 웹 디자인 역사를 정의하였다는 데 의의가 있다고 판단된다.
둘째, 스마트 디바이스의 새로운 인터랙션 형태가 등장할 것 같다. 전체 스크린, 듀얼 화면, 리프팅 카메라, 폴더블까지 새로운 제품은 지속적으로 출시되고 있으며 이러한 형태의 디바이스 등장은 웹 페이지의 크기 변화가 아닌 여러 콘텐츠를 한꺼번에 탐색할 수 있는 새로운 인터랙션을 제공해야 할 것이다.
질의응답
핵심어
질문
논문에서 추출한 답변
오랜 기간 지속하던 미니멀리즘의 동질화가 심각하게 진행되어 개성이 없어지고, 간결하여 감정이 결핍되었다는 문제를 해결하기 위해 등장한 것은 무엇인가?
하지만, 오랜 기간 지속하던 미니멀리즘은 동질화가 심각하게 진행되어 개성이 없어지고, 간결하여 감정이 결핍되었다는 문제를 발생시켰다. 이러한 문제를 해결하고자 다양한 디자인 스타일이 등장하기 시작했고, 대표적으로 구글의 머티리얼 디자인(Material Design)을 꼽을 수 있다.
스큐어모피즘(Skeuomorphism)이란 무엇인가?
2000년대 중반에 들어서며 사용자가 낯선 컴퓨터 환경에 더욱 친밀감을 느낄 수 있도록 지각된 어포던스가 적용된 스큐어모피즘 디자인이 발전하였다. 스큐어모피즘(Skeuomorphism)이란 실존하는 사물과 유사한 형태로 표현하는 방식으로 장식적 요소가 강조되는 도구의 물질적인 형태를 그대로 모방한다는 의미를 가진다. 특히, 현실에서의 모습과 사물의 형태를 다른 매체에 그대로 재현하여 도구의 모양, 재질감 등을 실감나게 묘사하여 표현하는 특징이 있다[3].
현재 웹 디자인의 역사나 흐름에 대한 연구는 무엇이 주를 이루고 있는가?
이에 필자는 웹의 초창기부터 현재까지의 흐름을 이해하고 웹 디자인의 현재 트렌드를 정확히 이해하는 것이 미래에 나아가야 할 방향을 잡는데 필요하다고 생각된다. 그러나 현재 웹 디자인의 역사나 흐름에 대한 연구는 웹 아이덴티티, 웹 표준 및 웹 접근성, 웹 사용성 등이 주를 이루고 있다. 특히, 이론적으로 웹 디자인의 변천 과정을 정의한 연구는 진행되지 않았다.
AI-Helper
※ AI-Helper는 부적절한 답변을 할 수 있습니다.