-
Notifications
You must be signed in to change notification settings - Fork 0
/
index.html
157 lines (144 loc) · 7.52 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
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<link rel="stylesheet" href="styles.css">
<title>Portfolio | Avik Samanta</title>
<script src="https://kit.fontawesome.com/3932f20917.js" crossorigin="anonymous"></script>
</head>
<body>
<div id="header">
<div class="container">
<nav>
<!-- link for logo, you will replace with your own-->
<h1>Avik Samanta</h1>
<ul>
<li><a href="#header">Home</a></li>
<li><a href="#about">About</a></li>
<li><a href="#research">Research</a></li>
<li><a href="#portfolio">Portfolio</a></li>
<!-- https://docs.google.com/presentation/d/1AsdUJ60gbWkJeIgOzj5S01GyPng6Oc2ciDfecLgdRyM/edit?usp=sharing -->
<!-- li - will be a link tag -->
<!-- a makes it a clickable link -->
</ul>
</nav>
<div class="header-text">
<p>Develop. Discover. </p>
<h1>My name is <span>Avik </span><br/>Samanta</h1>
</div>
</div>
</div>
<div id="about">
<div class="container">
<div class="row">
<div class = "about-col-1">
<img src="images/avik.jpg">
</div>
<div class = "about-col-2">
<h1 class="subs">About me</h1>
<p>What's up! I'm Avik. I'm a undergraduate student studying at UC Berkeley. I enjoy building full-stack apps and websites, and engaging with Cognitive Science research. I use data driven tools and machine learning to drive insights between brain waives, brain patterns, and human emotion. I am currently working on research for Berkeley's Center of Human Sleep Science and Devcom's US Army Research Laboratory. </p>
<div class="tab-titles">
<p class="tab-links active-link" onclick="opentab('skills')">Skills</p>
<p class="tab-links " onclick="opentab('experience')">Experience</p>
<p class="tab-links " onclick="opentab('education')">Education</p>
</div>
<div class="tab-contents active-tab" id="skills">
<ul>
<li><span>UI/UX</span><br>Designing Web/App interfaces</li>
<li><span>Web Development</span><br>Web app Development</li>
<li><span>App Development</span><br>Building Full stack apps</li>
<li><span>Data Science</span><br>Building Statistical Models</li>
</ul>
</div>
<div class="tab-contents" id="experience">
<ul>
<li><span>2023-Current</span><br>Undergraduate Research Assistant at The Center of Human Sleep Science</li>
<li><span>2023-Current</span><br>Undergraduate Research Assistant at RASCL - Relationships and Social Cognition Lab</li>
<li><span>2023-2024</span><br>Undergraduate Research Assistant at DEVCOM Army Research Laboratory</li>
<li><span>2022-Current</span><br>Software Developer at UCB Law IS&T Software Development</li>
</ul>
</div>
<div class="tab-contents" id="education">
<ul>
<li><span>2021-2025: Currently pursuing</span><br>University of California: Berkeley - BA Cognitive Science and Data Science, Minor in Computer Science </li>
</ul>
</div>
</div>
</div>
</div>
</div>
<!--- Research --->
<div id="research">
<div class="container">
<div class="row">
<div class="research-col1">
<img src="images/research_sample.png">
</div>
<div class="research-col2">
<h1 class="subs">Research Projects</h2>
<p class="none">I am currently pursuing undergraduate research in areas related to Cognitive Science, including behvioral psychology, emotional arousal, and sleep science. I work as a lab assistant for RASCL (Relationship and Social Cognition Lab) and CHSS (Center for Human Sleep Science), where I use data driven tools to gain insights from EEG data. Below is a link to my research portfolio:</p>
<a href="https://docs.google.com/presentation/d/1AsdUJ60gbWkJeIgOzj5S01GyPng6Oc2ciDfecLgdRyM/edit?usp=sharing" class="btn">Explore Research!</a>
</div>
</div>
</div>
</div>
<!--- Portfolio --->
<div id="portfolio">
<div class="container">
<h1 class="sub-title">Developer Portfolio</h1>
<h2>A collection of my various software development projects!</h2>
<div class="work-list">
<div class="work">
<img src="images/recap_logo.png" width="500" height="500">
<div class="layer">
<h3>Recap: Class Search App</h3>
<p>An app that helps you search for your next semester classes! Input your course code and school to get the overall difficulty and sentiment towards a class based on what others students' feelings towards the class. Features a backend that performs logistic regression on comments from a reddit database to determine the sentiment of a student's comment. Built with Python, Flask, and HTML/CSS</p>
<a href="https://recap-cigr.onrender.com"><i class="fa-solid fa-link"></i></a>
</div>
</div>
<div class="work">
<img src="images/bill_app.png" width="500" height="500">
<div class="layer">
<h3>Billing Calculator App</h3>
<p>An app that helps you split the bill at resturants! Takes the total bill, splits the cost based on the what the individual person payed, and takes into account tax and tip. Built with Javascript, and HTML/CSS</p>
<a href="https://lojikick.github.io/billing-calculator/billcalc_index.html"><i class="fa-solid fa-link"></i></a>
</div>
</div>
<div class="work">
<img src="images/calendar_app.png" width="500" height="500">
<div class="layer">
<h3>Event Calendar App</h3>
<p>An calendar app that helps you plan events across the year. Features functionality to post and delete events on days across the current year. Built with Javascript, and HTML/CSS</p>
<a href="https://lojikick.github.io/event_calendar/"><i class="fa-solid fa-link"></i></a>
</div>
</div>
</div>
</div>
</div>
</div>
<script>
var tablinks = document.getElementsByClassName("tab-links");
var tabcontents = document.getElementsByClassName("tab-contents");
function opentab(tabname){
for(tablink of tablinks){
tablink.classList.remove("active-link");
}
for(tabcontent of tabcontents){
tabcontent.classList.remove("active-tab");
}
event.currentTarget.classList.add("active-link");
document.getElementById(tabname).classList.add("active-tab");
}
</script>
<!-- <section class="intro" id="intro">
<div class="content">
<h2>Hi There,<br/> I'm Avik <span> Samantaaaa</span></h2>
</div>
<div class="image">
<img draggable="false" class="tilt" src="avik_beach_circle.png" alt="">
</div>
</section> -->
</body>
</html>