-
Notifications
You must be signed in to change notification settings - Fork 0
/
Copy pathindex.html
496 lines (470 loc) · 21.3 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
416
417
418
419
420
421
422
423
424
425
426
427
428
429
430
431
432
433
434
435
436
437
438
439
440
441
442
443
444
445
446
447
448
449
450
451
452
453
454
455
456
457
458
459
460
461
462
463
464
465
466
467
468
469
470
471
472
473
474
475
476
477
478
479
480
481
482
483
484
485
486
487
488
489
490
491
492
493
494
495
496
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0, minimum-scale=1.0" />
<meta http-equiv="X-UA-Compatible" content="ie=edge" />
<meta name="theme-color" content="#EC3558" />
<meta name="apple-mobile-web-app-status-bar-style" content="#EC3558" />
<meta name="og:type" content="website" />
<meta name="og:url" content="http://apps.uxsociety.org" />
<link rel="shortcut icon" href="logo.png" type="image/x-icon" />
<meta name="og:image" content="uxapps.jpg" />
<meta name="og:site_name" content="UX Society Officer Primer" />
<meta name="og:description" content="A primer to UXSoc's Officer positions. Apply to be an Officer at UX Society!" />
<meta name="description" content="A primer to UXSoc's Officer positions. Apply to be an Officer at UX Society!" />
<link href="https://fonts.googleapis.com/css?family=Roboto:300,400,500,700" rel="stylesheet" />
<!-- <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0/css/bootstrap.min.css"
integrity="sha384-Gn5384xqQ1aoWXA+058RXPxPg6fy4IWvTNh0E263XmFcJlSAwiGgFAW/dAiS6JXm" crossorigin="anonymous" /> -->
<!-- reset -->
<link rel="stylesheet" href="/stylesheets/minireset.css" />
<!-- new stylesheet -->
<link rel="stylesheet" href="/stylesheets/index.css" />
<link rel="stylesheet" href="/stylesheets/main.css" />
<title>UX Society Apps</title>
<!-- Global site tag (gtag.js) - Google Analytics -->
<script async src="https://www.googletagmanager.com/gtag/js?id=UA-40088075-7"></script>
<script>
window.dataLayer = window.dataLayer || [];
function gtag() {
dataLayer.push(arguments);
}
gtag("js", new Date());
gtag("config", "UA-40088075-7");
</script>
</head>
<body class="primer">
<div class="officer-primer">
<div class="header">
<figure class="header__logo-container">
<a href="index.html"><img src="logo.png" alt="" class="header__logo-image" /></a>
</figure>
<h1 class="header__item">EB Primer ‘20-’21</h1>
<a onclick="alert('Sorry applications are now closed')" class="header__apply-link"
style="cursor: pointer">Apply</a>
<!-- <a href="apply.html" class="header__apply-link">Apply</a> -->
</div>
<main>
<h1 class="title">EB APPLICATION PRIMER</h1>
<p class="main__spiel">
Hey UXer, we can‘t wait to welcome you to our UXSoc family! This
is a short primer listing the available executive board positions and
their accompanying duties for the
<span class="main__spiel--purple"> AY 2020-2021.</span>
Interested? Don‘t forget to apply!
</p>
<!-- Tab links -->
<div class="dept-tabs-flow">
<div class="dept-tabs">
<button class="dept-tablinks" onclick="openDept(event, 'dept-0')">
Top 3
</button>
<button class="dept-tablinks" onclick="openDept(event, 'dept-1')">
Design & Consultancy
</button>
<button class="dept-tablinks" onclick="openDept(event, 'dept-2')">
Engineering
</button>
<button class="dept-tablinks" onclick="openDept(event, 'dept-3')">
Human Resources
</button>
<button class="dept-tablinks" onclick="openDept(event, 'dept-4')">
Events
</button>
<button class="dept-tablinks" onclick="openDept(event, 'dept-5')">
Finance
</button>
<button class="dept-tablinks" onclick="openDept(event, 'dept-6')">
Marketing
</button>
<button class="dept-tablinks" onclick="openDept(event, 'dept-7')">
Externals
</button>
</div>
</div>
<div id="dept-0" class="dept-panel" id="defaultOpen">
<!-- top 3 -->
<div class="position-wrapper" style="padding-top: 4em;">
<div class="position-item">
<h1 class="position">President</h1>
<h2>The Chief Evangelist</h2>
<p>
The President is the
<strong>highest ranking executive</strong> in the organization.
He or she is in charge of
<strong>establishing the vision and mission</strong> for the
organization and making sure it can be translated to a portfolio
of projects and events during his/her term.
</p>
<p>
He or she is responsible for leading the growth of the entire
organization and also should be open to mentoring the next set
of leaders for the organization and he or she is responsible for
coordinating with LIONS and other offices.
</p>
<p>
It’s recommended that the President has the skills of effective
communication, persuasion, ability to handle conflict, good
judgment and past experience on leadership and team management.
</p>
</div>
</div>
<div class="position-wrapper">
<div class="position-item">
<h1 class="position">Executive Vice President</h1>
<h2>The Right Hand</h2>
<p>
The EVP is the right hand of the President. He or she fills in
the gaps the President cannot fill. Together with the President,
they are unbreakable in advocating User Experience.
</p>
<p>
He or she is the leader of all the vice presidents. He or she
should be deeply concerned with each of their growth and as much
as possible schedule individual consultations, hold honest
conversations, and find the root of the matter whenever they do
not perform well.
</p>
<p>
Your excellent work ethic, standards of quality, and can-do
attitude takes the organization far more than it could be
without you.
</p>
</div>
</div>
<div class="position-wrapper">
<div class="position-item">
<h1 class="position">Secretary General</h1>
<h2>The Chief Organizer & Project Manager</h2>
<p>
The SecGen is in charge of establishing an organized file
management system and having proper and appropriate
documentation. Also, the SecGen is the chief coordinator for all
tasks of the executive board member. He or she ensures that all
department heads are finishing their deliverables on time and
with quality.
</p>
<p>
Some responsibilities/tasks include setting up important
internal meetings while following respective agendas, creating
an organized Google Drive (or any other platform) available to
the team, and upholding standards of quality for org documents
</p>
<p>
It’s recommended that SecGen is detail-oriented, a team player,
a critical listener, and passionately champions quality
standards. Past experiences on quick and effective note-taking
is also recommended.
</p>
</div>
</div>
</div>
<div id="dept-1" class="dept-panel">
<!-- uxdc -->
<div class="position-wrapper">
<div class="position-item">
<h1 class="position">Vice President of User Experience Design</h1>
<h2>The Design Educator</h2>
<p>
The VP for UX Design is in charge of leading a team of designers
in creating digital products for clients.
</p>
<p>
He or she also ensures that UX design is effectively taught
throughout the organization.
</p>
<p>
It’s recommended that the VP for UX Design has past experience
not only in product design but also profound knowledge in user
research, visual design, and usability as well. The VP for UX
Design works hand in hand with the VP for Consultancy in
managing the UXDC team.
</p>
</div>
</div>
<div class="position-wrapper">
<div class="position-item">
<h1 class="position">Vice President of Consultancy</h1>
<h2>The Client Relations Executive</h2>
<p>
The VP for Consultancy is in charge of actively managing client
projects and ensuring that these are executed well from
deployment to turnover.
</p>
<p>
These projects will serve as a practice ground for the UXSoc
officers to help train their UI/UX design and dev’t skills.
Together with the VP of UX Design, their department is the main
source of income of UXSoc. Together they’re also in charge of
providing resources to those who are just learning about UX.
</p>
<p>
The VP of Consultancy must be ready to pitch the org’s services,
quote the right prices to clients, reasonably negotiate with
them, and deliver top-notch output quickly. It is ideal that
he/she has apt knowledge in freelancing for both design and
development in order to quote properly. More importantly, he/she
must be ready to adapt to the problems that may arise in every
project handled.
</p>
<p>
Some responsibilities of the VP of Consultancy is to coordinate
with all stakeholders of the projects, mentor officers and
members on UX design, assign projects to those who are fit for
the role, and deliver the project completely. He/she must be
responsible in overseeing these projects to ensure happy
officers and satisfied customers.
</p>
</div>
</div>
</div>
<div id="dept-2" class="dept-panel">
<!-- uxdev -->
<div class="position-wrapper">
<div class="position-item">
<h1 class="position">Vice President of Engineering</h1>
<h2>The Coding Sage</h2>
<p>
The VP for Engineering is in charge of transforming designs into
digital masterpieces that are usable, useful, and delightful.
</p>
<p>
This VP is the chief technological officer that manages all the
software engineering projects. He or she works hand in hand with
the designers and ensures that the projects are moving forward
as planned. This VP is also in charge of developing and honing
the programming skills of his/her developers.
</p>
<p>
It’s recommended that the VP for Engineering should have an
in-depth knowledge and experience in using the git flow and
programming front-end and back-end applications.
</p>
<p>
He or she should have a coding portfolio, meaning he or she has
already worked on other projects before. Moreover, the VP for
Engineering should also be meticulous in the code structure,
style and infrastructure.
</p>
</div>
</div>
</div>
<div id="dept-3" class="dept-panel">
<!-- uxhr -->
<div class="position-wrapper">
<div class="position-item">
<h1 class="position">Vice President of Human Resources</h1>
<h2>The Support Unit</h2>
<p>
The VP for HR is in charge of the recruitment, development, and
happiness of all members of UXSociety! Overseeing the AVPs of
Internal Management and Community Engagement, the VP ensures the
accomplishing of tasks while expressing empathy for others.
</p>
<p>
Responsibilities and tasks include activities and initiatives
concerning member bonding and research. This includes events
like RecWeek, Onboarding, Christmas Party, to initiatives like
internal posts, member contacting, and internal research for
community policies!
</p>
<p>
It’s recommended that the VP for HR have great writing skills
and planning skills, and be an organized and systematic person.
It’s also recommended that he/she have a passion for helping and
supporting others, whether through sharing resources or for
organizing fun activities.
</p>
</div>
</div>
</div>
<div id="dept-4" class="dept-panel">
<!-- uxevents -->
<div class="position-wrapper">
<div class="position-item">
<h1 class="position">Vice President of Events</h1>
<h2>The Event Experience Designer</h2>
<p>
The VP of Events is in charge of making sure the programs and
logistics of UXSoc's events are smooth and well-designed.
Moreover, he/ she is responsible for keeping the overall event
experience (both for audience and speaker) meaningful and
relevant.
</p>
<p>
He/she is an efficient planner and organizer of events. He/she
is familiar with Ateneo’s (rigorous) mechanisms with regards to
venue reservations and project proposals. If not, he/she is
ready to learn them, immerse in them, and give their soul to
them.
</p>
<p>
He/she knows how to deploy project teams, manage expectations
and motivations, and pick the right people for the right job.
</p>
<p>
The Events VP is in charge of working alongside the Finance
department to keep track of the budget of all events for the
year as well as to keep track of the expenses of each project or
event.
</p>
<p>
He/ she is also in charge of working with the Design &
Consultancy department to scout and assign relevant speakers for
each major event.
</p>
<p>
He/ she must also collaborate together with the Branding, Design
& Consultancy, Dev, and Content Marketing department to create a
lesson plan as well as assign relevant and appropriate speakers
for workshops.
</p>
<p>
Most importantly, the Events VP must advocate for User
Experience design. He/ she must encourage his/ her AVPs and
members to learn and practice User Experience design outside
Events (e.g. web development, design, etc.).
</p>
</div>
</div>
</div>
<div id="dept-5" class="dept-panel">
<!-- uxfin -->
<div class="position-wrapper">
<div class="position-item">
<h1 class="position">Vice President of Finance</h1>
<h2>The Money Lover</h2>
<p>
The VP of Finance keeps the organization running with enough
cash.
</p>
<p>
He/she keeps the organization’s financials in check, and creates
systems and processes to ensure that projects and expenses are
properly accounted for and there’s enough to go around!
</p>
<p>
He/she sets systems to track where our finances go. This VP is
obsessed with getting receipts, tallying expenses, and analyzing
our financial health so that we know how to maximize our funds
for the org’s growth!
</p>
<p>
This VP is often collaborating with the Consultancy and Design
department in order to secure payments from clients. It is not
unnatural for him/her to be handling MoA’s and other similar
documents. He/she is also able to keep track of expenses such as
hosting and domain management fees, SSL certificates, and more.
</p>
<p>
The Finance VP is also in charge of working alongside the Events
department to make sure that expenses for UXSoc’s projects and
events are properly accounted for and recorded!
</p>
<p>
The Finance department doesn’t need to just be all numbers and
systems! He/she can also be seen dabbling with the Branding
department to come up with the latest UX Merch that both speaks
of the org’s identity and generates cash for more projects and
events for the org!
</p>
</div>
</div>
</div>
<div id="dept-6" class="dept-panel">
<!-- uxmarketing -->
<div class="position-wrapper">
<div class="position-item">
<h1 class="position">Vice President of Marketing</h1>
<h2>The Trendsetter</h2>
<p>
The VP for Marketing is responsible for ensuring that the org is
well represented on all platforms and that the events, projects,
and initiative are both seen and heard.
</p>
<p>
They must help ensure that the org has a good reputation through
timely and sensible campaign strategies for all content and
promotional material.
</p>
<p>
It is recommended that they be able to juggle multiple projects
and teams as they will be overseeing and advising the branding
and content creation committees. This involves the tracking and
management of all content and output, ensuring their quality and
completion.
</p>
</div>
</div>
</div>
<div id="dept-7" class="dept-panel">
<!-- uxexternals -->
<div class="position-wrapper">
<div class="position-item">
<h1 class="position">Vice President of Externals</h1>
<h2>The User Experience Ambassador</h2>
<p>
The VP for Externals has the responsibility of being the face of
the organization and ensuring a good rapport to our dear
partners and sponsors, both long-term and short-term. The VP
works closely with departments that have major events and
projects.
</p>
<p>
This includes preparing sponsorship & media partnership
packages, emailing partners, assuring fulfillment of terms in
partnerships, and settling MOAs with the organization or
corporation partners in person.
</p>
<p>
He/she should have prior experience in the creation of MoAs, as
well as sponsorship and partnership packages. The VP should also
create a system to efficiently track the partnerships and
sponsorships ongoing for the organization, and foster the
development and skillsets of the AVPs of Sponsorships and
Partnerships.
</p>
</div>
</div>
</div>
</main>
<div class="footer">
Passionately made by UXSociety.
</div>
</div>
<!-- <script src="https://code.jquery.com/jquery-3.2.1.slim.min.js"
integrity="sha384-KJ3o2DKtIkvYIK3UENzmM7KCkRr/rE9/Qpg6aAZGJwFDMVNA/GpGFF93hXpG5KkN" crossorigin="anonymous">
</script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.12.9/umd/popper.min.js"
integrity="sha384-ApNbgh9B+Y1QKtv3Rn7W3mgPxhU9K/ScQsAP7hUibX39j7fakFPskvXusvfa0b4Q" crossorigin="anonymous">
</script>
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0/js/bootstrap.min.js"
integrity="sha384-JZR6Spejh4U02d8jOt6vLEHfe/JQGiRRSQQxSfFWpi1MquVdAyjUar5+76PVCmYl" crossorigin="anonymous">
</script> -->
<script src="./scripts/smooth-scroll.polyfills.min.js"></script>
<script type="text/javascript">
openDept(event, "dept-1");
function openDept(evt, deptName) {
// Declare all variables
var i, tabcontent, tablinks;
// Get all elements with class="tabcontent" and hide them
tabcontent = document.getElementsByClassName("dept-panel");
for (i = 0; i < tabcontent.length; i++) {
tabcontent[i].style.display = "none";
}
// Get all elements with class="tablinks" and remove the class "active"
tablinks = document.getElementsByClassName("dept-tablinks");
for (i = 0; i < tablinks.length; i++) {
tablinks[i].className = tablinks[i].className.replace(" active", "");
}
// Show the current tab, and add an "active" class to the button that opened the tab
document.getElementById(deptName).style.display = "block";
evt.currentTarget.className += " active";
}
</script>
<script>
var mybtn = document.getElementsByClassName("dept-tablinks")[0];
mybtn.click();
</script>
</body>
</html>