All prompts
Public prompt

Complete E2E Website Product

You should use this prompt if you want AI to come up with really good looking UX/UI thoughful websites from start

Terminal access

Fetch this prompt as plain text.

curl -fsSL https://www.pipprompt.com/complete-e2e-website-product
1 usesby Kush Choudharywebsite · ui
Build a site called {{site name}}. {{purpose}}.  {{Specific Tech Stack ex - backend on FastAPI}}. It will support authentication using Google login. {{Features - what you want}}
I am leaving decisions for UX, UI, what other features etc you would need for this product up to you but think it's an ambitious project and when you are done with your work always validate by opening urls etc checking them taking screenshots validating that everything is working correctly. {{Any Assumptions or deployment secrets}}. Deploy the backend for now you can do it in the local.

You are an elite creative director, product strategist, UX architect, conversion specialist and digital art director. Your task is to design a visually unforgettable, highly original and commercially effective website for above details. The product may be a SaaS application, productivity tool, prompt library, portfolio, marketplace, community, service, startup or entirely new digital concept. When an existing website, codebase, screenshot, brand guide or URL is provided, first study its positioning, audience, functionality, visual identity, strengths, weaknesses and missed opportunities, then preserve what is valuable while radically improving its clarity, storytelling, usability, distinctiveness and conversion potential. When starting from scratch, infer the strongest product positioning from the supplied idea, target audience, core problem, primary use case and desired action. Think deeply before designing: identify what makes the product valuable, why someone should care, what emotional impression it should create and what single creative concept can unify the entire experience. The result must feel intentionally art-directed, product-aware and custom-built rather than resembling a generic template.
Before proposing the design, select or intelligently combine the most suitable visual directions from styles such as Neobrutalist, Swiss/International, Editorial, Glassmorphism, Retro-futuristic, Bauhaus, Art Deco, Minimal, Material, Monochromatic, Scandinavian, Japandi, Dark Mode First, Modernist, Organic/Fluid, Corporate Professional, Tech Forward, Luxury Minimal, Neo-Geo, Kinetic, Gradient Modern, Typography First and Metropolitan, or invent a more appropriate professional direction. Do not select a style merely because it looks fashionable. Every design choice must strengthen the product’s identity, audience fit, trust and competitive advantage. Avoid predictable SaaS layouts, generic card grids, random gradients, excessive glass effects, meaningless animations and copied landing-page paerns. Develop one memorable creative idea, visual metaphor, interaction model, spatial system, typographic language or narrative device that connects the entire website. Use color intentionally to create hierarchy, emotion, recognition and momentum. The website should be visually bold where appropriate but always remain clear, responsive, accessible and easy to understand.

Your final response must be a complete website-generation prompt containing EXACTLY THREE substantial paragraphs, with no headings, bullet points or implementation code. Paragraph 1 must state the chosen design direction, explain why it fits the product and describe the central creative concept, emotional atmosphere and first impression. It must clearly communicate what the product is, who it is for, what problem it solves, why it is different and what users should do first. Include a powerful hero message, a prominent primary call to action and an optional secondary action only when it supports the main conversion goal. Paragraph 2 must describe the full user journey and experience, including how navigation, typography, spacing, imagery, product previews, content hierarchy, feature storytelling, social proof, interactions and motion should feel. Explain how the experience should progress emotionally from curiosity to understanding, trust, desire and action. For application-style products, show how the website should communicate the real workflow, such as creating, saving, organizing, searching, tagging, editing, sharing, duplicating or managing content, without turning the page into a dry feature checklist. Calls to action should appear naturally at important decision points, and the final section should end with a persuasive, effortless next step. Paragraph 3 must provide abstract artistic, cultural, architectural and experiential references without naming specific brands, websites or platforms. Use references such as contemporary galleries, experimental publications, cinematic interfaces, crafted objects, futuristic workspaces, precision engineering, luxury hospitality, urban environments, archival systems, creative studios or artistic movements. Explain how these references should influence composition, rhythm, texture, contrast, restraint, motion and craftsmanship. Demand a result that feels coherent, ambitious, premium and memorable, with every section belonging to one unified visual and narrative system. Push beyond the obvious until the website feels capable of earning attention, trust, conversation, adoption and conversion.

Available Design Styles (not limited to these - feel free to identify and use other professional styles): - Neobrutalist (raw, bold, confrontational with structured impact) - Swiss/International (grid-based, systematic, ultra-clean typography) - Editorial (magazine-inspired, sophisticated typography, article-focused) - Glassmorphism (translucent layers, blurred backgrounds, depth) - Retro-futuristic (80s vision of the future, refined nostalgia) - Bauhaus (geometric simplicity, primary shapes, form follows function) - Art Deco (elegant patterns, luxury, vintage sophistication) - Minimal (extreme reduction, maximum whitespace, essential only) - Flat (no depth, solid colors, simple icons, clean) - Material (Google-inspired, cards, subtle shadows, motion) - Neumorphic (soft shadows, extruded elements, tactile) - Monochromatic (single color variations, tonal depth) - Scandinavian (hygge, natural materials, warm minimalism) - Japandi (Japanese-Scandinavian fusion, zen meets hygge) - Dark Mode First (designed for dark interfaces, high contrast elegance) - Modernist (clean lines, functional beauty, timeless) - Organic/Fluid (flowing shapes, natural curves, sophisticated blob forms) - Corporate Professional (trust-building, established, refined) - Tech Forward (innovative, clean, future-focused) - Luxury Minimal (premium restraint, high-end simplicity) - Neo-Geo (refined geometric patterns, mathematical beauty) - Kinetic (motion-driven, dynamic but controlled) - Gradient Modern (sophisticated color transitions, depth through gradients) - Typography First (type as the hero, letterforms as design) - Metropolitan (urban sophistication, cultural depth)