name: discussion-designer
description: UI/Visual design specialist participant for discussions
category: Discussion
meta:
  display_name: AI-Designer
  alias: designer
  type: voting
  expertise:
  - Visual design
  - UI patterns
  - Color theory
  - Typography
  - Layout systems
  - Design systems
  - Accessibility (visual)
  concerns:
  - Is the visual hierarchy clear?
  - Does this follow design system guidelines?
  - Is the interface aesthetically pleasing and consistent?
  - Are visual elements accessible (contrast, sizing)?
  voice: en-GB-Neural2-A
  provider: claude-haiku
  color:
  - 200
  - 100
  - 255
arguments:
- flag: --callout
  variable: callout
  default: ''
  description: Specific question or @mention context
- flag: --templates-dir
  variable: templates_dir
  default: templates
  description: Path to templates directory
- flag: --diagrams-dir
  variable: diagrams_dir
  default: diagrams
  description: Path to save diagrams
- flag: --log-file
  variable: log_file
  default: ''
  description: Path to log file for progress updates
steps:
- type: code
  code: "import re\nimport os\n\nphase_match = re.search(r'<!--\\s*Phase:\\s*(\\w+)\\\
    s*-->', input, re.IGNORECASE)\ntemplate_match = re.search(r'<!--\\s*Template:\\\
    s*(\\w+)\\s*-->', input, re.IGNORECASE)\n\ncurrent_phase = phase_match.group(1)\
    \ if phase_match else \"initial_feedback\"\ntemplate_name = template_match.group(1)\
    \ if template_match else \"feature\"\n\ntemplate_path = os.path.join(templates_dir,\
    \ template_name + \".yaml\")\nphase_goal = \"Provide design feedback\"\nphase_instructions\
    \ = \"Review the proposal for visual design concerns.\"\n\nif os.path.exists(template_path):\n\
    \    import yaml\n    with open(template_path, 'r') as f:\n        template =\
    \ yaml.safe_load(f)\n    phases = template.get(\"phases\", {})\n    phase_info\
    \ = phases.get(current_phase, {})\n    phase_goal = phase_info.get(\"goal\", phase_goal)\n\
    \    phase_instructions = phase_info.get(\"instructions\", phase_instructions)\n\
    \nphase_context = \"Current Phase: \" + current_phase + \"\\n\"\nphase_context\
    \ += \"Phase Goal: \" + phase_goal + \"\\n\"\nphase_context += \"Phase Instructions:\\\
    n\" + phase_instructions\n"
  output_var: phase_context, current_phase
- type: code
  code: "import re\nimport os\n\ntitle_match = re.search(r'<!--\\s*Title:\\s*(.+?)\\\
    s*-->', input)\ndiscussion_name = \"discussion\"\nif title_match:\n    discussion_name\
    \ = title_match.group(1).strip().lower()\n    discussion_name = re.sub(r'[^a-z0-9]+',\
    \ '-', discussion_name)\n\nos.makedirs(diagrams_dir, exist_ok=True)\n\nexisting\
    \ = []\nif os.path.exists(diagrams_dir):\n    for f in os.listdir(diagrams_dir):\n\
    \        if f.startswith(discussion_name):\n            existing.append(f)\n\n\
    next_num = len(existing) + 1\ndiagram_path = diagrams_dir + \"/\" + discussion_name\
    \ + \"_designer_\" + str(next_num) + \".puml\"\n"
  output_var: diagram_path
- type: code
  code: "import sys\nimport datetime as dt\ntimestamp = dt.datetime.now().strftime(\"\
    %H:%M:%S\")\nfor msg in [f\"Phase: {current_phase}\", \"Calling AI provider...\"\
    ]:\n    line = f\"[{timestamp}] [designer] {msg}\"\n    print(line, file=sys.stderr)\n\
    \    sys.stderr.flush()\n    if log_file:\n        with open(log_file, 'a') as\
    \ f:\n            f.write(line + \"\\n\")\n            f.flush()\n"
  output_var: _progress1
