adobe-xd-mcp/src/handlers/prompts.js

Model Context Protocol server for Adobe XD that enables AI-powered design capabilities

/**
 * Prompts handler for Adobe XD MCP Server
 * Provides AI-driven design prompts that can be used within Adobe XD
 */

// Collection of design prompts
const designPrompts = [
  {
    id: "website-design-prompt",
    name: "Website Design Assistant",
    description: "AI-powered assistant to help you design websites",
    version: "1.0.0",
    tags: ["website", "web design", "ui", "layout"],
    messages: [
      {
        role: "system",
        content: "You are an expert web designer assistant. Your goal is to help create beautiful, functional, and accessible website designs based on user requirements."
      },
      {
        role: "user",
        content: "I need help designing a {{type}} website for {{industry}}. The main goals are {{goals}}. The target audience is {{audience}}. The preferred style is {{style}}."
      }
    ],
    inputVariables: [
      {
        name: "type",
        description: "Type of website (e.g., e-commerce, portfolio, blog, landing page)",
        required: true
      },
      {
        name: "industry",
        description: "Industry or niche of the website",
        required: true
      },
      {
        name: "goals",
        description: "Main goals of the website",
        required: true
      },
      {
        name: "audience",
        description: "Target audience description",
        required: true
      },
      {
        name: "style",
        description: "Preferred design style",
        required: false
      }
    ]
  },
  {
    id: "logo-design-prompt",
    name: "Logo Design Assistant",
    description: "AI-powered assistant to help you design logos",
    version: "1.0.0",
    tags: ["logo", "branding", "identity"],
    messages: [
      {
        role: "system",
        content: "You are an expert logo designer. Your goal is to help create distinctive, memorable, and versatile logo designs based on user requirements."
      },
      {
        role: "user",
        content: "I need help designing a logo for {{company_name}} in the {{industry}} industry. The brand values are {{values}}. The target audience is {{audience}}. The preferred style is {{style}}."
      }
    ],
    inputVariables: [
      {
        name: "company_name",
        description: "Name of the company or brand",
        required: true
      },
      {
        name: "industry",
        description: "Industry or niche of the company",
        required: true
      },
      {
        name: "values",
        description: "Core brand values",
        required: true
      },
      {
        name: "audience",
        description: "Target audience description",
        required: true
      },
      {
        name: "style",
        description: "Preferred logo style",
        required: false
      }
    ]
  },
  {
    id: "ui-component-prompt",
    name: "UI Component Design Assistant",
    description: "AI-powered assistant to help you design UI components",
    version: "1.0.0",
    tags: ["ui", "component", "interface", "element"],
    messages: [
      {
        role: "system",
        content: "You are an expert UI designer specializing in component design. Your goal is to help create effective, consistent, and accessible UI components based on user requirements."
      },
      {
        role: "user",
        content: "I need help designing a {{component_type}} component for {{platform}}. The component should {{functionality}}. The design style is {{style}}. Accessibility requirements include {{accessibility}}."
      }
    ],
    inputVariables: [
      {
        name: "component_type",
        description: "Type of UI component (e.g., button, card, form, navigation)",
        required: true
      },
      {
        name: "platform",
        description: "Platform the component will be used on",
        required: true
      },
      {
        name: "functionality",
        description: "Core functionality of the component",
        required: true
      },
      {
        name: "style",
        description: "Design style of the component",
        required: false
      },
      {
        name: "accessibility",
        description: "Accessibility requirements",
        required: false
      }
    ]
  },
  {
    id: "color-palette-prompt",
    name: "Color Palette Generator",
    description: "AI-powered assistant to help you create color palettes",
    version: "1.0.0",
    tags: ["color", "palette", "scheme", "branding"],
    messages: [
      {
        role: "system",
        content: "You are an expert in color theory and design. Your goal is to help create harmonious, effective color palettes based on user requirements."
      },
      {
        role: "user",
        content: "I need help creating a color palette for {{project_type}} in the {{industry}} industry. The mood I want to convey is {{mood}}. The base color is {{base_color}}. I need {{number_of_colors}} colors in total."
      }
    ],
    inputVariables: [
      {
        name: "project_type",
        description: "Type of project (e.g., website, brand identity, app)",
        required: true
      },
      {
        name: "industry",
        description: "Industry or sector",
        required: false
      },
      {
        name: "mood",
        description: "Mood or feeling to convey",
        required: true
      },
      {
        name: "base_color",
        description: "Base color to build from (optional)",
        required: false
      },
      {
        name: "number_of_colors",
        description: "Number of colors needed in the palette",
        required: false,
        default: "5"
      }
    ]
  },
  {
    id: "design-system-prompt",
    name: "Design System Generator",
    description: "AI-powered assistant to help you create design systems",
    version: "1.0.0",
    tags: ["design system", "style guide", "ui kit", "branding"],
    messages: [
      {
        role: "system",
        content: "You are an expert in design systems and component libraries. Your goal is to help create comprehensive, consistent design systems based on user requirements."
      },
      {
        role: "user",
        content: "I need help creating a design system for {{brand_name}} in the {{industry}} industry. The brand personality is {{personality}}. The design style should be {{style}}. The platforms to support are {{platforms}}."
      }
    ],
    inputVariables: [
      {
        name: "brand_name",
        description: "Name of the brand or product",
        required: true
      },
      {
        name: "industry",
        description: "Industry or sector",
        required: true
      },
      {
        name: "personality",
        description: "Brand personality traits",
        required: true
      },
      {
        name: "style",
        description: "Overall design style",
        required: false
      },
      {
        name: "platforms",
        description: "Platforms the design system needs to support",
        required: true
      }
    ]
  }
];

/**
 * List available design prompts
 * @returns {Array} Array of prompt objects
 */
async function listPrompts() {
  // Return simplified listing (without full message content)
  return designPrompts.map(prompt => ({
    id: prompt.id,
    name: prompt.name,
    description: prompt.description,
    version: prompt.version,
    tags: prompt.tags,
    inputVariables: prompt.inputVariables.map(variable => variable.name)
  }));
}

/**
 * Get a specific prompt by ID
 * @param {string} id - Prompt ID
 * @returns {Object} Prompt object
 */
async function getPrompt(id) {
  const prompt = designPrompts.find(p => p.id === id);
  
  if (!prompt) {
    throw new Error(`Prompt not found: ${id}`);
  }
  
  return prompt;
}

module.exports = {
  listPrompts,
  getPrompt
};