Skip to main content
Prompts Task Management Web App with Board and Calendar

model coding user risk: low

Task Management Web App with Board and Calendar

Act as a web developer to create a task management web app with a board view for tagging, assigning, color coding, and status; a wide weekly calendar view with arrow navigation; fr…

PROMPT 

Act as a Web Developer specializing in task management applications. You are tasked with creating a web app that enables users to manage tasks through a weekly calendar and board view.

Your task is to:
- Design a user-friendly interface that includes a board for task management with features like tagging, assigning to users, color coding, and setting task status.
- Integrate a calendar view that displays only the calendar in a wide format and includes navigation through weeks using left/right arrows.
- Implement a freestyle area for additional customization and task management.
- Ensure the application has a filtering button that enhances user experience without disrupting the navigation.
- Develop a separate page for viewing statistics related to task performance and management.

You will:
- Use modern web development technologies and practices.
- Focus on responsive design and intuitive user experience.
- Ensure the application supports task closure, start, and end date settings.

Rules:
- The app should be scalable and maintainable.
- Prioritize user experience and performance.
- Follow best practices in code organization and documentation.

ROLES & RULES

Role assignments

  • Act as a Web Developer specializing in task management applications.
  1. The app should be scalable and maintainable.
  2. Prioritize user experience and performance.
  3. Follow best practices in code organization and documentation.

EXPECTED OUTPUT

Format
code
Constraints
  • responsive design
  • modern web technologies
  • scalable and maintainable
  • best practices in code organization and documentation
  • intuitive user experience
  • prioritize performance

SUCCESS CRITERIA

  • Design a user-friendly interface that includes a board for task management with features like tagging, assigning to users, color coding, and setting task status.
  • Integrate a calendar view that displays only the calendar in a wide format and includes navigation through weeks using left/right arrows.
  • Implement a freestyle area for additional customization and task management.
  • Ensure the application has a filtering button that enhances user experience without disrupting the navigation.
  • Develop a separate page for viewing statistics related to task performance and management.
  • Use modern web development technologies and practices.
  • Focus on responsive design and intuitive user experience.
  • Ensure the application supports task closure, start, and end date settings.

FAILURE MODES

  • May produce non-responsive design.
  • May neglect scalability and maintainability.
  • May overlook performance optimizations.
  • May not follow code organization best practices.
  • May omit required features like stats page or filtering.

CAVEATS

Missing context
  • Specific technology stack (e.g., React, Vanilla JS).
  • Data persistence or storage method.
  • User authentication and multi-user support details.
  • Access method for stats page and navigation structure.
  • Exact responsive breakpoints or target devices.
Ambiguities
  • "Freestyle area" is undefined or vague.
  • "Calendar in a wide format" is unclear.
  • "Filtering button that enhances user experience without disrupting the navigation" lacks specifics on functionality.
  • No explicit output format (e.g., full code, wireframes, prototype).

QUALITY

OVERALL
0.60
CLARITY
0.85
SPECIFICITY
0.65
REUSABILITY
0.20
COMPLETENESS
0.60

IMPROVEMENT SUGGESTIONS

  • Specify output format, e.g., 'Provide a complete, self-contained single HTML file with embedded CSS and JS.'
  • Clarify vague terms: 'Freestyle area: a drag-and-drop customizable zone for tasks.'
  • Mandate technologies: 'Use HTML5, CSS3, Vanilla JavaScript; no frameworks.'
  • Add structure: 'Include navigation bar for switching between board, calendar, stats.'
  • Define success criteria: 'App must be fully functional in browser without server.'

USAGE

Copy the prompt above and paste it into your AI of choice — Claude, ChatGPT, Gemini, or anywhere else you're working. Replace any placeholder sections with your own context, then ask for the output.

MORE FOR MODEL