374 lines
23 KiB
HTML
374 lines
23 KiB
HTML
<!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>
|
|
</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>
|
|
</div>
|
|
<button id="mobile-menu-btn" class="md:hidden text-gray-400">
|
|
<i class="fas fa-bars text-xl"></i>
|
|
</button>
|
|
</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>
|
|
</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>
|
|
</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>
|
|
</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>
|
|
|
|
<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>
|
|
</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 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 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 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>
|
|
</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>
|
|
</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>
|
|
</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>
|