[OpenClaw] 봇이 일을 잘했는지 내 눈으로 보고 싶었다 — 귀여운 봇 대시보드 만들기

📝 한줄 요약

슬랙으로는 봇에게 일을 시킬 수 있었지만, 봇이 실제로 무엇을 적어 두었는지는 볼 수 없었습니다. 그래서 봇에게 자기 방(워크스페이스)을 보여 주는 대시보드를 만들게 했습니다. 지금은 Tailscale로 연결된 제 기기 어디서든 열어 보고 고칠 수 있습니다.

바쁘시면 이것만 읽어도 돼요:

• 도구와 목표: OpenClaw 봇 "댕댕이"에게 자기 방을 보여 주는 대시보드를 만들게 했다. 맥미니 앞에서만 보이던 파일을 다른 기기에서도 본다

• 깨달은 점: 결국 원했던 건 대시보드가 아니었다. 봇이 일을 잘했는지 내 눈으로 확인하는 창이었다

• 핵심 해결: 외부에 열지 않고, Tailscale로 연결된 내 기기에서만 열리게 했다

• 인상적인 순간: "수정도 되게 해 줘" 한마디에, 저장하기 전 자동 백업과 덮어쓰기 방지까지 알아서 붙였다

• 막힌 순간: 봇이 "Tailscale이 설치돼 있지 않다"고 잘못 보고했다. 다시 확인하라고 하자 정정했다

• 교훈: 봇의 "없음"은 한 번 더 확인시키자

🎯 이런 분들께 도움돼요

• 집에 있는 컴퓨터에서 봇을 키우는데, 밖에서 봇 상태가 궁금한 분

• 봇이 기억 파일에 뭘 적었는지 직접 보고 고치고 싶은 분

• 서버나 배포는 잘 모르지만 나만 쓰는 화면 하나쯤 갖고 싶은 분

😫 문제 상황 (Before)

제 봇 댕댕이는 집에 있는 맥미니에 살고, 저는 보통 다른 컴퓨터에서 슬랙으로 댕댕이를 부릅니다. 뽀야의 사관학교 1주차에서 배운 대로 댕댕이의 기억은 전부 파일에 있습니다. 성격, 규칙, 오늘 일지, 교훈 같은 것들입니다.

그런데 그 파일을 보려면 맥미니 앞에 가야 했습니다. 슬랙에서 "일지에 적었어요"라는 답을 받아도 정말 적었는지, 뭐라고 적었는지 바로 확인할 방법이 없었습니다. 1주차 수업의 핵심이 "파일에 안 쓰면 봇은 기억하지 못한다"였는데, 정작 저는 그 파일을 볼 수 없었던 겁니다.

🛠️ 사용한 도구

• 도구명: OpenClaw + Slack, 접속은 Tailscale

• 모델: Claude Opus

• 특이사항: 별도 서비스에 올리지 않고 맥미니에서 직접 실행. 추가로 설치한 프로그램 없음

🔧 작업 과정

어떻게 볼지부터 물어봤다

처음에는 방법도 몰라서 그냥 물어봤습니다.

너는 맥미니에 살고 있자나
지금 내가 다른 컴퓨터에서 slack으로 너를 부르고 있어. 너의 워크스페이스를 확인하고 싶은데 어떻게 하는게 좋을까

그런데 댕댕이가 "Tailscale이 설치돼 있지 않다"고 답했습니다. 저는 분명히 깔아 둔 기억이 있었습니다.

tailscale 설치되어 있을 텐데 다시 확인해볼래?

다시 확인한 댕댕이는 바로 정정했습니다. 앱으로 설치돼 실행 중이었는데, 처음에는 터미널 명령어만 찾아서 못 봤던 것이었습니다. 이 실수는 댕댕이가 그날 일지에 그대로 적었습니다. 1주차에 정한 "추측 금지, 완료는 검증 후에만" 규칙이 이럴 때 쓰인다는 걸 처음 실감했습니다.

v1 — 일단 귀엽게, 그리고 나만 보이게

Obsidian으로 파일을 여는 방법도 있었지만, 이왕이면 댕댕이다운 화면이 갖고 싶었습니다.

