Redesign site with comma.ai-inspired monochrome theme
Complete rebuild: white/black palette, Hanken Grotesk + JetBrains Mono typography, shared style.css, and five separate pages (index, devkits, opensource, consultancy, videos). Real product content, pricing, and video elements with replaceable src paths throughout. Removes old v1/v2/lazy video experiments. Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
This commit is contained in:
648
opensource.html
648
opensource.html
@@ -1,373 +1,341 @@
|
||||
<!DOCTYPE html>
|
||||
<html lang="en">
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||
<title>Open Source Software | Bournemouth Technology</title>
|
||||
<script src="https://cdn.tailwindcss.com"></script>
|
||||
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.4.0/css/all.min.css">
|
||||
<style>
|
||||
@import url('https://fonts.googleapis.com/css2?family=Roboto+Mono:wght@400;500;700&display=swap');
|
||||
body { font-family: 'Roboto Mono', monospace; }
|
||||
.circuit-bg {
|
||||
background-color: #22223b;
|
||||
background-image: url("data:image/svg+xml,%3Csvg width='60' height='60' viewBox='0 0 60 60' xmlns='http://www.w3.org/2000/svg'%3E%3Cg fill='none' fill-rule='evenodd'%3E%3Cg fill='%23f3f7ea' fill-opacity='0.04'%3E%3Cpath d='M22 28v-4h-2v4h-4v2h4v4h2v-4h4v-2zm0-24V0h-2v4h-4v2h4v4h2V6h4V4h-4zM6 28v-4H4v4H0v2h4v4h2v-4h4v-2zm0-24V0H4v4H0v2h4v4h2V6h4V4z'/%3E%3C/g%3E%3C/g%3E%3C/svg%3E");
|
||||
}
|
||||
.hover-lift { transition: transform 0.3s ease, box-shadow 0.3s ease; }
|
||||
.hover-lift:hover { transform: translateY(-5px); box-shadow: 0 12px 24px rgba(56,62,86,0.2); }
|
||||
</style>
|
||||
<meta charset="utf-8">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1">
|
||||
<title>Open Source Software — Bournemouth Technology</title>
|
||||
<meta name="description" content="Free, open-source drone software stack. Flight controllers, AI models, simulation tools, and more. MIT licensed.">
|
||||
<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">
|
||||
</head>
|
||||
<body class="bg-[#1a1b2f] text-gray-200">
|
||||
|
||||
<!-- Header -->
|
||||
<nav class="bg-[#22223b] fixed w-full z-50 top-0 border-b border-green-900">
|
||||
<div class="max-w-6xl mx-auto px-6 py-4 flex justify-between items-center">
|
||||
<a href="index.html" class="flex items-center">
|
||||
<i class="fas fa-microchip text-2xl text-green-400"></i>
|
||||
<span class="ml-3 text-lg font-bold text-green-300 tracking-wide">Bournemouth Technology</span>
|
||||
</a>
|
||||
<div class="hidden md:flex space-x-6 text-sm">
|
||||
<a href="devkits.html" class="text-gray-300 hover:text-green-400 transition">Devkits</a>
|
||||
<a href="opensource.html" class="text-green-400 font-semibold">Open Source</a>
|
||||
<a href="consultancy.html" class="text-gray-300 hover:text-green-400 transition">Consultancy</a>
|
||||
<a href="videos.html" class="text-gray-300 hover:text-green-400 transition">Videos</a>
|
||||
<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" class="active">Open Source</a>
|
||||
<a href="consultancy.html">Consultancy</a>
|
||||
<a href="videos.html">Videos</a>
|
||||
</nav>
|
||||
<a href="devkits.html" class="btn btn-dark btn-sm">Buy a devkit</a>
|
||||
</div>
|
||||
</div>
|
||||
</nav>
|
||||
|
||||
<!-- PAGE HERO (dark) -->
|
||||
<section class="section-dark" style="padding:clamp(64px,8vw,100px) 0 clamp(56px,7vw,88px);border-bottom:1px solid rgba(255,255,255,0.1);">
|
||||
<div class="container">
|
||||
<div class="eyebrow">Software · Free forever</div>
|
||||
<h1 style="font-size:clamp(44px,7vw,88px);font-weight:800;letter-spacing:-0.04em;line-height:0.95;margin-top:14px;max-width:820px;">Open Source<br>Software.</h1>
|
||||
<p style="font-size:clamp(17px,1.8vw,21px);line-height:1.55;color:rgba(255,255,255,0.66);max-width:620px;margin-top:22px;">Free, open-source drone software stack. Flight controllers, AI models, simulation tools, and more.</p>
|
||||
<div style="margin-top:32px;display:flex;flex-wrap:wrap;gap:13px;">
|
||||
<a href="#repos" class="btn btn-white btn-md">Explore projects</a>
|
||||
<a href="#community" class="btn btn-ghost-dark btn-md">Join Discord</a>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<!-- WHY OPEN SOURCE -->
|
||||
<section class="section">
|
||||
<div class="container">
|
||||
<div class="eyebrow" style="margin-bottom:14px;">Why open source?</div>
|
||||
<h2 class="section-title" style="margin-top:0;">Built on trust,<br>not lock-in.</h2>
|
||||
<div class="grid-3" style="margin-top:48px;">
|
||||
<div class="why-card">
|
||||
<svg width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.8" style="margin-bottom:16px;" aria-hidden="true"><rect x="3" y="11" width="18" height="11" rx="2" ry="2"/><path d="M7 11V7a5 5 0 0110 0v4"/></svg>
|
||||
<h3>No Lock-In</h3>
|
||||
<p>Full source code access. Modify, extend, and deploy without vendor restrictions.</p>
|
||||
</div>
|
||||
<div class="why-card">
|
||||
<svg width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.8" style="margin-bottom:16px;" 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>
|
||||
<h3>Community Driven</h3>
|
||||
<p>Contributions from developers worldwide. Better code, faster innovation.</p>
|
||||
</div>
|
||||
<div class="why-card">
|
||||
<svg width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.8" style="margin-bottom:16px;" aria-hidden="true"><path d="M2 3h6a4 4 0 014 4v14a3 3 0 00-3-3H2z"/><path d="M22 3h-6a4 4 0 00-4 4v14a3 3 0 013-3h7z"/></svg>
|
||||
<h3>Learn & Build</h3>
|
||||
<p>Educational friendly. Perfect for research, teaching, and experimentation.</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<!-- IMPACT STATS -->
|
||||
<section class="section-off" style="padding:0;">
|
||||
<div class="container">
|
||||
<div class="stat-strip">
|
||||
<div class="stat-item">
|
||||
<div class="stat-num">10k+</div>
|
||||
<div class="stat-label">GitHub Stars</div>
|
||||
</div>
|
||||
<div class="stat-item">
|
||||
<div class="stat-num">300+</div>
|
||||
<div class="stat-label">Contributors</div>
|
||||
</div>
|
||||
<div class="stat-item">
|
||||
<div class="stat-num">50+</div>
|
||||
<div class="stat-label">Countries</div>
|
||||
</div>
|
||||
<div class="stat-item">
|
||||
<div class="stat-num">5k+</div>
|
||||
<div class="stat-label">Deployments</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<!-- REPOS -->
|
||||
<section id="repos" class="section">
|
||||
<div class="container">
|
||||
<div class="eyebrow" style="margin-bottom:14px;">Projects</div>
|
||||
<h2 class="section-title" style="margin-top:0;">Six repos. One stack.</h2>
|
||||
<p style="font-size:17px;color:var(--ink-2);margin-top:16px;max-width:560px;line-height:1.55;">Clone our repos, join the community, and start developing your drone applications today.</p>
|
||||
|
||||
<div class="grid-3" style="margin-top:48px;">
|
||||
|
||||
<div class="repo-card">
|
||||
<div class="repo-card-top">
|
||||
<h3>Flight Core</h3>
|
||||
<div class="repo-stars">
|
||||
<svg width="13" height="13" viewBox="0 0 24 24" fill="currentColor" aria-hidden="true"><path d="M12 2l3.09 6.26L22 9.27l-5 4.87 1.18 6.88L12 17.77l-6.18 3.25L7 14.14 2 9.27l6.91-1.01L12 2z"/></svg>
|
||||
2.4k
|
||||
</div>
|
||||
<button id="mobile-menu-btn" class="md:hidden text-gray-400">
|
||||
<i class="fas fa-bars text-xl"></i>
|
||||
</button>
|
||||
</div>
|
||||
<p class="repo-desc">Real-time flight controller firmware for ARM microcontrollers. PID loops, sensor fusion, and MAVLink support.</p>
|
||||
<div class="repo-meta">
|
||||
<span class="repo-lang">C / C++</span>
|
||||
<span class="repo-license">MIT</span>
|
||||
</div>
|
||||
<a href="#" class="btn-text" style="font-size:13px;margin-top:8px;">View on GitHub ↗</a>
|
||||
</div>
|
||||
<div id="mobile-menu" class="hidden md:hidden bg-[#22223b] px-6 pb-4 text-sm">
|
||||
<a href="devkits.html" class="block py-2 text-gray-300 hover:text-green-400">Devkits</a>
|
||||
<a href="opensource.html" class="block py-2 text-green-400 font-semibold">Open Source</a>
|
||||
<a href="consultancy.html" class="block py-2 text-gray-300 hover:text-green-400">Consultancy</a>
|
||||
<a href="videos.html" class="block py-2 text-gray-300 hover:text-green-400">Videos</a>
|
||||
</div>
|
||||
</nav>
|
||||
|
||||
<!-- Hero -->
|
||||
<section class="circuit-bg pt-28 pb-16 px-6">
|
||||
<div class="max-w-5xl mx-auto">
|
||||
<div class="text-center mb-12">
|
||||
<h1 class="text-4xl md:text-5xl font-bold text-green-300 mb-6 tracking-wide">
|
||||
Open Source Software
|
||||
</h1>
|
||||
<p class="text-lg text-green-200 max-w-2xl mx-auto">
|
||||
Free, open-source drone software stack. Flight controllers, AI models, simulation tools, and more. Join our community of innovators.
|
||||
</p>
|
||||
<div class="repo-card">
|
||||
<div class="repo-card-top">
|
||||
<h3>Vision Suite</h3>
|
||||
<div class="repo-stars">
|
||||
<svg width="13" height="13" viewBox="0 0 24 24" fill="currentColor" aria-hidden="true"><path d="M12 2l3.09 6.26L22 9.27l-5 4.87 1.18 6.88L12 17.77l-6.18 3.25L7 14.14 2 9.27l6.91-1.01L12 2z"/></svg>
|
||||
1.8k
|
||||
</div>
|
||||
</div>
|
||||
<p class="repo-desc">Computer vision and AI inference toolkit. YOLO models, object detection, and semantic segmentation optimised for edge hardware.</p>
|
||||
<div class="repo-meta">
|
||||
<span class="repo-lang">Python</span>
|
||||
<span class="repo-license">Apache 2.0</span>
|
||||
</div>
|
||||
<a href="#" class="btn-text" style="font-size:13px;margin-top:8px;">View on GitHub ↗</a>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<!-- Philosophy -->
|
||||
<section class="py-16 px-6 bg-[#23243a]">
|
||||
<div class="max-w-4xl mx-auto text-center">
|
||||
<h2 class="text-3xl font-bold text-green-300 mb-6">Why Open Source?</h2>
|
||||
<p class="text-green-200 mb-8 text-lg">
|
||||
We believe drone technology should be accessible, transparent, and community-driven. All our software is released under permissive licenses—use it commercially, fork it, contribute back, or learn from it.
|
||||
</p>
|
||||
<div class="grid md:grid-cols-3 gap-6">
|
||||
<div class="bg-[#292b3d] p-6 rounded-lg border border-green-700">
|
||||
<i class="fas fa-unlock text-green-400 text-3xl mb-3"></i>
|
||||
<h3 class="text-xl font-bold text-green-300 mb-2">No Lock-In</h3>
|
||||
<p class="text-green-200 text-sm">Full source code access. Modify, extend, and deploy without vendor restrictions.</p>
|
||||
</div>
|
||||
<div class="bg-[#292b3d] p-6 rounded-lg border border-green-700">
|
||||
<i class="fas fa-users text-green-400 text-3xl mb-3"></i>
|
||||
<h3 class="text-xl font-bold text-green-300 mb-2">Community Driven</h3>
|
||||
<p class="text-green-200 text-sm">Contributions from developers worldwide. Better code, faster innovation.</p>
|
||||
</div>
|
||||
<div class="bg-[#292b3d] p-6 rounded-lg border border-green-700">
|
||||
<i class="fas fa-graduation-cap text-green-400 text-3xl mb-3"></i>
|
||||
<h3 class="text-xl font-bold text-green-300 mb-2">Learn & Build</h3>
|
||||
<p class="text-green-200 text-sm">Educational friendly. Perfect for research, teaching, and experimentation.</p>
|
||||
</div>
|
||||
<div class="repo-card">
|
||||
<div class="repo-card-top">
|
||||
<h3>Ground Control Station</h3>
|
||||
<div class="repo-stars">
|
||||
<svg width="13" height="13" viewBox="0 0 24 24" fill="currentColor" aria-hidden="true"><path d="M12 2l3.09 6.26L22 9.27l-5 4.87 1.18 6.88L12 17.77l-6.18 3.25L7 14.14 2 9.27l6.91-1.01L12 2z"/></svg>
|
||||
3.1k
|
||||
</div>
|
||||
</div>
|
||||
<p class="repo-desc">Cross-platform mission planning software. Waypoint editor, live telemetry, and geofencing tools in the browser.</p>
|
||||
<div class="repo-meta">
|
||||
<span class="repo-lang">JavaScript / React</span>
|
||||
<span class="repo-license">GPLv3</span>
|
||||
</div>
|
||||
<a href="#" class="btn-text" style="font-size:13px;margin-top:8px;">View on GitHub ↗</a>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<!-- Software Projects -->
|
||||
<section class="py-16 px-6 bg-[#1a1b2f]">
|
||||
<div class="max-w-5xl mx-auto">
|
||||
<h2 class="text-3xl font-bold text-green-300 mb-10 text-center">Our Software Projects</h2>
|
||||
|
||||
<div class="space-y-8">
|
||||
|
||||
<!-- Project 1 -->
|
||||
<div class="bg-[#292b3d] p-8 rounded-xl hover-lift border border-green-600">
|
||||
<div class="flex items-start justify-between mb-4">
|
||||
<div>
|
||||
<h3 class="text-2xl font-bold text-green-300 mb-2">Flight Core</h3>
|
||||
<div class="flex items-center gap-4 text-sm">
|
||||
<span class="text-green-400"><i class="fas fa-code-branch mr-1"></i> MIT License</span>
|
||||
<span class="text-gray-400"><i class="fab fa-github mr-1"></i> 2.4k stars</span>
|
||||
<span class="text-gray-400"><i class="fas fa-code mr-1"></i> C/C++</span>
|
||||
</div>
|
||||
</div>
|
||||
<a href="#" class="bg-green-600 text-white px-4 py-2 rounded-lg text-sm font-semibold hover:bg-green-500 transition">
|
||||
<i class="fab fa-github mr-1"></i> GitHub
|
||||
</a>
|
||||
</div>
|
||||
<p class="text-green-200 mb-4">
|
||||
Real-time flight controller firmware for ARM Cortex-M microcontrollers. Supports quadcopters, hexacopters, and fixed-wing platforms. Includes PID tuning, sensor fusion, and failsafe systems.
|
||||
</p>
|
||||
<div class="flex flex-wrap gap-2">
|
||||
<span class="bg-green-900 text-green-300 px-3 py-1 rounded text-xs">STM32</span>
|
||||
<span class="bg-green-900 text-green-300 px-3 py-1 rounded text-xs">IMU Fusion</span>
|
||||
<span class="bg-green-900 text-green-300 px-3 py-1 rounded text-xs">MAVLink</span>
|
||||
<span class="bg-green-900 text-green-300 px-3 py-1 rounded text-xs">FreeRTOS</span>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- Project 2 -->
|
||||
<div class="bg-[#292b3d] p-8 rounded-xl hover-lift border border-green-600">
|
||||
<div class="flex items-start justify-between mb-4">
|
||||
<div>
|
||||
<h3 class="text-2xl font-bold text-green-300 mb-2">Vision Suite</h3>
|
||||
<div class="flex items-center gap-4 text-sm">
|
||||
<span class="text-green-400"><i class="fas fa-code-branch mr-1"></i> Apache 2.0</span>
|
||||
<span class="text-gray-400"><i class="fab fa-github mr-1"></i> 1.8k stars</span>
|
||||
<span class="text-gray-400"><i class="fas fa-code mr-1"></i> Python</span>
|
||||
</div>
|
||||
</div>
|
||||
<a href="#" class="bg-green-600 text-white px-4 py-2 rounded-lg text-sm font-semibold hover:bg-green-500 transition">
|
||||
<i class="fab fa-github mr-1"></i> GitHub
|
||||
</a>
|
||||
</div>
|
||||
<p class="text-green-200 mb-4">
|
||||
Computer vision and AI inference toolkit for drones. Pre-trained models for object detection, tracking, semantic segmentation, and pose estimation. Optimized for edge devices like Jetson and Raspberry Pi.
|
||||
</p>
|
||||
<div class="flex flex-wrap gap-2">
|
||||
<span class="bg-green-900 text-green-300 px-3 py-1 rounded text-xs">TensorFlow</span>
|
||||
<span class="bg-green-900 text-green-300 px-3 py-1 rounded text-xs">PyTorch</span>
|
||||
<span class="bg-green-900 text-green-300 px-3 py-1 rounded text-xs">OpenCV</span>
|
||||
<span class="bg-green-900 text-green-300 px-3 py-1 rounded text-xs">YOLO</span>
|
||||
<span class="bg-green-900 text-green-300 px-3 py-1 rounded text-xs">ONNX</span>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- Project 3 -->
|
||||
<div class="bg-[#292b3d] p-8 rounded-xl hover-lift border border-green-600">
|
||||
<div class="flex items-start justify-between mb-4">
|
||||
<div>
|
||||
<h3 class="text-2xl font-bold text-green-300 mb-2">Ground Control Station</h3>
|
||||
<div class="flex items-center gap-4 text-sm">
|
||||
<span class="text-green-400"><i class="fas fa-code-branch mr-1"></i> GPLv3</span>
|
||||
<span class="text-gray-400"><i class="fab fa-github mr-1"></i> 3.1k stars</span>
|
||||
<span class="text-gray-400"><i class="fas fa-code mr-1"></i> JavaScript/React</span>
|
||||
</div>
|
||||
</div>
|
||||
<a href="#" class="bg-green-600 text-white px-4 py-2 rounded-lg text-sm font-semibold hover:bg-green-500 transition">
|
||||
<i class="fab fa-github mr-1"></i> GitHub
|
||||
</a>
|
||||
</div>
|
||||
<p class="text-green-200 mb-4">
|
||||
Cross-platform ground control software with mission planning, telemetry visualization, and real-time video streaming. Works with MAVLink-compatible flight controllers.
|
||||
</p>
|
||||
<div class="flex flex-wrap gap-2">
|
||||
<span class="bg-green-900 text-green-300 px-3 py-1 rounded text-xs">Electron</span>
|
||||
<span class="bg-green-900 text-green-300 px-3 py-1 rounded text-xs">WebRTC</span>
|
||||
<span class="bg-green-900 text-green-300 px-3 py-1 rounded text-xs">Mapbox</span>
|
||||
<span class="bg-green-900 text-green-300 px-3 py-1 rounded text-xs">MAVLink</span>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- Project 4 -->
|
||||
<div class="bg-[#292b3d] p-8 rounded-xl hover-lift border border-green-600">
|
||||
<div class="flex items-start justify-between mb-4">
|
||||
<div>
|
||||
<h3 class="text-2xl font-bold text-green-300 mb-2">ROS2 Middleware</h3>
|
||||
<div class="flex items-center gap-4 text-sm">
|
||||
<span class="text-green-400"><i class="fas fa-code-branch mr-1"></i> BSD-3</span>
|
||||
<span class="text-gray-400"><i class="fab fa-github mr-1"></i> 890 stars</span>
|
||||
<span class="text-gray-400"><i class="fas fa-code mr-1"></i> C++/Python</span>
|
||||
</div>
|
||||
</div>
|
||||
<a href="#" class="bg-green-600 text-white px-4 py-2 rounded-lg text-sm font-semibold hover:bg-green-500 transition">
|
||||
<i class="fab fa-github mr-1"></i> GitHub
|
||||
</a>
|
||||
</div>
|
||||
<p class="text-green-200 mb-4">
|
||||
ROS2 packages for drone control, navigation, and sensor integration. Includes launch files, message definitions, and example workflows for rapid prototyping.
|
||||
</p>
|
||||
<div class="flex flex-wrap gap-2">
|
||||
<span class="bg-green-900 text-green-300 px-3 py-1 rounded text-xs">ROS2 Humble</span>
|
||||
<span class="bg-green-900 text-green-300 px-3 py-1 rounded text-xs">Navigation2</span>
|
||||
<span class="bg-green-900 text-green-300 px-3 py-1 rounded text-xs">Gazebo</span>
|
||||
<span class="bg-green-900 text-green-300 px-3 py-1 rounded text-xs">PX4</span>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- Project 5 -->
|
||||
<div class="bg-[#292b3d] p-8 rounded-xl hover-lift border border-green-600">
|
||||
<div class="flex items-start justify-between mb-4">
|
||||
<div>
|
||||
<h3 class="text-2xl font-bold text-green-300 mb-2">DroneKit API</h3>
|
||||
<div class="flex items-center gap-4 text-sm">
|
||||
<span class="text-green-400"><i class="fas fa-code-branch mr-1"></i> MIT License</span>
|
||||
<span class="text-gray-400"><i class="fab fa-github mr-1"></i> 1.2k stars</span>
|
||||
<span class="text-gray-400"><i class="fas fa-code mr-1"></i> Python</span>
|
||||
</div>
|
||||
</div>
|
||||
<a href="#" class="bg-green-600 text-white px-4 py-2 rounded-lg text-sm font-semibold hover:bg-green-500 transition">
|
||||
<i class="fab fa-github mr-1"></i> GitHub
|
||||
</a>
|
||||
</div>
|
||||
<p class="text-green-200 mb-4">
|
||||
High-level Python API for controlling drones. Simple scripting interface for autonomous missions, waypoint navigation, and real-time telemetry. Perfect for rapid prototyping.
|
||||
</p>
|
||||
<div class="flex flex-wrap gap-2">
|
||||
<span class="bg-green-900 text-green-300 px-3 py-1 rounded text-xs">Python 3.8+</span>
|
||||
<span class="bg-green-900 text-green-300 px-3 py-1 rounded text-xs">Asyncio</span>
|
||||
<span class="bg-green-900 text-green-300 px-3 py-1 rounded text-xs">REST API</span>
|
||||
<span class="bg-green-900 text-green-300 px-3 py-1 rounded text-xs">WebSocket</span>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- Project 6 -->
|
||||
<div class="bg-[#292b3d] p-8 rounded-xl hover-lift border border-green-600">
|
||||
<div class="flex items-start justify-between mb-4">
|
||||
<div>
|
||||
<h3 class="text-2xl font-bold text-green-300 mb-2">SimDrone</h3>
|
||||
<div class="flex items-center gap-4 text-sm">
|
||||
<span class="text-green-400"><i class="fas fa-code-branch mr-1"></i> Apache 2.0</span>
|
||||
<span class="text-gray-400"><i class="fab fa-github mr-1"></i> 650 stars</span>
|
||||
<span class="text-gray-400"><i class="fas fa-code mr-1"></i> C++/Python</span>
|
||||
</div>
|
||||
</div>
|
||||
<a href="#" class="bg-green-600 text-white px-4 py-2 rounded-lg text-sm font-semibold hover:bg-green-500 transition">
|
||||
<i class="fab fa-github mr-1"></i> GitHub
|
||||
</a>
|
||||
</div>
|
||||
<p class="text-green-200 mb-4">
|
||||
Physics-based drone simulation environment for testing and validation. Simulate sensors, weather conditions, and failure scenarios before real-world deployment.
|
||||
</p>
|
||||
<div class="flex flex-wrap gap-2">
|
||||
<span class="bg-green-900 text-green-300 px-3 py-1 rounded text-xs">Gazebo</span>
|
||||
<span class="bg-green-900 text-green-300 px-3 py-1 rounded text-xs">Unity3D</span>
|
||||
<span class="bg-green-900 text-green-300 px-3 py-1 rounded text-xs">SITL</span>
|
||||
<span class="bg-green-900 text-green-300 px-3 py-1 rounded text-xs">Physics Engine</span>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="repo-card">
|
||||
<div class="repo-card-top">
|
||||
<h3>ROS2 Middleware</h3>
|
||||
<div class="repo-stars">
|
||||
<svg width="13" height="13" viewBox="0 0 24 24" fill="currentColor" aria-hidden="true"><path d="M12 2l3.09 6.26L22 9.27l-5 4.87 1.18 6.88L12 17.77l-6.18 3.25L7 14.14 2 9.27l6.91-1.01L12 2z"/></svg>
|
||||
890
|
||||
</div>
|
||||
</div>
|
||||
<p class="repo-desc">ROS2 packages for drone control. Nodes, topics, and services covering navigation, sensors, and actuator control.</p>
|
||||
<div class="repo-meta">
|
||||
<span class="repo-lang">C++ / Python</span>
|
||||
<span class="repo-license">BSD-3</span>
|
||||
</div>
|
||||
<a href="#" class="btn-text" style="font-size:13px;margin-top:8px;">View on GitHub ↗</a>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<!-- Community -->
|
||||
<section class="py-16 px-6 bg-[#23243a]">
|
||||
<div class="max-w-5xl mx-auto">
|
||||
<h2 class="text-3xl font-bold text-green-300 mb-10 text-center">Join the Community</h2>
|
||||
|
||||
<div class="grid md:grid-cols-2 gap-8 mb-12">
|
||||
<div class="bg-[#292b3d] p-8 rounded-xl border border-green-700">
|
||||
<div class="flex items-center mb-4">
|
||||
<i class="fas fa-comments text-green-400 text-3xl mr-4"></i>
|
||||
<h3 class="text-2xl font-bold text-green-300">Discussion Forums</h3>
|
||||
</div>
|
||||
<p class="text-green-200 mb-6">
|
||||
Discuss AI models, share flight algorithms, troubleshoot issues, and collaborate on new features. Active community of 800+ developers.
|
||||
</p>
|
||||
<a href="#" class="inline-block bg-green-500 text-[#22223b] px-6 py-3 rounded-lg font-bold hover:bg-green-400 transition">
|
||||
Join Forums
|
||||
</a>
|
||||
</div>
|
||||
|
||||
<div class="bg-[#292b3d] p-8 rounded-xl border border-green-700">
|
||||
<div class="flex items-center mb-4">
|
||||
<i class="fab fa-discord text-green-400 text-3xl mr-4"></i>
|
||||
<h3 class="text-2xl font-bold text-green-300">Discord Server</h3>
|
||||
</div>
|
||||
<p class="text-green-200 mb-6">
|
||||
Real-time chat with developers, maintainers, and contributors. Get help, share projects, and participate in code reviews.
|
||||
</p>
|
||||
<a href="#" class="inline-block bg-green-500 text-[#22223b] px-6 py-3 rounded-lg font-bold hover:bg-green-400 transition">
|
||||
Join Discord
|
||||
</a>
|
||||
</div>
|
||||
<div class="repo-card">
|
||||
<div class="repo-card-top">
|
||||
<h3>DroneKit API</h3>
|
||||
<div class="repo-stars">
|
||||
<svg width="13" height="13" viewBox="0 0 24 24" fill="currentColor" aria-hidden="true"><path d="M12 2l3.09 6.26L22 9.27l-5 4.87 1.18 6.88L12 17.77l-6.18 3.25L7 14.14 2 9.27l6.91-1.01L12 2z"/></svg>
|
||||
1.2k
|
||||
</div>
|
||||
</div>
|
||||
<p class="repo-desc">High-level Python scripting interface for autonomous missions. Simple API, comprehensive docs, and example scripts.</p>
|
||||
<div class="repo-meta">
|
||||
<span class="repo-lang">Python</span>
|
||||
<span class="repo-license">MIT</span>
|
||||
</div>
|
||||
<a href="#" class="btn-text" style="font-size:13px;margin-top:8px;">View on GitHub ↗</a>
|
||||
</div>
|
||||
|
||||
<div class="bg-[#292b3d] p-8 rounded-xl border border-green-600 text-center">
|
||||
<h3 class="text-2xl font-bold text-green-300 mb-4">Want to Contribute?</h3>
|
||||
<p class="text-green-200 mb-6 max-w-2xl mx-auto">
|
||||
We welcome pull requests, bug reports, and feature suggestions. Check our contribution guidelines on GitHub and join our monthly contributor calls.
|
||||
</p>
|
||||
<div class="flex flex-col sm:flex-row gap-4 justify-center">
|
||||
<a href="#" class="bg-green-500 text-[#22223b] px-6 py-3 rounded-lg font-bold hover:bg-green-400 transition">
|
||||
<i class="fab fa-github mr-2"></i> Contribution Guide
|
||||
</a>
|
||||
<a href="#" class="border-2 border-green-500 text-green-400 px-6 py-3 rounded-lg font-bold hover:bg-green-500 hover:text-[#22223b] transition">
|
||||
<i class="fas fa-calendar mr-2"></i> Monthly Calls
|
||||
</a>
|
||||
</div>
|
||||
<div class="repo-card">
|
||||
<div class="repo-card-top">
|
||||
<h3>SimDrone</h3>
|
||||
<div class="repo-stars">
|
||||
<svg width="13" height="13" viewBox="0 0 24 24" fill="currentColor" aria-hidden="true"><path d="M12 2l3.09 6.26L22 9.27l-5 4.87 1.18 6.88L12 17.77l-6.18 3.25L7 14.14 2 9.27l6.91-1.01L12 2z"/></svg>
|
||||
650
|
||||
</div>
|
||||
</div>
|
||||
<p class="repo-desc">Physics-based simulation environment. Test firmware and autonomy code against realistic aerodynamics before maiden flight.</p>
|
||||
<div class="repo-meta">
|
||||
<span class="repo-lang">C++ / Python</span>
|
||||
<span class="repo-license">Apache 2.0</span>
|
||||
</div>
|
||||
<a href="#" class="btn-text" style="font-size:13px;margin-top:8px;">View on GitHub ↗</a>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<!-- Stats -->
|
||||
<section class="py-16 px-6 bg-[#1a1b2f]">
|
||||
<div class="max-w-4xl mx-auto">
|
||||
<h2 class="text-3xl font-bold text-green-300 mb-10 text-center">Community Impact</h2>
|
||||
<div class="grid md:grid-cols-4 gap-6">
|
||||
<div class="text-center">
|
||||
<div class="text-4xl font-bold text-green-400 mb-2">10k+</div>
|
||||
<div class="text-green-200">GitHub Stars</div>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<!-- QUICKSTART + COMMUNITY -->
|
||||
<section id="community" class="section section-dark">
|
||||
<div class="container">
|
||||
<div class="two-col">
|
||||
<div>
|
||||
<div class="eyebrow">Get started</div>
|
||||
<h2 class="section-title">Up and running in minutes.</h2>
|
||||
<p class="section-body">Clone a repo, spin up the simulator, and start flying — no hardware required to begin.</p>
|
||||
<div style="margin-top:34px;display:flex;flex-wrap:wrap;gap:13px;">
|
||||
<a href="#" class="btn btn-white btn-md">Read the docs</a>
|
||||
<a href="#" class="btn btn-ghost-dark btn-md">View on GitHub</a>
|
||||
</div>
|
||||
|
||||
<div style="margin-top:48px;border-top:1px solid rgba(255,255,255,0.12);padding-top:40px;">
|
||||
<div class="eyebrow" style="margin-bottom:20px;">Community</div>
|
||||
<div style="display:flex;flex-direction:column;gap:16px;">
|
||||
<div style="display:flex;align-items:center;gap:14px;">
|
||||
<div style="width:40px;height:40px;border-radius:10px;background:rgba(255,255,255,0.08);display:flex;align-items:center;justify-content:center;flex-shrink:0;">
|
||||
<svg width="18" height="18" viewBox="0 0 24 24" fill="none" stroke="rgba(255,255,255,0.7)" stroke-width="1.8" aria-hidden="true"><path d="M21 15a2 2 0 01-2 2H7l-4 4V5a2 2 0 012-2h14a2 2 0 012 2z"/></svg>
|
||||
</div>
|
||||
<div class="text-center">
|
||||
<div class="text-4xl font-bold text-green-400 mb-2">300+</div>
|
||||
<div class="text-green-200">Contributors</div>
|
||||
<div>
|
||||
<div style="font-size:15px;font-weight:600;color:#fff;">Discussion Forums</div>
|
||||
<div style="font-size:13px;color:rgba(255,255,255,0.5);margin-top:2px;">800+ active developers</div>
|
||||
</div>
|
||||
<div class="text-center">
|
||||
<div class="text-4xl font-bold text-green-400 mb-2">50+</div>
|
||||
<div class="text-green-200">Countries</div>
|
||||
</div>
|
||||
<div style="display:flex;align-items:center;gap:14px;">
|
||||
<div style="width:40px;height:40px;border-radius:10px;background:rgba(255,255,255,0.08);display:flex;align-items:center;justify-content:center;flex-shrink:0;">
|
||||
<svg width="18" height="18" viewBox="0 0 24 24" fill="none" stroke="rgba(255,255,255,0.7)" stroke-width="1.8" aria-hidden="true"><path d="M18 2h-3a5 5 0 00-5 5v3H7v4h3v8h4v-8h3l1-4h-4V7a1 1 0 011-1h3z"/></svg>
|
||||
</div>
|
||||
<div class="text-center">
|
||||
<div class="text-4xl font-bold text-green-400 mb-2">5k+</div>
|
||||
<div class="text-green-200">Deployments</div>
|
||||
<div>
|
||||
<div style="font-size:15px;font-weight:600;color:#fff;">Discord Server</div>
|
||||
<div style="font-size:13px;color:rgba(255,255,255,0.5);margin-top:2px;">Real-time help and discussion</div>
|
||||
</div>
|
||||
</div>
|
||||
<div style="display:flex;align-items:center;gap:14px;">
|
||||
<div style="width:40px;height:40px;border-radius:10px;background:rgba(255,255,255,0.08);display:flex;align-items:center;justify-content:center;flex-shrink:0;">
|
||||
<svg width="18" height="18" viewBox="0 0 24 24" fill="none" stroke="rgba(255,255,255,0.7)" stroke-width="1.8" aria-hidden="true"><circle cx="12" cy="12" r="10"/><polyline points="12 6 12 12 16 14"/></svg>
|
||||
</div>
|
||||
<div>
|
||||
<div style="font-size:15px;font-weight:600;color:#fff;">Monthly Contributor Calls</div>
|
||||
<div style="font-size:13px;color:rgba(255,255,255,0.5);margin-top:2px;">Roadmap, demos, and Q&A</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<!-- CTA -->
|
||||
<section class="circuit-bg py-16 px-6">
|
||||
<div class="max-w-3xl mx-auto text-center">
|
||||
<h2 class="text-3xl font-bold text-green-300 mb-6">Start Building with Open Source</h2>
|
||||
<p class="text-green-200 mb-8">
|
||||
Clone our repos, join the community, and start developing your drone applications today.
|
||||
</p>
|
||||
<div class="flex flex-col sm:flex-row gap-4 justify-center">
|
||||
<a href="#" class="bg-green-400 text-[#22223b] px-8 py-3 rounded-lg font-semibold hover:bg-green-500 transition">
|
||||
<i class="fab fa-github mr-2"></i> Browse Repositories
|
||||
</a>
|
||||
<a href="index.html" class="border-2 border-green-400 text-green-400 px-8 py-3 rounded-lg font-semibold hover:bg-green-400 hover:text-[#22223b] transition">
|
||||
<i class="fas fa-home mr-2"></i> Back to Home
|
||||
</a>
|
||||
</div>
|
||||
<div class="terminal">
|
||||
<div class="terminal-header">
|
||||
<span class="terminal-dot"></span>
|
||||
<span class="terminal-dot"></span>
|
||||
<span class="terminal-dot"></span>
|
||||
<span class="terminal-title">flightos — quickstart</span>
|
||||
</div>
|
||||
<div class="terminal-body" style="line-height:1.9;">
|
||||
<div><span class="t-prompt">$ </span>git clone github.com/bournemouth-tech/flightos</div>
|
||||
<div><span class="t-prompt">$ </span>cd flightos && make sim</div>
|
||||
<div><span class="t-arrow">→</span> simulator ready · models loaded</div>
|
||||
<span class="t-comment"># MIT licensed · fork it, fly it, ship it</span>
|
||||
<br>
|
||||
<div style="margin-top:20px;"><span class="t-prompt">$ </span>git clone github.com/bournemouth-tech/vision-suite</div>
|
||||
<div><span class="t-prompt">$ </span>pip install -r requirements.txt</div>
|
||||
<div><span class="t-prompt">$ </span>python detect.py --model yolo-drone-v3</div>
|
||||
<div><span class="t-arrow">→</span> inference engine ready · 15fps</div>
|
||||
<span class="t-comment"># Apache 2.0 · modify freely</span>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<!-- Footer -->
|
||||
<footer class="bg-[#22223b] text-gray-500 py-8 px-6 text-center text-sm border-t border-green-900">
|
||||
<div class="max-w-6xl mx-auto">
|
||||
<p class="mb-2">© 2025 Bournemouth Technology. Hardware, software, and consultancy for drone innovators.</p>
|
||||
<p>Open source. Modular. Built by developers, for developers.</p>
|
||||
<!-- CTA -->
|
||||
<section class="cta-band">
|
||||
<div class="container">
|
||||
<h2>Fork it. Fly it. Ship it.</h2>
|
||||
<p>All our software is free forever, MIT or Apache licensed. No strings attached.</p>
|
||||
<div class="cta-band-btns">
|
||||
<a href="#" class="btn btn-dark btn-lg">View on GitHub</a>
|
||||
<a href="devkits.html" class="btn btn-outline btn-lg">Get the hardware</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>
|
||||
</footer>
|
||||
<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="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="opensource.html">Discord</a>
|
||||
<a href="consultancy.html">Contact</a>
|
||||
<a href="videos.html">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>
|
||||
const mobileMenuBtn = document.getElementById('mobile-menu-btn');
|
||||
const mobileMenu = document.getElementById('mobile-menu');
|
||||
mobileMenuBtn.addEventListener('click', () => { mobileMenu.classList.toggle('hidden'); });
|
||||
document.querySelectorAll('a[href^="#"]').forEach(anchor => {
|
||||
anchor.addEventListener('click', function (e) {
|
||||
e.preventDefault();
|
||||
const target = document.querySelector(this.getAttribute('href'));
|
||||
if (target) {
|
||||
target.scrollIntoView({ behavior: 'smooth', block: 'start' });
|
||||
mobileMenu.classList.add('hidden');
|
||||
}
|
||||
});
|
||||
});
|
||||
</script>
|
||||
</body>
|
||||
</html>
|
||||
|
||||
Reference in New Issue
Block a user