Spaces:
Running
Running
File size: 10,681 Bytes
e9f2363 |
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 78 79 80 81 82 83 84 85 86 87 88 89 90 91 92 93 94 95 96 97 98 99 100 101 102 103 104 105 106 107 108 109 110 111 112 113 114 115 116 117 118 119 120 121 122 123 124 125 126 127 128 129 130 131 132 133 134 135 136 137 138 139 140 141 142 143 144 145 146 147 148 149 150 151 152 153 154 155 156 157 158 159 160 161 162 163 164 165 166 167 168 169 170 171 172 173 174 175 176 177 178 179 180 181 182 183 184 185 186 187 188 189 190 191 192 193 194 195 196 197 198 199 200 201 202 203 204 205 206 207 208 209 210 211 212 213 214 215 216 217 218 219 220 221 222 223 224 225 226 227 228 229 230 231 232 233 234 235 236 237 238 239 240 241 242 243 244 245 246 247 248 249 250 251 252 253 254 |
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<meta name="description" content="Brightwave Studio crafts bold, human-centered digital experiences for modern brands.">
<meta name="keywords" content="design studio, web design, branding, creative agency">
<title>Brightwave Studio | Digital Design & Strategy</title>
<link rel="preconnect" href="https://fonts.googleapis.com">
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
<link href="https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700&display=swap" rel="stylesheet">
<link rel="stylesheet" href="assets/css/styles.css">
</head>
<body>
<header class="site-header" id="top">
<div class="container header-grid">
<div class="logo">
<a href="#top" aria-label="Brightwave Studio">
<span class="logo-dot"></span>Brightwave
</a>
</div>
<nav class="primary-nav" aria-label="Main navigation">
<button class="nav-toggle" aria-expanded="false" aria-controls="nav-menu">
<span class="sr-only">Toggle navigation</span>
<span class="hamburger"></span>
</button>
<ul id="nav-menu">
<li><a href="#services">Services</a></li>
<li><a href="#work">Work</a></li>
<li><a href="#testimonials">Testimonials</a></li>
<li><a href="#contact">Contact</a></li>
<li><a href="#insights">Insights</a></li>
</ul>
</nav>
<div class="header-cta">
<a class="btn ghost" href="https://huggingface.co/spaces/akhaliq/anycoder" target="_blank" rel="noopener">Built with anycoder</a>
<a class="btn solid" href="#contact">Let’s talk</a>
</div>
</div>
</header>
<main>
<section class="hero" aria-labelledby="hero-title">
<div class="container hero-grid">
<div class="hero-copy">
<p class="eyebrow">Award-winning digital studio</p>
<h1 id="hero-title">We design bold experiences that move people & brands.</h1>
<p>Strategy, design, and code—aligned to help ambitious teams launch products, refresh identities, and lead category-defining stories.</p>
<div class="hero-actions">
<a class="btn solid" href="#work">See our work</a>
<a class="btn ghost" href="#insights">Latest insights</a>
</div>
<dl class="hero-stats">
<div>
<dt>78</dt>
<dd>product launches</dd>
</div>
<div>
<dt>+146%</dt>
<dd>avg. engagement growth</dd>
</div>
<div>
<dt>12</dt>
<dd>industries served</dd>
</div>
</dl>
</div>
<div class="hero-media">
<div class="media-card">
<p>“Brightwave reshaped our platform narrative and delivered a design system that scales with confidence.”</p>
<span>— Maya Patel, Nimbus OS</span>
</div>
<div class="live-badge">
<span class="ping"></span>
Live capacity: <strong>3 slots</strong> left in Q3
</div>
</div>
</div>
</section>
<section id="services" class="services section" aria-labelledby="services-title">
<div class="container">
<div class="section-header">
<p class="eyebrow">What we do</p>
<h2 id="services-title">Full-stack design for modern teams</h2>
<p>From discovery to deployment, we partner across the entire lifecycle with fast feedback loops and measurable impact.</p>
</div>
<div class="services-grid">
<article>
<h3>Brand Systems</h3>
<p>Modular visual languages, messaging frameworks, and launch kits built for omnichannel consistency.</p>
<ul>
<li>Narrative & tone architecture</li>
<li>Design systems & libraries</li>
<li>Guidelines & governance</li>
</ul>
</article>
<article>
<h3>Product Experience</h3>
<p>Data-backed UX research, prototyping, and UI craft for web apps, SaaS dashboards, and mobile services.</p>
<ul>
<li>Journey mapping & audits</li>
<li>Rapid prototyping</li>
<li>Accessible component design</li>
</ul>
</article>
<article>
<h3>Launch & Growth</h3>
<p>Campaign sites, interactive stories, and content engines engineered to convert and evolve.</p>
<ul>
<li>Full-stack web builds</li>
<li>Web performance tuning</li>
<li>Analytics & experimentation</li>
</ul>
</article>
</div>
</div>
</section>
<section id="work" class="work section" aria-labelledby="work-title">
<div class="container">
<div class="section-header">
<p class="eyebrow">Case snapshots</p>
<h2 id="work-title">Launches we’re proud of</h2>
</div>
<div class="work-grid">
<article class="work-card">
<div class="work-tag">Fintech</div>
<h3>Pulse Ledger</h3>
<p>Redesigned the insights dashboard, increasing active trader retention by 38% through data storytelling.</p>
<div class="meta">
<span>Scope: UX, UI, front-end</span>
<span>Timeline: 14 weeks</span>
</div>
</article>
<article class="work-card">
<div class="work-tag">Climate</div>
<h3>Solara Atlas</h3>
<p>Crafted a modular brand system and immersive site that drove a 2.3x increase in enterprise demo requests.</p>
<div class="meta">
<span>Scope: Brand, Web</span>
<span>Timeline: 10 weeks</span>
</div>
</article>
<article class="work-card">
<div class="work-tag">Health</div>
<h3>Nova Care</h3>
<p>Built a HIPAA-ready patient portal with guided onboarding, cutting support tickets by 54% post-launch.</p>
<div class="meta">
<span>Scope: Product, QA</span>
<span>Timeline: 18 weeks</span>
</div>
</article>
</div>
</div>
</section>
<section class="metrics section">
<div class="container metrics-grid">
<div>
<p class="eyebrow">Proof in numbers</p>
<h2>Human-centered, measurable outcomes.</h2>
</div>
<dl>
<div>
<dt>1.9s</dt>
<dd>average LCP across shipped sites</dd>
</div>
<div>
<dt>92%</dt>
<dd>returning client partnerships</dd>
</div>
<div>
<dt>24/7</dt>
<dd>design & dev support coverage</dd>
</div>
<div>
<dt>AA</dt>
<dd>accessibility baseline on all deliveries</dd>
</div>
</dl>
</div>
</section>
<section id="testimonials" class="testimonials section" aria-labelledby="testimonials-title">
<div class="container">
<div class="section-header">
<p class="eyebrow">Client notes</p>
<h2 id="testimonials-title">Trusted by founders, CMOs, and product teams</h2>
</div>
<div class="testimonial-slider" aria-live="polite">
<button class="slider-btn prev" aria-label="Previous testimonial">←</button>
<div class="testimonial-track">
<figure>
<blockquote>“Brightwave is the rare partner that pushes strategy and execution equally. They feel like an embedded team.”</blockquote>
<figcaption>
<strong>Jonas Wirth</strong>, VP Product, Latticeworks
</figcaption>
</figure>
<figure>
<blockquote>“From research sprints to fully coded marketing pages, they helped us compress a six-month roadmap into three.”</blockquote>
<figcaption>
<strong>Camila Ortega</strong>, COO, Fluxion
</figcaption>
</figure>
<figure>
<blockquote>“Every deliverable was accessible, fast, and beautifully documented. They elevate our internal teams.”</blockquote>
<figcaption>
<strong>Priya Raman</strong>, Head of Design, Arclite
</figcaption>
</figure>
</div>
<button class="slider-btn next" aria-label="Next testimonial">→</button>
</div>
</div>
</section>
<section id="insights" class="insights section" aria-labelledby="insights-title">
<div class="container">
<div class="section-header">
<p class="eyebrow">Insights</p>
<h2 id="insights-title">Ideas shaping our work</h2>
</div>
<div class="insights-grid">
<article>
<p class="insight-date">May 14, 2024</p>
<h3>Designing for trust in AI copilots</h3>
<p>Frameworks for crafting transparent, explainable interfaces that keep humans in the loop.</p>
<a href="#" aria-label="Read more about designing for trust in AI copilots">Read more</a>
</article>
<article>
<p class="insight-date">Apr 30, 2024</p>
<h3>Systems thinking for marketing sites</h3>
<p>How component-driven storytelling unlocks faster experimentation without sacrificing brand.</p>
<a href="#" aria-label="Read more about systems thinking for marketing sites">Read more</a>
</article>
<article>
<p class="insight-date">Apr 10, 2024</p>
<h3>Performance as product strategy</h3>
<p>Why milliseconds matter and how we bake performance budgets into every engagement.</p>
<a href="#" aria-label="Read more about performance as product strategy">Read more</a>
</article>
</div>
</div>
</section>
<section id="contact" class="contact section" aria-labelledby="contact-title">
<div class="container contact-grid">
<div>
<p class="eyebrow">Let’s build together</p>
<h2 id="contact-title">Tell us about your next launch</h2>
<p>We reply within two business days. Share your goals, timeline, and any materials that help us understand the challenge.</p>
</div>
<form class="contact-form" novalidate |