웹사이트 비주얼영역의 비밀
웹사이트 구축에 있어 비주얼영역은 디자인 구현 전략에 있어 가장 중요한 항목 중 하나.
웹사이트의 첫인상을 결정짓는 비주얼영역은 웹사이트를 구축하는 프로젝트 디자인 구현 전략에 있어 가장 중요한 항목 중 하나이다. 프로젝트의 목적과 클라이언트의 요구사항이 천차만별이듯.
메인 비주얼영역도 그에 맞는 형태를 취해야 한다. 이번 장에서는 목적에 부합되면서 멋진 비주얼까지 지닌 메인 비주얼영역 구현 전략에 대해 고민해 보려고 한다.
① 올바른 제작 프로세스 세우기
비주얼영역은 크게 이미지 혹은 영상과 텍스트의 조합으로 이루어진다. 효과적인 구현전략을 수립하기 위해서는 구현 ‘콘셉트’를 선정한 후 그에 따른 이미지 구현과 카피라이팅이 진행돼야 한다.
메인 비쥬얼영역에 대한 고민은 대부분 프로젝트 초반에 이루어지기 때문에, 고객사와 원활한 커뮤니케이션을 통해 신뢰감 형성이 중요하다. 보다 능동적인 자세로 효과적인 구현전략에 대한 리서치와 설득의 과정이 필요한 부분이다.
메인 비주얼 구현 전략 수립 ▶ 비주얼영역 콘셉트 정의 ▶ 그에 맞는 카피라이팅 요청 및 이미지 요청 혹은 제작
② 추상적인 것보다 직관적인 것
추상적인 것은 상대적으로 공감을 이끌어내기 쉽지 않다. 실제로 존재하는 것 그리고 고객이 공감할 수 있는 포인트를 제대로 포착하는 것이 중요하다. 다음의 몇몇 사례를 살펴보자.
디지털 에이전시 ‘디파이’ 웹사이트(www.dfy.co.kr): 직접 촬영한 사무실 및 직원들의 영상을 활용해 디파이의 이미지를 효과적으로 전달하고 있다.
한화 채용사이트 ‘한화인’(www.hanwhain.com): 실제 근무하는 직원들의 사진은 텍스트 못지않은 시각적 전달력을 지니게 된다. 
③ 뻔한 느낌을 피하자
아직까지 다수의 구축 프로젝트에서 스톡이미지를 활용하고 있다. 제작환경 때문에 부득이하게 스톡이미지를 사용하다 보면 아무래도 비슷한 느낌과 어디서 본듯한 느낌을 피할 수 없다.
스톡이미지를 사용할 때에는 이러한 ‘정형화된 느낌’을 피하고 ‘자연스러움’에 중점을 두고 선정하도록 하자. 스톡이미지도 퀄리티에 따른 등급이 있기 때문에 비용과 퀄리티 사이에서 적절한 대안을 제시하는 것 또한 디자이너의 역할이다.
④ 괜찮은 ‘무료 이미지 사이트’를 이용해보자.
최근에는 상업적 제약이 없는 고퀄리티의 무료 스톡이미지 사이트가 많다. 굳이 비싼돈을 들이지 않고서도 만족할만한 결과물을 얻을 수도 있으니 다양한 무료 이미지 사이트들을 이용해 보는 건 어떨까. 
Unspalsh (www.unsplash.com)
PEXELS (www.pexels.com)
PicJumbo (www.picjumbo.com)
DesignersPics (www.designerspics.com)
⑤ 웹 트렌드를 바탕으로 구현돼야 한다.
비주얼영역은 텍스트와 이미지의 결합을 넘어 타이포그라피와 아트워크라는 한 단계 높은 시각언어로 구현의 형태가 다양하게 진화하고 있다. 시시각각 변하는 웹 트렌드에 대응하기 위해 트렌드에 대한 높은 이해를 바탕으로 구현해야 한다. 목적에 따라 적합한 트렌드가 무엇인지 살펴보자.
⑤-① 고퀄리티의 자연스러운 이미지
최근 웹 트렌드는 디지털 아트워크보다 고퀄리티의 사진 및 영상이 주류를 이룬다. 좋은 퀄리티의 이미지는 웹사이트에서도 강력한 시각적 효과를 지닌다. 디지털 보정을 많이 거친 이미지보다 적절한 조명에서 잘 촬영된 사진, 뻔한 구도보다는 감각적인 구도, 크롭된 형태 등 매력적인 이미지로 보이기 위한 요소는 다양하다.
www.christopherireland.net
⑤-② 타이포그라피
타이포그라피는 효과적인 그래픽 요소로써 시각적인 효과와 메시지를 좀 더 효율적으로 전달할 수 있다. 몇 년 전에는 캘리그라피 형태가 유행이었다면 지금은 레터링 스타일, 사진과 글자의 뎁스 차이를 두어 합성하는 그래픽 효과 등 웹사이트 제작에 적합한 다양한 타이포그라피 형태가 있다. 
www.apothecary87.co.u
⑤-③ 동적인 배경화면
움직이는 영상 및 시네마그래프는 정지화면보다 사람들의 이목을 더욱 집중시킨다. 예전에는 용량과 속도 등 웹사이트에서 영상을 구현하기 힘들었다면, 지금은 그런 것들이 큰 문제가 되지 않는다.
www.http://www.studiomarani.it
⑤-④ 심플한 구성
단순한 배경과 오브젝트를 간결하게 배치해, 오브젝트가 지닌 콘텐츠 전달에 적합한 레이아웃이다. 앱 소개 페이지, 특정 서비스를 소개하는 마이크로사이트 등에 적합한 레이아웃.
www.crispytheme.com/gotham
마치며
외국의 웹사이트와 우리나라 사이트를 비교해 볼 때 다양한 형태와 레이아웃이 공존하는 외국과 달리 아직 국내 웹사이트는 단조로운 면이 없지 않다. 추측하건대, 주어진 일정 안에서 ‘비주얼영역’에 대한 충분한 시간이 할당되는 경우가 적을 것이라 생각된다. 그래서 안정적인 레이아웃과 비교적 고객사의 승인을 받을 수 있는 보편적인 형태로 디자인이 되는 것이 디자이너로서의 효율적인 전략 중 하나일 수도 있다.
하지만 비주얼영역은 말 그대로 웹사이트의 시각적인 특징을 부여하는 중요한 부분이기 때문에 디자이너만의 재기발랄한 고민이 스며든다면, 비슷한 다른 웹사이트들보다 눈에 띌 수 있는 멋진 웹사이트로 거듭날 수 있을 것이다.
디자인 콘셉트 단계 초반에 웹사이트의 비주얼영역에 대한 고민을 선행하며, 고객사에 효과적인 형태를 능동적으로 설득하고 구현할 수 있다면, 고객과 사용자 모두의 눈을 즐겁게 해줄 수 있는 충분히 매력적인 웹사이트가 될 것이다.
권오형 wizrdbass@me.com
프리랜서 디자이너로 일하고 있으며, 5bro라는 이름의 브런치 작가로 활동 중이다(brunch.co.kr/@5bro). 최근에는 ‘웹사이트 디자인 제작기’라는 주제로 웹사이트 디자인 실습 강좌를 진행하고 있다.
