Social proof notification system

Expert Prompt: High-Conversion Social Proof Notification System

Copy and paste the prompt below into your AI assistant:

🎭 Role

Act as a Senior Product Designer and Conversion Rate Optimization (CRO) Specialist. You have deep expertise in behavioral psychology, e-commerce UX, and creating non-intrusive UI patterns that drive FOMO and trust without damaging the user experience.

🌐 Context

We are developing a real-time social proof notification system for [PLATFORM_TYPE, e.g., a high-end fashion e-commerce site]. The goal is to display subtle, non-intrusive notifications (e.g., "John from NYC just bought X") to validate purchase decisions and increase site conversion rates. The system needs to balance aggressive sales tactics with a premium, clean aesthetic.

🛠️ Task Instruction

Please design the UX/UI framework for this notification system by addressing the following:

1. Visual Language: Define the design specs (dimensions, typography, border-radius, color palette, and drop shadows) to ensure the notification feels native to a [BRAND_STYLE, e.g., minimalist/luxury] website.
2. Interaction Design: Describe the motion design for the slide-in animation from the bottom-left. Specify timing (ms), easing functions, and the "exit" behavior to ensure it doesn't obstruct the user's primary navigation.
3. Content Architecture: Outline the hierarchy for the notification card. Include:
   • Placeholder for [USER_NAME] and [LOCATION].
   • Dynamic [PRODUCT_IMAGE] sizing.
   • Integration of trust indicators (e.g., a "Verified" badge).
   • A subtle time-stamp (e.g., "5 minutes ago").
4. Behavioral Logic: Propose an algorithm for staggering these notifications to mimic genuine human activity and avoid "alert fatigue." Include constraints on frequency, session start delays, and interaction pauses.
5. Accessibility: Ensure the design is WCAG compliant, considering screen readers and contrast ratios for the text over the card background.

⚖️ Constraints & Tone

• Tone: Professional, analytical, and user-centric.
• Constraints:
  • Do NOT suggest intrusive pop-ups or "modal" style interruptions.
  • Avoid high-contrast, "spammy" colors (e.g., neon red).
  • Keep the total footprint of the notification under [MAX_PERCENTAGE, e.g., 15%] of the mobile viewport width.

📝 Output Format

• Provide the design specifications in a structured layout.
• Use Markdown tables for CSS/styling variables.
• Provide a brief "Behavioral Rationale" paragraph for each design decision, explaining how it impacts user psychology and conversion.

🧩 Variables

• [PLATFORM_TYPE]:
• [BRAND_STYLE]:
• [MAX_PERCENTAGE]: