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>
321 lines
19 KiB
HTML
321 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 Integration Consultancy — Bournemouth Technology</title>
|
|
<meta name="description" content="We package our devkits and open-source software into custom solutions for your industry. End-to-end deployment, training, and support.">
|
|
<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">Devkits</a>
|
|
<a href="opensource.html">Open Source</a>
|
|
<a href="consultancy.html" class="active">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="mailto:bournemouthtech@protonmail.com" class="btn btn-dark btn-sm">Get in touch</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">Consultancy · Use cases</div>
|
|
<h1>Drone Integration<br>Consultancy.</h1>
|
|
<p>We package our devkits and open-source software into custom solutions for your industry. End-to-end deployment, training, and support.</p>
|
|
<div style="margin-top:32px;display:flex;flex-wrap:wrap;gap:13px;">
|
|
<a href="mailto:bournemouthtech@protonmail.com" class="btn btn-dark btn-lg">Talk to our team</a>
|
|
<a href="#industries" class="btn btn-outline btn-lg">See use cases</a>
|
|
</div>
|
|
</div>
|
|
</section>
|
|
|
|
<!-- PROCESS -->
|
|
<section class="section">
|
|
<div class="container">
|
|
<div class="eyebrow" style="margin-bottom:14px;">How we work</div>
|
|
<h2 class="section-title" style="margin-top:0;margin-bottom:40px;">Four steps to deployment.</h2>
|
|
<div class="steps">
|
|
<div class="step">
|
|
<div class="step-num">01 · Discovery</div>
|
|
<h3>Discovery</h3>
|
|
<p>We learn about your use case, requirements, and constraints. No two deployments are the same — we start by listening.</p>
|
|
</div>
|
|
<div class="step">
|
|
<div class="step-num">02 · Design</div>
|
|
<h3>Design</h3>
|
|
<p>We architect a solution combining hardware, software, and workflows tailored to your environment and team.</p>
|
|
</div>
|
|
<div class="step">
|
|
<div class="step-num">03 · Deploy</div>
|
|
<h3>Deploy</h3>
|
|
<p>We build, test, and deliver the integrated system to your site. Rigorous QA at every stage before handoff.</p>
|
|
</div>
|
|
<div class="step">
|
|
<div class="step-num">04 · Support</div>
|
|
<h3>Support</h3>
|
|
<p>Ongoing training, maintenance, and feature development. We stay involved as your mission evolves.</p>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</section>
|
|
|
|
<!-- WHAT WE DELIVER -->
|
|
<section class="section section-off">
|
|
<div class="container">
|
|
<div class="two-col">
|
|
<div>
|
|
<div class="eyebrow">Services</div>
|
|
<h2 class="section-title">End-to-end, not off-the-shelf.</h2>
|
|
<p class="section-body">We deliver complete systems — from circuit board to operator dashboard — built on our open-source foundation so you own the result.</p>
|
|
<ul class="feature-list on-off" style="margin-top:34px;">
|
|
<li>
|
|
<svg width="17" height="17" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2.4" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true"><path d="M20 6L9 17l-5-5"/></svg>
|
|
Custom hardware + software integration
|
|
</li>
|
|
<li>
|
|
<svg width="17" height="17" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2.4" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true"><path d="M20 6L9 17l-5-5"/></svg>
|
|
End-to-end solution design
|
|
</li>
|
|
<li>
|
|
<svg width="17" height="17" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2.4" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true"><path d="M20 6L9 17l-5-5"/></svg>
|
|
AI model training for your use case
|
|
</li>
|
|
<li>
|
|
<svg width="17" height="17" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2.4" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true"><path d="M20 6L9 17l-5-5"/></svg>
|
|
Industry-specific deployments
|
|
</li>
|
|
<li>
|
|
<svg width="17" height="17" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2.4" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true"><path d="M20 6L9 17l-5-5"/></svg>
|
|
Operator and support staff training
|
|
</li>
|
|
</ul>
|
|
</div>
|
|
<div style="display:flex;flex-direction:column;gap:16px;">
|
|
<div style="padding:24px;border:1px solid var(--rule);border-radius:16px;">
|
|
<div style="font-family:var(--mono);font-size:11px;letter-spacing:0.12em;text-transform:uppercase;color:var(--ink-3);margin-bottom:10px;">Modular & Flexible</div>
|
|
<p style="font-size:15px;color:var(--ink-2);line-height:1.6;">Every solution is built from our modular devkit and software stack — components swap in or out as your mission changes.</p>
|
|
</div>
|
|
<div style="padding:24px;border:1px solid var(--rule);border-radius:16px;">
|
|
<div style="font-family:var(--mono);font-size:11px;letter-spacing:0.12em;text-transform:uppercase;color:var(--ink-3);margin-bottom:10px;">Open-source foundation</div>
|
|
<p style="font-size:15px;color:var(--ink-2);line-height:1.6;">No vendor lock-in. You own the deployed system. Full source access means your team can maintain and extend it.</p>
|
|
</div>
|
|
<div style="padding:24px;border:1px solid var(--rule);border-radius:16px;">
|
|
<div style="font-family:var(--mono);font-size:11px;letter-spacing:0.12em;text-transform:uppercase;color:var(--ink-3);margin-bottom:10px;">Rapid deployment</div>
|
|
<p style="font-size:15px;color:var(--ink-2);line-height:1.6;">Our pre-integrated hardware and software stack dramatically reduces time from brief to first operational flight.</p>
|
|
</div>
|
|
<div style="padding:24px;border:1px solid var(--rule);border-radius:16px;">
|
|
<div style="font-family:var(--mono);font-size:11px;letter-spacing:0.12em;text-transform:uppercase;color:var(--ink-3);margin-bottom:10px;">Ongoing partnership</div>
|
|
<p style="font-size:15px;color:var(--ink-2);line-height:1.6;">We don't disappear after delivery. Retainers for maintenance, new features, and fleet scaling are available.</p>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</section>
|
|
|
|
<!-- INDUSTRIES -->
|
|
<section id="industries" class="section">
|
|
<div class="container">
|
|
<div class="eyebrow" style="margin-bottom:14px;">Industries</div>
|
|
<h2 class="section-title" style="margin-top:0;">Where we deploy.</h2>
|
|
<p style="font-size:17px;color:var(--ink-2);margin-top:16px;max-width:540px;line-height:1.55;">Real solutions across eight sectors — from precision agriculture to photorealistic 3D scene capture.</p>
|
|
|
|
<div class="industry-grid" style="margin-top:48px;">
|
|
<div class="industry-cell">
|
|
<h3>
|
|
<svg width="18" height="18" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.8" aria-hidden="true"><path d="M3 9l9-7 9 7v11a2 2 0 01-2 2H5a2 2 0 01-2-2z"/><polyline points="9 22 9 12 15 12 15 22"/></svg>
|
|
Agriculture
|
|
</h3>
|
|
<p>Precision farming, crop monitoring, autonomous spraying with multispectral sensors and AI analytics.</p>
|
|
</div>
|
|
<div class="industry-cell">
|
|
<h3>
|
|
<svg width="18" height="18" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.8" aria-hidden="true"><path d="M12 22s8-4 8-10V5l-8-3-8 3v7c0 6 8 10 8 10z"/></svg>
|
|
Surveillance & Security
|
|
</h3>
|
|
<p>Autonomous perimeter monitoring, real-time alerting, and asset protection with live video streaming.</p>
|
|
</div>
|
|
<div class="industry-cell">
|
|
<h3>
|
|
<svg width="18" height="18" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.8" aria-hidden="true"><rect x="1" y="3" width="15" height="13"/><polygon points="16 8 20 8 23 11 23 16 16 16 16 8"/><circle cx="5.5" cy="18.5" r="2.5"/><circle cx="18.5" cy="18.5" r="2.5"/></svg>
|
|
Delivery & Logistics
|
|
</h3>
|
|
<p>Last-mile delivery, payload management, and autonomous route planning for urban and rural zones.</p>
|
|
</div>
|
|
<div class="industry-cell">
|
|
<h3>
|
|
<svg width="18" height="18" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.8" aria-hidden="true"><rect x="2" y="7" width="20" height="14" rx="2"/><path d="M16 21V5a2 2 0 00-2-2h-4a2 2 0 00-2 2v16"/></svg>
|
|
Infrastructure Inspection
|
|
</h3>
|
|
<p>Bridge surveys, power line monitoring, pipeline inspection, and construction site tracking.</p>
|
|
</div>
|
|
<div class="industry-cell">
|
|
<h3>
|
|
<svg width="18" height="18" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.8" aria-hidden="true"><polygon points="13 2 3 14 12 14 11 22 21 10 12 10 13 2"/></svg>
|
|
Emergency Response
|
|
</h3>
|
|
<p>Search & rescue, disaster assessment, fire monitoring, and medical supply delivery.</p>
|
|
</div>
|
|
<div class="industry-cell">
|
|
<h3>
|
|
<svg width="18" height="18" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.8" aria-hidden="true"><path d="M12 2a10 10 0 100 20A10 10 0 0012 2z"/><path d="M2 12h20M12 2a15.3 15.3 0 010 20M12 2a15.3 15.3 0 000 20"/></svg>
|
|
Environmental Monitoring
|
|
</h3>
|
|
<p>Wildlife tracking, pollution sampling, forestry management, and climate research data collection.</p>
|
|
</div>
|
|
<div class="industry-cell">
|
|
<h3>
|
|
<svg width="18" height="18" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.8" aria-hidden="true"><path d="M23 19a2 2 0 01-2 2H3a2 2 0 01-2-2V8a2 2 0 012-2h4l2-3h6l2 3h4a2 2 0 012 2z"/><circle cx="12" cy="13" r="4"/></svg>
|
|
Photography
|
|
</h3>
|
|
<p>Aerial stills and video for film, real estate, events, and commercial marketing — cinematic coverage from any altitude.</p>
|
|
</div>
|
|
<div class="industry-cell">
|
|
<h3>
|
|
<svg width="18" height="18" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.8" aria-hidden="true"><path d="M21 16V8a2 2 0 00-1-1.73l-7-4a2 2 0 00-2 0l-7 4A2 2 0 003 8v8a2 2 0 001 1.73l7 4a2 2 0 002 0l7-4A2 2 0 0021 16z"/><polyline points="3.27 6.96 12 12.01 20.73 6.96"/><line x1="12" y1="22.08" x2="12" y2="12"/></svg>
|
|
Environment Mapping & 3DGS
|
|
</h3>
|
|
<p>Photogrammetry and 3D Gaussian Splatting capture for photorealistic scene reconstruction — sites, structures, and terrain at scale.</p>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</section>
|
|
|
|
<!-- CTA / CONTACT -->
|
|
<section class="section section-dark">
|
|
<div class="container" style="max-width:700px;text-align:center;">
|
|
<div class="eyebrow">Contact</div>
|
|
<h2 class="section-title" style="font-size:clamp(38px,6vw,72px);margin-top:14px;">Bring us your hardest deployment.</h2>
|
|
<p style="font-size:clamp(17px,1.6vw,20px);color:rgba(255,255,255,0.66);margin-top:22px;line-height:1.55;">Tell us your use case and we'll scope a solution. No commitment required — we'll reply within one working day.</p>
|
|
<div style="margin-top:32px;display:flex;flex-wrap:wrap;gap:13px;justify-content:center;">
|
|
<a href="mailto:bournemouthtech@protonmail.com" class="btn btn-white btn-lg">bournemouthtech@protonmail.com</a>
|
|
</div>
|
|
<div style="margin-top:18px;font-family:var(--mono);font-size:13px;color:rgba(255,255,255,0.4);">We typically respond within one working day.</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>
|