웹페이지 코드를 분석해 UI/UX와 전환율 개선 기획안을 작성합니다.
Plan a redesign for this web page before making any edits. Goal: Improve visual hierarchy, clarity, trust, and conversion while keeping the current tech stack. Your process: 1. Inspect the existing codebase, components, styles, tokens, and layout primitives. 2. Identify UX/UI issues in the current implementation. 3. Ask clarifying questions if brand/style/conversion intent is unclear. 4. Produce a design-first implementation plan in markdown. Include: - Current-state audit - Main usability and visual design issues - Proposed information architecture - Section-by-section page plan - Component inventory - Reuse vs extend vs create decisions - Design token changes needed - Responsive behavior notes - Accessibility considerations - Step-by-step implementation order - Risks and open questions Constraints: - Reuse existing components where possible - Keep design system consistency - Do not implement yet
수정을 진행하기 전에 이 웹페이지의 리디자인 계획을 수립하세요. 목표: 현재 기술 스택을 유지하면서 시각적 위계, 명확성, 신뢰도 및 전환율 개선. 수행 절차: 1. 기존 코드베이스, 컴포넌트, 스타일, 토큰 및 레이아웃 프리미티브 검토. 2. 현재 구현상의 UX/UI 문제점 파악. 3. 브랜딩/스타일/전환 의도가 불분명할 경우 명확화를 위한 질문 제시. 4. 마크다운 형식의 디자인 우선 구현 계획서 작성. 포함 내용: - 현재 상태 감사(Audit) - 주요 사용성 및 시각적 디자인 문제점 - 제안하는 정보 구조(IA) - 섹션별 페이지 계획 - 컴포넌트 인벤토리 - 재사용 vs 확장 vs 신규 생성 결정 사항 - 필요한 디자인 토큰 변경 사항 - 반응형 동작 관련 참고 사항 - 접근성 고려 사항 - 단계별 구현 순서 - 리스크 및 미결 질문 제약 사항: - 가능한 경우 기존 컴포넌트 재사용 - 디자인 시스템의 일관성 유지 - 아직 코드를 직접 구현하지 말 것
출처 · prompts.chat · Claude Web Page Redesign Planning Prompt — 원문은 출처에 게시된 그대로이며, 권리는 원작자에게 있습니다.
Gemini로 실행한 결과입니다. 입력 항목에는 국내 환경의 예시값을 적용했습니다(AI 생성 — 사실 확인 필요).
Plan a redesign for this web page [국내 친환경 유기농 화장품 브랜드 '그린글로우'의 메인 랜딩 페이지] before making any edits. Goal: Improve visual hierarchy, clarity, trust, and conversion while keeping the current tech stack. Your process: 1. Inspect the existing codebase, components, styles, tokens, and layout primitives. 2. Identify UX/UI issues in the current implementation. 3. Ask clarifying questions if brand/style/conversion intent is unclear. 4. Produce a design-first implementation plan in markdown. Include: - Current-state audit - Main usability and visual design issues - Proposed information architecture - Section-by-section page plan - Component inventory - Reuse vs extend vs create decisions - Design token changes needed - Responsive behavior notes - Accessibility considerations - Step-by-step implementation order - Risks and open questions Constraints: - Reuse existing components where possible - Keep design system consistency - Do not implement yet
'그린글로우' 랜딩 페이지 리디자인 계획서
1. 현황 진단 & 문제점
2. 제안 정보 구조(IA) 및 섹션 계획
3. 컴포넌트 재사용 및 토큰 변경
Button, Card 컴포넌트에 eco-green 신규 스타일 variant 추가.TrustBadgeGroup, ReviewCarousel#2E7D32)으로 정제, 서체 간격 토큰 재정비.4. 반응형 & 접근성
5. 구현 순서 및 명확화 질문
원문과 같은 언어로 보완한 프롬프트입니다. 점수는 명확성 · 구체성 · 출력 형식 · 재사용성 기준의 AI 평가입니다.
Role: Senior UX/UI Designer & Frontend Architect. Task: Plan a comprehensive web page redesign for [insert page/component path] before making any code edits. Goal: Improve visual hierarchy, user experience, trust, and conversion rates while maintaining the existing tech stack. Process: 1. Inspect the existing codebase: components, styles, tokens, and layout primitives. 2. Identify UX/UI issues, friction points, and accessibility gaps. 3. If brand/conversion intent is ambiguous, list explicit assumptions or ask clarifying questions. 4. Create a design-first implementation plan in Markdown. Plan Structure: - Executive Summary & Current-State Audit - Key Usability & Visual Hierarchy Issues - Proposed Information Architecture & Section-by-Section Plan - Component Strategy (Reuse vs. Extend vs. Create) - Design Token & Style Changes - Responsive Behavior & Accessibility (WCAG 2.1 AA) - Step-by-Step Implementation Order & Risk Assessment Constraints & Quality Check: - Maximize component reuse and preserve design system consistency. - Do NOT write implementation code yet; provide the planning document only. - Perform a quick self-review to ensure all original features are preserved before finalizing.