# 동료 스터디에 앞서 공인중개사가 먼저 만들어 본 'Claude Cowork 5분 입문' 대시보드 ✨

- 작성자: [하모니카](https://community.clauders.ai/member/imported-member-SkiBbTVcoc)
- 공간: [에이전트 / 노코드 자동화](https://community.clauders.ai/automation)
- 게시: 2026-05-22
- 연재: [강의 기획과 자료 자동화](https://community.clauders.ai/series/lecture-production-automation) 1/1편
- 태그: #강의자동화 #OT과제
- 주소: https://community.clauders.ai/automation/post/%EB%8F%99%EB%A3%8C-%EC%8A%A4%ED%84%B0%EB%94%94%EC%97%90-%EC%95%9E%EC%84%9C-%EA%B3%B5%EC%9D%B8%EC%A4%91%EA%B0%9C%EC%82%AC%EA%B0%80-%EB%A8%BC%EC%A0%80-%EB%A7%8C%EB%93%A4%EC%96%B4-%EB%B3%B8-claude-cowork-5%EB%B6%84-%EC%9E%85%EB%AC%B8-%EB%8C%80%EC%8B%9C%EB%B3%B4%EB%93%9C-83b6e063-0017-8040-a15d-d5948e25afec

---

**부동산 스터디에 앞서 공인중개사가 먼저 직접 만들어 본 'Cowork 5분 입문' 대시보드 ✨**

> 🌐 **결과물 미리보기**: [https://sachol.github.io/cityuncle-cowork-intro-dashboard/](https://sachol.github.io/cityuncle-cowork-intro-dashboard/)  
> 📦 **코드 저장소**: [https://github.com/sachol/cityuncle-cowork-intro-dashboard](https://github.com/sachol/cityuncle-cowork-intro-dashboard)

> 🌐 **대시보드 개선/확장 사례글**: [https://github.com/sachol/cityuncle-cowork-intro-dashboard/blob/main/case-study-v2.md](https://github.com/sachol/cityuncle-cowork-intro-dashboard/blob/main/case-study-v2.md)

### **배운 점**

1. 🚨 **검증 게이트가 이번 사례의 가장 큰 배움**입니다. 결과물이 거의 완성된 시점에도 _"의도와 맞나? 사실은 정확한가?"_ 한 번 더 묻는 단계만으로 5~6곳의 외부 사실 오류가 잡혔습니다. 그대로 게시되었다면 수강생분들이 따라할 수 없는 자료가 됐을 텐데, **한 줄 질문이 결과물의 신뢰성을 통째로 구했습니다**.

   이 경험을 운영 규칙(`CLAUDE.md`)에 **"기획의도 검증 게이트"** 로 새겨, W2~W4 다음 결과물에도 자동 실행됩니다. **같이 공부하시는 분들도 본인 결과물 게시 직전에 4개 항목**(의도 일치 / 사실 정확성 / 청자 가치 / 본질 흐림) **한 번씩 점검해 보시기를 권합니다**. AI로 빠르게 만들수록 이 단계가 더 중요해집니다.
2. 🧩 **첫 사례부터 메인·서브 구조로 분리**한 게 가장 잘한 결정이었습니다. 결과물 디렉터리·문서·사례글이 한 폴더 안에서 깔끔하게 묶입니다.
3. ✨ **강사가 먼저 직접 적용해 검증**한 결과물 한 장은 슬라이드보다 강한 신뢰가 됩니다. "직접 만들어 본 거예요"가 OT 자료의 기둥이 됩니다.
4. 🌗 **다크 모드는 CSS 변수 + **`[data-theme="dark"]`** 오버라이드만으로 +80줄**입니다. 디자인 시스템을 토큰화하면 추가 비용이 거의 없습니다.
5. 🎨 **네오브루탈 톤은 굵은 검정 보더·그림자가 핵심**이라 라이트/다크 양쪽에서 잘 어울립니다. 같은 톤을 다음 결과물에 그대로 재사용할 수 있는 자산이 됐습니다.
6. 🔁 **"📱 폰 → 💻 데스크탑 → 📲 폰"** 흐름(Cowork Dispatch 베타)을 한 번 정확히 시연해두면, 외근·임장 중 활용이라는 핵심 가치가 즉시 전달됩니다. W4 크롬 확장 단계에서도 이 컨셉을 그대로 확장할 수 있습니다.

### **시행착오**

- **다크 모드에서 워커 카드 가독성**: 첫 진입 시 opacity 0.15 → 0.65로 올리고 채도·스케일로 인터랙션 차별화. 라이트 모드 검증만으로는 발견 못 했습니다.
- **💡 강조 박스가 묻힘**: rgba 흐릿한 톤 → 노랑 채움 강조 토스트로 변경. "강조하고 싶다면 명도 차이가 분명해야 한다"는 단순한 원칙을 다시 확인했습니다.
- **HERO 카피의 추상성**: "사무소 일"이 막연 → "공인중개사 업무"로 구체화. 도메인 어휘를 그대로 쓰는 게 공감대를 더 만들었습니다.
- **외부 기능명을 임의로 명명한 큰 실수** (가장 중요): 초안 단계에서 "Dispatch"를 fan-out 메타포로 잘못 명명했고, 가입 경로·플랜 등도 추측으로 채워둔 상태였습니다. 게시 직전에 한 번 더 검증을 거치며 공식 문서를 확인했더니 5~6곳이 사실과 달랐고 모두 정정했습니다. 구체적 정정 표·발견 과정·운영 규칙화는 **위 진행 방법 7단계**에 자세히 정리해 두었습니다 — 이 사건이 검증 게이트 도입의 계기였습니다.

### **앞으로의 계획**

이 미니 사례는 22기 4주 마일스톤의 첫 주에 만든 **"주차별 본 사례 옆에 두는 1장 견본"** 입니다. 다음 회차들에서는 본 사례·강의자료·대시보드 결과물이 차례로 이어질 예정이고, 그때마다 사례글로 따로 공유해 보고자 합니다. (시간이 되는 한....)

가까이는, 이** 작은 사례를 다음 회차에 강의자료 1차시로 변환**해보면서 — 한 장 페이지가 어떻게 슬라이드·워크북·퀴즈 1세트로 자연스럽게 풀리는 지를 확인할 계획도 있습니다.

## **도움 받은 글 (옵션)**

- 강의 페이지:
- Claude Cowork 공식 소개: [https://claude.com/product/cowork](https://claude.com/product/cowork)
- Claude Desktop 다운로드: [https://claude.com/download](https://claude.com/download)
- Cowork Dispatch (베타) 공식 도움말: [https://support.claude.com/en/articles/13947068-assign-tasks-from-anywhere-in-claude-cowork](https://support.claude.com/en/articles/13947068-assign-tasks-from-anywhere-in-claude-cowork)
- Cowork 시작하기 공식 도움말: [https://support.claude.com/en/articles/13345190-get-started-with-claude-cowork](https://support.claude.com/en/articles/13345190-get-started-with-claude-cowork)
- Pretendard 가변 폰트: [https://github.com/orioncactus/pretendard](https://github.com/orioncactus/pretendard)
- Tailwind CDN: [https://cdn.tailwindcss.com](https://cdn.tailwindcss.com/)