-
Notifications
You must be signed in to change notification settings - Fork 0
Expand file tree
/
Copy pathindex.html
More file actions
185 lines (170 loc) · 11 KB
/
Copy pathindex.html
File metadata and controls
185 lines (170 loc) · 11 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
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<link rel="stylesheet" type="text/css" href="style.css">
<link href="https://fonts.googleapis.com/css?family=Caveat|Open+Sans:400,700" rel="stylesheet">
</head>
<body>
<!----------------------------Navigation + Header------------------------------------>
<header id="about">
<nav>
<a href="#about">About</a>
<a href="#school">Education</a>
<a href="#skills">Skills</a>
<a href="#projects">Projects</a>
<a href="#contact">Contact</a>
</nav>
<div class="content-wrap">
<img class="profile-img" src="./assets/profile-photo.png" alt="profile photo">
<div class="col-wide">
<h1>Fiona Sun</h1>
<h2>Software Engineer</h2>
<p>A computer science graduate student with a background in design</p>
<p>Fluent in spoken and written English</p>
</div>
<a href="assets/Resume.pdf" download class="btn download" target="_blank">Download PDF</a>
</div>
</header>
<main>
<!--------------------------------School----------------------------->
<section id="school" class="school">
<div class="sch-wrapper">
<h2>Education</h2>
<h3>University of Southern California</h3>
<p>Master of Science in <strong>Computer Science</strong></p>
<ul>
<li>Object-oriented Programming</li>
<li>System Design</li>
<li>Algorithms</li>
<li>Data Structures</li>
<li>Database Systems</li>
<li>Computer Networks</li>
<li>Information Retrival and Search Engines</li>
<li>Mobile Games</li>
</ul>
</div>
<!--------------------------------Skills------------------------------------->
<section id="skills" class="skills">
<div class="skills-wrapper">
<h2>Skills</h2>
<!-----------------------------Section 1--------------------------------->
<h3>Languages and Database</h3>
<ul>
<li><strong>Languages: </strong>C++, Java, Python, SQL, C#, JavaScript</li>
<li><strong>Backend Technologies: </strong>MySOL, PostgreSQL, MongoDB, Spring Boot</li>
<li><strong>Platforms: </strong>Lunr, Solr, AWS</li>
</ul>
<!-----------------------------Section 2--------------------------------->
<h3>Web Debelopment and Design Tools</h3>
<ul>
<li><strong>Web Technologies: </strong>HTML, CSS, JavaScript, React.js, Million.js, Bootstrap, jQuery</li>
<li><strong>Design: </strong>UI/UX Design, Figma, Canva</li>
<li><strong>Version Control: </strong>Git</li>
</ul>
<!-----------------------------Section 3--------------------------------->
<h3>Software Proficiency</h3>
<ul>
<li><strong>Game Development: </strong>Unity</li>
<li><strong>Graphic Design: </strong>Adobe Creative Suite, Illustrator, Photoshop</li>
<li><strong>Video Editing: </strong>Final Cut Pro</li>
</ul>
<!-----------------------------Section 4--------------------------------->
<h3>Other Technical Skiills</h3>
<ul>
<li><strong>Containerization: </strong>Docker</li>
<li><strong>3D Graphiics: </strong>WebGL</li>
<li><strong>Operating Systems: </strong>Linux, Ubuntu</li>
</ul>
</div>
</section>
<!--------------------------------Projects------------------------------------->
<section id="projects" class="projects">
<div class="work-wrapper">
<h2>Projects</h2>
<!----------------------------Proj 1----------------------------------->
<div class="job-wrapper">
<div>
<h3>Full Stack Development | Movie Review Application</h3>
<p><strong>Java, JavaScript</strong></p>
<p>May 2023 - Jun 2023</p>
</div>
<div Class="job-description">
<ul>
<li><p>Developed a scalable full stack movie review application utilizing MongoDB, Spring Boot, and React,
demonstrating proficiency in backend and frontend technologies.</p></li>
<li><p>Configured and managed a comprehensive range of 21 dependencies, including Spring Boot's core libraries
(such as Spring Boot Starter Data MongoDB and Spring Boot Starter Web) and frontend libraries and frameworks
(such as React Router and Bootstrap), ensuring seamless integration and efficient operation of the movie review
application. </p></li>
<li><p>Created RESTful endpoints using Spring Boot for managing movies and reviews, ensuring seamless data retrieval
and manipulation, showcasing a solid grasp of API development and data management. </p></li>
<li><p>Implemented a loosely coupled architecture, allowing possibility for independent evolution of the client and server code.
Implemented frontend interface and components using React, highlighting a strong ability in creating user-friendly UI/UX
and efficient component-based design.</p></li>
</ul>
<p>Languages: <strong>Java, JavaScript</strong></p>
<p>Key Technologies: <strong>MongoDB, Spring Boot, React</strong></p>
</div>
</div>
<!----------------------------Proj 2----------------------------------->
<div class="job-wrapper">
<div>
<h3>Game Design | Keyboard Warrior</h3>
<p><strong>C#</strong></p>
<p>Jan 2023 - Apr 2023</p>
</div>
<div Class="job-description">
<ul>
<li><p>Managed team dynamics, established a Game Design Document (GDD), ensured efficient team
communication via Discord, maintained updated game progress in the GDD on a weekly basis.</p></li>
<li><p>Led the design group and created game graphics, utilizing Adobe software to provide lightweight
vector-based sprites for appealing aesthetics and optimized performance in the Unity game engine.</p></li>
<li><p>Guided playtest sessions, collected player feedback, and updated WebGL builds regularly, driving
iterative enhancements for optimal game performance within the Unity game engine.</p></li>
<li><p>Organized the implementation of analytics in the game, justifying the relevance of statistics to game
improvement along with graphical representations of game data based on real-time player data.</p></li>
</ul>
<p>Language: <strong>C#</strong></p>
<p>Key Technologies: <strong>Unity, Illustrator, WebGL</strong></p>
</div>
</div>
<!----------------------------Proj 3----------------------------------->
<div class="job-wrapper">
<div>
<h3>Socket Programming | Course Registration System</h3>
<p><strong>C++</strong></p>
<p>Sep 2022 - Dec 2022</p>
</div>
<div Class="job-description">
<ul>
<li><p>Developed a client-server course registration system in C++, employing Socket Programming,
enabling users to access and query varied course information.</p></li>
<li><p>Implemented a sophisticated three-phase process that incorporated TCP for server connections,
while leveraging UDP for the transmission of user query information, culminating in a user-friendly
display of query results.</p></li>
<li><p>Implemented an advanced functionality to handle concurrent queries of multiple courses, allowing
users to access relevant information from various backend servers simultaneously.</p></li>
<li><p>Ensured full compatibility and smooth operation of the project on an Ubuntu virtual machine,
demonstrating proficiency in cross-platform development.</p></li>
</ul>
<p>Language: <strong>C++</strong></p>
<p>Key Technologies: <strong>Computer Networks, Ubuntu</strong></p>
</div>
</div>
</div>
</section>
</main>
<!-------------------------------Footer & Contact Info------------------------------>
<footer id="contact">
<div class="contact-wrapper">
<h2>Contact Me</h2>
<div class="contact-buttons">
<a href="mailto:214sun@gmail.com" target="_blank" rel="noopener"><image class="media-pic"src="assets/email.png"></a>
<a href="tel:12133730417" rel="noopener"><image class="media-pic"src="assets/telephone-call.png"></a>
<a href="https://www.linkedin.com/in/fiona-h-sun-20057224a/" target="_blank" rel="noopener"><image class="media-pic"src="assets/linkedin.png"></a>
</div>
</div>
</footer>
</body>
</html>