e175430156
- worlds.html: new page matching videos.html style, grid of world cards with illustrated preview thumbnails and Explore links - World card CSS added to style.css (.world-card, .world-card-preview, .world-enter) - Delph Woods card links to worlds/delphwoods.html with a woodland SVG preview, description, and location/3DGS chips - Worlds added to nav and footer Product column on all 5 existing pages - CTA band on worlds page promotes consultancy for commissioning Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
339 lines
19 KiB
HTML
339 lines
19 KiB
HTML
<!DOCTYPE html>
|
|
<html lang="en">
|
|
<head>
|
|
<meta charset="utf-8">
|
|
<meta name="viewport" content="width=device-width, initial-scale=1">
|
|
<title>Drone Hardware Devkits — Bournemouth Technology</title>
|
|
<meta name="description" content="Complete hardware drone kits with CAD files, 3D printable components, PCB designs, and community support. From £1,999.">
|
|
<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=Hanken+Grotesk:wght@400;500;600;700;800&family=JetBrains+Mono:wght@400;500;600&display=swap" rel="stylesheet">
|
|
<link rel="stylesheet" href="style.css">
|
|
<script>
|
|
(function(){var t=localStorage.getItem('theme'),d=window.matchMedia('(prefers-color-scheme: dark)').matches;if(t==='dark'||(t===null&&d))document.documentElement.classList.add('dark');})();
|
|
</script>
|
|
</head>
|
|
<body>
|
|
|
|
<!-- NAV -->
|
|
<nav class="nav">
|
|
<div class="nav-inner">
|
|
<a href="index.html" class="nav-logo">
|
|
<svg width="22" height="22" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.6" aria-hidden="true">
|
|
<rect x="6" y="6" width="12" height="12" rx="1.5"/>
|
|
<rect x="9.5" y="9.5" width="5" height="5" fill="currentColor" stroke="none"/>
|
|
<path d="M9 6V2.5M15 6V2.5M9 21.5V18M15 21.5V18M6 9H2.5M6 15H2.5M21.5 9H18M21.5 15H18"/>
|
|
</svg>
|
|
<span>Bournemouth Technology</span>
|
|
</a>
|
|
<div class="nav-right">
|
|
<nav class="nav-links" aria-label="Main">
|
|
<a href="devkits.html" class="active">Devkits</a>
|
|
<a href="opensource.html">Open Source</a>
|
|
<a href="consultancy.html">Consultancy</a>
|
|
<a href="videos.html">Videos</a>
|
|
<a href="worlds.html">Worlds</a>
|
|
</nav>
|
|
<button id="theme-toggle" class="theme-toggle" aria-label="Toggle dark mode">
|
|
<svg class="icon-moon" width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="M21 12.79A9 9 0 1111.21 3 7 7 0 0021 12.79z"/></svg>
|
|
<svg class="icon-sun" width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><circle cx="12" cy="12" r="5"/><line x1="12" y1="1" x2="12" y2="3"/><line x1="12" y1="21" x2="12" y2="23"/><line x1="4.22" y1="4.22" x2="5.64" y2="5.64"/><line x1="18.36" y1="18.36" x2="19.78" y2="19.78"/><line x1="1" y1="12" x2="3" y2="12"/><line x1="21" y1="12" x2="23" y2="12"/><line x1="4.22" y1="19.78" x2="5.64" y2="18.36"/><line x1="18.36" y1="5.64" x2="19.78" y2="4.22"/></svg>
|
|
</button>
|
|
<a href="#products" class="btn btn-dark btn-sm">Buy a devkit</a>
|
|
</div>
|
|
</div>
|
|
</nav>
|
|
|
|
<!-- PAGE HERO -->
|
|
<section class="page-hero">
|
|
<div class="hero-bg" aria-hidden="true">
|
|
<div style="position:absolute;top:40px;left:-30px;width:210px;opacity:0.055;transform:rotate(14deg);">
|
|
<svg viewBox="0 0 100 100" fill="none" stroke="#0A0A0A" stroke-width="2.5" stroke-linecap="round">
|
|
<line x1="50" y1="50" x2="22" y2="22"/><line x1="50" y1="50" x2="78" y2="22"/>
|
|
<line x1="50" y1="50" x2="22" y2="78"/><line x1="50" y1="50" x2="78" y2="78"/>
|
|
<rect x="41" y="41" width="18" height="18" rx="4"/>
|
|
<circle cx="22" cy="22" r="8.5"/><circle cx="78" cy="22" r="8.5"/>
|
|
<circle cx="22" cy="78" r="8.5"/><circle cx="78" cy="78" r="8.5"/>
|
|
<ellipse cx="22" cy="22" rx="12" ry="2.6" transform="rotate(45 22 22)"/>
|
|
<ellipse cx="78" cy="22" rx="12" ry="2.6" transform="rotate(-45 78 22)"/>
|
|
<ellipse cx="22" cy="78" rx="12" ry="2.6" transform="rotate(-45 22 78)"/>
|
|
<ellipse cx="78" cy="78" rx="12" ry="2.6" transform="rotate(45 78 78)"/>
|
|
</svg>
|
|
</div>
|
|
<div style="position:absolute;top:30px;right:-40px;width:320px;opacity:0.045;transform:rotate(-9deg);">
|
|
<svg viewBox="0 0 100 100" fill="none" stroke="#0A0A0A" stroke-width="2.5" stroke-linecap="round">
|
|
<line x1="50" y1="50" x2="22" y2="22"/><line x1="50" y1="50" x2="78" y2="22"/>
|
|
<line x1="50" y1="50" x2="22" y2="78"/><line x1="50" y1="50" x2="78" y2="78"/>
|
|
<rect x="41" y="41" width="18" height="18" rx="4"/>
|
|
<circle cx="22" cy="22" r="8.5"/><circle cx="78" cy="22" r="8.5"/>
|
|
<circle cx="22" cy="78" r="8.5"/><circle cx="78" cy="78" r="8.5"/>
|
|
<ellipse cx="22" cy="22" rx="12" ry="2.6" transform="rotate(45 22 22)"/>
|
|
<ellipse cx="78" cy="22" rx="12" ry="2.6" transform="rotate(-45 78 22)"/>
|
|
<ellipse cx="22" cy="78" rx="12" ry="2.6" transform="rotate(-45 22 78)"/>
|
|
<ellipse cx="78" cy="78" rx="12" ry="2.6" transform="rotate(45 78 78)"/>
|
|
</svg>
|
|
</div>
|
|
<div style="position:absolute;top:30px;left:46%;width:120px;opacity:0.05;transform:rotate(26deg);">
|
|
<svg viewBox="0 0 100 100" fill="none" stroke="#0A0A0A" stroke-width="2.5" stroke-linecap="round">
|
|
<line x1="50" y1="50" x2="22" y2="22"/><line x1="50" y1="50" x2="78" y2="22"/>
|
|
<line x1="50" y1="50" x2="22" y2="78"/><line x1="50" y1="50" x2="78" y2="78"/>
|
|
<rect x="41" y="41" width="18" height="18" rx="4"/>
|
|
<circle cx="22" cy="22" r="8.5"/><circle cx="78" cy="22" r="8.5"/>
|
|
<circle cx="22" cy="78" r="8.5"/><circle cx="78" cy="78" r="8.5"/>
|
|
<ellipse cx="22" cy="22" rx="12" ry="2.6" transform="rotate(45 22 22)"/>
|
|
<ellipse cx="78" cy="22" rx="12" ry="2.6" transform="rotate(-45 78 22)"/>
|
|
<ellipse cx="22" cy="78" rx="12" ry="2.6" transform="rotate(-45 22 78)"/>
|
|
<ellipse cx="78" cy="78" rx="12" ry="2.6" transform="rotate(45 78 78)"/>
|
|
</svg>
|
|
</div>
|
|
</div>
|
|
<div class="container">
|
|
<div class="eyebrow">Hardware</div>
|
|
<h1>Drone Hardware<br>Devkits.</h1>
|
|
<p>Complete hardware kits with CAD files, 3D printable components, PCB designs, and community support for building industrial drones.</p>
|
|
</div>
|
|
</section>
|
|
|
|
<!-- WHAT'S IN THE KIT -->
|
|
<section class="section">
|
|
<div class="container">
|
|
<div class="eyebrow" style="margin-bottom:14px;">Every kit includes</div>
|
|
<h2 class="section-title" style="margin-top:0;max-width:540px;">Everything you need to build and fly.</h2>
|
|
<div class="kit-includes">
|
|
<div class="kit-item">
|
|
<div class="kit-item-icon">
|
|
<svg width="20" height="20" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.8" aria-hidden="true"><path d="M14 2H6a2 2 0 00-2 2v16a2 2 0 002 2h12a2 2 0 002-2V8z"/><polyline points="14 2 14 8 20 8"/><line x1="16" y1="13" x2="8" y2="13"/><line x1="16" y1="17" x2="8" y2="17"/></svg>
|
|
</div>
|
|
<h4>CAD Files & Drawings</h4>
|
|
<p>STEP, STL, and DXF formats for full mechanical design access.</p>
|
|
</div>
|
|
<div class="kit-item">
|
|
<div class="kit-item-icon">
|
|
<svg width="20" height="20" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.8" aria-hidden="true"><polygon points="12 2 15.09 8.26 22 9.27 17 14.14 18.18 21.02 12 17.77 5.82 21.02 7 14.14 2 9.27 8.91 8.26 12 2"/></svg>
|
|
</div>
|
|
<h4>3D Printable Models</h4>
|
|
<p>STL files for all custom structural and mounting components.</p>
|
|
</div>
|
|
<div class="kit-item">
|
|
<div class="kit-item-icon">
|
|
<svg width="20" height="20" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.8" aria-hidden="true"><rect x="4" y="4" width="16" height="16" rx="2"/><rect x="9" y="9" width="6" height="6"/><line x1="9" y1="1" x2="9" y2="4"/><line x1="15" y1="1" x2="15" y2="4"/><line x1="9" y1="20" x2="9" y2="23"/><line x1="15" y1="20" x2="15" y2="23"/><line x1="20" y1="9" x2="23" y2="9"/><line x1="20" y1="14" x2="23" y2="14"/><line x1="1" y1="9" x2="4" y2="9"/><line x1="1" y1="14" x2="4" y2="14"/></svg>
|
|
</div>
|
|
<h4>PCB Designs & Schematics</h4>
|
|
<p>Gerber files and full schematic packs for every board.</p>
|
|
</div>
|
|
<div class="kit-item">
|
|
<div class="kit-item-icon">
|
|
<svg width="20" height="20" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.8" aria-hidden="true"><path d="M9 11l3 3L22 4"/><path d="M21 12v7a2 2 0 01-2 2H5a2 2 0 01-2-2V5a2 2 0 012-2h11"/></svg>
|
|
</div>
|
|
<h4>Bill of Materials</h4>
|
|
<p>Full BOM with supplier links and component part numbers.</p>
|
|
</div>
|
|
<div class="kit-item">
|
|
<div class="kit-item-icon">
|
|
<svg width="20" height="20" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.8" aria-hidden="true"><circle cx="12" cy="12" r="10"/><path d="M12 8v4l3 3"/></svg>
|
|
</div>
|
|
<h4>Assembly Documentation</h4>
|
|
<p>Step-by-step assembly guides and wiring diagrams.</p>
|
|
</div>
|
|
<div class="kit-item">
|
|
<div class="kit-item-icon">
|
|
<svg width="20" height="20" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.8" aria-hidden="true"><path d="M17 21v-2a4 4 0 00-4-4H5a4 4 0 00-4 4v2"/><circle cx="9" cy="7" r="4"/><path d="M23 21v-2a4 4 0 00-3-3.87M16 3.13a4 4 0 010 7.75"/></svg>
|
|
</div>
|
|
<h4>Community Forum Access</h4>
|
|
<p>500+ active builders sharing mods, fixes, and flight tips.</p>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</section>
|
|
|
|
<!-- PRODUCTS -->
|
|
<section id="products" class="section section-off">
|
|
<div class="container">
|
|
<div class="eyebrow" style="margin-bottom:14px;">Products</div>
|
|
<h2 class="section-title" style="margin-top:0;">Choose your platform.</h2>
|
|
<p style="font-size:18px;color:var(--ink-2);margin-top:16px;max-width:540px;line-height:1.55;">Every kit ships with the same full documentation and community access. Pick the hardware that matches your mission.</p>
|
|
|
|
<div class="grid-3" style="margin-top:48px;gap:20px;">
|
|
|
|
<!-- Base Flight Kit -->
|
|
<div class="product-card">
|
|
<div class="product-card-tag">Quadcopter · Developer Platform</div>
|
|
<h3>Base Flight Kit</h3>
|
|
<div class="product-price">
|
|
£1,999
|
|
<span class="price-sub"> incl. VAT</span>
|
|
</div>
|
|
<p class="product-desc">Essential quadcopter platform for developers. The fastest path from CAD to first flight.</p>
|
|
<ul class="product-features">
|
|
<li>
|
|
<svg width="15" height="15" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2.2" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true"><path d="M20 6L9 17l-5-5"/></svg>
|
|
400mm wheelbase frame design
|
|
</li>
|
|
<li>
|
|
<svg width="15" height="15" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2.2" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true"><path d="M20 6L9 17l-5-5"/></svg>
|
|
Flight controller with STM32 MCU
|
|
</li>
|
|
<li>
|
|
<svg width="15" height="15" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2.2" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true"><path d="M20 6L9 17l-5-5"/></svg>
|
|
Power distribution board layout
|
|
</li>
|
|
<li>
|
|
<svg width="15" height="15" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2.2" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true"><path d="M20 6L9 17l-5-5"/></svg>
|
|
ESC integration guides
|
|
</li>
|
|
<li>
|
|
<svg width="15" height="15" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2.2" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true"><path d="M20 6L9 17l-5-5"/></svg>
|
|
2.4GHz radio antenna
|
|
</li>
|
|
</ul>
|
|
<a href="mailto:bournemouthtech@protonmail.com" class="btn btn-dark btn-md" style="margin-top:auto;">Buy now</a>
|
|
</div>
|
|
|
|
<!-- Edge Compute Kit (featured) -->
|
|
<div class="product-card featured">
|
|
<div class="product-card-tag">Quadcopter · AI Platform</div>
|
|
<h3>Edge Compute Kit</h3>
|
|
<div class="product-price">
|
|
£4,999
|
|
<span class="price-sub" style="color:rgba(255,255,255,0.5);"> incl. VAT</span>
|
|
</div>
|
|
<p class="product-desc">Advanced platform with onboard Linux computer integration for real-time AI inference.</p>
|
|
<ul class="product-features">
|
|
<li>
|
|
<svg width="15" height="15" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2.2" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true"><path d="M20 6L9 17l-5-5"/></svg>
|
|
Raspberry Pi 4/5 Compute Module
|
|
</li>
|
|
<li>
|
|
<svg width="15" height="15" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2.2" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true"><path d="M20 6L9 17l-5-5"/></svg>
|
|
Dual camera mounting points
|
|
</li>
|
|
<li>
|
|
<svg width="15" height="15" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2.2" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true"><path d="M20 6L9 17l-5-5"/></svg>
|
|
Extended flight time (up to 25 min)
|
|
</li>
|
|
<li>
|
|
<svg width="15" height="15" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2.2" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true"><path d="M20 6L9 17l-5-5"/></svg>
|
|
High-bandwidth telemetry
|
|
</li>
|
|
<li>
|
|
<svg width="15" height="15" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2.2" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true"><path d="M20 6L9 17l-5-5"/></svg>
|
|
Thermal management system
|
|
</li>
|
|
</ul>
|
|
<a href="mailto:bournemouthtech@protonmail.com" class="btn btn-white btn-md" style="margin-top:auto;">Buy now</a>
|
|
</div>
|
|
|
|
<!-- Heavy Lift -->
|
|
<div class="product-card">
|
|
<div class="product-card-tag">Hexacopter · Industrial</div>
|
|
<h3>Heavy Lift Platform</h3>
|
|
<div class="product-price" style="font-size:20px;color:var(--ink-3);">Contact for pricing</div>
|
|
<p class="product-desc">High-payload hexacopter design for delivery, survey equipment, and heavy sensor packages.</p>
|
|
<ul class="product-features">
|
|
<li>
|
|
<svg width="15" height="15" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2.2" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true"><path d="M20 6L9 17l-5-5"/></svg>
|
|
Hex frame with redundant motors
|
|
</li>
|
|
<li>
|
|
<svg width="15" height="15" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2.2" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true"><path d="M20 6L9 17l-5-5"/></svg>
|
|
High-torque motor selection guide
|
|
</li>
|
|
<li>
|
|
<svg width="15" height="15" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2.2" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true"><path d="M20 6L9 17l-5-5"/></svg>
|
|
Payload release mechanism
|
|
</li>
|
|
<li>
|
|
<svg width="15" height="15" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2.2" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true"><path d="M20 6L9 17l-5-5"/></svg>
|
|
Custom consultancy included
|
|
</li>
|
|
</ul>
|
|
<a href="mailto:bournemouthtech@protonmail.com" class="btn btn-outline btn-md" style="margin-top:auto;">Get in touch</a>
|
|
</div>
|
|
|
|
</div>
|
|
|
|
<!-- Sensor Expansion Pack -->
|
|
<div class="product-card" style="margin-top:20px;display:grid;grid-template-columns:1fr 1fr;gap:28px;align-items:center;">
|
|
<div>
|
|
<div class="product-card-tag">Modular Add-on</div>
|
|
<h3 style="font-size:22px;margin-top:8px;">Sensor Expansion Pack</h3>
|
|
<p class="product-desc" style="margin-top:10px;">Modular sensor integration kit compatible with all platforms. Add multispectral, thermal, LiDAR, or custom sensors to any devkit.</p>
|
|
</div>
|
|
<div style="display:flex;align-items:center;justify-content:flex-end;gap:20px;flex-wrap:wrap;">
|
|
<div class="product-price" style="font-size:18px;color:var(--ink-3);">Contact for pricing</div>
|
|
<a href="mailto:bournemouthtech@protonmail.com" class="btn btn-outline btn-md">Get in touch</a>
|
|
</div>
|
|
</div>
|
|
|
|
</div>
|
|
</section>
|
|
|
|
<!-- CTA BAND -->
|
|
<section class="cta-band section-off">
|
|
<div class="container">
|
|
<h2>Ready to build?</h2>
|
|
<p>Pick your platform, fork the firmware, and start flying.</p>
|
|
<div class="cta-band-btns">
|
|
<a href="#products" class="btn btn-dark btn-lg">See all kits</a>
|
|
<a href="consultancy.html" class="btn btn-outline btn-lg">Need something custom?</a>
|
|
</div>
|
|
</div>
|
|
</section>
|
|
|
|
<!-- FOOTER -->
|
|
<footer>
|
|
<div class="container">
|
|
<div class="footer-grid">
|
|
<div class="footer-brand">
|
|
<div class="footer-logo">
|
|
<svg width="22" height="22" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.6" aria-hidden="true">
|
|
<rect x="6" y="6" width="12" height="12" rx="1.5"/>
|
|
<rect x="9.5" y="9.5" width="5" height="5" fill="currentColor" stroke="none"/>
|
|
<path d="M9 6V2.5M15 6V2.5M9 21.5V18M15 21.5V18M6 9H2.5M6 15H2.5M21.5 9H18M21.5 15H18"/>
|
|
</svg>
|
|
<span>Bournemouth Technology</span>
|
|
</div>
|
|
<p class="footer-tagline">Hardware, software, and consultancy for drone innovators.<br>Open source. Modular. Built by developers, for developers.</p>
|
|
</div>
|
|
<div>
|
|
<div class="footer-col-label">Product</div>
|
|
<div class="footer-col-links">
|
|
<a href="devkits.html">Devkits</a>
|
|
<a href="opensource.html">Open Source</a>
|
|
<a href="videos.html">Videos</a>
|
|
<a href="worlds.html">Worlds</a>
|
|
<a href="consultancy.html">Consultancy</a>
|
|
</div>
|
|
</div>
|
|
<div>
|
|
<div class="footer-col-label">Resources</div>
|
|
<div class="footer-col-links">
|
|
<a href="opensource.html">Documentation</a>
|
|
<a href="opensource.html">GitHub</a>
|
|
<a href="devkits.html">Bill of materials</a>
|
|
<a href="opensource.html">Community forum</a>
|
|
</div>
|
|
</div>
|
|
<div>
|
|
<div class="footer-col-label">Connect</div>
|
|
<div class="footer-col-links">
|
|
<a href="consultancy.html">Contact</a>
|
|
<a href="https://www.youtube.com/@JonStarkeyfilms">YouTube</a>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="footer-bottom">
|
|
<span>© 2025 Bournemouth Technology</span>
|
|
<span>MIT licensed software · Made in Bournemouth, UK</span>
|
|
</div>
|
|
</div>
|
|
</footer>
|
|
|
|
<script>
|
|
document.getElementById('theme-toggle').addEventListener('click', function() {
|
|
var dark = document.documentElement.classList.toggle('dark');
|
|
localStorage.setItem('theme', dark ? 'dark' : 'light');
|
|
});
|
|
</script>
|
|
</body>
|
|
</html>
|