brunch

You can make anything
by writing

C.S.Lewis

by Duotone 듀오톤 Jun 30. 2023

시선을 사로잡는 디자인, 3가지면 됩니다.

CX팀의 노하우, 좋아 보이는 것들의 비밀

듀오톤은 멤버들의 성장을 위해 인터널 세미나를 제공합니다. 이번 콘텐츠는 2023.06.12 에 진행되었던 ‘Internal Seminar, 좋아 보이는 것들의 비밀’을 주제로 다뤘습니다.


좋은 디자인엔 공통점이 있다.


소수의 ‘눈길을 끄는 것들’ 사이에는 분명한 공통점이 있습니다. 강력, 심플, 조화, 귀여움인데요. 시각적 요소 외에도 입소문을 내는 마케팅(Contagious)이나 입에 착 달라붙는 메시지(Stick!) 등 창의적이고 매력적인 작업물들에는 언제나 공통된 특성들이 발견됩니다.


그게 사실이라면 누구나 쉽게 훌륭한 결과물을 만들어 낼 수 있어야 할 텐데, 정작 현실은 그렇지 못합니다. 어째서 우리는 이런 아이캐처(eye-cather)를 만드는 과정이 어렵게만 느껴질까요?


아마도 ‘알아보는 것’과 ‘만들어 내는 것’이 완전히 다른 차원의 이야기이기 때문일 겁니다. 저희 듀오톤 CX팀의 최지훈 수석님께서는 그 비밀을 한 꺼풀 더 벗겨내 보았으며, 과정에서 배울 수 있었던 소중한 노하우를 저희 멤버들에게 공유해주셨습니다.


최지훈 수석 디자이너

최지훈 - 듀오톤 수석 디자이너

우리는 좋은 디자인을 일상에서 수도 없이 접합니다. 하지만 그럼에도 실무에서의 시각적 표현은 항상 어렵게 느껴지곤 하죠. 왜 그럴까요? 저희만의 고민이 담긴 노하우를 나눠보려 합니다.


좋아 보이는 디자인, 왜 그렇게 멋져 보일까요?


아주 간단한 비밀 - 그룹화(Grouping)


입시 미술의 꽃, 석고상 데생을 예로 들어보겠습니다

아그리파 데생

두 그림은 동일한 석고상의 그림입니다. 한눈에 보더라도 확실히 차이가 있죠. 하지만 왼쪽 그림에 간단히 한 가지 기법만 적용해 봐도 오른쪽 그림처럼 정밀하고 근사하게 바꿀 수 있습니다. 바로 면처리 즉, 그룹화(Grouping)입니다.


먼저 (1) 빛의 방향에 따른 그림자의 흐름 처리가 명확하게 표현되고 있는지, 그리고 그림자 안의 부위별 속성 즉, (2) 근육의 형태를 제대로 표현하고 있는지를 확인합니다. 그리고 마무리를 할 때는 (3) 1M 이상 떨어져서 실눈을 뜨고 전체적으로 거슬리는 것이 없는지를 체크해 봅니다.


결국, 그 면이 속한 속성을 잘 그룹화해주면 그림을 잘 그리는 것은 제법 수월해진다는 것입니다.

Key Point : 속성 파악 → 그룹화 → 체크


“그럼 실전에서는 어떻게 활용하면 좋을까요?”


앞서 언급 드린 데생의 노하우를 그대로 적용해 보겠습니다. 디자인에서는 하나의 콘텐츠를 근육, 즉 하나의 속성으로 바라보고 이것을 도형의 모양으로 그룹화해주면 됩니다.


한 가지 예를 들어보겠습니다.

(1) 콘텐츠 속성을 도형의 형태로 정리해 본 화면인데요. 많은 콘텐츠의 노출을 요구하는 디자인 업무의 특성상, 이런 화면 같은 배치는 꽤나 빈번할 것으로 보입니다. 하지만 해당 화면은 정리가 되어 보이는 듯하면서도 묘하게 밸런스가 무너진듯한 모습을 보이지 않나요? 왜 그럴까요?


정답은 한 화면에 다양한 면들이 분산되어 있기 때문입니다. 이러한 경우 면의 형태가 최대한 유사한 것들끼리 묶어주시면 좋습니다. 물론 그룹화(Gruoping)를 적용하는 방법은 더욱 다양하겠지만, 기본적으로 비슷한 형태들을 묶어주면 대부분의 문제들은 쉽게 해결이 됩니다.


