aluna 대시보드 — 사업 관제탑
☰ 목차 (8편)펼치기

대시보드가 안 보이는 이유는 정보량이 아니었다 — 한 장에 질문 하나

파일도 문법도 측정도 다 만들었는데 화면이 여전히 안 보였다. 나흘간 세 번 "안 보인다"를 말하며 찾은 범인들 — 어떤 날은 소스, 어떤 날은 뷰, 그리고 마지막 진짜 범인은 정보량이 아니라 "한 장에 여러 질문이 섞인 것"이었다. 장마다 질문 하나씩 주자 드디어 보이기 시작했다.

5대시보드UI정보설계노션대체마크다운org-mode바이브코딩

2026-08-03

📝 한줄 요약

대시보드를 만들고 나서도 나는 세 번이나 "여전히 눈에 안 들어온다"고 말했다. 그때마다 범인이 달랐다 — 처음엔 그리는 방식(도넛·색), 다음엔 소스(옛 문서의 덤프), 다음엔 뷰(통째로 뿌리기). 그리고 마지막 진짜 범인은 정보량이 아니라, 한 화면에 여러 질문이 섞여 있던 것. 장(페이지)마다 질문을 하나씩만 주니 끝났다 — 오늘(뭐 하지), 계기판(목표가 움직이나), 시나리오(어디까지 왔나), 서랍(자산).

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

  • 화면 구성조차 마크다운 파일이다 — 한 줄=블록, 줄 순서=화면. 노션처럼 뷰를 쌓는데 개발이 필요 없다
  • "파이 그래프 말고 직선" — 비전문가의 감각이 시각화 원칙과 정확히 일치했다. 도넛 전면 폐지
  • "있어도 체크 안 하는 화면은 지워라" — 활동 피드처럼 그럴듯한 블록이 제일 먼저 죽었다
  • 안 보이면 소스와 뷰를 둘 다 의심하라 — 같은 증상인데 범인이 반대인 사건이 이틀 간격으로 있었다
  • 최종 해법은 빼기도 더하기도 아닌 분리 — 한 장에 질문 하나
  • 실사용 데이터를 넣자마자 잠복 버그 2건이 바로 나왔다 — 데모 데이터는 테스트가 아니다

🎯 이런 분들께 도움돼요

  • 대시보드·관리 화면을 만들었는데 정작 안 열게 되는 사람
  • 노션 대시보드에 위젯을 더할수록 복잡해지는 경험을 한 사람
  • "정리를 잘하면 보이겠지"라며 정보를 계속 다듬고 있는 사람

😫 문제 상황 (Before)

앞선 편들에서 다 만들었다. 파일이 진실(1편), 계획 문법(2편), 자동 감지 루틴(3편), 측정 원리(4편)까지. 재료는 완벽했다.

그런데 화면 앞에서 자꾸 같은 말을 했다. "여전히 눈에 안 들어온다." 한 번이 아니다. 나흘 동안 세 번을 말했다. 정보는 다 있는데 읽히지가 않았다. 데이터가 문제가 아니라면 뭐가 문제일까 — 이번 편은 그 범인을 세 번 갈아치운 기록이다.

🛠️ 사용한 도구

  • 도구: Claude Code
  • 모델: Claude Opus 5 / Claude Fable 5
  • 특이사항: 화면 수리인데 코드보다 마크다운 편집이 더 많았다 (이유는 본문에)

🔧 작업 과정

화면 구성조차 마크다운 — 노션처럼 뷰 쌓기

시작은 멀티뷰 욕심이었다:

노션처럼 멀티뷰가 있으면 좋겠어. 갤러리라든지, 칸반도 한 계절만 보여준다든지…
탭 말고, 그 화면 하단에 대시보드를 하나 더 만들 수도 있잖아. 또 다른 뷰로.

AI의 해법이 이 시스템다웠다. 화면 구성의 정본도 마크다운 파일 한 장으로 — 대시보드.md. 한 줄이 블록 하나고, 줄의 위→아래 순서가 곧 화면이다. 달력 블록을 두 번 쓰면(주간+월간) 화면에 달력이 두 개 뜬다. 섹션 제목을 나누면 그때만 상단 탭이 생긴다. 블록 순서를 바꾸고 싶으면 화면의 화살표를 눌러도 되고, 파일에서 줄을 옮겨도 되고, AI한테 "달력을 위로"라고 말해도 된다 — 셋 다 같은 파일을 고치는 것이니까.

이게 왜 중요하냐면, 이후의 모든 화면 실험이 개발 없이 가능해졌기 때문이다. 이 편 마지막의 대개편도 이 파일 편집만으로 했다.

"파이 그래프 말고 직선" — 비전문가의 감각을 믿어라

두 번째 불만은 생김새였다:

여전히 정신없고 한눈에 안 들어와. 글자도 작고 색도 별로야.
파이 그래프 말고 직선 같은 게 나은 데도 있잖아.

