"있어보이게" 디자인 하는 방법 1부

안녕하세요 키다리디자이너입니다.

오늘은 웹디자인을 "있어보이게"하는 방법에 대해 얘기해 알아보겠습니다.

경력이 많으신 분이나 디자인에 자신 있으신 분들에게는 이번 포스팅이 쓸모 없을 수도 있겠지만 키다리디자이너가 웹디자인을 하며 시간을 절약하며 나름 있어보이게 디자인하는 노하우를 풀어볼게요.

 

※ 아래 캡쳐화면들은 키다리디자이너가 특별한 의미 없이 주관적인 의견으로 선별했으며 해당 회사와 키다리디자이너와는 아무런 연관도 의미도 없습니다. 또한 본 캡쳐이미지는 현재 해당 회사의 홈페이지와 차이가 있을 수 있습니다.

 

 

1. "포인트"를 정확히 캐치하자

 

일반적인 웹디자이너분들은 디자인을 하기 전에 항상 어떻게 만들 것인가 고민하며 벤치마킹할만한 다른 웹사이트들을 뒤적거릴 거에요.

이것은 당연한 순서이며 경력이 많든 적든 디자이너라면 필연적으로 하게 되는 절차입니다.

하지만 경력이 많을 수록 그 고민하는 시간이 많이 줄어들겠죠.

저는 그것이 디자인 해야할 작업물의 "포인트(?)"를 잡아내는 능력때문이라 생각합니다.

무슨 말이냐 하면..

예를 들어 상품소개를 위한 웹페지를 만들어야 한다면 경험이 많은 디자이너라면 그 상품에서 느껴지는 디자인적인 컨셉과 느낌을 캐치하는 능력이 신입보다 훨씬 빠릅니다.

이런 느낌을 정확히 캐치했다면 이제 컬러를 정하고 바로 그려나가면 되는 것이죠.

만약 이런 느낌을 정확히 캐치하지 못했다거나 아예 느낌을 알지도 못한채 타사이트를 모방해서 바로 캔버스에 옮겼다면 보기 싫은 디자인이 나오는 것은 당연합니다.

 

그럼 아래 사이트들을 보실게요.

 

 

첫번째 사이트는 레모나 공식사이트입니다.

레모나의 상큼한 레몬색 컬러와 깨끗한 느낌의 아이유 사진들이 매치가 잘 되어 있죠.

 

두번째는 퓨마의 이벤트 홈페이지로 이 또한 역동적이고 스포티한 느낌이 잘 살아 있습니다.

 

그럼 아래 사이트는 어떤가요?

 

 

KB국민카드의 보험서비스 섹션입니다.

중앙의 텅빈 영역에 가족으로 보이는 의미없는 사진이 놓여 있습니다.

누가 보아도 금융, 보험과 전혀 어울리지도 않고 차라리 공공기관 홈페이지같은 느낌을 주고 있습니다.

 

이렇게 웹사이트가 말하고자 하는 바를 캐치하고 표현하는 것과 그렇지 못한 홈페이지는 느낌의 차이가 큽니다.

 

이것은 툴을 잘 다루고 디자인 경력이 많아 예쁘게 꾸미는 것과는 별개로 경력이 많은 디자이너들도 이 '포인트'를 짚어내는 능력이 부족한 사람이 태반입니다.

 

 

2. 강약을 확실하게 넣자.

 

모든 예술작품에는 기승전결이 있고 완급조절 등이 어우러져야 더욱 멋진 작품이 됩니다.

웹디자인도 마찬가지겠죠. 이것은 특히 우리나라에서 선호하는 것 같습니다.

 

광고와 웹사이트, 미디어가 매일 홍수처럼 쏟아져 나오는 현실에서 내가 만든 사이트를 하나부터 열까지 뚫어져라 쳐다보고 감상하는 사람은 없습니다.

일단 봤을때 한눈에 확 들어오지 못한다면 그것은 실패한 디자인이 될 확률이 높습니다.

 

그럼 아래 사이트를 보겠습니다.

 

 

 

 

 

어떤가요?

한눈에 그 사이트가 말하고자 하는 바가 확실히 들어오는 것 같습니다.

 

사이트 내 이미지와 텍스트들의 강약조절도 효과적으로 한다면 더욱 멋진 디자인 결과물이 나오게 됩니다.

 

그럼 아래 사이트를 보시겠습니다.

 

 

 

어떤가요?

보는 사람으로 하여금 첫눈에 시선을 잡아 끌지 못하고 지루한 느낌을 주는 것 같습니다.

 

멋진 디자인의 웹사이트들이 많지만 특별히 하나 꼽으라면 웹사이트 디자인의 강약 조절을 가장 잘 하는 곳은 역시 네이버가 아닐까 합니다.(저는 네이버라는 회사를 그다지 좋아하지는 않습니다.)

 

그들의 디자인 결과물은 보는 사람으로 하여금 시선을 어디로 끌어서 어디로 유인할지에 대한 많은 연구가 뒷받침 되고 있다는 것을 느끼게 합니다.

물론 디자인 자체도 예쁘게 하구요..

그래서 많은 사람들이 네이버의 그것을 따라 하고 또한 선호하는 지도 모르겠습니다.

 

 

3. 큰그림부터 그리자.

 

보통 초급 디자이너들이 디자인을 할 때 작은 아이콘이나 이미지, 텍스트같은 세세한 것에 집착하는 나머지 큰 그림을 놓치곤 합니다.

 

이것은 정말 안좋은 습관입니다.

 

그림을 그릴때.. 예를 들어 사람의 두상을 뎃생할 때도 눈,코,입을 먼저 그리지 않습니다.

그리고자 하는 두상의 골격의 비율과 크기를 잡고 이목구비를 다듬어 갑니다.

찰흙이나 조각으로 만들 때에도 마찬가지입니다.

 

웹디자인을 할 때에도 반드시 큰 그림부터 잡아 나가세요.

전체적인 비율과 구도, 레이아웃을 먼저 러프하게 잡고 나면 그것들을 꾸미면 됩니다.

본인에게 주어진 시간을 눈에 잘 띄지도 않는 작은 것에 다 쏟아붓는 행동은 하지 말기 바랍니다.

 

 

4. 컬러는 미리 정하자.

 

색을 사용하는데 능숙한 사람이 아니라면 디자인을 할 때 자연스럽게 어울리는 컬러의 조합을 찾아내기란 쉽지 않습니다.

이것은 웹디자이너 경력자들도 마찬가지입니다.

컬러에 대한 학습을 제대로 받지 못했거나 감각이 부족하다면 그것이 저절로 키워지지는 않습니다.

이것은 특별한 방법이 없습니다.

스스로 컬러에 대해 심도있는 학습을 하거나 컬러 배치가 잘된 디자인의 컬러팔레트를 그대로 사용하는 것 외에는요..

이렇게 컬러 팔레트를 확실하게 정하고 디자인한다면 한층 안정적이고 세력된 느낌의 결과물을 만들 수 있습니다.

 

 

오늘은 여기까지 이야기 하려고 합니다.

예시로 들었던 스크린샷들이 다소 비약이 있고 적절하지 못해도 이해해 주세요. 저도 생각보다 적절한 예시를 고르기 쉽지 않네요 ㅎㅎ

요즘 제가 게시글이 뜸한 편인데 좀 더 분발해서 좋은 포스트 드리도록 노력하겠습니다.

모두 즐거운 하루 되시길 바랍니다~