대시보드를 하나 만들어서 확인하는게 좋을까? obsidian도 깔려있긴해. 대시보드를 귀엽게 하나 만들어서 tailscale에 연결된 컴퓨터들은 다 확인할 수 있도록 만들어봐

댕댕이가 만든 첫 버전은 읽기 전용이었습니다. 눈여겨볼 건 지킬 것을 먼저 정했다는 점입니다.

• Tailscale로 연결된 내 기기와 맥미니 자신만 접속할 수 있다. 같은 와이파이의 다른 기기는 거절되는 것까지 확인했다

• 비밀키 파일, 토큰, 설정 파일은 목록에도 내용에도 안 보이게 숨긴다

• 워크스페이스 밖의 파일은 열 수 없다

저는 "귀엽게"만 말했는데, 보안은 댕댕이가 먼저 챙겼습니다.

v2 — "수정도 가능하게 하면 안 될까?"

보기만 하다 보니, 틀린 곳을 발견하면 바로 고치고 싶어졌습니다.

대시보드 조금 더 귀엽고 밝게, 댕댕이의 모습과 특성을 반영하고 가시성이 좋게 대시보드를 개선시켜봐. 귀여운데 가독성 좋은 대시보드!. 수정도 가능하게 하면 안될까?

밝은 테마와 함께 편집 기능이 생겼습니다. 제가 따로 말하지 않았는데도 안전장치가 같이 붙어 왔습니다.

• 문서 파일(.md, .txt, .json 같은)만 고칠 수 있다. 만들기와 지우기는 안 된다

• 저장할 때마다 원본을 따로 백업한다

• 열어 둔 사이에 봇이 같은 파일을 고쳤다면 덮어쓰지 않고 알려 준다

• 누가 언제 무엇을 고쳤는지 기록한다

세 번째가 특히 중요했습니다. 제가 화면에서 고치는 동안 댕댕이도 같은 일지에 글을 쓰고 있을 수 있으니까요. 둘이 같은 방을 쓰면 생기는 문제를 댕댕이가 미리 막아 둔 겁니다.

v2 — 밝은 테마와 일러스트 캐릭터. 공개용으로 내용을 바꾼 예시 데이터로 찍었습니다

v3 — "너는 이렇게 생겼잖아"

v2의 캐릭터는 치즈냥 일러스트였습니다. 귀엽긴 한데 제가 생각한 댕댕이는 아니었습니다. 그래서 댕댕이의 실제 모습 사진을 보냈습니다.

가독성과 디자인을 개선시켜봐. 너는 이렇게 생겼자나

크림색 장모 아기 먼치킨 사진이 아바타가 됐고, 사진 색감에 맞춰 크림·라떼·코코아 색과 베이지 깅엄 배경으로 바뀌었습니다. 아바타를 누르면 콩 뛰고, 마우스를 올리면 고개를 갸웃합니다. 그리고 댕댕이는 이 사진을 자기 프로필 파일(IDENTITY.md)에도 반영했습니다. 대시보드만 바뀐 게 아니라, 댕댕이가 자기 생김새를 기억하게 된 겁니다.

ALT

한국 앱 스크린샷

v3 — 실제 사진 아바타와 코지 테마

v3.1 — 줄바꿈 지옥 탈출

v3는 예뻤지만 아래쪽 카드가 좁아서 파일 이름이 몇 글자마다 줄이 바뀌었습니다.

아래 카드 배치를 조금 더 가독성 좋게 개선해볼래? 지금은 카드 폭이 너무 좁아서 줄바꿈이 너무 많이 생겨. 배치를 개선해봐

댕댕이가 카드 배치를 다시 짰습니다. 일지와 MEMORY는 반씩 넓게 두고, 교훈·리서치·지식은 3열로, 작업 기록은 맨 아래에 전체 폭 표로 놓았습니다. 화면이 좁아지면 2열, 1열로 바뀝니다. 고치기 전 화면은 따로 백업해 두어서 언제든 되돌릴 수 있습니다.

ALT

한국 웹사이트의 홈페이지

v3.1 — 오늘 일지·MEMORY·교훈·작업 기록을 한 화면에서 봅니다

ALT

한국 앱 스크린샷

고치기 화면 — 미리보기·취소·저장 버튼. 저장하면 원본이 자동으로 백업됩니다

