Consumer Experience

DPP Website Builder

Build consumer-facing product passport pages with AI — branded, multilingual, deployed automatically. The page your customers see when they scan.

The page your customers see when they scan the QR code

The website builder creates public-facing DPP landing pages — the consumer experience at the end of a QR code scan. Pre-built templates are optimised for DPP compliance. Each template includes layout, styling, content structure, and starter configuration, backed by a GitHub repository for version control.

These are not static mockups. They are live, deployed websites.

An AI development agent that builds in real time

Every site has an AI-powered development agent (Claude) that modifies the page as you describe changes in natural language. “Change the header colour to navy.” “Add a sustainability section.” “Translate the page to French.” Changes stream in real time via Server-Sent Events — you see them as they happen. Full conversation history is preserved per site.

Your brand, applied automatically

Enter your company website URL. The AI analyses your existing brand identity — colours, typography, visual style — and applies it to your DPP pages. Custom logos, brand palettes, and consistent styling across every product passport page. Mobile-responsive design is standard.

All 24 EU languages

The ESPR requires DPP information to be accessible in the language of the market where the product is sold. The AI development agent handles translation and localisation across all 24 official EU languages: Bulgarian, Croatian, Czech, Danish, Dutch, English, Estonian, Finnish, French, German, Greek, Hungarian, Irish, Italian, Latvian, Lithuanian, Maltese, Polish, Portuguese, Romanian, Slovak, Slovenian, Spanish, and Swedish.

Fully automated deployment

Sites deploy through a five-step pipeline: GitHub repository from template, configuration with site-specific settings, Netlify for static hosting with CI/CD, Fly.io for the AI development agent runtime, and the site record updated with all deployment URLs. Create, preview, edit, publish — all from the platform dashboard. No devops team required.


What does a DPP consumer page need to include?

The ESPR does not prescribe a specific visual layout, but it requires that DPP information be accessible to consumers in a clear, understandable format. In practice, a DPP product page needs to present data from the 15 EPRS data categories in a way that is useful to both consumers and regulators.

For a consumer, this means:

  • Material composition — what the product is made from, including recycled content percentages
  • Environmental impact — carbon footprint, water consumption, energy use
  • Circularity information — how to repair, recycle, or dispose of the product
  • Supply chain transparency — where the product was made and by whom
  • Certifications — ISO 14001, OEKO-TEX, GOTS, and other relevant standards

For a regulator or compliance inspector, the page also needs to link to the underlying signed DPP document and provide machine-readable access via the GS1 resolver.

Aura’s templates are designed to present all of this data in a structured, scannable layout that meets regulatory requirements without overwhelming the consumer. For more on the full data model, see DPP data requirements explained.

How does the AI development agent work?

Every DPP site created on Aura has its own AI development agent powered by Claude. This is not a template editor with drag-and-drop widgets. It is a conversational AI that can modify HTML, CSS, and content in real time based on natural language instructions.

Examples of what the agent handles:

  • “Move the carbon footprint section above the material composition”
  • “Add a repair instructions section with an accordion layout”
  • “Make the certification badges larger and add tooltips showing expiry dates”
  • “Translate all content to German and adjust the layout for longer text”
  • “Apply our brand colour palette — primary #1A2B5F, accent #4CAF50”

Changes stream in via Server-Sent Events, so you see updates appear on the page as the agent works. Every conversation is preserved, so you can return to a site weeks later and continue where you left off.

The agent has access to your product data, so it can pull in real values rather than placeholder text. When you say “add the carbon footprint data for product X,” the agent populates the section with actual Scope 1, 2, and 3 figures from your DPP data model.

Can I customise the DPP page for different product categories?

Yes. Each product category can have its own template or layout variant. A textiles brand might want to highlight fibre composition and care instructions prominently, while a battery manufacturer needs to foreground cycle life and hazardous substance data.

The workflow is straightforward:

  1. Start from a template — choose the pre-built template closest to your product category (e.g., DPP Apparel for fashion and textiles)
  2. Customise with the AI agent — describe the changes you need. Add sections, remove irrelevant ones, reorder content, adjust emphasis
  3. Apply your branding — enter your website URL and the AI extracts your brand identity automatically
  4. Preview and publish — check the result on desktop and mobile, then push live

Once a template is customised for one product, it applies across all products in that category. You do not need to rebuild pages for each SKU — the page pulls data dynamically from the DPP.

How does the deployment pipeline work?

When you create a new DPP site, Aura runs a fully automated five-step deployment:

  1. Repository creation — a GitHub repository is created from the selected template, giving you version control over every change
  2. Configuration — the repository is configured with your site-specific settings: brand colours, product data endpoints, resolver URLs
  3. Static hosting — a Netlify site is created and linked to the repository, providing CDN-backed hosting with automatic CI/CD deploys on every change
  4. AI agent runtime — a Fly.io application is provisioned to run the AI development agent, which handles real-time site modifications
  5. Platform registration — the site record is updated with all deployment URLs and status

The entire pipeline runs without manual intervention. Status tracking in the dashboard shows progress through each step with a real-time progress bar. Once deployed, you manage the site entirely from the Aura platform — create, preview, edit, and publish without touching a terminal or deployment tool.

For teams using QR codes on packaging, this means the page behind the scan is live and branded within minutes of setup.

How Aura helps

Building a consumer-facing DPP page from scratch requires frontend development, hosting infrastructure, data integration, multilingual support, and ongoing maintenance. Most brands do not have a dedicated team for this, and outsourcing it as a web project adds months and significant cost.

Aura eliminates the entire build-and-deploy cycle. Select a template, apply your brand, customise with the AI agent, and publish. The page is live, mobile-responsive, available in all 24 EU languages, and automatically connected to your product data. When you update a product’s DPP data — new carbon figures, updated certifications, revised material composition — the page reflects those changes.

Your DPP pages are the last step in the chain from product data through supplier data collection to the consumer’s screen. Read more about the consumer experience in our post on building DPP pages.


Frequently asked questions

Do I need a web developer to create DPP pages?

No. The AI development agent handles all design and content changes through natural language instructions. You describe what you want, and the agent implements it. Technical teams can access the underlying GitHub repository directly if they prefer, but it is not required.

Can I use my own domain for DPP pages?

DPP sites are deployed on Netlify with a default subdomain. Custom domain configuration is available for brands that want their DPP pages served from their own domain (e.g., dpp.yourbrand.com). This is configured during site setup.

How does multilingual support work in practice?

Tell the AI development agent to translate the page into the language you need — “Translate this page to French” or “Add a German language version.” The agent handles the translation, adjusts the layout for text length differences, and preserves the page structure. The ESPR requires that DPP information be available in the language of the market where the product is sold, so this is not optional for brands selling across multiple EU member states.

What happens to the page if I update my product’s DPP data?

The page pulls data from your DPP, so updates are reflected automatically. If you add new supplier certifications, update carbon footprint figures, or revise material composition through the platform, the DPP page shows the latest data on the next visit. No manual page updates needed.

Ready to try it?

Explore Aura at no cost — start with 50 products and see how dpp website builder works for your organisation.

See pricing