Skip to main content

User Story Management and Integration

Core Agent provides comprehensive user story management capabilities, including integration with project management tools like Jira, automated story extraction from designs, and intelligent story generation from application screenshots. This enables seamless conversion of requirements into actionable test cases and development tasks.

Jira & Figma Integration Options

Core Agent provides multiple integration options for connecting user stories and design artifacts into automated test generation:

  1. PostQode Model Context Protocol (MCP) Server: Allows the AI agent to interactively search, read, create, and update Jira tickets and inspect Figma canvas design trees directly.
  2. Jira REST API & Test Management Sync: Automated sync with Jira issue tracking and enterprise test management tools (Xray / Zephyr for test result reporting).
  3. Git & GitHub Integration: Smart commit linking and pull request requirement validation.

Setting Up Jira & Figma MCP in PostQode

Configuration File Location

MCP server configurations are defined in postqode_mcp_settings.json:

  • macOS / Linux: ~/.postqode/settings/postqode_mcp_settings.json
  • Windows: %APPDATA%\Code\User\globalStorage\postqode.postqode\settings\postqode_mcp_settings.json

Prerequisites

  1. Atlassian Jira Credentials:
    • Go to Atlassian API Tokens.
    • Click Create API token, name it postqode-mcp, and copy the generated token.
    • Note your Atlassian user email and Jira host domain (e.g. https://your-domain.atlassian.net).
  2. Figma Access Token:
    • Go to your Figma Account Settings ➔ Personal access tokens.
    • Generate a token named postqode-figma and copy it.

MCP Configuration Example

Add the Jira and Figma servers to your postqode_mcp_settings.json:

{
"mcpServers": {
"jira": {
"command": "npx",
"args": ["-y", "@modelcontextprotocol/server-jira"],
"env": {
"JIRA_HOST": "https://your-company.atlassian.net",
"JIRA_EMAIL": "[email protected]",
"JIRA_API_TOKEN": "your-atlassian-api-token"
}
},
"figma": {
"command": "npx",
"args": ["-y", "figma-mcp-server"],
"env": {
"FIGMA_ACCESS_TOKEN": "your-figma-personal-access-token"
}
}
}
}

Checking & Re-establishing Connection

  1. Click the MCP Servers (🔌) icon in the PostQode chat panel.
  2. Verify that jira and figma show a green Connected status with available tools (jira_get_issue, jira_search_issues, figma_get_file_nodes).
  3. If disconnected, click Restart Server to re-authenticate.

Story Analysis and Processing

Story Structure Recognition

📝 Jira Story Analysis:
├── Story Title and Description
├── Acceptance Criteria (Given-When-Then)
├── Story Points and Priority
├── Labels and Components
├── Linked Issues and Dependencies
├── Comments and Attachments
└── Custom Fields and Metadata

Example: Jira Story Processing

🎫 ECOM-456: User Account Registration

📋 Story Details:
- Type: Story
- Priority: High
- Story Points: 5
- Sprint: Sprint 23
- Assignee: John Developer
- Reporter: Jane Product Owner

📝 Description:
"As a new user, I want to create an account on the e-commerce platform
so that I can save my preferences and track my orders."

✅ Acceptance Criteria:
1. Given I am on the registration page
When I enter valid email, password, and personal details
Then my account should be created successfully

2. Given I am registering with an existing email
When I submit the registration form
Then I should see an error message "Email already exists"

3. Given I enter an invalid email format
When I submit the registration form
Then I should see validation error for email format

🧪 Generated Test Cases:
├── ✅ Valid User Registration
├── ❌ Registration with Existing Email
├── ❌ Registration with Invalid Email Format
├── ❌ Registration with Weak Password
├── 🔒 Registration Without Required Fields
└── 📊 Registration with Various Data Combinations

Bulk Story Processing

# Bulk Story Extraction Configuration
bulk_extraction:
query: "project = ECOM AND status IN ('To Do', 'In Progress') AND type = Story"
batch_size: 50
processing_options:
extract_acceptance_criteria: true
generate_test_cases: true
create_test_data: true
link_dependencies: true

output_format:
test_suites: "feature_based"
documentation: "markdown"
traceability_matrix: "excel"

filters:
priority: ["High", "Medium"]
components: ["User Management", "Shopping Cart", "Payment"]
labels: ["testing-required", "automation-candidate"]

Figma Design Integration

Design Analysis Capabilities

Core Agent can analyze Figma designs to extract UI components, user flows, and generate corresponding user stories and test cases.

Figma API Integration

# Figma Configuration
figma_config:
api_token: "your-figma-api-token"
team_id: "your-team-id"

analysis_settings:
extract_components: true
identify_interactions: true
analyze_user_flows: true
generate_responsive_tests: true

supported_elements:
- buttons
- forms
- navigation
- modals
- dropdowns
- image_galleries
- data_tables

Design-to-Story Generation Process

🎨 Figma Analysis Workflow:
├── 🔗 Connect to Figma file/project
├── 📊 Extract design components and layouts
├── 🔍 Identify interactive elements
├── 🗺️ Map user interaction flows
├── 📝 Generate user stories from interactions
├── 🧪 Create corresponding test cases
└── 📋 Build comprehensive test plans

Practical Example: E-commerce Checkout Flow

Figma Design Analysis

🎨 Figma File: "E-commerce Checkout Flow"

🔍 Identified Screens:
├── 📄 Shopping Cart Review
├── 🚚 Shipping Information
├── 💳 Payment Details
├── 📋 Order Summary
└── ✅ Confirmation Page

🖱️ Interactive Elements Detected:
├── Quantity Selectors (+ / - buttons)
├── Remove Item Buttons
├── Shipping Method Radio Buttons
├── Payment Method Selection
├── Credit Card Form Fields
├── Promo Code Input
├── Place Order Button
└── Continue Shopping Link

📱 Responsive Breakpoints:
├── Desktop: 1200px+
├── Tablet: 768px - 1199px
└── Mobile: 320px - 767px

Generated User Stories

📝 Generated User Stories from Figma Design:

🎫 ECOM-501: Shopping Cart Quantity Management
"As a customer, I want to adjust item quantities in my cart
so that I can purchase the exact amount I need."

Acceptance Criteria:
✅ User can increase quantity using + button
✅ User can decrease quantity using - button
✅ Quantity cannot go below 1
✅ Price updates automatically when quantity changes
✅ Total cart value recalculates correctly

🎫 ECOM-502: Shipping Method Selection
"As a customer, I want to choose my preferred shipping method
so that I can balance cost and delivery speed."

Acceptance Criteria:
✅ Multiple shipping options are displayed with costs
✅ User can select one shipping method
✅ Delivery estimates are shown for each option
✅ Total order cost updates with shipping selection
✅ Default shipping method is pre-selected

🎫 ECOM-503: Payment Information Entry
"As a customer, I want to securely enter my payment details
so that I can complete my purchase."

Acceptance Criteria:
✅ Credit card form validates card number format
✅ Expiry date validation prevents past dates
✅ CVV field is masked for security
✅ Billing address can be same as shipping
✅ Payment form shows security indicators

Application Screenshot Analysis

Screenshot Processing Capabilities

Core Agent can analyze application screenshots to understand existing functionality and generate corresponding user stories and test cases.

Screenshot Analysis Process

📸 Screenshot Analysis Workflow:
├── 🖼️ Upload application screenshots
├── 🔍 Identify UI elements and components
├── 📊 Analyze layout and information architecture
├── 🎯 Infer user interactions and workflows
├── 📝 Generate user stories for identified features
├── 🧪 Create test cases for functionality
└── 📋 Build regression test suites

Element Recognition Technology

🤖 AI-Powered Element Detection:
├── Buttons and Clickable Elements
├── Form Fields and Input Controls
├── Navigation Menus and Links
├── Data Tables and Lists
├── Modal Dialogs and Popups
├── Image Galleries and Carousels
├── Search Bars and Filters
└── Status Indicators and Badges

Example: Mobile App Screenshot Analysis

Screenshot Input

📱 Mobile App Screenshots: "Food Delivery App"

🖼️ Analyzed Screens:
├── 🏠 Home Screen (Restaurant listings)
├── 🍕 Restaurant Detail Page
├── 🛒 Menu and Cart
├── 📍 Delivery Address Selection
└── 💳 Payment and Checkout

Generated Analysis Report

📊 Screenshot Analysis Report:

🔍 Identified Features:
├── Restaurant Search and Filtering
├── Menu Item Selection and Customization
├── Shopping Cart Management
├── Address and Location Services
├── Payment Processing
├── Order Tracking
└── User Account Management

🖱️ Interactive Elements:
├── Search Bar with Filter Options
├── Restaurant Cards (Clickable)
├── Add to Cart Buttons
├── Quantity Selectors
├── Customization Options (Size, Toppings)
├── Address Selection Map
├── Payment Method Cards
└── Order Status Indicators

📱 Mobile-Specific Patterns:
├── Bottom Navigation Tabs
├── Swipe Gestures for Image Galleries
├── Pull-to-Refresh on Restaurant List
├── Floating Action Button for Cart
└── Modal Overlays for Item Details

Generated User Stories

📝 User Stories from Screenshot Analysis:

🎫 FOOD-101: Restaurant Discovery
"As a hungry customer, I want to browse nearby restaurants
so that I can find food options that appeal to me."

Acceptance Criteria:
✅ Restaurants are displayed with photos and ratings
✅ Filter options include cuisine type, price range, delivery time
✅ Search functionality works with restaurant names and food types
✅ Location-based sorting shows nearest restaurants first
✅ Restaurant cards show key information (rating, delivery fee, time)

🎫 FOOD-102: Menu Item Customization
"As a customer, I want to customize my food order
so that I can get exactly what I want."

Acceptance Criteria:
✅ Menu items show customization options (size, toppings, etc.)
✅ Price updates automatically with customizations
✅ Special instructions field is available
✅ Dietary restrictions and allergen info is displayed
✅ Add to cart button is prominent and functional

🎫 FOOD-103: Cart Management
"As a customer, I want to review and modify my order
before checkout so that I can ensure it's correct."

Acceptance Criteria:
✅ Cart shows all selected items with customizations
✅ Quantity can be adjusted for each item
✅ Items can be removed from cart
✅ Subtotal, taxes, and delivery fees are clearly displayed
✅ Promo codes can be applied and validated

Integration Workflows

End-to-End Story Processing

name: story-to-test-pipeline
description: Complete pipeline from story extraction to test execution

steps:
- name: story-extraction
sources: ["jira", "figma", "screenshots"]
actions:
- extract_stories: "all_active_sprints"
- analyze_acceptance_criteria: "detailed_parsing"
- identify_test_scenarios: "comprehensive_coverage"

- name: test-generation
actions:
- generate_functional_tests: "positive_and_negative"
- create_integration_tests: "api_and_ui"
- build_performance_tests: "load_scenarios"
- generate_test_data: "realistic_datasets"

- name: test-organization
actions:
- create_test_suites: "story_based_grouping"
- setup_execution_order: "dependency_aware"
- configure_environments: "multi_environment"

- name: documentation
actions:
- generate_test_plans: "comprehensive_coverage"
- create_traceability_matrix: "story_to_test_mapping"
- build_execution_reports: "detailed_results"

Cross-Platform Story Analysis

# Multi-Source Story Integration
integration_config:
sources:
jira:
projects: ["ECOM", "MOBILE", "API"]
issue_types: ["Story", "Epic", "Task"]

figma:
teams: ["Design Team", "UX Research"]
projects: ["Web App", "Mobile App"]

screenshots:
applications: ["Production App", "Staging App"]
platforms: ["Web", "iOS", "Android"]

consolidation:
merge_duplicate_stories: true
resolve_conflicts: "manual_review"
maintain_source_links: true

output:
unified_backlog: "priority_ordered"
test_coverage_matrix: "comprehensive"
execution_roadmap: "sprint_aligned"

User story management with Core Agent provides seamless integration between project management tools, design systems, and test automation, ensuring comprehensive coverage from requirements to execution.