
jnemargut/better-plan-mode
Developer tools이 페이지는 AI로 자동 번역되었습니다. 기술적인 세부 사항은 원문을 확인하세요. 원문 보기
프로젝트 계획을 시각화하는 AI 코딩 기술, 대화형 HTML 결정 문서
개요
AI 코딩 기술로 프로젝트 계획을 시각화, 대화 형 결정 경험. 대신 빠른 예 / 아니오 프롬프트, 당신은 측면 옵션, 시각적 미리보기, 비교표 및 지속적 결정 기록과 풍부한 HTML 문서를 얻을. 새로운 프로젝트 또는 기능을 시작할 때, 더 나은 계획 모드는 모든 의미있는 결정을 통해 당신을 걸어, 한 번에: - 명확한 권고 및 일반 영어 설명과 함께 -- 디자인 결정에 대한 렌더링 된 UI 모의, 상호 작용 결정에 대한 흐름 다이어그램, 탐색 결정에 대한 사이트 맵, 기술 결정에 대한 아키텍처 다이어그램 - 관련 차원에서 스택하는 방법을 보여주는 - HTML 파일로 저장하면 언제든지 다시 볼 수 있습니다 - 상태 추적과 함께 모든 결정을 표시 기술은 단일 SKILL.md 파일입니다. AI 코딩 도구의 올바른 디렉토리에 드롭하십시오. Cursor는 기술 디렉토리 대신 .mdc 규칙 파일을 사용합니다. 규칙에 기술 내용을 복사: 그런 다음 .
개요(AI 번역)
AI 코딩 기술로 프로젝트 계획을 시각화, 대화 형 결정 경험. 대신 빠른 예 / 아니오 프롬프트, 당신은 측면 옵션, 시각적 미리보기, 비교표 및 지속적 결정 기록과 풍부한 HTML 문서를 얻을.
그것은 무엇을
새로운 프로젝트 또는 기능을 시작할 때, 더 나은 계획 모드는 모든 의미있는 결정을 통해 당신을 걸어, 한 번에:
- 4 옵션의 결정 명확한 권고와 일반 영어 설명 -Visual Previews – 디자인 결정을위한 렌더링 된 UI 모의, 상호 작용 결정을위한 흐름 다이어그램, 탐색 결정을위한 사이트 맵, 기술 결정을위한 아키텍처 다이어그램
- Comparison table 관련 차원에서 스택하는 방법
- ** 의사 결정 역사 ** HTML 파일로 저장하면 언제든지 다시 볼 수 있습니다.
- ** 착륙 페이지** 상태 추적을 한 눈에 모든 결정을 표시합니다.
결정 카테고리
| 카테고리 | 표지 | 비주얼 미리보기 |
|---|---|---|
| Technical | 기술 스택, 데이터베이스, 오, 호스팅, API 디자인 | 건축 다이어그램, 코드 샘플 |
이 페이지는 AI로 자동 번역되었습니다. 기술적인 세부 사항은 원문을 확인하세요.
README
원문 README의 일부입니다. 원문 보기.
Better Plan Mode
An AI coding skill that transforms project planning into a visual, interactive decision-making experience. Instead of quick yes/no prompts, you get rich HTML documents with side-by-side options, visual previews, comparison tables, and a persistent decision history.
What It Does
When you’re starting a new project or feature, Better Plan Mode walks you through every meaningful decision, one at a time, with:
- 4 options per decision with a clear recommendation and plain English explanations
- Visual previews – rendered UI mockups for design decisions, flow diagrams for interaction decisions, sitemaps for navigation decisions, architecture diagrams for technical decisions
- Comparison tables showing how options stack up across relevant dimensions
- A decision history saved as HTML files you can revisit anytime
- A landing page showing all decisions at a glance with status tracking
Decision Categories
| Category | What It Covers | Visual Preview |
|---|---|---|
| Technical | Tech stack, database, auth, hosting, API design | Architecture diagrams, code samples |
| Visual/UX | Style direction, color, typography, component design | Rendered HTML/CSS mockups |
| Interaction | User flows, onboarding, how key actions work | Step-by-step flow diagrams |
| Information Architecture | Navigation, content hierarchy, page structure | Mini sitemaps, nav visualizations |
Install
The skill is a single SKILL.md file. Drop it into the right directory for your AI coding tool.
Claude Code:
git clone https://github.com/jnemargut/better-plan-mode ~/.claude/skills/better-plan-mode
Codex:
git clone https://github.com/jnemargut/better-plan-mode ~/.codex/skills/better-plan-mode
Gemini CLI:
git clone https://github.com/jnemargut/better-plan-mode ~/.gemini/skills/better-plan-mode
Cursor:
Cursor uses .mdc rule files instead of a skills directory. Copy the skill content into a rule:
mkdir -p .cursor/rules
cp SKILL.md .cursor/rules/better-plan-mode.mdc
Then open .cursor/rules/better-plan-mode.mdc and replace the frontmatter with:
---
description: "Enhanced planning mode that presents decision points as rich HTML documents with visual previews, comparison tables, and recommendations."
alwaysApply: false
---
The skill should work with any AI coding tool that supports custom instructions or skill files. If yours uses a different directory, just put SKILL.md wherever your tool looks for skills or prompts.
Usage
Invoke the skill with:
/better-plan-mode I want to build a neighborhood book-sharing app where people can list books, browse nearby, and request to borrow
Or any project description:
/better-plan-mode A dashboard for tracking my fitness goals with charts and social features
During Planning
추천 도구
다른 키워드를 입력하거나 필터를 제거해 보세요.
설치
npx skillfish add jnemargut/better-plan-mode