Kyungsun4.github.io/index.html at master · KyungSun4/Kyungsun4.github.io · GitHub

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
<!DOCTYPE html>
<html>

<head>
  <link href="main.css" rel="stylesheet">
  <title>
    John Han
  </title>
  <!-- Global site tag (gtag.js) - Google Analytics -->
  <script async src="https://www.googletagmanager.com/gtag/js?id=UA-119528889-1"></script>
  <script>
    window.dataLayer = window.dataLayer || [];

    function gtag() {
      dataLayer.push(arguments);
    }
    gtag('js', new Date());

    gtag('config', 'UA-119528889-1');
  </script>

</head>


<body>
  <ul class="social-icons icon-circle icon-rotate list-unstyled list-inline">
    <li class="icon" id="fa-github"><a href="https://www.github.com/kyungsun4"><i class="fa fa-github" ></i></a></li>
    <li class="icon" id="fa-linkedin"><a href="https://www.linkedin.com/in/john-h-b04840bb/"><i class="fa fa-linkedin" ></i></a></li>
    <li class="icon" id="fa-youtube"><a href="https://www.youtube.com/channel/UC1xVlqhh7ajkc0yOgImm0eg"><i class="fa fa-youtube" ></i></a></li>
  </ul>
  <div id="loadBack"></div>
  <div id="wavediv">
    <wave id="a"></wave>
    <wave id="c"></wave>
    <wave id="e"></wave>
    <wave id="g"></wave>
    <wave id="i"></wave>
    <wave id="k"></wave>
    <wave id="m"></wave>
    <wave id="o"></wave>
    <wave id="q"></wave>
  </div>
  <img class="titleImg" src="john.png">
  <ul id="homeul">
    <li class="homeli fadeinb" id="resumes"><a class="button" href="Resume.pdf">Resume</a></li>
    <li class="homeli fadeinb" id="projects"><a class="button" href="#projects">Projects</a></li>
    <li class="homeli fadeinb" id="abouts"><a class="button" href="#about">About</a></li>
    <li class="homeli fadeinb" id="contacts"><a class="button" href="#contact">Contact</a></li>
  </ul>
  <br>

  <div class="projects">
    <div class="title">PROJECTS</div>
    <div class="project" num="0">
      <h2>Owl Tutoring</h2>
      <div class="description">A tutoring company established in 2016 to provide affordable peer tutors. As a part of the company I focus on the technical and financial parts of the company. This work involves processing payments, paying tutors, and organizing information. In
        order to do this efficiently, I have automated many of these processes.</div>
      <div class="info-container">
        <div class="left3">Founded 2016</div>
        <div class="center3"><a href="https://www.owltutoring.co">owltutoring.co</a></div>
        <div class="right3"><a href="https://github.com/owltutoring">GitHub</a></div>
      </div>
    </div>
    <div class="project" num="1">
      <h2>CS 196 Project r/place game</h2>
      <div class="description">As a class project we wrote a multiplayer online game inspired by the subreddit <a href="https://reddit.com/r/place">r/place.</a> This game combines the multiuser aspects of r/place into a war strategy game. This project was created as a Node.js
        application that uses MongoDB to store game information. The project also includes user accounts and encrypts user passwords. Live gameplay is updated to the client side using socket.io. More information can be found on the <a href='https://github.com/CS196Illinois/r-place-game/blob/master/README.md'>GitHub Readme</a></div>
      <div class="info-container">
        <div class="left3">2017</div>
        <div class="center3"><a href="http://r-place-game.herokuapp.com/">r-place-game.herokuapp.com</a></div>
        <div class="right3"><a href="https://github.com/CS196Illinois/r-place-game">GitHub</a></div>
      </div>
    </div>
    <div class="project" num="2">
      <h2>im_bot-hi_bot Reddit Bot</h2>
      <div class="description">A reddit bot that greats people when then introduces themselves by saying I'm ____. The bot will then respond to replies. Uses praw python library. The account was suspended from reddit after making thousands of comments and receiving 18,000 comment
        karma. No new account was created.
      </div>
      <div class="info-container">
        <div class="left3">2018</div>
        <div class="center3"><a href="https://www.reddit.com/r/BlackPeopleTwitter/comments/86r2aj/court_was_lit_like_judge_mathis/dw7eb4n/">reddit</a></div>
        <div class="right3"><a href="https://github.com/KyungSun4/im_bot-hi_bot">GitHub</a></div>
      </div>
    </div>
    <div class="project" num="3">
      <h2>Illini Solar Car</h2>
      <div class="description"> As a member of the Illini Solar Car Team I have worked on analyzing race data using python to better understand the cars performance. After this, I have been working on a race simulation and neural network to better determine race strategy based
        on road and weather conditions. Due to the competitive nature of the team, the code for these projects is not publicly available.
      </div>
      <div class="info-container">
        <div class="left3">2017-Present</div>
        <div class="center3"><a href="http://illinisolarcar.com/">illinisolarcar.com</a></div>
        <div class="right3"><a href="https://github.com/IlliniSolarCar">GitHub</a></div>
      </div>
    </div>
    <div class="project" num="4">
      <h2>iRobotics Combotics Team</h2>
      <div class="description">
        As a member of the <a href="http://irobotics.illinois.edu/">iRobotics</a> Combotics team at the University of Illinois I worked with a team to design and build a remote control robot for the <a href="http://robobrawl.engineering.illinois.edu/">Robobrawl</a>        competition at <a href="https://www.eoh.ec.illinois.edu/">EOH<a>
      </div>
      <div class="info-container">
        <div class="left3">2017-Present</div>
        <div class="center3"><a href="http://irobotics.illinois.edu/freshman-combots-post-eoh-wrapup/">Freshman Year Review</a></div>
      <div class="right3"><a href="https://youtu.be/9mccnIR-VmY?t=14m5s">Video</a></div>
    </div>
  </div>
  <div class="project" num="5">
    <h2>Fleets/pirates (work in progress)</h2>
    <div class="description">
      A multiplayer online game I designed with my brother who created all the game artwork. Players build their fleets and sail them around the map fighting other ships. While this game is incomplete is it playable. The time of completion of this project is
      unknown as much of the code would likely have to be rewritten for it to be manageable.
    </div>
    <div class="info-container">
      <div class="left3">2016</div>
      <div class="center3"><a href="http://fleetsio.herokuapp.com/">fleetsio.herokuapp.com</a></div>
      <div class="right3"><a href="https://github.com/KyungSun4/pirates">GitHub</a></div>
    </div>
  </div>
  <div class="project" num="6">
    <h2>BattleCode</h2>
    <div class="description">
      A month long team coding competition run every year by MIT to design an AI to play against other teams. For our bot we coded in Java.
    </div>
    <div class="info-container">
      <div class="left3">2017, 2018</div>
      <div class="center3"><a href="http://battlecode.org">battlecode.org</a></div>
      <div class="right3"><a href="https://github.com/JeffreyZh4ng/battlecode-2018-final">GitHub</a></div>
    </div>
  </div>
  <div class="project" num="3">
    <h2>3D Print Designs</h2>
    <div class="info-container">
      <div class="left3"><a href="https://www.thingiverse.com/KyungSun/designs">Thingiverse</a></div>
    </div>
  </div>
  <div class="project" num="7">
    <h2>Tap Tap</h2>
    <div class="description">
      A multiplayer single device touchscreen web-game. Up to 10 players race to tap as fast as they can. One player is eliminated each round until only one winner remains.
    </div>
    <div class="info-container">
      <div class="left3">2015</div>
      <div class="center3"><a href="http://jkhan.altervista.org/Tap/index.html">Tap Tap</a></div>
    </div>
  </div>
  <div class="project" num="8">
    <h2>Oh Nice!</h2>
    <div class="description">
      A web game to test your ability to decode poorly spelled text messages.
    </div>
    <div class="info-container">
      <div class="left3">2016</div>
      <div class="center3"><a href="http://jkhan.altervista.org/ohnice/index.html">Oh Nice!</a></div>
    </div>
  </div>
  <div class="project" num="9">
    <h2>Krys Game (incomplete)</h2>
    <div class="description">
      An abandoned HTML5 web game where the player faces multiple levels and battles various armies throughout history.
    </div>
    <div class="info-container">
      <div class="left3">2015</div>
      <div class="center3"><a href="http://jkhan.altervista.org/krysGame/index.html">Krys Game</a></div>
    </div>
  </div>
  <div class="project" num="10">
    <h2>Color Snake</h2>
    <div class="description">
      A simple colorful version of the snake game.
    </div>
    <div class="info-container">
      <div class="left3">2014</div>
      <div class="center3"><a href="http://jkhan.altervista.org/snake.html">Color Snake</a></div>
    </div>
  </div>
  <div class="project" num="11">
    <h2>GameSalad Games</h2>
    <div class="description">
      Gamesalad is a drag and drop game programing application. Besides some simple Lego Mindstorms programs, this is how I first learned how to code.
    </div>
    <div class="info-container">
      <div class="left3">2013-2015</div>
      <div class="center3"><a href="http://arcade.gamesalad.com/p/gamemaker123456789">GameSalad Profile</a></div>
    </div>
  </div>
  </div>
  <div class="abouts">
    <div class="about" num="0">
      <h2>About</h2>John Han is a student studying computer engineering at the University of Illinois Urbana-Champaign.</div>
  </div>
  <div class="contacts">
    <div class="contact" num="0">
      <h2>Contact</h2>Call or text: <a href="sms://+12248149291">(224) 814-9291</a><br>Email: <a href="mailto:jsh3@illinois.edu">jsh3@illinois.edu</a></div>
  </div>
  <div class="back" id="projectsback"></div>
  <div class="back" id="resumesback"></div>
  <div class="back" id="aboutsback"></div>
  <div class="back" id="contactsback"></div>

</body>
<footer>John Han
  <script type="text/javascript">
    document.write(new Date().getFullYear());
  </script><br><a href="index.html">home<a></footer>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script>
<script src="javascript.js"></script>
<script src="http://code.jquery.com/color/jquery.color-2.1.2.min.js"></script>
<link href="https://fonts.googleapis.com/css?family=Anonymous+Pro|Cousine|Nixie+One|Share+Tech+Mono" rel="stylesheet">
<link href="http:////netdna.bootstrapcdn.com/font-awesome/4.0.3/css/font-awesome.css" rel="stylesheet">


</html>