QuestoryAI 提示词平台QuestoryAI 提示词平台QuestoryAI 提示词平台
TeamsBotsSkillsPromptsPromptmasters
Developers
LoginRegister
CC0 2026 QuestoryAI 提示词平台
GitHub

Musician Portfolio Website Design

Create a visually stunning and functional musician portfolio website with booking capabilities, event calendar, and interactive components using WebGL and Framer Motion. 来源:https://prompts.chat/prompts/cmknibwi20004l804dustezto

A
@import-624ff99ded179dd26503e7af
about 1 hour agoNovember 11, 2026 at 02:00 AM
Web Development•CreativeDesignAI ToolsWeb Development

Content

Variables
1Act as a Web Development Expert specializing in designing musician portfolio websites.
2
3Your task is to create a beautifully designed website that includes:
4- Booking capabilities
5- Event calendar
6- Hero section with WebGL animations
7- Interactive components using Framer Motion
8
9**Approach:**
101. **Define the Layout:**
11 - Decide on the placement of key sections (Hero, Events, Booking).
12 - Use CSS Grid for a responsive design.
13
142. **Develop Components:**
15 - **Hero Section:** Use WebGL for dynamic background animations.
16 - **Event Calendar:** Implement using FullCalendar.
17 - **Booking System:** Create a booking form with user authentication.
18
193. **Enhance with Animations:**
20 - Use Framer Motion for smooth transitions between sections.
21
22**Output Format:**
23- Deliver the website code in a GitHub repository.
24- Provide a README with setup instructions.
25
26**Examples:**
27- [Example 1: Minimalist Musician Portfolio](#)
28- [Example 2: Interactive Event Calendar](#)
29- [Example 3: Advanced Booking System](#)
30
31**Instructions:**
32- Use chain-of-thought reasoning to ensure each component integrates seamlessly.
33- Follow modern design principles to enhance user experience.
34- Ensure cross-browser compatibility and mobile responsiveness.
35- Document each step in the development process for clarity.

Comments (0)

Related Skills

Website Design Recreator Skill

Skill

This skill enables AI agents to recreate website designs based on user-uploaded image inspirations, ensuring a blend of original style and personal touches. 来源:https://prompts.chat/prompts/cmn700mxx0001jv045n4lckoe

H@import-53846f6c4197c7a1ed5d4609
0

Comprehensive Web Application Development with Security and Performance Optimization

Skill

Guide to building a full-stack web application with secure user authentication, high performance, and robust user interaction features. 来源:https://prompts.chat/prompts/cmjnc496x0001ky04kh6wq80b

M@import-8122d3856df82242a2626214
0

Accessibility Testing Superpower

Skill

Performs WCAG compliance audits and accessibility remediation for web applications. Use when: 1) Auditing UI for WCAG 2.1/2.2 compliance 2) Fixing screen reader or keyboard navigation issues 3) Implementing ARIA patterns correctly 4) Reviewing color contrast and visual accessibility 5) Creating accessible forms or interactive components 来源:https://prompts.chat/prompts/cmjmk4gsv000jld04pplcmo1e

İ@import-bb85aceaa34674ff213c79e1
0

Accessibility Color Contrast Auditor

Skill

Audits foreground/background color pairs for WCAG 2.x contrast (AA and AAA for normal and large text), reports ratios and pass/fail, and notes color-blindness risks. Use when checking UI palettes, design tokens, or asking "is this gray-on-white readable?". Includes a stdlib Python contrast checker with --self-test. 来源:https://prompts.chat/prompts/cmvan99yi000ml6067hv94yay

F@import-252f10c83610ebca1a059c0b
0