-
Notifications
You must be signed in to change notification settings - Fork 0
Expand file tree
/
Copy pathabout.html
More file actions
234 lines (220 loc) · 12.3 KB
/
about.html
File metadata and controls
234 lines (220 loc) · 12.3 KB
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
167
168
169
170
171
172
173
174
175
176
177
178
179
180
181
182
183
184
185
186
187
188
189
190
191
192
193
194
195
196
197
198
199
200
201
202
203
204
205
206
207
208
209
210
211
212
213
214
215
216
217
218
219
220
221
222
223
224
225
226
227
228
229
230
231
232
233
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>About | MAFBench</title>
<script src="https://cdn.tailwindcss.com"></script>
<link rel="stylesheet" href="styles/main.css">
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.4.0/css/all.min.css">
</head>
<body class="bg-white">
<!-- Navigation -->
<nav id="navbar" class="fixed top-0 w-full bg-white/95 backdrop-blur-sm shadow-sm z-50">
<div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8">
<div class="flex justify-between items-center h-16">
<div class="flex items-center">
<a href="index.html" class="text-2xl font-bold text-indigo-600">MAFBench</a>
</div>
<div class="hidden md:flex space-x-8 items-center">
<a href="index.html" class="text-gray-600 hover:text-indigo-600">Home</a>
<a href="design.html" class="text-gray-600 hover:text-indigo-600">Why Design Matters</a>
<div class="dropdown relative">
<a href="architecture/index.html" class="text-gray-600 hover:text-indigo-600 flex items-center">
Architecture Guide
<i class="fas fa-chevron-down ml-1 text-xs"></i>
</a>
<div class="dropdown-menu">
<a href="architecture/index.html">Overview</a>
<a href="architecture/single-agent.html">Single-Agent Characteristics</a>
<a href="architecture/multi-agent.html">Multi-Agent Characteristics</a>
<a href="architecture/environment.html">Environment</a>
</div>
</div>
<a href="results.html" class="text-gray-600 hover:text-indigo-600">Results</a>
<a href="mafbench.html" class="text-gray-600 hover:text-indigo-600">MAFBench</a>
<a href="paper.html" class="text-gray-600 hover:text-indigo-600">Paper & Code</a>
<a href="about.html" class="text-gray-900 font-medium hover:text-indigo-600">About</a>
</div>
<button id="mobile-menu-btn" class="md:hidden text-gray-600">
<i class="fas fa-bars text-xl"></i>
</button>
</div>
</div>
<div id="mobile-menu" class="hidden md:hidden bg-white border-t">
<div class="px-4 py-4 space-y-3">
<a href="index.html" class="block text-gray-600">Home</a>
<a href="design.html" class="block text-gray-600">Why Design Matters</a>
<div class="pl-2 border-l-2 border-gray-200">
<a href="architecture/index.html" class="block text-gray-900 font-medium mb-2">Architecture Guide</a>
<div class="pl-4 space-y-2">
<a href="architecture/index.html" class="block text-gray-600 text-sm">Overview</a>
<a href="architecture/single-agent.html" class="block text-gray-600 text-sm">Single-Agent Characteristics</a>
<a href="architecture/multi-agent.html" class="block text-gray-600 text-sm">Multi-Agent Characteristics</a>
<a href="architecture/environment.html" class="block text-gray-600 text-sm">Environment</a>
</div>
</div>
<a href="results.html" class="block text-gray-600">Results</a>
<a href="mafbench.html" class="block text-gray-600">MAFBench</a>
<a href="paper.html" class="block text-gray-600">Paper & Code</a>
<a href="about.html" class="block text-gray-900 font-medium">About</a>
</div>
</div>
</nav>
<!-- Hero Section -->
<section class="pt-32 pb-16 px-4 sm:px-6 lg:px-8 bg-gradient-to-b from-indigo-50 to-white">
<div class="max-w-4xl mx-auto text-center">
<h1 class="text-5xl md:text-6xl font-bold text-gray-900 mb-6">
About
</h1>
<p class="text-xl text-gray-600">
Understanding how architecture shapes multi-agent AI systems
</p>
</div>
</section>
<!-- Team -->
<section class="py-20 px-4 sm:px-6 lg:px-8 bg-white">
<div class="max-w-6xl mx-auto">
<h2 class="text-4xl font-bold text-center text-gray-900 mb-16">Research Team</h2>
<div class="grid md:grid-cols-3 gap-12">
<div class="text-center">
<div class="w-32 h-32 rounded-full overflow-hidden mx-auto mb-6 border-4 border-indigo-100">
<img src="abdelghnny.png" alt="Abdelghny Orogat" class="w-full h-full object-cover">
</div>
<h3 class="text-2xl font-bold text-gray-900 mb-2">
<a href="https://aorogat.github.io/" target="_blank" class="text-gray-900 hover:text-indigo-600 transition inline-flex items-center gap-2">
Abdelghny Orogat
<i class="fas fa-external-link-alt text-sm text-indigo-600"></i>
</a>
</h3>
<p class="text-gray-600 mb-4">Concordia University</p>
<p class="text-sm text-gray-500">Canada</p>
</div>
<div class="text-center">
<div class="w-32 h-32 bg-purple-100 rounded-full flex items-center justify-center mx-auto mb-6">
<i class="fas fa-user text-purple-600 text-5xl"></i>
</div>
<h3 class="text-2xl font-bold text-gray-900 mb-2">Ana Rostam</h3>
<p class="text-gray-600 mb-4">Concordia University</p>
<p class="text-sm text-gray-500">Canada</p>
</div>
<div class="text-center">
<div class="w-32 h-32 rounded-full overflow-hidden mx-auto mb-6 border-4 border-green-100">
<img src="essam.jpg" alt="Essam Mansour" class="w-full h-full object-cover">
</div>
<h3 class="text-2xl font-bold text-gray-900 mb-2">
<a href="http://emansour.com/" target="_blank" class="text-gray-900 hover:text-indigo-600 transition inline-flex items-center gap-2">
Essam Mansour
<i class="fas fa-external-link-alt text-sm text-indigo-600"></i>
</a>
</h3>
<p class="text-gray-600 mb-4">Concordia University</p>
<p class="text-sm text-gray-500">Canada</p>
</div>
</div>
</div>
</section>
<!-- Affiliation -->
<section class="py-20 px-4 sm:px-6 lg:px-8 bg-gray-50">
<div class="max-w-4xl mx-auto text-center">
<h2 class="text-4xl font-bold text-gray-900 mb-8">Affiliation</h2>
<div class="bg-white rounded-xl p-12 shadow-lg">
<div class="text-6xl mb-6">
<i class="fas fa-university text-indigo-600"></i>
</div>
<h3 class="text-3xl font-bold text-gray-900 mb-4">Concordia University</h3>
<p class="text-xl text-gray-600">Canada</p>
</div>
</div>
</section>
<!-- Mission -->
<section class="py-20 px-4 sm:px-6 lg:px-8 bg-white">
<div class="max-w-4xl mx-auto">
<h2 class="text-4xl font-bold text-center text-gray-900 mb-12">Our Mission</h2>
<div class="grid md:grid-cols-3 gap-6">
<div class="bg-indigo-100 p-6 rounded-lg text-center">
<div class="text-4xl mb-4">
<i class="fas fa-lightbulb text-indigo-600"></i>
</div>
<h3 class="text-xl font-bold text-gray-900 mb-3">Understanding Impact</h3>
<p class="text-gray-700">
Bridge the gap between framework adoption and architectural understanding.
</p>
</div>
<div class="bg-green-100 p-6 rounded-lg text-center">
<div class="text-4xl mb-4">
<i class="fas fa-tools text-green-600"></i>
</div>
<h3 class="text-xl font-bold text-gray-900 mb-3">Better Design</h3>
<p class="text-gray-700">
Translate research into actionable design principles for engineers.
</p>
</div>
<div class="bg-purple-100 p-6 rounded-lg text-center">
<div class="text-4xl mb-4">
<i class="fas fa-code-branch text-purple-600"></i>
</div>
<h3 class="text-xl font-bold text-gray-900 mb-3">Open Science</h3>
<p class="text-gray-700">
Open source benchmark enabling community collaboration and advancement.
</p>
</div>
</div>
</div>
</section>
<!-- Contact -->
<section class="py-20 px-4 sm:px-6 lg:px-8 bg-indigo-600">
<div class="max-w-4xl mx-auto text-center">
<h2 class="text-4xl font-bold text-white mb-6">Get in Touch</h2>
<p class="text-xl text-indigo-100 mb-8">
Have questions about the research, want to contribute, or need help with MAFBench?
</p>
<div class="flex flex-col sm:flex-row gap-4 justify-center">
<a href="https://github.com/CoDS-GCS/MAFBench" target="_blank" class="px-8 py-4 bg-white text-indigo-600 rounded-lg font-semibold text-lg hover:bg-gray-100 transition shadow-lg">
<i class="fab fa-github mr-2"></i> GitHub Issues
</a>
<a href="paper.html" class="px-8 py-4 bg-indigo-500 text-white rounded-lg font-semibold text-lg hover:bg-indigo-400 transition">
<i class="fas fa-envelope mr-2"></i> Contact via Paper
</a>
</div>
</div>
</section>
<!-- Footer -->
<footer class="bg-gray-900 text-gray-300 py-12 px-4 sm:px-6 lg:px-8">
<div class="max-w-7xl mx-auto">
<div class="grid md:grid-cols-4 gap-8 mb-8">
<div>
<h3 class="text-white font-bold text-lg mb-4">MAFBench</h3>
<p class="text-sm">A unified benchmark for evaluating multi-agent LLM frameworks.</p>
</div>
<div>
<h4 class="text-white font-semibold mb-4">Resources</h4>
<ul class="space-y-2 text-sm">
<li><a href="paper.html" class="hover:text-white">Paper</a></li>
<li><a href="mafbench.html" class="hover:text-white">Benchmark</a></li>
<li><a href="https://github.com/CoDS-GCS/MAFBench" target="_blank" class="hover:text-white">GitHub</a></li>
</ul>
</div>
<div>
<h4 class="text-white font-semibold mb-4">Learn</h4>
<ul class="space-y-2 text-sm">
<li><a href="architecture/index.html" class="hover:text-white">Architecture Guide</a></li>
<li><a href="results.html" class="hover:text-white">Results</a></li>
</ul>
</div>
<div>
<h4 class="text-white font-semibold mb-4">Connect</h4>
<ul class="space-y-2 text-sm">
<li><a href="about.html" class="hover:text-white">About</a></li>
<li><a href="https://github.com/CoDS-GCS/MAFBench" target="_blank" class="hover:text-white">GitHub</a></li>
</ul>
</div>
</div>
<div class="border-t border-gray-800 pt-8 text-center text-sm">
<p>© 2026 MAFBench. Research by Concordia University.</p>
</div>
</div>
</footer>
<script src="scripts/main.js"></script>
</body>
</html>