brunch

매거진 CX 딥다이브

라이킷 26 댓글

You can make anything
by writing

C.S.Lewis

계정을 잊어버리셨나요?

by 지성민 Nov 26. 2023

공간을 채우는 것은 무엇일까?

일상에서 찾을 수 있는 디자인 영감

CX 딥다이브 매거진은 디자인을 보는 시각을 넓히고 CX(크리에이티브한 경험과 아이디어)를 UI 디자인에 적용하는 방법에 대해 영감을 주고자 개설하였습니다. 단순히 보이는 게 전부가 아닌 더 깊이 본질을 생각해 보고 아이디어를 도출하여 시각화하고자 합니다. 사실 제가 가장 하고 싶었던 주제이기도 합니다. 아마도 실용적인 디자인과는 거리가 어느 정도 있는 내용들이 많겠지만 최대한 실용적으로 도움이 될 수 있도록 사례들을 만들어 보도록 하겠습니다.

예로부터 디자인 거장들의 명언 중 빼놓지 않고 등장하는 문구가 있습니다.

디자인은 우리 일상의 소소한 부분에서 영감을 얻습니다. 그래서 우리는 주변을 항상 유심히 관찰해야 합니다.

일상의 경험을 UI 디자인까지 가져온다는 것은 말이 쉽지 어렵습니다. 일상은 여행이 될 수도, 전시회가 될 수도, 아니면 친구들과의 술자리가 될 수도 있습니다.

첫 번째 글은 여행으로부터 시작됩니다.

최근에 평창을 여행하였습니다. 여행 도중 메밀꽃 필 무렵의 작가인 이효석 문학관을 가게 되었는데요. 이곳에는 효석 달빛 언덕이라는 곳이 있습니다.

효석 달빛 언덕의 전경

이 달빛 언덕에는 또 하나의 설치 작품이 있습니다. 바로 이호영 작가님의 오래된 정원 - 푸른 기다림이라는 작품입니다.

출처 https://blog.naver.com/7607song/221666152434

위의 사진을 유심히 보면 큰 의자 말고 물 안에 작은 의자들이 있습니다. 큰 의자보다는 이 작은 의자들이 포인트입니다. 작은 의자들은 물에 의해 점점 부식되어 갑니다. 이 작품에 대한 작가의 해설은 다음과 같습니다.

"고요한. 가을 들녘. 하늘거리며 피어 있는 꽃들. 그들 사이. 피어나는 의자 위, 그리고 녹들. 녹의 질료, 색감은, 촉감은 하나의 시선에서 아름다울 수 있다. 또한 추할 수도 있다. 그러한 색감은 건조함과 더불어 화려할 수도 있다. 철의 주검을 의미하기도 하는 녹, 철의 부식은 다른 이질적인 것과의 결합을 의미하기도 한다. 만지고 느낄 수 있는 것들 속에 녹은, 철이 가지는 차가움을 감추고 따뜻함을 드러낸다."

좀 어렵게 서술하신 바도 있지만 제 생각을 담아 쉽게 풀자면 이렇습니다.

"시간이 흘러 녹이 슬어야 비로소 이 작품이 완성된다. 결국 이 공간을 채우는 것은 시간의 흐름이다."

더 어려우신가요? 죄송합니다...

제가 느낀 결론은 "이 작품은 특정 공간에 설치되었지만 이 공간을 채우고 있는 것은 공간이 아닌 시간이다."라는 것이 제가 받는 느낌이었습니다. 그렇게 그러한 생각을 한켠에 지니고 있던 도중 어떤 사이트 하나를 만나게 됩니다.

서핏과 Awwwards에서 소개된 사이트입니다. 사이트 명은 Press Play On Tape입니다. 이 회사의 정체성은 사운드 디자인 스튜디오입니다. 링크는 아래와 같습니다.

Press Play On Tape - Your Multidisciplinary Sound Creation Studio in Paris

Meet Press Play On Tape, the Paris-based sound studio at the intersection of sound design and composition. From audio branding to interactive storytelling, w...

pressplayontape.studio

서핏에 아웃링크 된 썸네일은 아래와 같습니다.

Press Play On Tape의 대표 썸네일

처음 썸네일을 보고 클릭하기 전까지는 최근 유행하는 네오 브루탈리즘 기법의 웹사이트라고 생각했습니다. 그러나 클릭하고 들어간 웹사이트에서는 이 모습은 아주 잠시 나올 뿐입니다. 나타났다 사라지죠. 그리고 아래와 같이 화면이 정지됩니다.

메인 화면의 시작

처음엔 뭐지 에러인가? 하고 기다렸는데 아니었습니다. 스크롤을 내리면 컨텐츠들이 소개가 됩니다만 초기화면의 시작은 위의 이미지에서 멈춥니다. Studio 메뉴를 클릭해 보았는데 아래와 같습니다.

Studio 화면의 시작

왜?

그렇다면 왜 이렇게 제작되었을까요? 도메인 명과 기업의 정체성을 보면 답이 나옵니다. 해당 기업은 사운드 디자인을 하는 기업입니다. 즉 자신들이 만든 사운드가 가장 핵심 컨텐츠임과 동시에 정체성이기도 합니다. 이에 따라 사용자를 오직 사운드에만 집중시키기 위해 시각 요소마저 전부 생략하였습니다. 소리에 집중하려면 눈을 감게 되는 인간의 심리를 반영한 것이죠. 그 결과 위와 같은 디자인이 나오게 된 것입니다. 하지만 우리는 음소거를 많이 해놓죠. 그에 대한 보완으로 해당 페이지를 보시면 플레이 버튼만 움직임을 갖고 있습니다. 시선이 가게 말이죠.

모바일 화면도 마찬가지입니다.

Home, Studio의 모바일 페이지

이글의 핵심 포인트

위의 설치 조형물은 빈 공간을 시간으로 채웠고, 아래의 웹사이트는 빈 공간을 사운드로 채웠습니다. 공간을 채우는 요소를 제한하여 가두지 말고 더 넓은 시야로 바라보세요.

이제 응용 사례 제작을 통해 조금 더 다가가 보도록 하겠습니다.

사례 1.

청소전문 기업의 회사소개 페이지의 첫 화면입니다. 아래의 흰 배경의 페이지는 비어 있는 공간이 아닌 인간이 할 수 있는 가장 궁극의 깨끗함(#FFFFFF)입니다. 이후 스크롤을 유도하면서 다른 내용으로 이어지게 됩니다. 이러한 접근법은 스토리텔링 기반의 시나리오와 결합하면 보다 양질의 컨텐츠로 부각될 수 있습니다. 궁금증을 유발하거나 호기심을 갖도록 하는 광고에서도 많이 쓰는 전개 방식입니다.