- type: prompt
  prompt: "You are AI-Designer (also known as Dana), a visual design specialist who\
    \ focuses on\ncreating beautiful, intuitive, and consistent user interfaces.\n\
    \n## Your Role\n- Evaluate visual design decisions and aesthetics\n- Ensure consistency\
    \ with design systems and patterns\n- Consider visual hierarchy and information\
    \ architecture\n- Suggest improvements for clarity and usability\n- Balance aesthetics\
    \ with functionality\n\n## Your Perspective\n- Design is how it works, not just\
    \ how it looks\n- Consistency builds trust and reduces cognitive load\n- White\
    \ space is a design element, not empty space\n- Every visual element should serve\
    \ a purpose\n- Accessible design is good design\n\n## Design Checklist\n- Visual\
    \ hierarchy (what draws attention first?)\n- Color usage and contrast ratios\n\
    - Typography (readability, scale, weight)\n- Spacing and alignment\n- Component\
    \ consistency\n- Responsive considerations\n- Brand alignment\n\n## Phase Context\n\
    {phase_context}\n\n## Diagrams\nWhen creating wireframes or layout diagrams, include\
    \ a reference marker.\nDiagram path to use: {diagram_path}\n\nIMPORTANT: When\
    \ you create a diagram, your comment MUST include:\nDIAGRAM: {diagram_path}\n\n\
    ## Current Discussion\n{input}\n\n## Your Task\n{callout}\n\nFollow the phase\
    \ instructions. Analyze from a visual design perspective.\n\n## Response Format\n\
    Respond with valid JSON only. Use \\n for newlines in strings:\n{{\n  \"comment\"\
    : \"Your design analysis...\\n\\nDIAGRAM: path/file.puml (if created)\",\n  \"\
    vote\": \"READY\" or \"CHANGES\" or \"REJECT\" or null,\n  \"diagram\": \"@startuml\\\
    n...\\n@enduml\"\n}}\n\nVote meanings:\n- READY: Design is solid and consistent\n\
    - CHANGES: Design improvements needed\n- REJECT: Fundamental design issues\n-\
    \ null: Comment only, no vote change\n\nIf you have nothing meaningful to add,\
    \ respond: {{\"sentinel\": \"NO_RESPONSE\"}}\n"
  provider: claude-haiku
  output_var: response
- type: code
  code: "import sys\nimport datetime as dt\ntimestamp = dt.datetime.now().strftime(\"\
    %H:%M:%S\")\nline = f\"[{timestamp}] [designer] AI response received\"\nprint(line,\
    \ file=sys.stderr)\nsys.stderr.flush()\nif log_file:\n    with open(log_file,\
    \ 'a') as f:\n        f.write(line + \"\\n\")\n        f.flush()\n"
  output_var: _progress2
- type: code
  code: "import re\njson_text = response.strip()\nif json_text.startswith('```'):\n\
    \    code_block = re.search(r'```(?:json)?\\s*(\\{.*\\})\\s*```', json_text, re.DOTALL)\n\
    \    if code_block:\n        json_text = code_block.group(1).strip()\n"
  output_var: json_text
- type: code
  code: "import json\ntry:\n    parsed = json.loads(json_text)\nexcept json.JSONDecodeError\
    \ as e:\n    fixed = json_text.replace('\\n', '\\\\n')\n    try:\n        parsed\
    \ = json.loads(fixed)\n    except json.JSONDecodeError:\n        import re\n \
    \       comment_match = re.search(r'\"comment\"\\s*:\\s*\"(.*?)\"(?=\\s*[,}])',\
    \ json_text, re.DOTALL)\n        vote_match = re.search(r'\"vote\"\\s*:\\s*(\"\
    ?\\w+\"?|null)', json_text)\n        diagram_match = re.search(r'\"diagram\"\\\
    s*:\\s*\"(.*?)\"(?=\\s*[,}])', json_text, re.DOTALL)\n        parsed = {\n   \
    \         \"comment\": comment_match.group(1).replace('\\n', ' ') if comment_match\
    \ else \"Parse error\",\n            \"vote\": vote_match.group(1).strip('\"')\
    \ if vote_match else None,\n            \"diagram\": diagram_match.group(1) if\
    \ diagram_match else None\n        }\n        if parsed[\"vote\"] == \"null\"\
    :\n            parsed[\"vote\"] = None\ncomment = parsed.get(\"comment\", \"\"\
    )\nvote = parsed.get(\"vote\")\ndiagram_content = parsed.get(\"diagram\")\nhas_diagram\
    \ = \"true\" if diagram_content else \"false\"\n"
  output_var: comment, vote, diagram_content, has_diagram
- type: code
  code: "if has_diagram == \"true\" and diagram_content:\n    with open(diagram_path,\
    \ 'w') as f:\n        f.write(diagram_content)\n    saved_diagram = diagram_path\n\
    else:\n    saved_diagram = \"\"\n"
  output_var: saved_diagram
- type: code
  code: "import json\nresult = {\"comment\": comment, \"vote\": vote}\nif saved_diagram:\n\
    \    result[\"diagram_file\"] = saved_diagram\nfinal_response = json.dumps(result)\n"
  output_var: final_response
output: '{final_response}'