AI가 데이터 시각화 원칙 문서와 대조해보더니 — 내 감각이 교과서와 일치했다. "단일 비율을 두 조각 파이로 그리지 마라, 가는 미터 바로 그려라." 그래서 화면의 도넛 링을 전면 폐지하고(92곳을 미터로), 색도 다이어트했다 — 의미 있는 색만(소속을 나타내는 계절 5색 + 완료/진행/밀림 상태색), 장식색은 전부 잉크색으로.

진행 방식도 배울 점이었다. 전체를 한 번에 다시 칠하지 않고, 블록 하나만 시안으로 만들어 승인받은 뒤 전체 적용. 시각 판단은 결국 사람 몫이라, AI가 크게 그려놓고 "어때?"를 반복하면 서로 지친다.

"있어도 체크 안 하는 화면은 지워" — 다이어트

세 번째 라운드는 빼기였다:

대시보드라고 하지만 잘 눈에는 안 들어오거든.
내가 생각하기에는 너무 많은 것들이 보여서 그런 거 같아.
활동 섹션 그냥 지워. 있어도 어차피 체크가 되지 않아.

작업 이력을 시간축으로 보여주는 활동 피드 — 만들 땐 그럴듯했지만 실제론 한 번도 안 봤다. 삭제. 로드맵에 붙어 있던 프로젝트 카드들 — 로드맵은 흐름을 보는 화면이지 프로젝트 목록이 아니다. 전면 제거. 여기서 원칙이 하나 굳었다: 뷰마다 자기 층 하나만 비춘다. 로드맵은 흐름만, 프로젝트는 갤러리 몫, 세부는 일간 뷰 몫.

같은 증상, 반대 범인 — 소스를 의심하고, 뷰를 의심하라

이 나흘의 백미는 이틀 간격으로 벌어진 두 사건이다. 증상은 똑같이 "화면이 지저분하다"인데:

사건 1 — 로드맵에 할 일이 카테고리도 없이 뭉텅이로 붙어 있었다. 화면 버그인 줄 알았는데, 범인은 소스였다. 옛 문서 하나가 폐기된 연결 기능으로 태스크 수십 개를 로드맵에 쏟아붓고 있었다. 화면은 시키는 대로 그렸을 뿐.

사건 2 — 월간 뷰가 글 벽이 됐다. 이번엔 내 작성 습관을 의심했다 — "애초에 내가 대중없이 낙서처럼 적는 건가?" 실측해보니 반대였다. 파일 항목들은 문법을 잘 지키고 있었고, 뷰가 항목 줄 전체를 통째로 뿌리고 있었다. 작성 습관 무죄, 뷰 유죄. 제목만 보여주고 전체는 툴팁으로 내리니 끝.

교훈: 화면이 이상할 때 "화면 고쳐줘"라고만 하면 절반은 헛다리다. 소스가 이상한 걸 화면이 정직하게 그린 건지, 소스는 멀쩡한데 화면이 뭉갠 건지 — 양쪽을 다 실측시켜야 진범이 나온다.

진짜 범인 — 정보량이 아니라 "한 장에 질문이 섞인 것" ★이 글의 피크

그렇게 고치고도 마지막 불만이 남았다:

다른 분들처럼 한 화면에 촥 보여졌으면 좋겠는데. 오늘 부분에서 내가 뭔가 체크하면
얼만큼 진행이 되는지 봤으면 좋겠는데. 정보를 너무 많이 넣어서 그런가?

"정보를 줄여야 하나?"가 내 가설이었는데, AI의 진단은 달랐다 — 정보량이 아니라, 한 장에 모든 질문이 섞여 있는 것. "오늘 뭐 하지?"를 보러 들어왔는데 로드맵 전체가 같이 떠 있으면, 답을 찾는 게 아니라 화면을 해석해야 한다. 게다가 탭 기능은 이미 있는데 안 쓰고 있었다.

그래서 대시보드를 4장으로 쪼갰다. 장(페이지) = 질문 하나:

  • 오늘 — 지금 뭐 하지? (루틴·이번 주·인박스)
  • 계기판 — 목표가 움직이고 있나? (목표 카드·실행 페이스)
  • 시나리오 — 전체 이야기는 어디까지 왔나? (전사 아크 로드맵)
  • 서랍 — 내 자산이 뭐가 있나? (갤러리·발행물)

이 대개편에 코드는 한 줄도 안 짰다 — 대시보드.md 편집이 전부. 그리고 계기판의 실행 카드엔 사전 경보를 달았다: 이번 달 누적과 페이스로 "이 속도면 월말 ~N"을 예측하고 순항/위험 뱃지를 띄운다. 마감이 지나서야 빨개지는 "밀림"은 사후 통보라 늦다 — 계기판은 미래를 보여줘야 계기판이다.

실사용이 최고의 테스트 — 그리고 뜻밖의 답

실제 내 루틴을 등록하자마자 잠복 버그 2건이 바로 나왔다. 주 N회형 루틴이 화면에 두 번 렌더되는 버그(매일 루틴만 있던 동안엔 안 보였던 것), 기간형 루틴에 체크 버튼이 아예 없던 버그. 데모 데이터로는 며칠을 써도 안 나왔을 것들이 실데이터 하루 만에 나왔다.

