홈어시스턴트(HA)를 설치하고 자동화까지 마쳤다면, 이제 스마트폰 앱이나 거실 월패드를 열었을 때 보이는 화면을 가꿀 차례입니다. 처음 접속했을 때 보이는 기본 화면은 집안의 모든 기기가 무작위로 나열되어 있어 사용하기 매우 불편하죠.
"이거 어떻게 불 꺼?"라고 묻는 가족들의 원성을 잠재우고, 마치 전문 업체가 시공한 것 같은 세련된 컨트롤 패널을 만드는 UI(사용자 인터페이스) 배치 전략을 공유합니다.
1. 대시보드 설계의 골든 룰: '3클릭 법칙'
좋은 대시보드는 고민할 필요 없이 직관적이어야 합니다. 제가 수많은 시행착오 끝에 정리한 세 가지 원칙은 다음과 같습니다.
- 가장 많이 쓰는 기능은 첫 화면 상단에: 거실 등, 에어컨, 현관 도어락 등 매일 쓰는 기기는 앱을 열자마자 바로 보여야 합니다.
- 공간별 그룹화: 거실, 침실, 주방 등 실제 생활 공간에 맞게 탭(Tab)이나 섹션을 나눕니다.
- 정보와 제어의 분리: 온도, 습도, 전력량 같은 '정보'와 전등 끄기 같은 '제어' 버튼을 시각적으로 구분하세요.
2. 초보자를 위한 추천 카드(Card) 조합
홈어시스턴트는 '카드'라는 단위로 화면을 구성합니다. 다음은 제가 가장 추천하는 조합입니다.
- 그리드 카드 (Grid Card): 여러 개의 전등 버튼을 2x2나 3x3으로 배치하여 한눈에 들어오게 합니다.
- 버튼 카드 (Button Card): 단순한 스위치보다 아이콘 크기가 커서 조작이 쉽습니다. 상태(on/off)에 따라 색상이 변하게 설정하면 직관성이 높아집니다.
- 온도계 카드 (Gauge Card): 집안의 온습도를 바늘 게이지 형태로 보여주어 현재 쾌적도를 시각적으로 바로 알 수 있게 합니다.
3. 집사들의 비밀 병기: '조건부 카드' 활용하기
모든 버튼이 항상 화면에 있을 필요는 없습니다. 조건부 카드(Conditional Card)를 쓰면 대시보드가 훨씬 깔끔해집니다.
- 예시: 공기청정기가 켜져 있을 때만 필터 잔량 정보를 보여주기, 혹은 세탁기가 다 돌아갔을 때만 "세탁 완료" 알림 버튼을 띄우는 식입니다. 이렇게 하면 화면 공간을 효율적으로 쓰면서 필요한 정보만 강조할 수 있습니다.
4. 월패드(태블릿)를 위한 디자인 팁
집에 남는 태블릿이 있다면 거실 벽에 붙여 '스마트홈 월패드'로 변신시켜 보세요. 이때는 다음 두 가지만 기억하세요.
- 다크 모드(Dark Mode): 밤에 거실 불을 다 껐을 때 태블릿 화면만 너무 밝으면 눈이 아픕니다. 어두운 테마를 기본으로 설정하세요.
- 키오스크 모드: 다른 앱이 실행되지 않도록 홈어시스턴트 화면만 고정하는 설정을 활용하면 훨씬 전문적인 느낌을 줍니다.
5. 가족의 신뢰를 얻는 마지막 디테일
대시보드를 만들 때 가장 중요한 것은 사용자 친화적인 이름입니다. light.living_room_spotlight_1 같은 개발자용 엔티티 이름 대신, "거실 소파등"처럼 가족 누구나 이해할 수 있는 한글 이름을 붙여주세요. 작은 배려가 스마트홈에 대한 가족들의 거부감을 줄여주는 열쇠가 됩니다.
[7편 핵심 요약]
- 대시보드는 빈도수와 공간을 기준으로 위계질서를 세워 배치해야 합니다.
- 조건부 카드를 활용해 필요한 정보만 노출하면 UI가 훨씬 정갈해집니다.
- 가족이 함께 쓴다면 전문 용어 대신 친숙한 한글 명칭을 사용하세요.