Files
automaker/apps/marketing/public/index.html
Cody Seibert 8de4056417 fix: update release URL in marketing pages
- Changed the default release URL from 'https://releases.automaker.dev/releases.json' to 'https://releases.automaker.app/releases.json' in both index.html and releases.html files to ensure correct resource loading.
2025-12-13 00:29:03 -05:00

594 lines
24 KiB
HTML

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Automaker - Autonomous AI Development Studio</title>
<style>
* {
margin: 0;
padding: 0;
box-sizing: border-box;
}
:root {
--primary: #6366f1;
--primary-dark: #4f46e5;
--secondary: #8b5cf6;
--accent: #ec4899;
--dark: #0f172a;
--dark-light: #1e293b;
--text: #e2e8f0;
--text-muted: #94a3b8;
}
body {
font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, sans-serif;
background: linear-gradient(135deg, #0f172a 0%, #1e293b 50%, #0f172a 100%);
color: var(--text);
line-height: 1.6;
overflow-x: hidden;
}
.container {
max-width: 1200px;
margin: 0 auto;
padding: 0 2rem;
}
/* Header */
header {
padding: 2rem 0;
position: sticky;
top: 0;
background: rgba(15, 23, 42, 0.8);
backdrop-filter: blur(10px);
z-index: 100;
border-bottom: 1px solid rgba(148, 163, 184, 0.1);
}
nav {
display: flex;
justify-content: space-between;
align-items: center;
}
.logo {
font-size: 1.5rem;
font-weight: 700;
background: linear-gradient(135deg, var(--primary), var(--secondary));
-webkit-background-clip: text;
-webkit-text-fill-color: transparent;
background-clip: text;
}
.nav-links {
display: flex;
gap: 2rem;
list-style: none;
}
.nav-links a {
color: var(--text-muted);
text-decoration: none;
transition: color 0.3s;
}
.nav-links a:hover {
color: var(--text);
}
/* Hero Section */
.hero {
padding: 6rem 0;
text-align: center;
position: relative;
}
.hero::before {
content: '';
position: absolute;
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
width: 600px;
height: 600px;
background: radial-gradient(circle, rgba(99, 102, 241, 0.1) 0%, transparent 70%);
border-radius: 50%;
z-index: -1;
}
.hero h1 {
font-size: 4rem;
font-weight: 800;
margin-bottom: 1.5rem;
background: linear-gradient(135deg, #ffffff 0%, var(--text-muted) 100%);
-webkit-background-clip: text;
-webkit-text-fill-color: transparent;
background-clip: text;
line-height: 1.2;
}
.hero p {
font-size: 1.5rem;
color: var(--text-muted);
margin-bottom: 2rem;
max-width: 700px;
margin-left: auto;
margin-right: auto;
}
.cta-buttons {
display: flex;
gap: 1rem;
justify-content: center;
flex-wrap: wrap;
}
.btn {
padding: 1rem 2rem;
border-radius: 0.5rem;
text-decoration: none;
font-weight: 600;
transition: all 0.3s;
display: inline-block;
}
.btn-primary {
background: linear-gradient(135deg, var(--primary), var(--secondary));
color: white;
box-shadow: 0 4px 15px rgba(99, 102, 241, 0.4);
}
.btn-primary:hover {
transform: translateY(-2px);
box-shadow: 0 6px 20px rgba(99, 102, 241, 0.6);
}
.btn-secondary {
background: rgba(148, 163, 184, 0.1);
color: var(--text);
border: 1px solid rgba(148, 163, 184, 0.2);
}
.btn-secondary:hover {
background: rgba(148, 163, 184, 0.2);
transform: translateY(-2px);
}
/* Features Section */
.features {
padding: 6rem 0;
}
.section-title {
text-align: center;
font-size: 2.5rem;
font-weight: 700;
margin-bottom: 1rem;
}
.section-subtitle {
text-align: center;
color: var(--text-muted);
font-size: 1.2rem;
margin-bottom: 4rem;
}
.features-grid {
display: grid;
grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
gap: 2rem;
margin-top: 3rem;
}
.feature-card {
background: rgba(30, 41, 59, 0.5);
border: 1px solid rgba(148, 163, 184, 0.1);
border-radius: 1rem;
padding: 2rem;
transition: all 0.3s;
}
.feature-card:hover {
transform: translateY(-5px);
border-color: rgba(99, 102, 241, 0.5);
box-shadow: 0 10px 30px rgba(99, 102, 241, 0.2);
}
.feature-icon {
font-size: 2.5rem;
margin-bottom: 1rem;
display: block;
}
.feature-card h3 {
font-size: 1.5rem;
margin-bottom: 0.5rem;
color: var(--text);
}
.feature-card p {
color: var(--text-muted);
line-height: 1.6;
}
/* Tech Stack Section */
.tech-stack {
padding: 6rem 0;
background: rgba(15, 23, 42, 0.5);
}
.tech-grid {
display: flex;
flex-wrap: wrap;
justify-content: center;
gap: 2rem;
margin-top: 3rem;
}
.tech-item {
background: rgba(30, 41, 59, 0.5);
padding: 1rem 2rem;
border-radius: 0.5rem;
border: 1px solid rgba(148, 163, 184, 0.1);
transition: all 0.3s;
}
.tech-item:hover {
border-color: var(--primary);
transform: scale(1.05);
}
/* Footer */
footer {
padding: 3rem 0;
text-align: center;
border-top: 1px solid rgba(148, 163, 184, 0.1);
color: var(--text-muted);
}
footer a {
color: var(--primary);
text-decoration: none;
}
footer a:hover {
text-decoration: underline;
}
/* Responsive */
@media (max-width: 768px) {
.hero h1 {
font-size: 2.5rem;
}
.hero p {
font-size: 1.2rem;
}
.nav-links {
display: none;
}
.features-grid {
grid-template-columns: 1fr;
}
}
/* Animations */
@keyframes fadeInUp {
from {
opacity: 0;
transform: translateY(30px);
}
to {
opacity: 1;
transform: translateY(0);
}
}
.feature-card {
animation: fadeInUp 0.6s ease-out;
}
.feature-card:nth-child(1) { animation-delay: 0.1s; }
.feature-card:nth-child(2) { animation-delay: 0.2s; }
.feature-card:nth-child(3) { animation-delay: 0.3s; }
.feature-card:nth-child(4) { animation-delay: 0.4s; }
.feature-card:nth-child(5) { animation-delay: 0.5s; }
.feature-card:nth-child(6) { animation-delay: 0.6s; }
/* Download Buttons */
.download-section {
margin-top: 2.5rem;
}
.download-label {
color: var(--text-muted);
font-size: 0.9rem;
margin-bottom: 1rem;
}
.download-buttons {
display: flex;
gap: 1rem;
justify-content: center;
flex-wrap: wrap;
}
.btn-download {
padding: 0.75rem 1.5rem;
border-radius: 0.5rem;
text-decoration: none;
font-weight: 600;
transition: all 0.3s;
display: inline-flex;
align-items: center;
gap: 0.5rem;
background: rgba(30, 41, 59, 0.8);
color: var(--text);
border: 1px solid rgba(148, 163, 184, 0.2);
font-size: 0.9rem;
}
.btn-download:hover {
background: rgba(99, 102, 241, 0.2);
border-color: var(--primary);
transform: translateY(-2px);
}
.btn-download svg {
width: 20px;
height: 20px;
}
.download-subtitle {
color: var(--text-muted);
font-size: 0.9rem;
margin-top: 1rem;
}
.download-subtitle a {
color: var(--primary);
text-decoration: none;
}
.download-subtitle a:hover {
text-decoration: underline;
}
/* Video Demo Section */
.video-demo {
margin-top: 3rem;
max-width: 900px;
margin-left: auto;
margin-right: auto;
padding: 0 2rem;
}
.video-container {
position: relative;
margin-left: -2rem;
margin-right: -2rem;
width: calc(100% + 4rem);
padding-bottom: 66.67%; /* Taller aspect ratio to show more height */
background: rgba(30, 41, 59, 0.5);
border-radius: 1rem;
overflow: hidden;
border: 1px solid rgba(148, 163, 184, 0.2);
box-shadow: 0 10px 40px rgba(0, 0, 0, 0.3);
}
.video-container video {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
object-fit: contain;
}
@media (max-width: 768px) {
.video-demo {
margin-top: 2rem;
padding: 0 1rem;
}
.video-container {
margin-left: -1rem;
margin-right: -1rem;
width: calc(100% + 2rem);
}
}
</style>
</head>
<body>
<header>
<nav class="container">
<div class="logo">Automaker</div>
<ul class="nav-links">
<li><a href="#features">Features</a></li>
<li><a href="#tech">Tech Stack</a></li>
<li><a href="releases.html">Releases</a></li>
<li><a href="https://github.com/AutoMaker-Org/automaker" target="_blank">GitHub</a></li>
</ul>
</nav>
</header>
<main>
<section class="hero">
<div class="container">
<h1>Build Software Faster with AI-Powered Agents</h1>
<p>Automaker is an autonomous AI development studio that helps you build software faster using AI-powered agents. Manage features visually, assign AI agents automatically, and track progress through an intuitive workflow.</p>
<div class="cta-buttons">
<a href="https://github.com/AutoMaker-Org/automaker" class="btn btn-primary" target="_blank">View on GitHub</a>
<a href="https://github.com/AutoMaker-Org/automaker#getting-started" class="btn btn-secondary" target="_blank">Get Started</a>
</div>
<div class="video-demo">
<div class="video-container">
<video controls autoplay muted loop playsinline>
<source src="https://releases.automaker.app/demo.mp4" type="video/mp4">
Your browser does not support the video tag.
</video>
</div>
</div>
<div class="download-section" id="downloadSection" style="display: none;">
<p class="download-label">Download for your platform:</p>
<div class="download-buttons">
<a href="#" class="btn-download" id="download-windows" style="display: none;">
<svg viewBox="0 0 24 24" fill="currentColor"><path d="M0 3.449L9.75 2.1v9.451H0m10.949-9.602L24 0v11.4H10.949M0 12.6h9.75v9.451L0 20.699M10.949 12.6H24V24l-12.9-1.801"/></svg>
Windows
</a>
<a href="#" class="btn-download" id="download-macos" style="display: none;">
<svg viewBox="0 0 24 24" fill="currentColor"><path d="M18.71 19.5c-.83 1.24-1.71 2.45-3.05 2.47-1.34.03-1.77-.79-3.29-.79-1.53 0-2 .77-3.27.82-1.31.05-2.3-1.32-3.14-2.53C4.25 17 2.94 12.45 4.7 9.39c.87-1.52 2.43-2.48 4.12-2.51 1.28-.02 2.5.87 3.29.87.78 0 2.26-1.07 3.81-.91.65.03 2.47.26 3.64 1.98-.09.06-2.17 1.28-2.15 3.81.03 3.02 2.65 4.03 2.68 4.04-.03.07-.42 1.44-1.38 2.83M13 3.5c.73-.83 1.94-1.46 2.94-1.5.13 1.17-.34 2.35-1.04 3.19-.69.85-1.83 1.51-2.95 1.42-.15-1.15.41-2.35 1.05-3.11z"/></svg>
macOS
</a>
<a href="#" class="btn-download" id="download-linux" style="display: none;">
<svg viewBox="0 0 24 24" fill="currentColor"><path d="M12.504 0c-.155 0-.315.008-.48.021-4.226.333-3.105 4.807-3.17 6.298-.076 1.092-.3 1.953-1.05 3.02-.885 1.051-2.127 2.75-2.716 4.521-.278.832-.41 1.684-.287 2.489a.424.424 0 00-.11.135c-.26.268-.45.6-.663.839-.199.199-.485.267-.797.4-.313.136-.658.269-.864.68-.09.189-.136.394-.132.602 0 .199.027.4.055.536.058.399.116.728.04.97-.249.68-.28 1.145-.106 1.484.174.334.535.47.94.601.81.2 1.91.135 2.774.6.926.466 1.866.67 2.616.47.526-.116.97-.464 1.208-.946.587-.003 1.23-.269 2.26-.334.699-.058 1.574.267 2.577.2.025.134.063.198.114.333l.003.003c.391.778 1.113 1.132 1.884 1.071.771-.06 1.592-.536 2.257-1.306.631-.765 1.683-1.084 2.378-1.503.348-.199.629-.469.649-.853.023-.4-.2-.811-.714-1.376v-.097l-.003-.003c-.17-.2-.25-.535-.338-.926-.085-.401-.182-.786-.492-1.046h-.003c-.059-.054-.123-.067-.188-.135a.357.357 0 00-.19-.064c.431-1.278.264-2.55-.173-3.694-.533-1.41-1.465-2.638-2.175-3.483-.796-1.005-1.576-1.957-1.56-3.368.026-2.152.236-6.133-3.544-6.139zm.529 3.405h.013c.213 0 .396.062.584.198.19.135.33.332.438.533.105.259.158.459.166.724 0-.02.006-.04.006-.06v.105a.086.086 0 01-.004-.021l-.004-.024a1.807 1.807 0 01-.15.706.953.953 0 01-.213.335.71.71 0 00-.088-.042c-.104-.045-.198-.064-.284-.133a1.312 1.312 0 00-.22-.066c.05-.06.146-.133.183-.198.053-.128.082-.264.088-.402v-.02a1.21 1.21 0 00-.061-.4c-.045-.134-.101-.2-.183-.333-.084-.066-.167-.132-.267-.132h-.016c-.093 0-.176.03-.262.132a.8.8 0 00-.205.334 1.18 1.18 0 00-.09.4v.019c.002.089.008.179.02.267-.193-.067-.438-.135-.607-.202a1.635 1.635 0 01-.018-.2v-.02a1.772 1.772 0 01.15-.768c.082-.22.232-.406.43-.533a.985.985 0 01.594-.2zm-2.962.059h.036c.142 0 .27.048.399.135.146.129.264.288.344.465.09.199.14.4.153.667v.004c.007.134.006.2-.002.266v.08c-.03.007-.056.018-.083.024-.152.055-.274.135-.393.2.012-.09.013-.18.003-.267v-.015c-.012-.133-.04-.2-.082-.333a.613.613 0 00-.166-.267.248.248 0 00-.183-.064h-.021c-.071.006-.13.04-.186.132a.552.552 0 00-.12.27.944.944 0 00-.023.33v.015c.012.135.037.2.08.334.046.134.098.2.166.268.01.009.02.018.034.024-.07.057-.117.07-.176.136a.304.304 0 01-.131.068 2.62 2.62 0 01-.275-.402 1.772 1.772 0 01-.155-.667 1.759 1.759 0 01.08-.668 1.43 1.43 0 01.283-.535c.128-.133.26-.2.418-.2zm1.37 1.706c.332 0 .733.065 1.216.399.293.2.523.269 1.052.468h.003c.255.136.405.266.478.399v-.131a.571.571 0 01.016.47c-.123.31-.516.643-1.063.842v.002c-.268.135-.501.333-.775.465-.276.135-.588.292-1.012.267a1.139 1.139 0 01-.448-.067 3.566 3.566 0 01-.322-.198c-.195-.135-.363-.332-.612-.465v-.005h-.005c-.4-.246-.616-.512-.686-.71-.07-.268-.005-.47.193-.6.224-.135.38-.271.483-.336.104-.074.143-.102.176-.131h.002v-.003c.169-.202.436-.47.839-.601.139-.036.294-.065.466-.065zm2.8 2.142c.358 1.417 1.196 3.475 1.735 4.473.286.534.855 1.659 1.102 3.024.156-.005.33.018.513.064.646-1.671-.546-3.467-1.089-3.966-.22-.2-.232-.335-.123-.335.59.534 1.365 1.572 1.646 2.757.13.535.16 1.104.021 1.67.067.028.135.06.205.067 1.032.534 1.413.938 1.23 1.537v-.002c-.06-.003-.12 0-.18 0h-.016c.151-.467-.182-.825-1.065-1.224-.915-.4-1.646-.336-1.77.465-.008.043-.013.066-.018.135-.068.023-.139.053-.209.064-.43.268-.662.669-.793 1.187-.13.533-.17 1.156-.205 1.869v.003c-.02.482-.04 1.053-.158 1.425-.06.134-.133.27-.238.465h-.003c-.067-.004-.003-.401-.004-.469.006-.534.011-1.2.036-1.534.006-.468.011-.534-.021-.267-.18.936-.323 1.2-.608 1.67a1.016 1.016 0 01-.112.134v.003l-.005-.003c-.07-.2-.044-.401-.044-.535-.002-.468.006-.869-.089-1.334-.066-.468-.353-.935-.711-1.469-.074-.104-.264-.333-.376-.533-.073-.133-.067-.267.123-.336.104-.037.2-.135.29-.2.09-.067.18-.136.27-.2.02-.015.04-.018.059-.036.14-.083.267-.2.368-.335a.838.838 0 00.145-.262l.002-.004c.028-.087.042-.133.034-.2-.034-.135-.232-.333-.393-.468-.226-.2-.4-.333-.673-.467l-.005-.002c-.569-.27-1.322-.534-1.927-.8a.082.082 0 01-.026-.013c-.136-.071-.27-.2-.406-.4-.466-.735-.727-1.536-.727-1.936 0-.2.067-.4.129-.533.032-.067.065-.135.102-.2.036-.067.257-.2.378-.267.143-.095.287-.191.441-.263z"/></svg>
Linux
</a>
</div>
<p class="download-subtitle">
<span id="latestVersion"></span> | <a href="releases.html">All releases</a>
</p>
</div>
</div>
</section>
<section class="features" id="features">
<div class="container">
<h2 class="section-title">Powerful Features</h2>
<p class="section-subtitle">Everything you need to accelerate your development workflow</p>
<div class="features-grid">
<div class="feature-card">
<span class="feature-icon">📋</span>
<h3>Kanban Board</h3>
<p>Visual drag-and-drop board to manage features through backlog, in progress, waiting approval, and verified stages.</p>
</div>
<div class="feature-card">
<span class="feature-icon">🤖</span>
<h3>AI Agent Integration</h3>
<p>Automatic AI agent assignment to implement features when moved to "In Progress".</p>
</div>
<div class="feature-card">
<span class="feature-icon">🧠</span>
<h3>Multi-Model Support</h3>
<p>Choose from multiple AI models including Claude Opus, Sonnet, and more.</p>
</div>
<div class="feature-card">
<span class="feature-icon">📡</span>
<h3>Real-time Agent Output</h3>
<p>View live agent output, logs, and file diffs as features are being implemented.</p>
</div>
<div class="feature-card">
<span class="feature-icon">🔍</span>
<h3>Project Analysis</h3>
<p>AI-powered project structure analysis to understand your codebase.</p>
</div>
<div class="feature-card">
<span class="feature-icon">💡</span>
<h3>Feature Suggestions</h3>
<p>AI-generated feature suggestions based on your project.</p>
</div>
<div class="feature-card">
<span class="feature-icon"></span>
<h3>Concurrent Processing</h3>
<p>Configure concurrency to process multiple features simultaneously.</p>
</div>
<div class="feature-card">
<span class="feature-icon">🔀</span>
<h3>Git Integration</h3>
<p>View git diffs and track changes made by AI agents.</p>
</div>
<div class="feature-card">
<span class="feature-icon">🖥️</span>
<h3>Cross-Platform</h3>
<p>Desktop application built with Electron for Windows, macOS, and Linux.</p>
</div>
</div>
</div>
</section>
<section class="tech-stack" id="tech">
<div class="container">
<h2 class="section-title">Built With Modern Technology</h2>
<p class="section-subtitle">Powered by the best tools in the industry</p>
<div class="tech-grid">
<div class="tech-item">Next.js</div>
<div class="tech-item">Electron</div>
<div class="tech-item">React</div>
<div class="tech-item">Tailwind CSS</div>
<div class="tech-item">Zustand</div>
<div class="tech-item">dnd-kit</div>
<div class="tech-item">TypeScript</div>
<div class="tech-item">Claude AI</div>
</div>
</div>
</section>
</main>
<footer>
<div class="container">
<p>Made with ❤️ by <a href="mailto:webdevcody@gmail.com">Cody Seibert</a></p>
<p style="margin-top: 1rem;">
<a href="https://github.com/AutoMaker-Org/automaker" target="_blank">GitHub</a> |
<a href="https://github.com/AutoMaker-Org/automaker/blob/main/LICENSE" target="_blank">License</a>
</p>
<p style="margin-top: 1rem; font-size: 0.9rem; color: var(--text-muted);">
⚠️ <strong>Security Disclaimer:</strong> This software uses AI-powered tooling that has access to your operating system. Use at your own risk. We recommend running Automaker in a sandboxed environment.
</p>
</div>
</footer>
<script>
(function() {
const R2_RELEASES_URL = window.RELEASES_JSON_URL || 'https://releases.automaker.app/releases.json';
async function loadLatestRelease() {
try {
const response = await fetch(R2_RELEASES_URL);
if (!response.ok) throw new Error('Failed to fetch releases');
const data = await response.json();
if (!data.releases || data.releases.length === 0) return;
const latest = data.releases[0];
let hasAnyAsset = false;
if (latest.assets.windows) {
const btn = document.getElementById('download-windows');
btn.href = latest.assets.windows.url;
btn.style.display = 'inline-flex';
hasAnyAsset = true;
}
if (latest.assets.macos || latest.assets.macosArm) {
const btn = document.getElementById('download-macos');
const macAsset = latest.assets.macosArm || latest.assets.macos;
btn.href = macAsset.url;
btn.style.display = 'inline-flex';
hasAnyAsset = true;
}
if (latest.assets.linux) {
const btn = document.getElementById('download-linux');
btn.href = latest.assets.linux.url;
btn.style.display = 'inline-flex';
hasAnyAsset = true;
}
if (hasAnyAsset) {
document.getElementById('latestVersion').textContent = latest.version;
document.getElementById('downloadSection').style.display = 'block';
}
} catch (error) {
console.error('Failed to load releases:', error);
}
}
loadLatestRelease();
})();
</script>
</body>
</html>