commit a42cde4dfc2511010cf50308dea248c05aa42aed
Author: root <root@hub.scroll.pub> Date: 2024-12-30 18:48:44 +0000 Subject: Initial commit diff --git a/body.html b/body.html new file mode 100644 index 0000000..9d24e43 --- /dev/null +++ b/body.html @@ -0,0 +1,78 @@ +<header class="nav-header"> + <nav> + <div class="logo">ConverSales AI</div> + <div class="nav-links"> + <a href="#features">Features</a> + <a href="#results">Results</a> + <a href="#demo">Demo</a> + </div> + </nav> +</header> + +<main> + <section class="hero"> + <h1>Turn Cold Leads Into Sales</h1> + <p class="subtitle">With Our ChatGPT Powered SMS Systems</p> + <div class="hero-cta"> + <p class="highlight">Performance-Based Partnership: Zero Upfront Costs!</p> + <button class="primary-btn" onclick="scrollToDemo()">Get Started</button> + </div> + </section> + + <section class="intro"> + <p>Got unconverted leads? Our ChatGPT Powered SMS Androids open persuasive conversations that get up to <span class="highlight">30% reply rates</span> and <span class="highlight">12-18% booking rates</span>.</p> + <p>Turn 'meh' into 'heck yeah'—it's like texting a buddy, but smarter and more persuasive.</p> + </section> + + <section id="features" class="features"> + <h2>Powerful Features for Maximum Conversion</h2> + <div class="features-grid"> + <div class="feature-card"> + <h3>Database Reactivation</h3> + <p>Revive dead leads with intelligent, human-like SMS conversations</p> + </div> + <div class="feature-card"> + <h3>48hr Sales Android</h3> + <p>Engage recent leads before they go cold</p> + </div> + <div class="feature-card"> + <h3>Cart Recovery</h3> + <p>Boost e-commerce revenue with smart follow-ups</p> + </div> + </div> + </section> + + <section id="results" class="results"> + <h2>Client Results</h2> + <div class="stats-grid"> + <div class="stat-card"> + <span class="stat-number">40%</span> + <span class="stat-label">Labor Cost Reduction</span> + </div> + <div class="stat-card"> + <span class="stat-number">25%</span> + <span class="stat-label">Revenue Increase</span> + </div> + <div class="stat-card"> + <span class="stat-number">60</span> + <span class="stat-label">Hours Saved Monthly</span> + </div> + </div> + </section> + + <section id="demo" class="demo"> + <h2>Request a Demo</h2> + <form id="demoForm" class="demo-form"> + <input type="text" placeholder="Your Name" required> + <input type="email" placeholder="Business Email" required> + <input type="text" placeholder="Company Name" required> + <input type="text" placeholder="Job Title" required> + <input type="text" placeholder="Main Product/Service" required> + <button type="submit" class="primary-btn">Request Demo</button> + </form> + </section> +</main> + +<footer> + <p>2024 ConverSales AI</p> +</footer> diff --git a/index.scroll b/index.scroll new file mode 100644 index 0000000..43d9678 --- /dev/null +++ b/index.scroll @@ -0,0 +1,8 @@ +buildHtml +baseUrl https://conversales.scroll.pub +metaTags +editButton /edit.html +title ConverSales AI - ChatGPT Powered SMS Sales System +style.css +body.html +script.js diff --git a/prompt.json b/prompt.json new file mode 100644 index 0000000..a5ff12d --- /dev/null +++ b/prompt.json @@ -0,0 +1,20 @@ +{ + "id": "msg_01SrAKaZyHJPLySYSRirBMfo", + "type": "message", + "role": "assistant", + "model": "claude-3-5-sonnet-20241022", + "content": [ + { + "type": "text", + "text": "I'll create a modern, Apple-inspired design for ConverSales AI. For the domain, I suggest:\n\n---domain---\nconversales.scroll.pub\n\n---index.scroll---\nbuildHtml\nbaseUrl https://conversales.scroll.pub\nmetaTags\neditButton /edit.html\ntitle ConverSales AI - ChatGPT Powered SMS Sales System\nstyle.css\nbody.html\nscript.js\n\n---body.html---\n<header class=\"nav-header\">\n <nav>\n <div class=\"logo\">ConverSales AI</div>\n <div class=\"nav-links\">\n <a href=\"#features\">Features</a>\n <a href=\"#results\">Results</a>\n <a href=\"#demo\">Demo</a>\n </div>\n </nav>\n</header>\n\n<main>\n <section class=\"hero\">\n <h1>Turn Cold Leads Into Sales</h1>\n <p class=\"subtitle\">With Our ChatGPT Powered SMS Systems</p>\n <div class=\"hero-cta\">\n <p class=\"highlight\">Performance-Based Partnership: Zero Upfront Costs!</p>\n <button class=\"primary-btn\" onclick=\"scrollToDemo()\">Get Started</button>\n </div>\n </section>\n\n <section class=\"intro\">\n <p>Got unconverted leads? Our ChatGPT Powered SMS Androids open persuasive conversations that get up to <span class=\"highlight\">30% reply rates</span> and <span class=\"highlight\">12-18% booking rates</span>.</p>\n <p>Turn 'meh' into 'heck yeah'—it's like texting a buddy, but smarter and more persuasive.</p>\n </section>\n\n <section id=\"features\" class=\"features\">\n <h2>Powerful Features for Maximum Conversion</h2>\n <div class=\"features-grid\">\n <div class=\"feature-card\">\n <h3>Database Reactivation</h3>\n <p>Revive dead leads with intelligent, human-like SMS conversations</p>\n </div>\n <div class=\"feature-card\">\n <h3>48hr Sales Android</h3>\n <p>Engage recent leads before they go cold</p>\n </div>\n <div class=\"feature-card\">\n <h3>Cart Recovery</h3>\n <p>Boost e-commerce revenue with smart follow-ups</p>\n </div>\n </div>\n </section>\n\n <section id=\"results\" class=\"results\">\n <h2>Client Results</h2>\n <div class=\"stats-grid\">\n <div class=\"stat-card\">\n <span class=\"stat-number\">40%</span>\n <span class=\"stat-label\">Labor Cost Reduction</span>\n </div>\n <div class=\"stat-card\">\n <span class=\"stat-number\">25%</span>\n <span class=\"stat-label\">Revenue Increase</span>\n </div>\n <div class=\"stat-card\">\n <span class=\"stat-number\">60</span>\n <span class=\"stat-label\">Hours Saved Monthly</span>\n </div>\n </div>\n </section>\n\n <section id=\"demo\" class=\"demo\">\n <h2>Request a Demo</h2>\n <form id=\"demoForm\" class=\"demo-form\">\n <input type=\"text\" placeholder=\"Your Name\" required>\n <input type=\"email\" placeholder=\"Business Email\" required>\n <input type=\"text\" placeholder=\"Company Name\" required>\n <input type=\"text\" placeholder=\"Job Title\" required>\n <input type=\"text\" placeholder=\"Main Product/Service\" required>\n <button type=\"submit\" class=\"primary-btn\">Request Demo</button>\n </form>\n </section>\n</main>\n\n<footer>\n <p>2024 ConverSales AI</p>\n</footer>\n\n---style.css---\n:root {\n --primary: #007AFF;\n --secondary: #5856D6;\n --dark: #1D1D1F;\n --light: #F5F5F7;\n --gradient: linear-gradient(135deg, var(--primary), var(--secondary));\n}\n\n* {\n margin: 0;\n padding: 0;\n box-sizing: border-box;\n font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, sans-serif;\n}\n\nbody {\n background: var(--light);\n color: var(--dark);\n line-height: 1.6;\n}\n\n.nav-header {\n backdrop-filter: blur(10px);\n background: rgba(255, 255, 255, 0.8);\n position: fixed;\n width: 100%;\n z-index: 100;\n padding: 1rem;\n}\n\nnav {\n max-width: 1200px;\n margin: 0 auto;\n display: flex;\n justify-content: space-between;\n align-items: center;\n}\n\n.logo {\n font-size: 1.5rem;\n font-weight: 700;\n background: var(--gradient);\n -webkit-background-clip: text;\n -webkit-text-fill-color: transparent;\n}\n\n.nav-links a {\n margin-left: 2rem;\n text-decoration: none;\n color: var(--dark);\n transition: color 0.3s;\n}\n\n.nav-links a:hover {\n color: var(--primary);\n}\n\n.hero {\n height: 100vh;\n display: flex;\n flex-direction: column;\n justify-content: center;\n align-items: center;\n text-align: center;\n padding: 2rem;\n background: var(--gradient);\n color: white;\n}\n\nh1 {\n font-size: 4rem;\n margin-bottom: 1rem;\n}\n\n.subtitle {\n font-size: 1.5rem;\n margin-bottom: 2rem;\n}\n\n.primary-btn {\n background: white;\n color: var(--primary);\n border: none;\n padding: 1rem 2rem;\n border-radius: 2rem;\n font-size: 1.1rem;\n cursor: pointer;\n transition: transform 0.3s, box-shadow 0.3s;\n}\n\n.primary-btn:hover {\n transform: translateY(-2px);\n box-shadow: 0 4px 20px rgba(0,0,0,0.1);\n}\n\n.features-grid, .stats-grid {\n display: grid;\n grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));\n gap: 2rem;\n padding: 4rem 2rem;\n max-width: 1200px;\n margin: 0 auto;\n}\n\n.feature-card, .stat-card {\n background: white;\n padding: 2rem;\n border-radius: 1rem;\n box-shadow: 0 10px 30px rgba(0,0,0,0.1);\n transition: transform 0.3s;\n}\n\n.feature-card:hover, .stat-card:hover {\n transform: translateY(-5px);\n}\n\n.stat-number {\n font-size: 3rem;\n font-weight: 700;\n color: var(--primary);\n display: block;\n}\n\n.demo-form {\n max-width: 600px;\n margin: 0 auto;\n padding: 2rem;\n display: grid;\n gap: 1rem;\n}\n\ninput {\n padding: 1rem;\n border: 2px solid #ddd;\n border-radius: 0.5rem;\n font-size: 1rem;\n}\n\ninput:focus {\n border-color: var(--primary);\n outline: none;\n}\n\n@media (max-width: 768px) {\n h1 {\n font-size: 2.5rem;\n }\n \n .nav-links {\n display: none;\n }\n \n .features-grid, .stats-grid {\n grid-template-columns: 1fr;\n }\n}\n\n---script.js---\ndocument.addEventListener('DOMContentLoaded', () => {\n // Smooth scroll functionality\n const scrollToDemo = () => {\n document.querySelector('#demo').scrollIntoView({\n behavior: 'smooth'\n });\n };\n\n // Form submission handler\n const demoForm = document.getElementById('demoForm');\n demoForm.addEventListener('submit', (e) => {\n e.preventDefault();\n // Add form submission logic here\n alert('Thank you for your interest! We will contact you soon.');\n demoForm.reset();\n });\n\n // Intersection Observer for animations\n const observer = new IntersectionObserver((entries) => {\n entries.forEach(entry => {\n if (entry.isIntersecting) {\n entry.target.classList.add('visible');\n }\n });\n }, {\n threshold: 0.1\n });\n\n // Observe all cards\n document.querySelectorAll('.feature-card, .stat-card').forEach(card => {\n observer.observe(card);\n });\n});\n\n// Make scrollToDemo available globally\nwindow.scrollToDemo = () => {\n document.querySelector('#demo').scrollIntoView({\n behavior: 'smooth'\n });\n};\n\n---end---\n\nThis design features:\n- Modern Apple-inspired aesthetic with gradient accents\n- Smooth animations and transitions\n- Fully responsive layout\n- Clean typography and spacing\n- Interactive elements with hover effects\n- Intersection Observer for scroll animations\n- Accessibility-friendly semantic HTML\n- Performance-optimized CSS\n- Minimal JavaScript for enhanced functionality\n\nThe design maintains a professional, high-tech feel while being clean and user-friendly. The color scheme and typography are inspired by Apple's design language, and the layout prioritizes content hierarchy and readability." + } + ], + "stop_reason": "end_turn", + "stop_sequence": null, + "usage": { + "input_tokens": 718, + "cache_creation_input_tokens": 0, + "cache_read_input_tokens": 0, + "output_tokens": 2521 + } +} \ No newline at end of file diff --git a/readme.scroll b/readme.scroll new file mode 100644 index 0000000..4bb7cde --- /dev/null +++ b/readme.scroll @@ -0,0 +1,2 @@ +# conversales2.scroll.pub +Website generated by Claude from prompt: act as an apple designer and make a high tech looking website for this given text: ConverSales AI: Turn Cold Leads Into Sales With Our ChatGPT Powered SMS Systems Performance-Based Partnership: Zero Upfront Costs! Got unconverted leads? Our ChatGPT Powered SMS Androids open persuasive sms conversations that get up to 30% reply rates and 12-18% booking rates. Turn 'meh' into 'heck yeah'—it's like texting a buddy, but smarter and more persuasive. Ready to see it work? Let's go. Read G-doc Case Study (3min read) Test Drive Our Sales Android Now Tell us about yourself and your business. Your Name * Company Name * Main Product/Service * Start Conversation Powerful Features for Maximum Conversion Everything you need to transform your cold leads into sales opportunities Database Reactivation Sales Android This ChatGPT powered SMS Sales Android initiates human-like persuasive SMS conversations with your old unconverted leads database, intelligently persuading and converting them into sales/appointments. Pull new sales from leads you thought were dead 48hr Sales Android Expertly trained to open human-like SMS conversations, this Android engages leads from the last 48 hours through sms who've ignored your calls, keeping them warm and booking them into appointments before they go cold or turn to competitors. Abandoned Cart Recovery Android Proven to boost e-commerce revenue, this Android uses persuasive, human-like SMS conversations to reach out to abandoned cart customers, persuading them to complete their purchases and drive more sales. Some of Our Clients Have Seen Results Like These Our AI ChatGPT SMS Systems transforms your business operations and boosts your profits. 40% Labor Cost Reduction 25% Revenue Increase 60hrs/month Time Saved Request a Demo See how our AI-powered SMS system can transform your cold leads into sales opportunities. Name Business Email Company Name Job Title Request Demo © 2024 ConverSales AI. All rights reserved. \ No newline at end of file diff --git a/script.js b/script.js new file mode 100644 index 0000000..0bc6ec5 --- /dev/null +++ b/script.js @@ -0,0 +1,40 @@ +document.addEventListener('DOMContentLoaded', () => { + // Smooth scroll functionality + const scrollToDemo = () => { + document.querySelector('#demo').scrollIntoView({ + behavior: 'smooth' + }); + }; + + // Form submission handler + const demoForm = document.getElementById('demoForm'); + demoForm.addEventListener('submit', (e) => { + e.preventDefault(); + // Add form submission logic here + alert('Thank you for your interest! We will contact you soon.'); + demoForm.reset(); + }); + + // Intersection Observer for animations + const observer = new IntersectionObserver((entries) => { + entries.forEach(entry => { + if (entry.isIntersecting) { + entry.target.classList.add('visible'); + } + }); + }, { + threshold: 0.1 + }); + + // Observe all cards + document.querySelectorAll('.feature-card, .stat-card').forEach(card => { + observer.observe(card); + }); +}); + +// Make scrollToDemo available globally +window.scrollToDemo = () => { + document.querySelector('#demo').scrollIntoView({ + behavior: 'smooth' + }); +}; diff --git a/style.css b/style.css new file mode 100644 index 0000000..d81e8f2 --- /dev/null +++ b/style.css @@ -0,0 +1,156 @@ +:root { + --primary: #007AFF; + --secondary: #5856D6; + --dark: #1D1D1F; + --light: #F5F5F7; + --gradient: linear-gradient(135deg, var(--primary), var(--secondary)); +} + +* { + margin: 0; + padding: 0; + box-sizing: border-box; + font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, sans-serif; +} + +body { + background: var(--light); + color: var(--dark); + line-height: 1.6; +} + +.nav-header { + backdrop-filter: blur(10px); + background: rgba(255, 255, 255, 0.8); + position: fixed; + width: 100%; + z-index: 100; + padding: 1rem; +} + +nav { + max-width: 1200px; + margin: 0 auto; + display: flex; + justify-content: space-between; + align-items: center; +} + +.logo { + font-size: 1.5rem; + font-weight: 700; + background: var(--gradient); + -webkit-background-clip: text; + -webkit-text-fill-color: transparent; +} + +.nav-links a { + margin-left: 2rem; + text-decoration: none; + color: var(--dark); + transition: color 0.3s; +} + +.nav-links a:hover { + color: var(--primary); +} + +.hero { + height: 100vh; + display: flex; + flex-direction: column; + justify-content: center; + align-items: center; + text-align: center; + padding: 2rem; + background: var(--gradient); + color: white; +} + +h1 { + font-size: 4rem; + margin-bottom: 1rem; +} + +.subtitle { + font-size: 1.5rem; + margin-bottom: 2rem; +} + +.primary-btn { + background: white; + color: var(--primary); + border: none; + padding: 1rem 2rem; + border-radius: 2rem; + font-size: 1.1rem; + cursor: pointer; + transition: transform 0.3s, box-shadow 0.3s; +} + +.primary-btn:hover { + transform: translateY(-2px); + box-shadow: 0 4px 20px rgba(0,0,0,0.1); +} + +.features-grid, .stats-grid { + display: grid; + grid-template-columns: repeat(auto-fit, minmax(300px, 1fr)); + gap: 2rem; + padding: 4rem 2rem; + max-width: 1200px; + margin: 0 auto; +} + +.feature-card, .stat-card { + background: white; + padding: 2rem; + border-radius: 1rem; + box-shadow: 0 10px 30px rgba(0,0,0,0.1); + transition: transform 0.3s; +} + +.feature-card:hover, .stat-card:hover { + transform: translateY(-5px); +} + +.stat-number { + font-size: 3rem; + font-weight: 700; + color: var(--primary); + display: block; +} + +.demo-form { + max-width: 600px; + margin: 0 auto; + padding: 2rem; + display: grid; + gap: 1rem; +} + +input { + padding: 1rem; + border: 2px solid #ddd; + border-radius: 0.5rem; + font-size: 1rem; +} + +input:focus { + border-color: var(--primary); + outline: none; +} + +@media (max-width: 768px) { + h1 { + font-size: 2.5rem; + } + + .nav-links { + display: none; + } + + .features-grid, .stats-grid { + grid-template-columns: 1fr; + } +}