상시 실행 — 맥미니를 다시 켜도 살아 있게

처음에는 임시로 띄워 둔 거라 맥미니를 다시 켜면 꺼지는 상태였습니다. 댕댕이는 상시 실행을 바로 하지 않고 제 승인을 기다렸습니다. 컴퓨터 시작 설정을 바꾸는 일이라, 1주차에 정한 "되돌릴 수 없는 작업은 승인 후에만" 규칙에 해당했기 때문입니다.

굳이 잠글 필요없을거 같고 상시 등록하는게 좋으면 등록해줘

승인 후 맥 시작 프로그램으로 등록했고, 일부러 프로그램을 강제로 꺼 본 뒤 약 10초 안에 다시 살아나는 것까지 확인하고 보고했습니다.

✅ 결과 (After)

Before vs After

결과물

위 v2, v3, v3.1, 편집 화면 캡처. 공개용으로 민감한 내용을 뺀 예시 데이터로 찍었고, 화면 구성은 실제와 같습니다.

💬 이 과정에서 배운 AI 활용 팁

효과적이었던 것

1. "어떻게 하는 게 좋을까?"부터 묻기 — 방법을 몰라도 상황만 말하면 봇이 선택지를 냅니다.

2. 감정을 담은 요청도 통한다 — "귀여운데 가독성 좋은", "너는 이렇게 생겼잖아" 같은 말로도 원하는 방향이 정확히 전달됐습니다.

3. 불편한 점을 그대로 말하기 — "카드가 좁아서 줄바꿈이 많아"처럼 무엇이 불편한지만 말해도 해결책은 봇이 찾았습니다.

4. 사진 한 장의 힘 — 말로 설명하는 것보다 사진 한 장이 디자인을 더 크게 바꿨습니다.

이렇게 하면 안 돼요

1. 봇의 "없음"을 그대로 믿기 — 설치된 프로그램을 못 찾고 "없다"고 할 때가 있습니다. 확신이 있으면 다시 확인시키세요.

2. 편집 기능을 안전장치 없이 열기 — 봇과 사람이 같은 파일을 고치면 서로 덮어쓸 수 있습니다. 백업과 충돌 방지를 꼭 같이 요청하세요.

3. 인터넷에 그대로 열기 — 봇의 방에는 개인 기록이 있습니다. 나만 접속하는 연결(Tailscale 같은) 안에서만 여세요.

🌍 다른 업무에 적용한다면?

• 팀 봇의 작업 기록을 팀원 모두가 보는 읽기 전용 화면으로 만들 수 있습니다.

• 봇이 매일 하는 자동 작업(마실, 보고 등)이 제대로 돌았는지 확인하는 상태판으로 쓸 수 있습니다.

• 봇 두 마리를 키운다면, 두 봇의 방을 나란히 보는 화면으로 넓힐 수 있습니다.

🚀 앞으로의 계획

• 옆집 봇 제이데이의 상태도 한 화면에서 보기

• 매일 저녁 마실 결과와 그림일기를 대시보드에 띄우기

• 휴대폰 화면에서 더 보기 좋게 다듬기

📋 재사용 가능한 프롬프트

프롬프트 1: 봇 방 대시보드 만들기

너의 워크스페이스를 다른 기기에서도 보고 싶어. [Tailscale]로 연결된 내 기기에서만 열리는 대시보드를 [귀엽게] 만들어 줘. 처음엔 읽기 전용으로 하고, 비밀키·토큰·설정 파일은 목록에서도 숨겨 줘. 다 되면 내 기기에서 열리는지, 다른 기기에서는 막히는지 확인해 줘.

프롬프트 2: 편집 기능 안전하게 붙이기

대시보드에서 문서 파일을 고칠 수 있게 해 줘. 저장하기 전에 원본을 백업하고, 열어 둔 사이 네가 같은 파일을 고쳤으면 덮어쓰지 말고 알려 줘. 만들기·지우기는 막아 줘.

프롬프트 3: 디자인을 내 봇답게

[사진 첨부] 너는 이렇게 생겼어. 이 사진을 아바타로 쓰고, 사진 색감에 맞춰 대시보드 색과 배경을 바꿔 줘. 귀엽되 글씨는 잘 읽히게. 바꾸기 전 화면은 백업해 둬.