Built with Bolt
PromptLenz Interactive Landing Page Development
Michai Morin
PromptLenz Web App: Interactive Landing Page
This is the React based website and landing page for the PromptLenz.App
PromptLenz is a professional AI model comparison platform designed to help developers, researchers, and AI professionals efficiently test, compare, and analyze responses from various large language models. It aims to streamline the AI development workflow by providing a unified tool that eliminates the need to juggle multiple platforms, API keys, or manual comparison methods.
Different Sections of the Website: The website is structured into several key sections, each highlighting a different aspect of the PromptLenz platform:
Hero Section: The introductory section that presents the platform's main value proposition, key statistics (e.g., number of models available, free tokens), and an interactive live comparison demo.
Workflow Steps Section: Explains the simplified 5-step process of using PromptLenz, from entering a prompt to analyzing results, with interactive visual examples.
Empowerment Section: Details who the platform is designed for (AI enthusiasts, prompt engineers, researchers, and developers) and the specific benefits it offers to each group.
Feature Showcase: An interactive file explorer-like interface that allows users to explore detailed descriptions and visual examples of the platform's powerful features, such as side-by-side testing, model diff view, response analysis, and prompt chaining.
Demo Section: Provides a hands-on interactive demo where users can input a prompt, select two models, and simulate a comparison to see how the metrics card would display results.
Token Economy Section: Explains the token-based pricing model, including a token usage calculator to estimate costs, and outlines the advantages of this approach over traditional subscriptions. It also presents the different token packages available for purchase.
Trust Section: Addresses security and privacy concerns, emphasizing features like no prompt storage, regular security audits, end-to-end encryption, and GDPR compliance.
Metrics Section: Showcases the efficiency gains and positive feedback from beta testers, highlighting how PromptLenz helps users ship products faster and make better AI decisions.
Final CTA Section: A concluding call-to-action encouraging users to start testing the platform for free.
Footer: Contains links to features, company information (including an "About" modal with the company's origin story), terms of service, and privacy policy.
Tech Stack: The PromptLenz website is built with a modern and efficient tech stack:
Frontend:
React: The primary JavaScript library for building the user interface.
TypeScript: Provides type safety and improves code quality and maintainability.
Vite: A fast build tool and development server for modern web projects.
Tailwind CSS: A utility-first CSS framework used for rapid and consistent styling.
Lucide React: A collection of open-source icons used throughout the application for visual elements.
Motion: A library for declarative animations.
Clsx & Tailwind-merge: Utilities for conditionally joining CSS class names.
Backend & Database:
Supabase: Used for backend services, including user authentication, database management (PostgreSQL), and potentially edge functions. The database schema includes tables for managing Stripe orders, customer information, subscriptions, model usage, user tokens, query history, and allowed models, indicating a comprehensive system for user and billing management.
Deployment:
Netlify: The platform used for deploying and hosting the static site.
Development:
Bolt.New: This website was built using the Bolt.New development platform.
Like this project
Posted Jun 7, 2025
Developed an interactive landing page for the PromptLenz Web App using Bolt.New, React, Supabase, Stripe, and modern web tools.
