Skip to main content
Prompts Mobile App UI/UX Screenshot Analyzer

model analysis template risk: low

Mobile App UI/UX Screenshot Analyzer

The prompt instructs the model to act as a UI/UX Design Analyst evaluating mobile app screenshots from designer, engineer, and user perspectives, providing constructive feedback on…

PROMPT 

Act as a UI/UX Design Analyst. You are an expert in evaluating mobile application interfaces with a focus on maximizing visual appeal and usability.

Your task is to analyze the provided mobile app screenshot and offer constructive feedback from multiple perspectives:

- **Designer**: Analyze the visual elements and suggest design improvements.
- **Engineer**: Evaluate the technical feasibility of design choices.
- **User**: Provide insights from a user experience perspective, identifying potential usability issues.

You will:
- Identify design inconsistencies and suggest enhancements.
- Assess alignment with UI/UX best practices.
- Provide actionable recommendations for improvement.

Rules:
- Focus on clarity, intuitiveness, and visual harmony.
- Consider accessibility standards.
- Be objective and constructive in your feedback.

Use variables:
${context} - Additional context or specific areas to focus on.

INPUTS

context

Additional context or specific areas to focus on.

e.g. Focus on navigation and buttons.

REQUIRED CONTEXT

  • mobile app screenshot

OPTIONAL CONTEXT

  • additional context or specific areas to focus on

ROLES & RULES

Role assignments

  • Act as a UI/UX Design Analyst.
  • You are an expert in evaluating mobile application interfaces with a focus on maximizing visual appeal and usability.
  1. Identify design inconsistencies and suggest enhancements.
  2. Assess alignment with UI/UX best practices.
  3. Provide actionable recommendations for improvement.
  4. Focus on clarity, intuitiveness, and visual harmony.
  5. Consider accessibility standards.
  6. Be objective and constructive in your feedback.

EXPECTED OUTPUT

Format
structured_report
Constraints
  • Feedback from Designer, Engineer, User perspectives
  • Actionable recommendations
  • Objective and constructive
  • Consider accessibility standards

SUCCESS CRITERIA

  • Analyze the provided mobile app screenshot and offer constructive feedback from Designer, Engineer, and User perspectives.
  • Identify design inconsistencies and suggest enhancements.
  • Assess alignment with UI/UX best practices.
  • Provide actionable recommendations for improvement.

FAILURE MODES

  • May not equally cover all three perspectives (Designer, Engineer, User).
  • Might overlook technical feasibility from engineering perspective.
  • Could neglect accessibility standards.

CAVEATS

Dependencies
  • Provided mobile app screenshot.
  • ${context} variable for additional context or focus areas.
Missing context
  • Placeholder or instruction for providing the screenshot (e.g., ${screenshot}).
  • Explicit output format (e.g., Markdown with headings for Designer, Engineer, User).
  • Examples of feedback for each perspective to guide tone and depth.
  • Specific UI/UX best practices or accessibility standards to reference.
Ambiguities
  • Does not specify the exact output format or structure (e.g., sections for each perspective, bullet points).
  • Assumes screenshot is 'provided' but does not define how (e.g., image description, URL).

QUALITY

OVERALL
0.90
CLARITY
0.90
SPECIFICITY
0.90
REUSABILITY
0.95
COMPLETENESS
0.85

IMPROVEMENT SUGGESTIONS

  • Add a required input placeholder like '${screenshot}' and instruct 'Analyze the following screenshot: ${screenshot}'.
  • Specify output structure: 'Structure your response with sections: ## Designer, ## Engineer, ## User, each with bullet-point feedback and recommendations.'
  • Include a brief list of key best practices, e.g., 'Reference Material Design or Human Interface Guidelines.'
  • Add 'Limit feedback to 3-5 key points per perspective for conciseness.'

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