122 lines
9.3 KiB
HTML
122 lines
9.3 KiB
HTML
<!DOCTYPE html>
|
|
<html lang="en">
|
|
<head>
|
|
<meta charset="utf-8">
|
|
<meta name="viewport" content="width=device-width, initial-scale=1">
|
|
<title>Select Electrical Services — UX proposal gallery</title>
|
|
<link rel="stylesheet" href="assets/css/ux-hub.css">
|
|
</head>
|
|
<body class="hub-page">
|
|
<div class="proposal-banner">
|
|
<div><span class="tag">Proposal mockup</span> Select Electrical Services — UX examples (not production)</div>
|
|
<div>
|
|
<a href="pricing.html">Pricing picker</a> ·
|
|
<a href="index.html">Marketing home</a> ·
|
|
<a href="ux-gallery.html">All screens</a>
|
|
</div>
|
|
</div>
|
|
|
|
<section class="hub-hero">
|
|
<h1>Select Electrical Services — UX proposal</h1>
|
|
<p>Click-through mocks for the public marketing site and Django client portal: leads, UTM analytics, and optional add-ons (email/SMS, direct mail, blog, Stripe payments, social, AI social).</p>
|
|
</section>
|
|
|
|
<div class="hub-section">
|
|
<h2>Proposal</h2>
|
|
<p class="sec-lead">Scope and interactive estimate.</p>
|
|
</div>
|
|
<div class="hub-grid">
|
|
<a class="hub-card" href="pricing.html">
|
|
<div class="eyebrow">Proposal · Pricing</div>
|
|
<h3>Feature pricing</h3>
|
|
<p>Toggle add-ons; live build + monthly totals. Dependencies enforced.</p>
|
|
<span class="status">Ready</span>
|
|
</a>
|
|
</div>
|
|
|
|
<div class="hub-section">
|
|
<h2>Public site · base</h2>
|
|
<p class="sec-lead">What visitors see.</p>
|
|
</div>
|
|
<div class="hub-grid">
|
|
<a class="hub-card" href="index.html"><div class="eyebrow">Public · base</div><h3>Marketing home</h3><p>Brand-forward landing with services, reviews, and CTA.</p><span class="status">Ready</span></a>
|
|
<a class="hub-card" href="index.html#about"><div class="eyebrow">Public · base</div><h3>About</h3><p>Since 1984 · western suburbs · trust signals.</p><span class="status">Ready</span></a>
|
|
<a class="hub-card" href="index.html#contact"><div class="eyebrow">Public · base</div><h3>Contact form</h3><p>Lead capture → portal lead + contact.</p><span class="status">Ready</span></a>
|
|
<a class="hub-card" href="index.html#services"><div class="eyebrow">Public · extras</div><h3>Services overview</h3><p>Repairs, lighting, panels, fans, GFCI, EV charging.</p><span class="status">Ready</span></a>
|
|
<a class="hub-card" href="electrical-installation.html"><div class="eyebrow">Public · extras</div><h3>Panel / installation</h3><p>Service detail page.</p><span class="status">Ready</span></a>
|
|
<a class="hub-card" href="lighting-installation.html"><div class="eyebrow">Public · extras</div><h3>Lighting</h3><p>Service detail page.</p><span class="status">Ready</span></a>
|
|
<a class="hub-card" href="emergency-repair.html"><div class="eyebrow">Public · extras</div><h3>Troubleshooting & repairs</h3><p>Service detail page.</p><span class="status">Ready</span></a>
|
|
<a class="hub-card" href="smart-home.html"><div class="eyebrow">Public · extras</div><h3>EV charging</h3><p>Service detail page.</p><span class="status">Ready</span></a>
|
|
<a class="hub-card" href="public-404.html"><div class="eyebrow">Public · system</div><h3>404 not found</h3><p>Branded error page.</p><span class="status">Ready</span></a>
|
|
<a class="hub-card" href="public-under-construction.html"><div class="eyebrow">Public · system</div><h3>Under construction</h3><p>Pre-launch holding page with notify-me.</p><span class="status">Ready</span></a>
|
|
</div>
|
|
|
|
<div class="hub-section">
|
|
<h2>Client portal · base (+ UTM)</h2>
|
|
<p class="sec-lead">Private Django UI. UTM tracking included with every portal.</p>
|
|
</div>
|
|
<div class="hub-grid">
|
|
<a class="hub-card" href="portal-login.html"><div class="eyebrow">Portal · base</div><h3>Login</h3><p>Client authentication.</p><span class="status">Ready</span></a>
|
|
<a class="hub-card" href="portal-dashboard.html"><div class="eyebrow">Portal · base</div><h3>Dashboard</h3><p>New leads, campaign health, add-on widgets.</p><span class="status">Ready</span></a>
|
|
<a class="hub-card" href="portal-leads.html"><div class="eyebrow">Portal · base</div><h3>Lead inbox</h3><p>Statuses, source attribution, filters.</p><span class="status">Ready</span></a>
|
|
<a class="hub-card" href="portal-lead-detail.html"><div class="eyebrow">Portal · base</div><h3>Lead detail</h3><p>Notes, UTM, linked contact.</p><span class="status">Ready</span></a>
|
|
<a class="hub-card" href="portal-analytics.html"><div class="eyebrow">Portal · base</div><h3>UTM analytics</h3><p>Leads by source/campaign over time.</p><span class="status">Ready</span></a>
|
|
</div>
|
|
|
|
<div class="hub-section">
|
|
<h2>Email & SMS</h2>
|
|
<p class="sec-lead">Add-on. Required for payment notifications.</p>
|
|
</div>
|
|
<div class="hub-grid">
|
|
<a class="hub-card" href="portal-contacts.html"><div class="eyebrow">Portal · Email/SMS</div><h3>Mailing list</h3><p>Contacts with per-channel consent.</p><span class="status">Ready</span></a>
|
|
<a class="hub-card" href="portal-contacts-import.html"><div class="eyebrow">Portal · Email/SMS</div><h3>Import contacts</h3><p>CSV upload, mapping, consent defaults.</p><span class="status">Ready</span></a>
|
|
<a class="hub-card" href="portal-campaign.html"><div class="eyebrow">Portal · Email/SMS</div><h3>Campaign composer</h3><p>Email or SMS — recipients, schedule, send.</p><span class="status">Ready</span></a>
|
|
<a class="hub-card" href="portal-campaign-report.html"><div class="eyebrow">Portal · Email/SMS</div><h3>Email engagement</h3><p>Opens, clicks, bounces, unsubscribes.</p><span class="status">Ready</span></a>
|
|
<a class="hub-card" href="public-unsubscribe.html"><div class="eyebrow">Public · Email/SMS</div><h3>Opt-out / unsubscribe</h3><p>One-click and per-channel preference.</p><span class="status">Ready</span></a>
|
|
</div>
|
|
|
|
<div class="hub-section">
|
|
<h2>Direct mail</h2>
|
|
<p class="sec-lead">Add-on. Postcards / print vendor handoff.</p>
|
|
</div>
|
|
<div class="hub-grid">
|
|
<a class="hub-card" href="portal-postcard-designer.html"><div class="eyebrow">Portal · Direct mail</div><h3>Postcard designer</h3><p>Sizes, media library, front/back preview.</p><span class="status">Ready</span></a>
|
|
<a class="hub-card" href="portal-direct-mail.html"><div class="eyebrow">Portal · Direct mail</div><h3>Direct mail campaign</h3><p>Recipients, schedule, send.</p><span class="status">Ready</span></a>
|
|
</div>
|
|
|
|
<div class="hub-section">
|
|
<h2>Blog</h2>
|
|
<p class="sec-lead">Add-on. Public posts + portal management.</p>
|
|
</div>
|
|
<div class="hub-grid">
|
|
<a class="hub-card" href="public-blog.html"><div class="eyebrow">Public · Blog</div><h3>Blog index</h3><p>Public post listing.</p><span class="status">Ready</span></a>
|
|
<a class="hub-card" href="public-blog-post.html"><div class="eyebrow">Public · Blog</div><h3>Blog post</h3><p>Single article view.</p><span class="status">Ready</span></a>
|
|
<a class="hub-card" href="portal-blog.html"><div class="eyebrow">Portal · Blog</div><h3>Blog list</h3><p>Draft / published management.</p><span class="status">Ready</span></a>
|
|
<a class="hub-card" href="portal-blog-edit.html"><div class="eyebrow">Portal · Blog</div><h3>Blog editor</h3><p>Create and edit posts.</p><span class="status">Ready</span></a>
|
|
</div>
|
|
|
|
<div class="hub-section">
|
|
<h2>Payments (Stripe)</h2>
|
|
<p class="sec-lead">Add-on. Requires Email & SMS.</p>
|
|
</div>
|
|
<div class="hub-grid">
|
|
<a class="hub-card" href="portal-invoices.html"><div class="eyebrow">Portal · Payments</div><h3>Invoices</h3><p>Open / paid / past due list.</p><span class="status">Ready</span></a>
|
|
<a class="hub-card" href="portal-invoice-create.html"><div class="eyebrow">Portal · Payments</div><h3>Create invoice</h3><p>Line items, customer email, send.</p><span class="status">Ready</span></a>
|
|
<a class="hub-card" href="portal-invoice-detail.html"><div class="eyebrow">Portal · Payments</div><h3>Invoice detail</h3><p>Status and payment history.</p><span class="status">Ready</span></a>
|
|
<a class="hub-card" href="public-pay.html"><div class="eyebrow">Public · Payments</div><h3>Pay invoice</h3><p>Stripe checkout / confirmation.</p><span class="status">Ready</span></a>
|
|
</div>
|
|
|
|
<div class="hub-section">
|
|
<h2>Social & AI social</h2>
|
|
<p class="sec-lead">Add-ons. AI generator requires social consolidation (Ollama).</p>
|
|
</div>
|
|
<div class="hub-grid">
|
|
<a class="hub-card" href="portal-social-accounts.html"><div class="eyebrow">Portal · Social</div><h3>Social accounts</h3><p>OAuth connect, health, disconnect.</p><span class="status">Ready</span></a>
|
|
<a class="hub-card" href="portal-social.html"><div class="eyebrow">Portal · Social</div><h3>Social composer</h3><p>Live FB / IG / LinkedIn previews.</p><span class="status">Ready</span></a>
|
|
<a class="hub-card" href="portal-social-calendar.html"><div class="eyebrow">Portal · Social</div><h3>Social calendar</h3><p>Schedule and queue.</p><span class="status">Ready</span></a>
|
|
<a class="hub-card" href="portal-social-ai.html"><div class="eyebrow">Portal · AI Social</div><h3>AI social generator</h3><p>Ollama drafts → insert into composer.</p><span class="status">Ready</span></a>
|
|
</div>
|
|
<p class="aiml-site-credit">Made by <a href="https://aimloperations.com" rel="noopener noreferrer" target="_blank">AI ML Operations, LLC</a></p>
|
|
</body>
|
|
</html>
|