자, 그렇게 유사한 속성들끼리 묶어주면 (2) 화면처럼 노출이 됩니다. 따라오는 예시 화면 (3)은 해당 속성들끼리 그룹화한 2번 설계 화면에 실제 이미지와 텍스트를 적용한 모습입니다.


이렇게 그룹화를 통해 단단한 구성을 갖춘다면 어떤 이미지와 텍스트가 들어가더라도 꽤 완성도 있는 결과물을 만들 수가 있습니다. 또한 정보 영역과 이미지 영역을 명확히 구분해 줌으로써 시선의 분산을 최소화하고 정보 전달의 몰입도를 높일 수도 있습니다.


자, 이렇게 그룹화를 배우고 나면 자연스레 할 수 있는 것이 생기는데요. 바로 대비 효과입니다.   


극적인 연출 - 대비 효과


: 대비 효과를 제대로 사용한다면, 굉장히 드라마틱한 시각 표현이 가능합니다. 보다 쉬운 이해를 위해 포스터를 예시로 들어보겠습니다.


안정적인 설계 구조

해당 포스터의 구조는 어떠한 카테고리에도 적용이 가능한, 굉장히 안정적인 설계 구조입니다. 하지만 대비 효과를 적용하면 조금 더 드라마틱한 연출이 가능한데요. 앞서 설명드렸던 그룹화 파트와 동일하게, (1) 콘텐츠의 속성 파악을 먼저 완료한 후 (2) 중요도에 따른 우선순위를 구분해 주시면 아주 쉽게 적용이 가능합니다.



대비 효과의 적용



이처럼 1순위 콘텐츠가 지면의 반 이상을 차지하게 만들어주고 나머지 2,3 순위 콘텐츠를 우선순위에 따라 배치 해주면 됩니다(1순위 콘텐츠를 먼저 눈에 띄게 하는 선에서 정리해 주면 좋습니다). 





이런 구성을 그대로 적용해 본다면, 하단의 포스터가 만들어지게 됩니다.

대비 효과가 적용된 포스터

이렇게 대비 효과가 잘 적용된 포스터는 여러 장의 그룹으로 존재하게 될 때 더욱 극적인 시각적 대비 효과를 일으켜 사람들의 시선을 사로잡을 수 있게 됩니다.


디자인 시각화 영역은 그룹화로 시작하여 그룹화로 마무리된다고 해도 과언이 아닙니다. 다양한 크기와 속성들끼리 그룹화하고 의도적인 대비를 연출하기 위한 연습을 소홀히 하지 않는다면, 분명 더 나은 결과물로 나아갈 수 있을 거라 생각합니다.


사랑에 빠져드는 디자인, 스토리텔링의 힘


사람들은 몰입에서 상당한 기쁨을 느낀다고 해요. 미적 황홀경, 무아지경이라고도 하죠. 다들 한 번쯤은 경험해 보셨을 거라고 생각합니다. 좋은 디자인을 만드는 과정에서도 몰입과 이를 통한 기쁨은 굉장히 중요한 역할을 하는데요. 듀오톤 멤버들이 디자인 속으로 딥 다이브 할 수 있도록 만들어주는, 저희만의 비밀을 공개합니다.

최민혜 책임과 최지훈 수석 디자이너

최민혜 - 듀오톤 책임 디자이너

긴 시간은 아니지만 지금껏 비주얼 작업을 하면서 든 생각은, 디자인하는 건 항상 좋고 재미있지만 어디인지 모르게 닿지 못하는 지점이 항상 존재했다는 거였어요. 그 부분에 대한 갈증이 항상 따라다녔는데, 지금의 멤버들을 만나 또 다른 방향으로 작업물을 바라보는 경험을 하면서 어느 정도 해소가 됐고 더불어 제가 디자인을 바라보는 시선에 대해 터닝 포인트가 된 것 같아요. 그래서 이에 대한 이야기를 들려드릴까 합니다


디자인은 소통이자 설득이다 - 서사 부여하기


서사를 부여하면 작업에 공감을 할 수 있게 됩니다. 단지 예쁘고 상황에 맞는 작업을 목표할 때와는 달리, 더욱 자연스럽고 좋은 작업물이 나오게 되더라고요. 디자인은 곧 소통이자 설득이라고 생각해요. 그리고 소비자와 소통하고, 또 설득하기 위해서는 먼저 작업자가 온전히 몰입할 수 있어야 한다고 생각합니다. 여기서 이야기는 참 유용한 장치가 됩니다.


스토리텔링의 힘을 느낄 수 있었던 저희 팀의 경험을 공유해 보겠습니다.


L’oreal winter project - 제작 과정 들여다보기

