방긋 웃을 수 있는 공간이란 무엇일까요?

아이스크림 가게 사장님에게도 미소를 찾아주기 위해, 우리는 몰랐던 편안함을 찾아냅니다.

Hejhome Square는 소상공인, 그리고 무인 매장 운영 등 소규모 공간을 관리하는 분들을 위한 공간 매니지먼트 서비스로, IoT부터 CCTV, 그리고 POS와 키오스크 시스템을 통한 매출 관리까지 상업에 필요한 모든 디지털 솔루션을 한데 담고자 하는 원대한 목표를 가지고 있습니다. 다만 일반소비자와 가까운 사장님이 이용하기엔 낯선 개념과 기술을 다루고 있고, 각각의 매장이 원하는 환경과 운영이 다르다는 도전 과제를 안고 있었습니다. 우리는 이에 대한 해답으로, 서비스를 이루는 기초단위부터 친근하며, 쉽게 설명할 수 있는 구조와 각각의 환경에 적응할 수 있는 반응성 있는 디자인 시스템을 만들어내고자 했습니다.

청사진이라면 한 가지 색이 필요하겠지만, 우리는 편안한 일상을 그리기 위해 색연필이 필요했습니다.

서비스와 함께, 디자인 시스템이 풀어야 할 과제는 크게 세 가지 부분이 있었습니다. 먼저, 종합적인 솔루션을 제공하기 위해 다양한 브랜드의 시스템이 우리의 경험 깊숙이, 그리고 일관적으로 연동되어야 했습니다. 그뿐만 아니라 가게의 모니터나 태블릿, 또는 사장님의 스마트폰 위에서 온전히 보여줄 수 있는 인터페이스를 가지고 있어야 했습니다. 마지막으로, 이 모든 것을 창업하기 시작하는 젊은 층, 그리고 이미 노련한 실력이 쌓인 장년층이 쉽게 이해할 수 있도록 준비를 갖추어야 했습니다.

모나지 않다는 건 포용할 준비가 되었다는 것이죠.

라운드스퀘어, 편안함의 심볼이자 아이디어를 쌓을 블럭.

아이콘부터 지오메트릭 한 서체, 그리고 레이아웃까지. 인터페이스의 모든 방향성은 Hejhome 브랜딩에서 영감을 받은 "라운드스퀘어(RoundSquare)" 형상을 따릅니다. 이는 단순한 디자인 언어임을 넘어, 확장성 있는 설계를 위한 "블록" 형태의 모듈 방식 인터페이스를 고안하는데 큰 기저가 됩니다.

"블록" 컴포넌트는 각 디바이스 및 서비스의 기능을 손쉽게 나누어 재구성할 수 있는 특성을 가집니다. 예로, 사용자가 위젯을 추가하듯 원하는 형태로 스스로 디바이스 기능을 짜맞출 수 있는 "대시보드"는 블록 디자인이 가장 적극적으로 적용한 부분입니다. 그 결과, 그 어떤 상용 IoT 서비스보다 다채롭게 정보를 표현하면서도, 각 기능이 손쉽게 정렬되어 사장님 사업에 딱 맞는 관리 체계를 만들어 낼 수 있게 되었습니다. 이런 설계는 비단 대시보드뿐만 아니라 기기 조작 패널, 카메라 멀티뷰 등 다양한 부분에서 정보량과 관계없이 일관된 조작을 제공할 수 있는 초석을 만듭니다.

규칙이란 색깔의 수식어로 수식을 만드는 것.

근래 "디자인 토큰"이 불러온 편의성의 혁명은 이를 더는 선택의 영역에 두지 않도록 했습니다. 더 많은 단계일수록 섬세한 토큰화(Tokenize)가 가능하겠지만, 우리는 능동적으로 조정하기 쉽도록 두 단계로 이루어진 간결한 형태의 토큰 구조를 만들었습니다. 이 구조는 각각의 스타일에 사용 위치와 맥락적 역할을 부여하는 "시맨틱 팔레트"가, 정의한 테마 및 상황에 따라 기본적인 스타일 데이터가 담긴 "베이직 팔레트"의 값을 달리 참조하는 형태로 구현합니다.

작성한 토큰 팔레트는 Next 및 Flutter 등 실제 개발 환경에서 유용하게 활용할 수 있도록 만들어야 합니다. 따라서 개발 환경에서 권장하는 포맷팅 스타일을 제안하고, 기준이 되는 토큰 라이브러리를 가공이 쉬운 JSON으로 작성했습니다. 이 과정을 통해 디자인-개발 작업흐름 간 소통 혼란을 줄이고, 보다 적극적인 토큰 사용을 장려했습니다.

대시보드 위젯이나 일러스트 등, 컴포넌트로 만들기 어렵거나 별도의 체계를 가진 변주적인 곳까지 우리의 스타일을 맥락에 맞게 적용할 수 있었습니다. 결과적으로, 스타일의 변인 통제를 도와, 테마나 브랜딩 등의 작업에서 강력한 편의성을 제공했습니다.

다정함이야말로 언어가 가진 힘이기에.

Hejhome Leende는 실제 개발에 사용되는 컴포넌트 및 스타일과 더불어, 글쓰기 규범(Writing System)을 중요하게 기술합니다. 브랜드 모든 영역에서 사용하는 톤-오브-보이스에 착안하여, Hejhome Square에서 통용하는 우리만의 어투를 새롭게 정의했습니다.

"사용자가 이해하고 스스로 해결할 수 있는 서비스"란 경험을 목적으로 ToV의 각 부분을 확장합니다. 눈높이에 맞는 가까운 거리감으로, 모호한 표현 대신 명쾌하고 간결한 방식을 통해 문제해결을 위한 "해답"이 아닌 "방법"을 제안합니다. 이것이 우리가 기술과 사용자 사이를 좁히는 디자인 시스템의 그 어떤 부분보다 중요한 부분임을 명심합니다.

달라질 일상을 전하기 위한 우리의 방식

Hejhome 브랜드는 국내 소비자용 IoT 제품 중 가장 높은 인지도를, 회사는 대규모 현장을 위한 맞춤형 IoT 컨설팅을 통해 B2B 시장을 선도하고 있었습니다. 하지만 소규모 B2B라는 시장은 이 두 영역에 있는 노하우를 한데 모아야 진입할 수 있는 분야였습니다.

디자인 시스템의 모듈형 디자인과 토큰 팔레트는 문제를 해결할 수 있는 다양한 협력사 시스템을 우리만의 방식으로 전달할 수 있도록 체화했으며, 글쓰기 규범은 우리의 기술이 사장님을 효과적으로 도울 수 있도록 고민할 수 있는 기준이 되었습니다. 이렇듯, Hejhome Leende는 "우리의 방향을 한 데 맞추는" 디자인 시스템의 가장 큰 장점을 통해, 우리가 소비자를 대하는 모습과 방향성을 보다 전문화된 시스템에 녹이는 융화제가 되어 새로운 고객층을 위한 서비스를 만들어 낼 수 있었습니다.