-
Notifications
You must be signed in to change notification settings - Fork 0
/
index.html
415 lines (381 loc) · 19.7 KB
/
index.html
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
234
235
236
237
238
239
240
241
242
243
244
245
246
247
248
249
250
251
252
253
254
255
256
257
258
259
260
261
262
263
264
265
266
267
268
269
270
271
272
273
274
275
276
277
278
279
280
281
282
283
284
285
286
287
288
289
290
291
292
293
294
295
296
297
298
299
300
301
302
303
304
305
306
307
308
309
310
311
312
313
314
315
316
317
318
319
320
321
322
323
324
325
326
327
328
329
330
331
332
333
334
335
336
337
338
339
340
341
342
343
344
345
346
347
348
349
350
351
352
353
354
355
356
357
358
359
360
361
362
363
364
365
366
367
368
369
370
371
372
373
374
375
376
377
378
379
380
381
382
383
384
385
386
387
388
389
390
391
392
393
394
395
396
397
398
399
400
401
402
403
404
405
406
407
408
409
410
411
412
413
414
415
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>ML-Scope Home</title>
<style>
:root {
--dark-blue: #1a365d;
--light-blue: #7db0e8;
--orange: #ff6b35;
}
body {
font-family: Arial, sans-serif;
line-height: 1.6;
color: var(--dark-blue);
margin: 0;
padding: 0;
background-color: #f0f8ff;
}
.container {
max-width: 800px;
margin: 0 auto;
padding: 20px;
}
nav {
background-color: var(--dark-blue);
padding: 10px 0;
width: 100%;
}
nav .container {
display: flex;
justify-content: space-between;
align-items: center;
}
.logo {
width: 50px;
height: 50px;
}
.nav-links a {
color: white;
text-decoration: none;
margin-left: 20px;
}
.nav-links a:hover {
color: var(--light-blue);
}
h1 {
text-align: center;
color: var(--dark-blue);
}
.project-container {
border: 1px solid var(--light-blue);
margin-bottom: 20px;
border-radius: 5px;
overflow: hidden;
background-color: white;
}
.project-header {
background-color: var(--light-blue);
padding: 10px;
cursor: pointer;
display: flex;
justify-content: space-between;
align-items: center;
transition: background-color 0.3s ease;
}
.project-header:hover {
background-color: #6a9fd4;
}
.project-header h2 {
margin: 0;
color: var(--dark-blue);
}
.project-content {
display: none;
padding: 20px;
}
.project-content.active {
display: block;
}
.toggle-icon::after {
content: "\25BC";
color: var(--dark-blue);
}
.project-header.active .toggle-icon::after {
content: "\25B2";
}
a {
color: var(--orange);
text-decoration: none;
text-decoration: underline;
}
a:hover {
text-decoration: underline;
}
.btn {
cursor: pointer;
background-color: var(--orange);
color: var(--dark-blue);
font-weight: 700;
border: none;
width: 200px;
height: 50px;
padding: 5px;
margin: 20px;
transition: 0.8s;
}
.btn:hover {
color: var(--orange);
background-color: var(--dark-blue);
}
</style>
</head>
<body>
<nav>
<div class="container">
<a href="index.html">
<img src="aida-logo.jpeg" alt="Logo" class="logo" />
</a>
<div class="nav-links">
<a href="index.html">Problems</a>
<a href="solutions.html">Solutions</a>
<a href="leaderboard.html">Leaderboard</a>
<a href="resources.html">Resources</a>
</div>
</div>
</nav>
<div class="container">
<h1>MLScope</h1>
<center>
<a target="_blank" href="https://forms.gle/zCq6EVG8kUSFHfxP8"
><button class="btn">Project 4 Submission</button></a
>
</center>
<div id="content"></div>
</div>
<script>
const problemsData = [
{
project: 1,
title: "House Price Prediction",
content: `
<p>In this task, the goal is to predict house prices in King County using a regression model. Given features like square footage, number of bedrooms, and location, you will utilize models to accurately estimate house prices. This involves data cleaning, model training/utilization, and model performance evaluation.</p>
<h4>Dataset:</h4>
<p><a href="https://www.kaggle.com/datasets/harlfoxem/housesalesprediction" target="_blank" rel="noopener noreferrer">House Sales Prediction Dataset</a></p>
<p>The dataset contains house sales data from King County, Washington. It has 21,613 rows and 21 columns, covering features like price, sqft_living, bedrooms, bathrooms, waterfront, and zip code, among others. The price column is the target variable, and the other features are used to predict house prices.</p>
<h4>Starter Notebook (not required to use):</h4>
<p><a href="https://colab.research.google.com/drive/1yhrpIwnvJ7ExjYacx-ixmRcW09JPn2rX?usp=sharing" target="_blank" rel="noopener noreferrer">Make a Copy to Use:</a></p>
<h4>Goals/tasks:</h4>
<ul>
<li>Clean dataset (remove unnecessary columns from the dataset to use it for regression)</li>
<li>Train/test split</li>
<li>Set up code for training model (using library of choice)</li>
<li>Train model with hyperparameters</li>
<li>Test model against test data</li>
</ul>
<h4>Potential Skills:</h4>
<h5>Starter</h5>
<ul>
<li>Linear Regression</li>
<li>scikit-learn</li>
</ul>
<h5>Bonus</h5>
<ul>
<li>Simple Decision Tree</li>
<li>Random Forest</li>
<li>PyTorch</li>
</ul>
<h4>Useful Package Documentation:</h4>
<ol>
<li><strong>NumPy</strong> (for numerical computations): <a href="https://numpy.org/doc/" target="_blank" rel="noopener noreferrer">NumPy Documentation</a></li>
<li><strong>pandas</strong> (for data manipulation): <a href="https://pandas.pydata.org/docs/" target="_blank" rel="noopener noreferrer">pandas Documentation</a></li>
<li><strong>scikit-learn</strong> (for model training and evaluation): <a href="https://scikit-learn.org/stable/documentation.html" target="_blank" rel="noopener noreferrer">scikit-learn Documentation</a></li>
<li><strong>matplotlib</strong> (for data visualization): <a href="https://matplotlib.org/stable/contents.html" target="_blank" rel="noopener noreferrer">matplotlib Documentation</a></li>
<li><strong>PyTorch</strong> (for deep learning-based models): <a href="https://pytorch.org/docs/stable/index.html" target="_blank" rel="noopener noreferrer">PyTorch Documentation</a></li>
</ol>
`,
},
{
project: 2,
title: "Heart Disease Classifier",
content: `
<p>In this task, the goal is to classify whether a given patient has heart disease using a classifier model. Given features like age, sex, chest pain type, blood pressure, etc. you will utilize models to accurately predict whether or not a patient has heart disease. This involves data cleaning, model training/utilization, and model performance evaluation.</p>
<h4>Dataset:</h4>
<p><a href="https://www.kaggle.com/datasets/johnsmith88/heart-disease-dataset" target="_blank" rel="noopener noreferrer">Heart Disease Classifier Dataset</a></p>
<p>The dataset contains heart data attributes from four medical databases (Cleveland, Hungary, Switzerland, Long Beach). It has 1026 rows and 15 columns, covering features like age, sex, chest pain type, blood pressure, among others. The target column is the target variable, where 1 = heart disease and 0 = no heart disease. For a full breakdown, you can view the kaggle description of the dataset.</p>
<h4>Starter Notebook (not required to use):</h4>
<p><a href="https://colab.research.google.com/drive/1oYpGxTEJN3fo4RInWTGrQIvfUrXqW67I?usp=sharing" target="_blank" rel="noopener noreferrer">Make a Copy to Use</a></p>
<h4>Goals/tasks:</h4>
<ul>
<li>Clean dataset (remove unnecessary columns from the dataset to use it for classification)</li>
<li>Train/test split</li>
<li>Set up code for training model (using library of choice)</li>
<li>Train model with hyperparameters</li>
<li>Test model against test data</li>
</ul>
<h4>Potential Skills:</h4>
<h5>Starter</h5>
<ul>
<li>Logistic Regression</li>
<li>SVM</li>
<li>scikit-learn</li>
</ul>
<h5>Bonus</h5>
<ul>
<li>Decision Tree</li>
<li>Random Forest Classifier</li>
<li>PyTorch</li>
<li>Neural Networks</li>
</ul>
<h4>Useful Package Documentation:</h4>
<ol>
<li><strong>NumPy</strong> (for numerical computations): <a href="https://numpy.org/doc/" target="_blank" rel="noopener noreferrer">NumPy Documentation</a></li>
<li><strong>pandas</strong> (for data manipulation): <a href="https://pandas.pydata.org/docs/" target="_blank" rel="noopener noreferrer">pandas Documentation</a></li>
<li><strong>scikit-learn</strong> (for model training and evaluation): <a href="https://scikit-learn.org/stable/documentation.html" target="_blank" rel="noopener noreferrer">scikit-learn Documentation</a></li>
<li><strong>matplotlib</strong> (for data visualization): <a href="https://matplotlib.org/stable/contents.html" target="_blank" rel="noopener noreferrer">matplotlib Documentation</a></li>
<li><strong>PyTorch</strong> (for deep learning-based models): <a href="https://pytorch.org/docs/stable/index.html" target="_blank" rel="noopener noreferrer">PyTorch Documentation</a></li>
</ol>
`,
},
{
project: 3,
title: "Benchmarking LLMs Against a Baseline Dataset",
content: `
<p>This project explores the crucial task of benchmarking Large Language Models (LLMs) against a baseline dataset. The goal is to evaluate LLM performance and analyze the impact of design choices and parameter tuning on model accuracy. By systematically comparing LLMs to a baseline, participants can gain insights into their strengths, weaknesses, and overall capabilities, aiding in selecting the most suitable LLM for specific applications.</p>
<h4>Dataset:</h4>
<p><a href="https://huggingface.co/datasets/gsm8k" target="_blank" rel="noopener noreferrer">GSM8K Dataset</a></p>
<p>The GSM8K dataset consists of 8,000 high-quality grade school math problems specifically designed to test LLM reasoning capabilities. The "main" version of the dataset is divided into train and test splits, with the test split containing 1,319 problems. Each problem contains a question and an answer in text format, and the challenge is to produce the correct numerical answer. The test split will be used for evaluating LLM performance.</p>
<h4>Starter Notebook:</h4>
<p><a href="https://colab.research.google.com/drive/1xWtiFpSRIUGO1a_24T1e_PtDQCEf-haF?usp=sharing" target="_blank" rel="noopener noreferrer">Make a Copy to Use</a></p>
<h4>Goals/tasks:</h4>
<ul>
<li>Set up API calls to interact with a given LLM model (LLaMa-3-8B)</li>
<li>Explore different prompt engineering techniques</li>
<li>Adjust model parameters and settings to optimize performance</li>
<li>Evaluate the model against the test dataset</li>
<li>Calculate the final accuracy and compare against the baseline</li>
</ul>
<h4>Potential Skills:</h4>
<h5>Starter</h5>
<ul>
<li>Prompt Engineering</li>
<li>API Integration</li>
<li>Text Normalization and Cleaning</li>
</ul>
<h5>Bonus</h5>
<ul>
<li>Advanced Parameter Tuning</li>
<li>Exploring Different LLM Architectures</li>
<li>Evaluation and Analysis Techniques</li>
</ul>
<h4>Useful Package Documentation:</h4>
<ol>
<li><strong>transformers</strong> (for LLM model interactions): <a href="https://huggingface.co/docs/transformers/index" target="_blank" rel="noopener noreferrer">Transformers Documentation</a></li>
<li><strong>datasets</strong> (for dataset loading and management): <a href="https://huggingface.co/docs/datasets/index" target="_blank" rel="noopener noreferrer">Datasets Documentation</a></li>
<li><strong>Replicate</strong> (for model hosting and API calls): <a href="https://replicate.com/docs/reference/http" target="_blank" rel="noopener noreferrer">Replicate Documentation</a></li>
<li><strong>re</strong> (for text processing): <a href="https://docs.python.org/3/library/re.html" target="_blank" rel="noopener noreferrer">Python re Documentation</a></li>
</ol>
`,
},
{
project: 4,
title: "MNIST Digit Classification",
content: `
<p>In this challenge, you'll work with the classic MNIST dataset to create a digit classification model. Beyond basic classification, you can tackle additional advanced challenges to enhance your model's capabilities and earn bonus points.</p>
<h4>Dataset:</h4>
<p><a href="https://www.tensorflow.org/api_docs/python/tf/keras/datasets/mnist/load_data" target="_blank" rel="noopener noreferrer">MNIST Dataset</a> (no need to specifiy 'path' parameter)</p>
<p>The MNIST database contains 60,000 training images and 10,000 testing images of handwritten digits. Each image is a 28x28 grayscale image of a single digit (0-9). This is a great dataset for learning the basics of neural networks and image classification.</p>
<h4>Starter Notebook (not required to use):</h4>
<p><a href="https://colab.research.google.com/drive/1zm01NpRwq4j2tQuqCDW70sUFzp5r6XKW?usp=sharing" target="_blank" rel="noopener noreferrer">Make a Copy to Use</a></p>
<h4>Basic Goals/tasks:</h4>
<ul>
<li>Load and preprocess the MNIST dataset</li>
<li>Design and implement a neural network architecture</li>
<li>Train the model with appropriate hyperparameters</li>
<li>Evaluate model performance on the test set</li>
<li>Visualize results and confusion matrix</li>
</ul>
<h4>[Optional]: Bonus Challenges (Choose any or do your own):</h4>
<h5>1. Confidence Scoring and Uncertainty</h5>
<ul>
<li>Implement confidence scoring for predictions</li>
<li>Visualize prediction uncertainty</li>
<li>Analyze cases with low confidence scores</li>
</ul>
<h5>2. Sequential Digits Recognition</h5>
<ul>
<li>Create synthetic sequences from MNIST digits (for example: 123 or 38183)</li>
<li>Implement RNN/LSTM architecture for sequence recognition</li>
<li>Train and evaluate on multi-digit sequences</li>
</ul>
<h5>3. Image-to-Equation Conversion</h5>
<ul>
<li>Generate simple mathematical equations using MNIST digits</li>
<li>Develop a pipeline to recognize and parse equations</li>
<li>Implement equation solving functionality</li>
</ul>
<h5>4. Stylized MNIST Digits</h5>
<ul>
<li>Apply various transformations to MNIST digits (rotations, noise addition, etc.)</li>
<li>Train model on augmented dataset</li>
<li>Evaluate robustness to different styles and transformations</li>
</ul>
<h4>Potential Skills:</h4>
<h5>Starter</h5>
<ul>
<li>Convolutional Neural Networks (CNNs)</li>
<li>PyTorch or TensorFlow</li>
<li>Basic Image Processing</li>
</ul>
<h5>Bonus</h5>
<ul>
<li>RNNs/LSTMs</li>
<li>Data Augmentation</li>
<li>Uncertainty Estimation</li>
<li>Advanced Architecture Design</li>
</ul>
<h4>Useful Package Documentation:</h4>
<ol>
<li><strong>PyTorch</strong>: <a href="https://pytorch.org/docs/stable/index.html" target="_blank" rel="noopener noreferrer">PyTorch Documentation</a></li>
<li><strong>TensorFlow</strong>: <a href="https://www.tensorflow.org/api_docs" target="_blank" rel="noopener noreferrer">TensorFlow Documentation</a></li>
<li><strong>OpenCV</strong>: <a href="https://docs.opencv.org/4.x/" target="_blank" rel="noopener noreferrer">OpenCV Documentation</a></li>
<li><strong>scikit-learn</strong>: <a href="https://scikit-learn.org/stable/documentation.html" target="_blank" rel="noopener noreferrer">scikit-learn Documentation</a></li>
</ol>
`,
},
];
const solutionsData = [
{
project: 1,
title: "House Price Prediction Solution",
content: `
<p>Solutions for Project 1 will be uploaded here after the submission deadline.</p>
`,
},
// Add more solution projects here as needed
];
function createProjectElement(projectData) {
const projectElement = document.createElement("div");
projectElement.className = "project-container";
projectElement.innerHTML = `
<div class="project-header">
<h2>Project ${projectData.project}: ${projectData.title}</h2>
<span class="toggle-icon"></span>
</div>
<div class="project-content">
${projectData.content}
</div>
`;
return projectElement;
}
function toggleProject(projectHeader) {
projectHeader.classList.toggle("active");
const content = projectHeader.nextElementSibling;
content.classList.toggle("active");
}
function loadContent(data) {
const contentDiv = document.getElementById("content");
contentDiv.innerHTML = "";
data.forEach((project, index) => {
const projectElement = createProjectElement(project);
contentDiv.appendChild(projectElement);
const projectHeader = projectElement.querySelector(".project-header");
projectHeader.addEventListener("click", () =>
toggleProject(projectHeader)
);
// Open the last project by default
if (index === data.length - 1) {
toggleProject(projectHeader);
}
});
}
// Determine which page to load based on the current URL
const currentPage = window.location.pathname.includes("solutions.html")
? "solutions"
: "problems";
loadContent(currentPage === "solutions" ? solutionsData : problemsData);
</script>
</body>
</html>