-
Notifications
You must be signed in to change notification settings - Fork 0
/
Copy pathacm-website.html
190 lines (176 loc) · 11.2 KB
/
acm-website.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
<!DOCTYPE HTML>
<!--
Dopetrope by HTML5 UP
html5up.net | @ajlkn
Free for personal and commercial use under the CCA 3.0 license (html5up.net/license)
-->
<html lang="en">
<head>
<!-- Google tag (gtag.js) -->
<script async src="https://www.googletagmanager.com/gtag/js?id=G-7V2T37B7CE"></script>
<script>
window.dataLayer = window.dataLayer || [];
function gtag(){dataLayer.push(arguments);}
gtag('js', new Date());
gtag('config', 'G-7V2T37B7CE');
</script>
<title>ACM Website - Janzen Molina</title>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1, user-scalable=no">
<link rel="stylesheet" href="assets/css/main.css">
</head>
<body class="no-sidebar is-preload">
<div id="page-wrapper">
<!-- Header -->
<section id="header">
<!-- Logo -->
<h1><a href="index.html">Janzen Molina</a></h1>
<!-- Nav -->
<nav id="nav">
<ul>
<li><a href="index.html">Home</a></li>
<li class="current">
<a href="#">UI/UX</a>
<ul>
<li><a href="acm-website.html">ACM at UCSD Website</a></li>
<li><a href="navassist.html">NavAssist</a></li>
<li><a href="civictechjobs.html">Civic Tech Jobs</a></li>
<li><a href="zoomredesign.html">Zoom Redesign</a></li>
</ul>
</li>
<li>
<a href="#">Beyond UI/UX</a>
<ul>
<!-- <li><a href="grove.html">Grove</a></li> -->
<li><a href="synposium.html">SYNposium</a></li>
<li><a href="vrexhibition.html">VR Exhibition Night</a></li>
<li><a href="eds124br.html">EDS 124BR</a></li>
</ul>
</li>
<li><a href="resume.html">Resume</a></li>
<li><a href="about.html">About</a></li>
</ul>
</nav>
</section>
<!-- Main -->
<section id="main">
<div class="container">
<!-- Content -->
<article class="box" style="background: #FBF3DB; text-align: center;"><header>
<h3>This work is still in progress: updates will be made to the site as development continues.</h3>
</header>
</article>
<article class="box post">
<a class="image featured"><img src="images/acmwebsite-banner.png" alt=""></a>
<header>
<h2>ACM at UCSD Website</h2>
<p>A computing club website that makes it easy and engaging to connect with other students</p>
</header>
<p>
<b>Team:</b> Faris Ashai (VP of Development), Tiffany Lee (Mentor), Janzen Molina (UI/UX Designer), Ryan Xu (UI/UX Designer), Trevor Kwan (Front End Developer), Raymond Sun (Front End Developer)
</p>
<section>
<header>
<h3>Challenge</h3>
</header>
<p>
For students, there are several options when it comes to uploading a resume, but with most options, they can only hope that their resume is viewed by recruiters and not immediately rejected by the perceived “automated resume screenings”. For this reason, many students tend to neglect trying to apply for jobs or internships out of fear of rejection or their assumptions that they would “never make it even if they tried”.
</p>
<h4>Objective</h4>
<p>
As fellow students that face these same hopes and fears, we were eager to develop a solution. Using ACM at UCSD’s vast network of recruiters and industry connections, we can add a resume upload feature to our membership website that helps bring more peace of mind in letting students know that their work is being recognized.
</p>
</section>
<section>
<header>
<h3>Stakeholders</h3>
</header>
<p>
<b>Primary stakeholders:</b> New and returning members of ACM at UCSD <br>
<b>Secondary stakeholders:</b> Club board members that want to upload a resume but also want to access the database of stored resumes to send to recruiters <br>
<b>Tertiary stakeholders:</b> Recruiters and other industry personnel that will interact with board members and receive the stored resumes
</p>
</section>
<section>
<header>
<h3>Research Questions</h3>
</header>
<p>
1. What are the needs of people looking to upload their resume on a website?<br>
2. What barriers stop students from uploading their resume to a website?<br>
3. On other websites, how do users upload their resume? What methods of uploading are students accustomed to?<br>
4. What prevents recruiters from seeing a student’s resume?<br>
5. What would make the process of handing off a resume from student to recruiter more transparent?<br>
</p>
</section>
<section>
<header>
<h3>Competitive Analysis</h3>
</header>
<p>Competitive analysis was done against 4 websites with features resembling that of a resume upload service:<br>
1. Indeed, an all-encompassing employment website for job seekers of all ages<br>
2. Handshake, a job site with specific resources for college students<br>
3. UCSD Employment, a career finder for UCSD students, alumni and general working professionals<br>
4. Jobscan, an applicant tracking system (ATS) resume checker<br></p>
<a href="images/acm-competitiveanalysis.png" target="_blank"><img class="article-image" style="width: 95%;" src="images/acm-competitiveanalysis.png" alt="Competitive analysis for resume upload"></a>
<p class="gallery-description">Competitive analysis table for resume upload feature<br>
<a href="https://www.figma.com/file/kGhZ2AK3emmP3CnCfvowlX/Portal---Mobile-and-Desktop-Redesign?node-id=817%3A2630" target="_blank">Link to Figma page</a>
<img class="article-image" style="width: 15%; margin-top: 2em;" src="images/acm-indeed.png" alt="Indeed logo">
<p class="gallery-description">Source: Wikimedia Commons</p>
<p>Indeed had the least friction for a user to upload a resume in terms of number of clicks while supporting the feature with encouraging external content. However, the broader scope of Indeed's target audience can be discouraging for students due to outside competition. Additionally, Indeed gave us no insight into uploading multiple resumes as the user's profile cannot hold more than one at a time.</p>
<img class="article-image" style="width: 20%; margin-top: 2em;" src="images/acm-handshake.png" alt="Handshake logo">
<p class="gallery-description">Source: Handshake</p>
<p>Meanwhile, Handshake gave us a better understanding of a proper multi-resume upload and table view that we could implement into the admin perspective. Additionally, the student-centric theme of the website gives us an idea of what to include in order to maintain user positivity towards sharing their resume with others. From a user's perspective, though, Handshake took the longest number of clicks which could prove to be frustrating for newer users.
<img class="article-image" style="width: 30%; margin-top: 2em;" src="images/acm-ucsdemployment.png" alt="UCSD Employment logo">
<p class="gallery-description">Source: employment.ucsd.edu</p>
<p>The UCSD Employment website demonstrated how to properly instill confidence in users by means of name recognition, which we can implement on our website through sponsorship brands. Beyond that, we found that there was an importance in creating some sort of direct contact with the company being contacted, which this website did not have.</p>
<img class="article-image" style="width: 20%; margin-top: 2em;" src="images/acm-jobscan.png" alt="Jobscan logo">
<p class="gallery-description">Source: Jobscan</p>
<p>Although not a directly related website, Jobscan helped the team imagine future experimental features in terms of what the users would be able to do with their resume. Additionally, the site allowed for uploading the resume directly from the landing page, which we can try to use on our own site in order to reduce time taken to complete the resume upload flow. The website also highlighted the importance of an aesthetically pleasing website as a variety of inconsistencies and glitches in the UI made it unappealing to use.</p>
</section>
<section>
<header>
<h3>Initial Prototypes</h3>
</header>
<p> These initial prototypes were made as a means of demonstrating to the development team how the first iteration of the feature should appear on the website. These are not yet based on user needs- instead, they were meant to maintain the style of the existing website.</p>
<a href="images/acm-initialuserside.png" target="_blank"><img class="article-image" style="width: 90%;" src="images/acm-initialuserside.png" alt="Initial user side for resume upload"></a>
<p class="gallery-description">Sample screen of user side for resume upload feature<br>
<a href="https://www.figma.com/proto/kGhZ2AK3emmP3CnCfvowlX/Portal---Mobile-and-Desktop-Redesign?node-id=794%3A2358&scaling=scale-down&page-id=716%3A2444&starting-point-node-id=794%3A2358&show-proto-sidebar=1" target="_blank">Link to Figma prototype</a>
</p>
<a href="images/acm-initialadminside.png" target="_blank"><img class="article-image" style="width: 90%; margin-top: 2em;" src="images/acm-initialadminside.png" alt="Initial admin side for resume upload"></a>
<p class="gallery-description">Sample screen of admin side for resume upload feature<br>
<a href="https://www.figma.com/proto/kGhZ2AK3emmP3CnCfvowlX/Portal---Mobile-and-Desktop-Redesign?node-id=898%3A3750&scaling=scale-down&page-id=716%3A2444&starting-point-node-id=898%3A3750&show-proto-sidebar=1" target="_blank">Link to Figma prototype</a>
</p>
</section>
<section>
<header>
<h3>Stakeholder Interviews</h3>
</header>
<p>
<i>To be displayed...</i>
</p>
</section>
</article>
</div>
</section>
<!-- Footer -->
<div id="copyright" class="index-copyright">
<ul class="social">
<li><a class="icon solid fa-envelope" href="mailto:[email protected]"><span class="label">Email</span></a></li>
<li><a class="icon brands fa-github" href="https://github.com/janzenmolina"><span class="label">GitHub</span></a></li>
<li><a class="icon brands fa-linkedin" href="https://www.linkedin.com/in/janzenmolina/"><span class="label">LinkedIn</span></a></li>
</ul>
<ul class="links">
<li>© Janzen Molina 2022</li><li>Design: <a href="http://html5up.net">HTML5 UP</a></li>
</ul>
</div>
</div>
<!-- Scripts -->
<script src="assets/js/jquery.min.js"></script>
<script src="assets/js/jquery.dropotron.min.js"></script>
<script src="assets/js/browser.min.js"></script>
<script src="assets/js/breakpoints.min.js"></script>
<script src="assets/js/util.js"></script>
<script src="assets/js/main.js"></script>
</body>
</html>