-
Notifications
You must be signed in to change notification settings - Fork 0
/
Copy pathindex.html
383 lines (362 loc) · 23.1 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
<!DOCTYPE html>
<html lang="en">
<head>
<title>Portfolio - Amanda Alling Andrén</title>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8"/>
<meta name="viewport" content="width=device-width, initial-scale=1"/>
<link href="https://fonts.googleapis.com/icon?family=Material+Icons" rel="stylesheet">
<link rel="stylesheet" href="https://cdn.rawgit.com/konpa/devicon/df6431e323547add1b4cf45992913f15286456d3/devicon.min.css">
<link href="css/materialize.css" type="text/css" rel="stylesheet" media="screen,projection"/>
<link href="css/style.css" type="text/css" rel="stylesheet" media="screen,projection"/>
<script src="https://code.jquery.com/jquery-3.3.1.js" integrity="sha256-2Kok7MbOyxpgUVvAk/HJ2jigOSYS2auK4Pfzbm7uH60=" crossorigin="anonymous"></script>
<script>
$(function(){
$("#header").load("partials/header.html", function onclick(){
$('.sidenav').sidenav();
});
$("#fab").load("partials/fab.html", function onclick(){
$('.fixed-action-btn').floatingActionButton();
});
$("#footer").load("partials/footer.html");
});
</script>
<script src="https://code.jquery.com/jquery-2.1.1.min.js"></script>
<script src="js/materialize.js"></script>
<script src="js/init.js"></script>
<script src="https://kit.fontawesome.com/a98657c293.js" crossorigin="anonymous"></script>
<link rel="stylesheet" href="https://pro.fontawesome.com/releases/v5.10.0/css/all.css" integrity="sha384-AYmEC3Yw5cVb3ZcuHtOA93w35dYTsvhLPVnYs9eStHfGJvOvKxVfELGroGkvsg+p" crossorigin="anonymous"/>
<link rel="stylesheet" href="https://cdn.jsdelivr.net/gh/devicons/[email protected]/devicon.min.css">
<link rel="preconnect" href="https://fonts.gstatic.com">
<link href="https://fonts.googleapis.com/css2?family=Montserrat:wght@300;700&family=Press+Start+2P&display=swap" rel="stylesheet">
<link rel="shortcut icon" type="image/x-icon" href="images/favicon.ico"/>
<!-- Global site tag (gtag.js) - Google Analytics -->
<script async src="https://www.googletagmanager.com/gtag/js?id=G-YHSY0Z59GP"></script>
<script>
window.dataLayer = window.dataLayer || [];
function gtag(){dataLayer.push(arguments);}
gtag('js', new Date());
gtag('config', 'G-YHSY0Z59GP');
</script>
</head>
<body>
<header>
<div id="header"></div>
</header>
<!-- fixed action button FAB-->
<div id="fab"></div>
<!-- welcome -->
<div id="index-banner" class="parallax-container" id="top">
<div class="container">
<div class="row center">
<div class="col s12 center">
<h1 id="smaller-header" class="game-header text-darken-4" >I'm Amanda<span class="blinking-cursor" style="font-size:40px;">|</span></h1>
<h1 id="normal-header" class="game-header text-darken-4" style="margin-top:50px;">I'm Amanda<span class="blinking-cursor">|</span></h1>
<h4 class="tagline light white-text" style="padding-top:0px;margin-top:20px;">Game UX Researcher and Release Manager</h4>
<!-- <a href="#projects" class="btn-large waves-effect waves-light">See projects</a> -->
<br><a href="#projects" ><i id="link_btn" class="large material-icons">keyboard_arrow_down</i></a>
</div>
</div>
</div>
<div class="parallax"><img src="images/background1.png" alt="background image, pretty much just pixelated gray"></div>
</div>
<!-- welcome icon section -->
<div class="parallax-container divider-block">
<div class="container">
<!-- <div class="section"> -->
<div class="row center" style="margin-bottom: 0;">
<div class="col s12 hide-on-large-screen">
<img alt="A picture of me! Red hair, black glasses, big smile :)" id="my-photo" src="images/amanda1.jpg" style="margin-top:30px" class="circle responsive-img materialboxed">
</div>
<div class="col s12 m4">
<div class="icon-block">
<h2><i class="fas fa-user-friends welcome-icons"></i></h2>
<h4>User Research Enthusiast</h4>
<p class="light flow-text no-margain-bottom">
Leveraging strong analytical skills and playtest data to identify player needs, refine experiences, and inform design improvements that enhance gameplay.
<!-- I analyze and interpret data from playtests and player feedback to inform design decisions. I sort insights, present statistics, and identify key issues and solutions. -->
<!-- I create accessible & engaging solutions that fit your target audience, by researching, observing, and testing -->
</p>
</div>
</div>
<div class="col s12 m4 hide-on-small-screen">
<img alt="A picture of me! Red hair, black glasses, big smile :)" id="my-photo" src="images/amanda1.jpg" style="padding:30px;" class="circle responsive-img center">
</div>
<div class="col s12 m4">
<div class="icon-block">
<h2><i class="fas fa-gamepad welcome-icons"></i></h2>
<h4>Release Champion</h4>
<p class="light flow-text">
With a knack for project management, I streamline complex game releases, coordinating teams and balancing multiple projects to ensure smooth launches and post-release success.
<!-- As a lifelong gamer (PC/VR/console/mobile/tabletop), I have insights on how to create a great experience -->
</p>
</div>
</div>
<!-- <div class="col s12 m4">
<div class="icon-block">
<h2 class="center"><i class="fas fa-swords welcome-icons"></i></h2>
<h4 class="center">Challenge Lover</h4>
<p class="light flow-text left-align">I love to learn and explore new solutions and tools, and I thrive on challenge - there's always room for improvement</p>
</div>
</div> -->
</div>
<!-- </div> -->
</div>
</div>
<!-- projects section -->
<!-- <div class="parallax-container" id="projects">
<div class="parallax img-overlay"><img src="images/projects/ftg/ftg_background.jpg"></div>
<div class="container">
<a href="ftg" target="_blank"> -->
<!-- <a href="paxdei"> -->
<!-- <div class="card-background card-border card row hoverable rounded_corners large-screen-margin">
<div class="col s12 m12 l10 offset-l1">
<div class="center">
<img src="images/projects/ftg/ftg_logo.png" alt="Mainframe Industries Logo" class="img-half-out hide-on-small-screen">
</div>
<h4 style="padding-top:10px">Fast Travel Games</h4>
<p class="light flow-text" style="margin-bottom: 20px;">
Working with multiple FTG titles, such as
Cities: VR,
We Are One,
Everslaught Invasion,
Broken Edge,
Ghost Signal: A Stellaris Game,
and more!
</p>
<div class="col" style="margin-bottom: 20px;">
<div class="roundbubble flow-text small-bubble" style="margin-left: 0px;">UX</div>
<div class="roundbubble flow-text small-bubble">Playtesting</div>
<div class="roundbubble flow-text small-bubble">Analysis</div>
<i class='small-bubble'><img alt="Oculus logo" src="images/projects/logo-oculus.svg" width="60" height="60" style="margin-bottom:-3px;" class="none"/></i>
<i class='small-bubble'><img alt="Miro logo" src="images/projects/miro_icon_white.svg" width="60" height="60" style="margin-bottom:-3px;" class="none"/></i>
<i class="fab fa-figma small-bubble small-icon" style="padding-top:0;"></i>
</div>
</div>
</div>
</a>
</div>
</div> -->
<div class="parallax-container" id="projects">
<div class="parallax img-overlay"><img src="images/projects/ftg/ftg_4.png"></div>
<div class="container">
<!-- <a href=""> -->
<div class="card-background card-border card row rounded_corners large-screen-margin">
<div class="col s12 m12 l10 offset-l1">
<div class="center">
<img src="images/projects/ftg/ftg_logo.png" alt="Fast Travel Games Logo" class="img-half-out hide-on-small-screen">
</div>
<h4 style="padding-top:10px">Fast Travel Games: Key Contributions</h4>
<p class="light flow-text" style="margin-bottom: 20px;">
<ul class="browser-default flow-text">
<li class="bullet"><b>Established and refined the UX Research Process</b></li>
<li class="bullet"><b>40+ UXR projects</b> for 12+ games across multiple genres and platforms</li>
<li class="bullet"><b>200+ qualitative playtest sessions</b> and 10+ quantitative</li>
<li class="bullet"><b>Created guidelines</b> to avoid common design pitfalls</li>
<li class="bullet"><b>Implemented tools & processes</b> for both UXR and Release Management</li>
<li class="bullet"><b>20+ teams collaborated with</b> across design, dev, and marketing</li>
<li class="bullet"><b>Managed 19+ games simultaneously</b> from store setup to post-launch</li>
<li class="bullet"><b>5 platforms used</b> including Meta Quest, Steam, PlayStation, and others.</li>
<li class="bullet"><b>4 successfully handled launches</b> across multiple platforms.</li>
</ul>
</p>
<!-- <div class="col" style="margin-bottom: 20px;">
<div class="roundbubble flow-text small-bubble" style="margin-left: 0px;">Testing</div>
<div class="roundbubble flow-text small-bubble">Prototyping</div>
<i class='small-bubble'><img alt="Jira logo" src="images/projects/jira_icon_white.svg" width="60" height="60" style="margin-bottom:-3px;" class="none"/></i>
<i class="fab fa-figma small-bubble small-icon" style="padding-top:0;"></i>
<i class='small-bubble'><img alt="Miro logo" src="images/projects/miro_icon_white.svg" width="60" height="60" style="margin-bottom:-3px;" class="none"/></i>
<i class='small-bubble'><img alt="Oculus logo" src="images/projects/logo-oculus.svg" width="60" height="60" style="margin-bottom:-3px;" class="none"/></i>
<i class='small-bubble'><img alt="PSVR logo" src="images/projects/ps_logo.png" width="60" height="60" style="margin-bottom:-3px;" class="none"/></i>
</div> -->
</div>
</div>
<!-- </a> -->
</div>
</div>
<div class="divider-block">
</div>
<div class="parallax-container" id="">
<div class="parallax img-overlay"><img src="images/projects/cities/cities.jpg"></div>
<div class="container">
<a href="cities">
<div class="card-background card-border card row hoverable rounded_corners large-screen-margin">
<div class="col s12 m12 l10 offset-l1">
<div class="center">
<img src="images/projects/ftg/ftg_logo.png" alt="Fast Travel Games Logo" class="img-half-out hide-on-small-screen">
</div>
<h4 style="padding-top:10px">Cities: VR - Tutorial</h4>
<p class="light flow-text" style="margin-bottom: 20px;">
<p class="light flow-text ">
Cities: VR is a live VR port of the city-building game Cities: Skylines. Since joining the project, I have focused on improving the tutorial and onboarding experience through prototyping, testing, and design discussions with the team.
<!-- I test, prototype, suggest solutions, and discuss design choices with the team.
While I have worked on creating different solutions to make the game more enjoyable for the player, my largest project is the <b>tutorial</b>. -->
</p>
</p>
<div class="col" style="margin-bottom: 20px;">
<div class="roundbubble flow-text small-bubble" style="margin-left: 0px;">Testing</div>
<div class="roundbubble flow-text small-bubble">Prototyping</div>
<i class='small-bubble'><img alt="Jira logo" src="images/projects/jira_icon_white.svg" width="60" height="60" style="margin-bottom:-3px;" class="none"/></i>
<i class="fab fa-figma small-bubble small-icon" style="padding-top:0;"></i>
<i class='small-bubble'><img alt="Miro logo" src="images/projects/miro_icon_white.svg" width="60" height="60" style="margin-bottom:-3px;" class="none"/></i>
<i class='small-bubble'><img alt="Oculus logo" src="images/projects/logo-oculus.svg" width="60" height="60" style="margin-bottom:-3px;" class="none"/></i>
<i class='small-bubble'><img alt="PSVR logo" src="images/projects/ps_logo.png" width="60" height="60" style="margin-bottom:-3px;" class="none"/></i>
</div>
</div>
</div>
</a>
</div>
</div>
<div class="divider-block">
</div>
<div class="parallax-container">
<div class="parallax img-overlay"><img src="images/projects/paxdei/paxdei_logo.jpeg"></div>
<div class="container">
<a href="paxdei">
<div class="card-background card-border card row hoverable rounded_corners large-screen-margin">
<div class="col s12 m12 l10 offset-l1">
<div class="center">
<img src="images/projects/paxdei/logo_shadow.png" alt="Mainframe Industries Logo" class="img-half-out hide-on-small-screen">
</div>
<h4 style="padding-top:10px">Pax Dei - MMO Traversal System For Blind Players</h4>
<p class="light flow-text" style="margin-bottom: 20px;">
Designed a traversal system for a sandbox MMO that was more accessible and enjoyable for totally blind gamers.
Six concepts were developed through research and consultation with an accessibility expert and were prototyped and tested with the target audience.
<!-- Designed an accessible and enjoyable traversal system in an unannounced sandbox MMO, for totally blind players. -->
</p>
<div class="col" style="margin-bottom: 20px;">
<div class="roundbubble flow-text small-bubble" style="margin-left: 0px;">UX</div>
<div class="roundbubble flow-text small-bubble">Prototyping</div>
<div class="roundbubble flow-text small-bubble">Project Management</div>
<i class='small-bubble'><img alt="Miro logo" src="images/projects/miro_icon_white.svg" width="60" height="60" style="margin-bottom:-3px;" class="none"/></i>
<i class='devicon-photoshop-plain small-bubble small-icon'></i>
<i class='devicon-xd-plain small-bubble small-icon'></i>
</div>
</div>
</div>
</a>
</div>
</div>
<div class="divider-block">
</div>
<div class="parallax-container">
<div class="parallax img-overlay"><img src="images/projects/madshot/MadShot_Poster.png"></div>
<div class="container">
<a href="madshot">
<div class="card-background card-border card row hoverable rounded_corners large-screen-margin">
<div class="col s12 m12 l10 offset-l1">
<div class="center">
<img src="images/projects/madshot/logo_shadow.png" alt="Overflow Logo" class="img-half-out hide-on-small-screen">
</div>
<h4>Madshot - Challenge System</h4>
<p class="light flow-text" style="margin-bottom: 20px;">
Developed a challenge system for Madshot, a rogue-lite shooter. Our process included researching and playtesting Madshot and five other relevant games, create concept sketches and prototypes, and conducting multiple iterations of testing.
</p>
<div class="col" style="margin-bottom: 20px;">
<div class="roundbubble flow-text small-bubble" style="margin-left: 0px;">UX</div>
<div class="roundbubble flow-text small-bubble">UI</div>
<div class="roundbubble flow-text small-bubble">Prototyping</div>
<div class="roundbubble flow-text small-bubble">PM</div>
<i class='small-bubble'><img alt="Miro logo" src="images/projects/miro_icon_white.svg" width="60" height="60" style="margin-bottom:-3px;" class="none"/></i>
<i class='devicon-photoshop-plain small-bubble small-icon'></i>
<i class="fab fa-figma small-bubble small-icon" style="padding-top:0;"></i>
<i class="fab fa-steam small-bubble-no-margain-bottom small-icon" style="padding-top:0;"></i>
</div>
</div>
</div>
</a>
</div>
</div>
<!--
<div class="divider-block">
</div> -->
<!-- <div class="parallax-container">
<div class="parallax img-overlay"><img src="images/projects/cryptids/background.png"></div>
<div class="container">
<a href="cryptids">
<div class="card-background card-border card row hoverable rounded_corners large-screen-margin">
<div class="col s12 m12 l10 offset-l1">
<div class="center">
<img src="images/projects/cryptids/logo_shadow.png" alt="Spyla Logo" class="img-half-out hide-on-small-screen">
</div>
<h4>Game Jam Project</h4>
<img style="max-width:200px;padding-left: 10px;" class="responsive-img" src="images/projects/cryptids/win_icon.png" alt="Badge that says '1st Place - Rookies PC'">
<br>
<p class="light flow-text" style="margin-bottom: 20px;">
Created all UX and some UI for Cryptids, a first person horror survival game made for IGDA's Summer Game Jam 2021.
</p>
<div class="col" style="margin-bottom: 20px;">
<div class="roundbubble flow-text small-bubble" style="margin-left: 0px;">UX</div>
<div class="roundbubble flow-text small-bubble">UI</div>
<div class="roundbubble flow-text small-bubble">Prototyping</div>
<div class="roundbubble flow-text small-bubble">Testing</div>
<div class="roundbubble flow-text small-bubble">Narrative</div>
<i class='devicon-photoshop-plain small-bubble small-icon'></i>
<i class="fab fa-trello small-bubble small-icon" style="padding-top:0;"></i>
<i class="fab fa-unity small-bubble small-icon" style="padding-top:0;"></i>
<i class="fab fa-figma small-bubble small-icon" style="padding-top:0;"></i>
</div>
</div>
</div>
</a>
</div>
</div> -->
<div class="parallax-container hide-on-small-screen">
<div class="container">
<div class="row">
<div class="center">
<a href="https://www.linkedin.com/in/amanda-alling-andren/details/recommendations/"><h2 class="hide-on-small-screen">Said about me</h4></a>
</div>
<div class="col s12 m12 l10 offset-l1">
<div class="carousel carousel-slider" id="reviews">
<p class="carousel-item flow-text">
"(...) I can’t stress enough how diverse Amanda is. While she is a UX designer by education, she’s also a great researcher
and certainly has a knack for production as she’s one of the most organized people I’ve worked with."
<br><span style="float: right">- <a href="https://www.linkedin.com/in/patrickliu/" target="_blank">Patrick Liu</a><br>Head of Publishing at <a href="https://www.fasttravelgames.com/" target="_blank">Fast Travel Games</a></span>
</p>
<p class="carousel-item flow-text">
"(...) Not only did she take her role as UX Designer really seriously and single-handedly drove her initiative to build up and utilize a database of external testers for play-tests, but she also grew and took on new responsibilities with time, such as filling in as Release Manager on our publishing branch.
<br>In short, a delight to work with and a rock-solid recommendation from me!"
<br><span style="float: right">- <a href="https://www.linkedin.com/in/robin-lilius-lundmark-144020143/" target="_blank">Robin Lilius-Lundmark</a><br>Lead Game Designer at <a href="https://www.fasttravelgames.com/" target="_blank">Fast Travel Games</a></span>
</p>
<p class="carousel-item flow-text">
"Amanda has exceptional Self Leadership and Team Leadership skills<br> and is an emphatical super talent."
<br><span style="float: right">- <a href="https://www.linkedin.com/in/anna-von-walzel/" target="_blank">Anna Von Walzel</a><br>Founder of <a href="ourtech.agency" target="_blank">Ourtech.agency</a></span>
</p>
<p class="carousel-item flow-text">
"(...) Amanda showed an incredible set of skills that include but are not limited to senior level production planning and team organization, expert execution on user research as well as feature development.
<br><br>
Amanda is a powerhouse, an intuitive and passionate designer that understands experience design at it's core. She naturally takes charge and helps to set up those around her for success, all while keeping the product goals and deliverables on track. I recommend Amanda to anyone that can value and nurture this set of skills and am looking forward to follow her career."
Amanda is a powerhouse, an intuitive and passionate designer that understands experience design at it's core. She naturally takes charge and helps to set up those around her for success, all while keeping the product goals and deliverables on track."
<br><span style="float: right">- <a href="https://www.linkedin.com/in/jasmin-dahncke-b163824b/" target="_blank">Jasmin Dahncke</a><br>Senior UX Designer at <a href="https://www.mainframeindustries.com/" target="_blank">Mainframe Industries</a></span>
</p>
<p class="carousel-item flow-text">
"Amanda and her team were a joy to work with!
<br><br>
She had a great structure and the result from the team was fantastic!
<br><br>
Would definitely want to work with her and her team again."
<br><span style="float: right">- <a href="https://www.linkedin.com/in/jonathan-prytz-02798662/" target="_blank">Jonathan Prytz</a><br>CEO at <a href="https://www.overflowgames.com/" target="_blank">Overflow Games</a></span>
</p>
<p class="carousel-item flow-text">
"(...) Amanda is one in a million. Bright, hard working and skilled. One of the most talented and hard working individuals I have ever come across.
<br><br>
She brings a problem solving mindset to every challenge she is presented with and leaves no stone unturned. She is curios, positive and has a great team spirit. I recommend Amanda to anyone who is looking for an excellent and competent employee or coworker in the UX or Game industry. Just hire her before anyone else does!"
<br><span style="float: right">- <a href="https://www.linkedin.com/in/bidnerdonethat/" target="_blank">Jan Bidner</a><br> at <a href="https://www.bidnerdonethat.se/" target="_blank">Bidnerdonethat</a></span>
</p>
<p class="carousel-item flow-text">
"(...) Amanda is dedicated, displays an intuitive grasp for the intricacies of participatory and immersive design. I would count her as an asset to any design team in related areas."
<br><span style="float: right">- <a href="https://www.linkedin.com/in/daniel-sundstr%C3%B6m-060ba530/" target="_blank">Daniel Sundström</a><br>Chief Technology Officer at <a href="https://www.comorning.com/" target="_blank">CO:</a></span>
</p>
</div>
</div>
</div>
</div>
<div class="parallax"><img src="images/background.png" alt="background image, pretty much just pixelated gray"></div>
</div>
</div>
<!-- footer & contact section -->
<footer class="page-footer black" id="contact">
<div id="footer"></div>
</footer>
</body>
</html>