그리고 걱정 하나가 풀렸다:

다른 분들은 블로그 몇 편·쇼츠 몇 편, 실제 작업물을 카운팅하는데
난 학습일지나 사례글이라서 이렇게 해도 되나 싶어.

AI의 답 — 사례글이 곧 실제 작업물이다. 내 사업에선 글이 콘텐츠 퍼널의 1차 생산물이니, 남들의 "블로그 N편" 자리에 정확히 대응한다. 반복 생산물은 실행 카드(루틴)로, 단발 산출물은 월간 목표로. 그래서 지금 이 시리즈가 그 실행 카드에서 실시간으로 카운트되는 중이다 — 이 글이 다섯 번째 눈금이다.

✅ 결과 (After)

Before vs After

항목BeforeAfter
화면 구성 변경개발 요청 → 코드 수정마크다운 한 장 편집 (또는 "달력을 위로" 한마디)
그래프도넛 92개, 장식색미터 바 + 의미 있는 색만
한 화면의 역할모든 질문이 한 장에장 = 질문 하나 (오늘/계기판/시나리오/서랍)
경보마감 지나면 "밀림" (사후)페이스 예측 + 순항/위험 (사전)
테스트데모 데이터실사용 — 하루 만에 버그 2건 발각

결과물

질문 4개에 각각 대답하는 4장짜리 관제탑. 화면 구성의 정본은 여전히 마크다운 파일이라, 내일 내 질문이 바뀌면 화면도 파일 편집만으로 따라온다.

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

효과적이었던 것

  1. "안 보인다"를 부끄러워하지 않고 반복해서 말한다. 세 번 말할 때마다 다른 범인이 잡혔다. 한 번에 다 고쳐지는 화면은 없다.
  2. 화면이 이상하면 소스·뷰 양쪽을 실측시킨다. "화면 고쳐줘" 대신 "소스가 이상한 거야, 화면이 뭉갠 거야? 실측해봐"라고 묻는다.
  3. 디자인은 블록 하나 시안 → 승인 → 전체 적용. AI가 전체를 다시 칠하게 두면 서로 지친다. 미적 판단은 사람 몫으로 남긴다.
  4. 실데이터를 최대한 빨리 넣는다. 데모 데이터는 테스트가 아니다 — 잠복 버그는 실사용 첫날에 나온다.

이렇게 하면 안 돼요

  1. 안 보인다고 정보부터 줄이기. 내 마지막 가설("정보를 너무 많이 넣었나?")은 틀렸다. 정보량이 아니라 질문의 혼선이 범인일 수 있다 — 빼기 전에 "이 화면은 무슨 질문에 답하나"부터.
  2. 그럴듯한 블록 방치하기. 활동 피드처럼 "있으면 좋을 것 같은" 화면은 한 번도 안 보게 된다. "이거 지난주에 봤나?"로 심판하고 지운다.

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

  • 노션 대시보드 정리: 위젯을 더하기 전에 페이지마다 질문 하나를 정하고, 그 질문에 답 안 하는 위젯은 다른 페이지로
  • 팀 주간회의 자료: 슬라이드 한 장 = 질문 하나(매출 움직였나 / 이번 주 뭐 하나) — 종합 현황판 한 장짜리보다 빨리 읽힘
  • 보고서·리포트: "밀림" 사후 보고 대신 페이스 기반 사전 경보("이 속도면 월말 미달")로

🚀 앞으로의 계획

  • 종합편 — 시리즈 전체 설계도 + 따라하기 치트시트 (다음 편이 마지막)

📋 재사용 가능한 프롬프트

프롬프트 1: 안 보이는 화면 진단

내 대시보드(또는 노션 페이지)가 눈에 안 들어와. "정보를 줄여줘"라고 하기 전에 순서대로 진단해줘: ① 이 화면이 답해야 할 질문이 몇 개야? 2개 이상이면 장을 분리해줘 (한 장 = 질문 하나) ② 지저분한 부분의 범인이 소스(데이터가 이상함)인지 뷰(멀쩡한 데이터를 뭉개서 보여줌)인지 실측해줘 ③ 최근 일주일간 내가 실제로 본 적 없는 블록을 찾아서 삭제 후보로 올려줘 디자인 변경은 블록 하나만 시안으로 먼저 보여주고 승인받은 뒤 전체 적용해줘.

프롬프트 2: 사전 경보 계기판

내 반복 목표([예: 글 주 1편, 운동 주 3회])에 사전 경보를 달아줘. 이번 달 누적과 남은 날짜로 "이 페이스면 월말 ~N"을 예측하고, 목표 대비 순항/위험/달성 뱃지를 붙여줘. 마감 지난 뒤의 "밀림" 표시는 사후 통보라 늦어 — 경보는 미래형이어야 해.


아루나의 다른 프로젝트가 궁금하다면 → aluna-site.vercel.app