Preview Sites

Repository for quickly building tailored UI mockups and proposals for prospective clients. Reusable starter designs live in templates/. Client-specific work lives in proposals/.

Agent / creation rules

See RULE.md for the step-by-step workflow to create a client preview (gallery, pricing picker, scope docs, hard constraints). Cursor also loads .cursor/rules/preview-sites.mdc on every session.

Platform features

See features.md for the product catalog: public site, client portal + UTM (base), and add-ons (email/SMS, direct mail, blog, Stripe payments, social, AI social via Ollama) with build/monthly pricing and UX screen lists.

Each client proposal should include:

proposal/SCOPE.md — which features are recommended and priced for that client
mockup/ux-gallery.html — monica-style card hub (one card per screen/feature)
mockup/pricing.html — interactive feature picker with dependency rules

Active previews

Business	Phone	Email	Preview URL
Bob Bollweg Plumbing	(630) 393-9444	TBD	https://bob-bollweg-plumbing-preview.aimloperations.com/
Ed's Plumbing & Sewer	(630) 663-1444	info@thegreatestplumber.com	https://ed-preview.aimloperations.com/
Fix&Fresh	(630) 936-8512	fixandfreshllc@gmail.com	https://fix-and-fresh-preview.aimloperations.com/
Golden Sun Landscaping & Tree Service	(630) 330-0486	goldensunlandscaping@yahoo.com	https://golden-sun-landscaping-preview.aimloperations.com/
Happy Hauling Junk Removal	(224) 622-2526	TBD	https://happy-hauling-junk-removal-preview.aimloperations.com/
Mobile Galaxy Gaming	(773) 817-4239	TBD	https://mobile-galaxy-gaming-preview.aimloperations.com/
Paint to Please	TBD	TBD	https://paint-to-please-preview.aimloperations.com/
Professional Fence Repair	(630) 393-3722	TBD	https://professional-fence-repair-preview.aimloperations.com/
Select Electrical Services	(630) 202-8020	select8020@gmail.com	https://select-electrical-preview.aimloperations.com/
Singh Driving School	(630) 999-9931	TBD	https://singh-driving-school-preview.aimloperations.com/
T.R.B. Painting	(630) 606-6776	TBD	https://trb-painting-preview.aimloperations.com/

Repository structure

preview_sites/
├── features.md
├── templates/
│   └── <template-name>/
│       ├── index.html
│       ├── css/
│       ├── js/
│       └── assets/
└── proposals/
    └── <client-name>/
        ├── mockup/
        │   ├── index.html          # marketing entry (or public-home)
        │   ├── ux-gallery.html     # feature card gallery
        │   ├── pricing.html        # interactive estimate
        │   ├── ux-planned.html     # stubs for unbuilt screens
        │   ├── css/
        │   ├── js/
        │   └── assets/
        └── proposal/
            ├── NOTES.md
            ├── SCOPE.md
            └── ...

templates/ contains reusable site designs and components. Templates should not contain client names, branding, credentials, or other client-specific data.
proposals/<client-name>/mockup/ contains the tailored static HTML, CSS, JavaScript, images, fonts, and other assets used for a client demo.
proposals/<client-name>/proposal/ contains the related proposal documents, estimates, notes, and supporting material.

Use lowercase kebab-case for template and client folder names, such as real-estate or acme-properties.

Creating a client preview

Choose a starter from templates/.
Create proposals/<client-name>/mockup/ and proposals/<client-name>/proposal/.
Copy the selected template into mockup/.
Tailor branding, copy, images, layout, and interactions.
Test the mockup locally as a static site.
Copy the contents of mockup/ to the preview server and configure an Nginx server block for the client's preview hostname.
Remove the hosted preview when it is no longer needed.

Preview requirements

Mockups should remain portable static sites:

Use relative paths for local CSS, JavaScript, and assets.
Keep index.html as the entry point.
Do not commit API keys, passwords, production customer data, or other secrets.
Use fictional or explicitly approved contact and customer information.
Optimize image and font sizes before deployment.
Clearly label previews as concepts when visitors could mistake them for live production sites.
Every page footer must include: Made by AI ML Operations, LLC (company name is the link).

Nginx deployment

Deployment is manual. Each preview can be copied to its own web root and served by Nginx:

server {
    listen 80;
    server_name client-preview.example.com;

    root /var/www/previews/client-name;
    index index.html;

    location / {
        try_files $uri $uri/ =404;
    }
}

Enable HTTPS and any desired access controls on the server. For private or unfinished previews, restrict access with authentication or an IP allowlist.

5.1 KiB Raw Permalink Blame History