Home Assistant 3분 소요

스마트홈 화면을 일러스트레이터에게 맡긴다면, 우리 집 그림이 더 편할까요?

핵심 요약

  • 집 그림을 활용한 대시보드에서는 기기가 놓인 위치를 보고 찾아 조작합니다.
  • 일러스트를 그리는 일과 스마트홈 기기를 연동하는 일은 각각 설계해야 합니다.
  • 그림 속 사물의 크기와 상태 표시 방식에 따라 조작하기 편한지가 달라집니다.
  • 거실처럼 익숙한 공간부터 적용해 기존 화면과 어느 쪽이 쓰기 편한지 비교해볼 수 있습니다.

스마트홈 기기가 늘어나면 제어 화면에서 찾아야 할 항목도 많아집니다. 조명 하나를 켜려고 기기 이름을 훑다 보면, 차라리 우리 집 그림에서 그 조명을 누르면 편하겠다는 생각이 듭니다. 여러 스마트홈 기기를 한곳에서 관리하는 Home Assistant에 이런 화면을 만들면 조작이 좀 더 편해질까요?

기기 이름을 찾는 대신, 방을 찾습니다

가령 대시보드에 거실 조명 1, 거실 조명 2, 거실 조명 3이 있다고 해보겠습니다. 설정한 사람은 각각 어느 조명인지 알겠지만, 다른 가족은 소파 옆 스탠드가 몇 번인지부터 알아야 합니다.

집 그림을 쓰면 기기를 찾는 방식이 달라집니다. 거실의 소파 옆에 스탠드를 그려놓고, 그 부분을 누르면 해당 조명을 조작하도록 연결하는 겁니다. 사용자는 기기 이름을 외우는 대신 공간 속 위치를 떠올리면 됩니다.

집에서 늘 보던 배치를 화면에서도 그대로 쓸 수 있다는 점이 이 방식의 매력입니다. “소파 옆 불을 켜야지” 하고 생각하면 화면에서도 그 자리로 손이 가는 것이죠. 다만 실제로 더 빨리 조작할 수 있는지는 그림의 구도와 화면 크기에 따라 확인해야 합니다.

일러스트 의뢰서에도 작동 방식이 필요합니다

일러스트레이터에게 “우리 집을 예쁘게 그려주세요”라고 부탁하는 것만으로는 조작 화면에 무엇이 필요한지 전달하기 어렵습니다. 눈으로 감상할 그림과 손으로 누를 화면은 신경 써야 할 부분이 다르기 때문입니다.

예를 들어 실제 스탠드는 소파보다 훨씬 작습니다. 그 비율을 태블릿 화면에 그대로 옮기면 손가락으로 누르기 어려울 수 있습니다. 조작할 물건은 조금 크게 그리거나 주변에 충분한 여백을 두어 누르기 편하게 조정해야 합니다.

기기 상태를 어떻게 보여줄지도 의뢰 단계에서 정해두면 좋습니다. 조명이 켜졌을 때는 밝게, 꺼졌을 때는 어둡게 보이도록 그림을 각각 준비하는 식입니다. 색만으로는 구별하기 어려운 사람도 있으므로, 짧은 상태 문구나 표시를 함께 넣는 방법도 고려할 수 있습니다.

여기서 그림 제작과 기기 연동은 별개의 작업입니다. 그림 위에서 누를 영역을 정하고, 그곳을 눌렀을 때 실제 기기가 작동하도록 연결해야 합니다. 일러스트레이터에게 어디까지 맡길지, 대시보드는 어디까지 구현할지 미리 정해두어야 어떤 결과물을 받을지도 분명해집니다.

예쁜 집 그림이 복잡한 메뉴가 되는 순간

집 전체를 한 화면에 담으면 보기에는 근사할 수 있습니다. 하지만 방이 많아질수록 화면 속 기기는 작아집니다. 벽걸이 태블릿에서 누르기 좋았던 조명이 휴대전화에서는 작은 점처럼 보일 수도 있습니다.

이럴 때는 조작을 두 단계로 나눠볼 수 있습니다. 집 전체 그림에서 거실을 선택하면 거실 화면이 열리도록 만드는 방식입니다. 화면을 한 번 더 거쳐야 하지만, 그만큼 각 기기를 크게 보여줄 공간이 생깁니다.

모든 기능을 그림 안에 넣을 필요도 없습니다. 조명을 켜고 끌 때는 그림 속 사물을 직접 누르는 방식이 잘 맞습니다. 반면 밝기를 정확히 조절하려면 슬라이더가 필요할 수 있습니다. 그림에서 기기를 찾은 뒤, 세부 설정은 익숙한 조작 요소로 다루도록 구성할 수 있습니다.

특히 명령과 실제 상태를 구분해야 합니다. 조명 그림을 누르자마자 불이 켜진 모습으로 바꾸면, 연결이 끊겼을 때 실제 집과 화면이 어긋날 수 있습니다. 기기에서 확인한 상태를 화면에 어떻게 보여줄지도 함께 설계해야 합니다.

우리 집에 맞는지 확인하려면, 거실부터 시작해보세요

처음부터 집 전체를 의뢰하기보다는 한 공간에서 기기를 어떻게 조작할지 먼저 정해보는 편이 좋습니다. 예를 들어 거실의 천장등, 스탠드, 커튼이라는 3개 기기만 대상으로 삼을 수 있습니다.

간단한 스케치만 있어도 확인할 것은 많습니다. 가족에게 “스탠드를 켜보세요”라고 했을 때 따로 설명하지 않아도 위치를 찾는지 살펴보는 겁니다. 커튼 그림을 누르면 바로 움직일 거라고 생각하는지, 별도 메뉴가 열릴 거라고 생각하는지도 확인할 수 있습니다.

기존 목록 화면에서도 같은 일을 해보면 비교하기 쉽습니다. 그림에서 더 오래 헤매거나 다른 물건을 자꾸 누른다면 그림을 어떻게 바꿀지 살펴봐야 합니다. 이때 문제를 찾아 고쳐두면, 일러스트를 완성한 뒤 다시 수정해야 하는 부담도 줄어듭니다.

나중에 기기를 추가하거나 바꿀 때도 생각해야 합니다. 스탠드 하나를 추가할 때 집 그림 전체를 다시 손봐야 한다면 번거롭습니다. 배경과 조작할 사물을 따로 교체할 수 있게 그려달라고 요청하면 이후에 수정하기도 수월해집니다.

저는 집에서 익숙한 위치를 화면에서도 찾아 누를 수 있다는 점이 일러스트 대시보드의 장점이라고 봅니다. 얼마나 잘 만든 화면인지는 가족이 원하는 기기를 쉽게 찾고 현재 상태를 정확히 읽는지로 판단할 수 있습니다. 조명 이름을 고르는 일과 그림 속 조명을 짚는 일 중 어느 쪽이 가족에게 더 자연스러운지 직접 비교해보면 좋겠습니다.

Home Assistant 스마트홈 UX

댓글

    댓글을 불러오는 중...