로레알과 네이버 쇼핑이 함께 진행한 ‘뷰티 원더랜드 페스타’는 2022년 1월 진행된 온라인 라이브 쇼핑 프로젝트입니다.

L’oreal Winter는 ‘WonderLand’라는 가상의 세계에서 ‘아름다움을 찾기 위한 여행을 떠난다’는 스토리를 부여하고 시작한 프로젝트입니다. 솔직히 처음에는 조금 과하다고 생각하기도 했어요. 어떻게 보면 그냥 제품 구매 촉진 이벤트라고 보일 수도 있었거든요. 하지만 이제 와서 이 프로젝트의 성공 요인을 돌아보면, ‘스토리텔링을 통한 공감’이 정말 큰 역할을 해냈다는 확신이 들어요.



스토리는 특정한 상황에서 어떻게 행동해야 하는지에 대한 기준과 지침을 마련해 줍니다. 때문에 여러 시안들에서 브랜드로 하나로 묶기 위해 고군분투할 필요도 없었고, 자연스럽게 ‘내가 각 테마에 맞는 여행을 간다면 어떤 분위기가 될까?”라는 질문을 떠올리게 되었어요. 단순히 제품을 판매하는 프로모션이 아니라, ‘원더랜드로 떠나는 나만의 여행이야기’라는 스토리가 백그라운드에 단단히 깔려 있었기 때문에 비주얼 작업 과정이 굉장히 수월해졌으며, 퀄리티 또한 높아질 수 있었다고 생각합니다.


디자인을 하면서 가장 피해야 할 태도는 아무런 생각도, 의견도 없는 상태 같아요. 단지 기획과 와이어 프레임만을 따라가기보단, 작업하면서 해당 테마만의 이야기를 연출해 보면 좋을 것 같습니다. 일단 작업자의 시선이 달라지고 나면 작업을 보는 사람들의 시선도 달라지게 될 테니까요.


함께 성장하는 곳, Duotone


최지훈 수석 디자이너와 최민혜 책임 디자이너의 노하우를 배울 수 있는 귀중한 시간이었습니다. 덕분에 스스로에게도 사랑스럽고, 남들에게도 좋아 보이는 작업을 할 수 있을 것 같아 참 설레는 마음입니다. 그룹화와 대비 효과, 스토리텔링에서 이어질 멤버들의 또 다른 디자인 방정식들이 정말 기대가 됩니다.


저희 듀오톤은 이처럼 주기적인 세미나를 통해 서로의 고민과 통찰을 나누고 발전하도록 끌어주고 있습니다. 모두에게 유익한 시간이었길 바라며, 참석한 멤버들의 후기를 끝으로 Internal Seminar, ‘좋아 보이는 것들의 비밀’ 마치겠습니다.


UI 조혜수

일상생활 속에서 막연하게 좋아 보이는 것들을 실무에서는 어떻게 적용할 수 있을지 고민이 많았는데 강의를 통해 알아갈 수 있어 도움이 되었습니다. 또한 주제마다 상세한 예시와 함께 설명을 해주셔서 이해가 훨씬 수월했습니다. 마지막으로 질문의 상세한 답변을 들으며 더 즐겁게 디자인을 하는 방법과 주니어로써 어떻게 디자인을 해나갈지에 대해서도 알아볼 수 있어 유익한 시간이었습니다.


UXD 이청아

스스로 좋아 보였던 것들이 무엇이 있었나 돌아볼 수 있는 좋은 강의였습니다. 앞으로 어떤 작업을 볼 때 ‘왜, 어떻게 좋은지’ 한 번쯤 고민해 볼 것 같습니다. 상세한 예시 덕분에 쉽게 이해할 수 있어서 더욱 좋았고, 주니어로서 실무에 적용할 수 있는 지식을 얻음은 물론 디자이너로서 가져야 할 스탠스를 한 번에 익히는 좋은 기회가 되었습니다.




Salmon Inspiration은 듀오톤 멤버들이 성장을 위해 수행하는 다양한 활동들을 담은 콘텐츠입니다.

Speaker : 최지훈 수석, 최민혜 책임

CX Current

: 디자인 크리에이션 부분, 아이디어 발상과 이에 따른 시각적 표현에 강점을 지닌 커런트입니다.


세미나 목차

1. 아주 간단한 비밀 - 그룹화(Grouping)

2. 극적인 연출 - 대비 효과

3. 사랑에 빠져드는 디자인 - 스토리텔링  

매거진의 이전글 사용자의 시선을 쫓는 Eyetracker 2
브런치는 최신 브라우저에 최적화 되어있습니다. IE chrome safari