mirror of https://github.com/kortix-ai/suna.git
184 lines
6.7 KiB
HTML
184 lines
6.7 KiB
HTML
<!DOCTYPE html>
|
|
<html lang="en">
|
|
<head>
|
|
<meta charset="UTF-8">
|
|
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
|
<title>Understanding Artificial Intelligence</title>
|
|
<style>
|
|
body {
|
|
font-family: 'Segoe UI', Arial, sans-serif;
|
|
margin: 0;
|
|
padding: 20px;
|
|
background: linear-gradient(135deg, #f5f7fa 0%, #c3cfe2 100%);
|
|
}
|
|
.slide {
|
|
background: white;
|
|
margin: 20px auto;
|
|
padding: 40px;
|
|
border-radius: 15px;
|
|
box-shadow: 0 5px 15px rgba(0,0,0,0.1);
|
|
max-width: 800px;
|
|
transition: transform 0.3s ease;
|
|
}
|
|
.slide:hover {
|
|
transform: translateY(-5px);
|
|
}
|
|
.slide-title {
|
|
font-size: 36px;
|
|
color: #2c3e50;
|
|
margin-bottom: 30px;
|
|
border-bottom: 3px solid #3498db;
|
|
padding-bottom: 10px;
|
|
}
|
|
.content {
|
|
font-size: 24px;
|
|
line-height: 1.6;
|
|
}
|
|
.bullet-points {
|
|
font-size: 22px;
|
|
line-height: 1.8;
|
|
}
|
|
.bullet-points li {
|
|
margin-bottom: 15px;
|
|
padding-left: 10px;
|
|
}
|
|
.highlight {
|
|
color: #3498db;
|
|
font-weight: 600;
|
|
}
|
|
.icon {
|
|
margin-right: 10px;
|
|
color: #3498db;
|
|
}
|
|
@keyframes fadeIn {
|
|
from { opacity: 0; transform: translateY(20px); }
|
|
to { opacity: 1; transform: translateY(0); }
|
|
}
|
|
.slide {
|
|
animation: fadeIn 0.5s ease-out forwards;
|
|
}
|
|
.progress-bar {
|
|
position: fixed;
|
|
top: 0;
|
|
left: 0;
|
|
height: 4px;
|
|
background: #3498db;
|
|
width: 0;
|
|
transition: width 0.3s ease;
|
|
}
|
|
</style>
|
|
</head>
|
|
<body>
|
|
<div class="progress-bar" id="progressBar"></div>
|
|
|
|
<!-- Title Slide -->
|
|
<div class="slide">
|
|
<h1 class="slide-title" style="font-size: 48px; text-align: center;">Understanding Artificial Intelligence</h1>
|
|
<p style="text-align: center; font-size: 24px;">A Comprehensive Overview</p>
|
|
<p style="text-align: center; font-size: 18px; color: #666;">Exploring the Future of Technology</p>
|
|
</div>
|
|
|
|
<!-- What is AI? -->
|
|
<div class="slide">
|
|
<h2 class="slide-title">What is Artificial Intelligence?</h2>
|
|
<div class="content">
|
|
<p>Artificial Intelligence (AI) is the simulation of human intelligence by machines programmed to think and learn like humans.</p>
|
|
<ul class="bullet-points">
|
|
<li>🧠 Ability to learn from experience</li>
|
|
<li>🔄 Adapt to new inputs</li>
|
|
<li>🎯 Perform human-like tasks</li>
|
|
</ul>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- Types of AI -->
|
|
<div class="slide">
|
|
<h2 class="slide-title">Types of AI</h2>
|
|
<div class="content">
|
|
<ul class="bullet-points">
|
|
<li><span class="highlight">Narrow AI:</span> Designed for specific tasks (e.g., facial recognition, playing chess)</li>
|
|
<li><span class="highlight">General AI:</span> Human-level intelligence across various domains (still theoretical)</li>
|
|
<li><span class="highlight">Super AI:</span> Hypothetical AI surpassing human intelligence in all aspects</li>
|
|
</ul>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- Applications -->
|
|
<div class="slide">
|
|
<h2 class="slide-title">Real-World Applications</h2>
|
|
<div class="content">
|
|
<ul class="bullet-points">
|
|
<li>🏥 Healthcare diagnostics and drug discovery</li>
|
|
<li>🚗 Autonomous vehicles and transportation</li>
|
|
<li>🗣️ Virtual assistants (Siri, Alexa, Google Assistant)</li>
|
|
<li>💹 Financial trading and fraud detection</li>
|
|
<li>🏭 Manufacturing robotics and automation</li>
|
|
</ul>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- AI Technologies -->
|
|
<div class="slide">
|
|
<h2 class="slide-title">Key AI Technologies</h2>
|
|
<div class="content">
|
|
<ul class="bullet-points">
|
|
<li><span class="highlight">Machine Learning:</span> Systems that improve through experience</li>
|
|
<li><span class="highlight">Deep Learning:</span> Neural networks mimicking human brain function</li>
|
|
<li><span class="highlight">Natural Language Processing:</span> Understanding and generating human language</li>
|
|
<li><span class="highlight">Computer Vision:</span> Enabling machines to interpret visual world</li>
|
|
</ul>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- Future of AI -->
|
|
<div class="slide">
|
|
<h2 class="slide-title">The Future of AI</h2>
|
|
<div class="content">
|
|
<ul class="bullet-points">
|
|
<li>🎯 Enhanced personalization in services</li>
|
|
<li>🤖 Advanced robotics and automation</li>
|
|
<li>💊 Revolutionary healthcare solutions</li>
|
|
<li>🌆 Smart cities and infrastructure</li>
|
|
<li>🌍 Environmental protection and climate solutions</li>
|
|
</ul>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- Challenges -->
|
|
<div class="slide">
|
|
<h2 class="slide-title">Challenges and Considerations</h2>
|
|
<div class="content">
|
|
<ul class="bullet-points">
|
|
<li>⚖️ Ethical concerns and moral decisions</li>
|
|
<li>🔒 Privacy and data protection</li>
|
|
<li>💼 Workforce transformation and adaptation</li>
|
|
<li>⚠️ Bias and fairness in AI systems</li>
|
|
<li>🛡️ Safety and security concerns</li>
|
|
</ul>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- Conclusion -->
|
|
<div class="slide">
|
|
<h2 class="slide-title">Conclusion</h2>
|
|
<div class="content">
|
|
<p>AI is transforming our world and will continue to play an increasingly important role in shaping our future.</p>
|
|
<ul class="bullet-points">
|
|
<li>🚀 Rapid advancement in technology</li>
|
|
<li>🌐 Wide-ranging impact across industries</li>
|
|
<li>🤝 Need for responsible development and governance</li>
|
|
</ul>
|
|
</div>
|
|
</div>
|
|
|
|
<script>
|
|
// Progress bar functionality
|
|
window.onscroll = function() {
|
|
let winScroll = document.body.scrollTop || document.documentElement.scrollTop;
|
|
let height = document.documentElement.scrollHeight - document.documentElement.clientHeight;
|
|
let scrolled = (winScroll / height) * 100;
|
|
document.getElementById("progressBar").style.width = scrolled + "%";
|
|
};
|
|
</script>
|
|
</body>
|
|
</html> |