-
Notifications
You must be signed in to change notification settings - Fork 0
/
Copy pathindex.html
311 lines (258 loc) · 14.8 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
<!DOCTYPE html>
<html lang="en" dir="ltr">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>Tim Sta-Ana - Artist Portfolio</title>
<link rel="icon" sizes="50x50" href="favicon.png">
<link rel="stylesheet" href="style.css">
<!-- Schema.org markup -->
<script type="application/ld+json">
{
"@context": "http://schema.org",
"@type": "Person",
"name": "Tim Sta-Ana",
"url": "https://www.timstaana.com",
"sameAs": [
"https://timmy.dog",
"https://www.facebook.com/timstaana",
"https://www.instagram.com/timstaana",
"https://www.linkedin.com/in/timstaana",
"https://twitter.com/timstaana",
"https://bsky.app/profile/timstaana.com",
"https://pencilbooth.com/tim/",
"https://www.imdb.com/name/nm7128903/"
],
"jobTitle": "Artist",
"image": "https://www.timstaana.com/profile.jpg",
"description": "Tim Sta-Ana is an animator, visual artist and creative technologist 💻 🛸",
"memberOf": {
"@type": "Organization",
"name": "Converse All Stars"
}
}
</script>
<!-- Twitter Card data -->
<meta name="twitter:card" content="summary_large_image">
<meta name="twitter:site" content="@timstaana">
<meta name="twitter:title" content="Tim Sta-Ana - Artist Portfolio">
<meta name="twitter:description" content="Online portfolio for Tim Sta-Ana, an animator, visual artist and creative technologist.">
<meta name="twitter:image" content="https://www.timstaana.com/cover.png">
<!-- Open Graph data -->
<meta property="og:title" content="Tim Sta-Ana - Artist Portfolio" />
<meta property="og:type" content="website" />
<meta property="og:url" content="https://www.timstaana.com/" />
<meta property="og:image" content="https://www.timstaana.com/cover.png" />
<meta property="og:description" content="Online portfolio for Tim Sta-Ana, an animator, visual artist and creative technologist." />
<meta property="og:site_name" content="Tim Sta-Ana - Artist Portfolio" />
</head>
<body>
<section id="about">
<img itemprop="image" class="logo" src="logo.webp" alt="Tim Sta-Ana Logo" loading="lazy">
<p>Tim Sta-Ana is an animator, visual artist and creative technologist 💻 🛸 at a small studio space in Naarm/Melbourne 🇦🇺.</p>
<p>He/they has worked on a number of TV and film animation as a character animator with Netflix, Hulu, and Disney, as well as a BD in Animation and Interactive Media from Royal Melbourne Institute of Technology (RMIT).</p>
<div id="links">
<a href="mailto:[email protected]?subject=Hey!">Contact</a>
<a href="https://docs.google.com/document/d/1CMg8e5II2VHcjvUvBebEf0VIRWl6caicD9uckujV5t0/export?format=pdf" target="_blank">Artist CV</a>
<a href="https://www.instagram.com/timstaana" target="_blank">Instagram</a>
<a href="https://www.imdb.com/name/nm7128903/" target="_blank">IMDB</a>
<a href="https://pencilbooth.com/tim/" target="_blank">Email Newsletter</a>
<a href="https://store.timstaana.com/" target="_blank">Store 🛍</a>
</div>
</section>
<section id="portfolio">
<h2>Selected work and exhibition</h3>
<figure itemscope itemtype="http://schema.org/VisualArtwork">
<img itemprop="image" src="OnJacksonStreet_WIA(WIN)-6261 Large.jpeg" alt="Photo of the group exhibition title 'What I Am (What I'm Not)'" loading="lazy">
<img itemprop="image" src="OnJacksonStreet_WIA(WIN)-6225 Large.jpeg" alt="Photo of a wide view of all the artworks in the exhibition" loading="lazy">
<img itemprop="image" src="OnJacksonStreet_WIA(WIN)-5943 Large.jpeg" alt="Close up shot of Tim Sta-Ana's work for the exhibition" loading="lazy">
<img itemprop="image" src="OnJacksonStreet_WIAM(WIN)-6240-2 Large.jpeg" alt="Alternative view of Tim Sta-Ana's work for the exhibition" loading="lazy">
<img itemprop="image" src="OnJacksonStreet_WIA(WIN)-6254 Large.jpeg" alt="Close up shot of the promotional poster for the residency which pictures Niqui Toldi, Sarah Nguyen, Tim Sta-Ana and Olivia Grbac" loading="lazy">
<figcaption itemprop="description">
<span itemprop="name">Theres A Garden Where The Electricity Lives</span>,
<time itemprop="dateCreated" datetime="2023">2023</time>.
<span itemprop="artMedium">Interactive guest book displayed on iMac G4 from 2002</span>.
Exhibited in 'What I Am (What I'm Not)' exhibition at <a href="https://www.instagram.com/lamingtondrive">Lamington Drive, Collingwood, Victoria, Australia</a>. Additional painting assistance <a href="https://www.instagram.com/jesschowwwww/">Jess Chow</a>. Photos by <a href="https://www.instagram.com/on_jacksonstreet/">On Jackson Street</a>.
</figcaption>
</figure>
<figure itemscope itemtype="http://schema.org/VisualArtwork">
<img itemprop="image" src="IMG_5594.jpg" alt="Untitled" loading="lazy">
<img itemprop="image" src="314932263_207284651698035_2740029081612367192_n.jpg" alt="Untitled detail" loading="lazy">
<figcaption itemprop="description">
<span itemprop="name">Untitled</span>,
<time itemprop="dateCreated" datetime="2022">2022</time>.
<span itemprop="artMedium">Acrylic on skateboard</span>.
Exhibited in For the Deckade exhibition at <a href="https://www.instagram.com/backwoods.gallery">Backwoods Gallery, Collingwood, Victoria, Australia</a> with <a href="https://www.instagram.com/fortheartco/">FORT HEART</a>.
</figcaption>
</figure>
<figure itemscope itemtype="http://schema.org/VisualArtwork">
<img itemprop="image" src="187640137_318802076273288_2575389028587259449_n.jpg" alt="True Colours detail" loading="lazy">
<img itemprop="image" src="189711937_328036528737093_6098380218094407163_n.jpg" alt="True Colours detail" loading="lazy">
<img itemprop="image" src="188027987_870840213811858_7362352844908151816_n.jpg" alt="True Colours" loading="lazy">
<figcaption itemprop="description">
<span itemprop="name">True Colours</span>,
<time itemprop="dateCreated" datetime="2022">2022</time>.
<span itemprop="artForm">Street mural</span>,
<span itemprop="artMedium">house paint on brick wall</span>.
Painted in Thornbury, Victoria, Australia</a> with <a href="https://www.instagram.com/theeczepanski/">Daya Czepanski</a> & <a href="https://www.instagram.com/converse_ANZ/">Converse ANZ</a>. Photos by <a href="https://www.instagram.com/asapfloral/">Chloé Anne</a>.
</figcaption>
</figure>
<figure itemscope itemtype="http://schema.org/VisualArtwork">
<video itemprop="video" src="8C4925DB5DE7CEDAB4DA4F0FCE9D799F_video_dashinit.mp4" title="Is it good luck to walk over a ladder?" autoplay muted loop controls loading="lazy"></video>
<figcaption itemprop="description">
<span itemprop="name">Is it good luck to walk over a ladder?</span>,
<time itemprop="dateCreated" datetime="2022">2022</time>.
<span itemprop="artForm">3D printed sculpture</span>,
<span itemprop="artMedium">acrylic and felt on 3D printed PLA
</span>.
Exhibited in "Very Superstitious" show curated by <a href="https://www.instagram.com/teganiversen/">Tegan Iversen</a> at <a href="https://www.instagram.com/solgalleryspace/">SOL Gallery, Fitzroy, Victora, Australia</a>.
</figcaption>
</figure>
<figure itemscope itemtype="http://schema.org/VisualArtwork">
<img itemprop="image" src="274602098_1121887761890615_7648031283762158208_n.jpg" alt="You're the person I keep seeing in this dream" loading="lazy">
<img itemprop="image" src="274390980_143819791434067_770485726100545087_n.jpg" alt="You're the person I keep seeing in this dream detail" loading="lazy">
<figcaption itemprop="description">
<span itemprop="name">You're the person I keep seeing in this dream</span>,
<time itemprop="dateCreated" datetime="2022">2022</time>.
<span itemprop="artForm">Digital print</span>.
Exhibited in Dreaming Girl (夢見る少女) exhibition at <a href="https://www.gallery-iyn.com/">Gallery IYN, Osaka, Japan</a>.
</figcaption>
</figure>
<figure itemscope itemtype="http://schema.org/VisualArtwork">
<img itemprop="image" src="278292803_504655727805371_4106658489205351458_n.jpg" alt="Soft Nice x Tim Sta-Ana detail" loading="lazy">
<img itemprop="image" src="272064008_501590938054359_7270086406226497501_n.jpg" alt="Soft Nice x Tim Sta-Ana" loading="lazy">
<img itemprop="image" src="277478646_155222757021227_5555587646396328270_n.jpg" alt="Soft Nice x Tim Sta-Ana detail" loading="lazy">
<figcaption itemprop="description">
<span itemprop="name">Soft Nice x Tim Sta-Ana</span>,
<time itemprop="dateCreated" datetime="2022">2022</time>.
<span itemprop="artForm">T-shirt design and tarot card deck</span>.
Collaboration with <a href="https://www.instagram.com/softnice_au/">Soft Nice</a>. Photos by <a href="https://www.instagram.com/on_jacksonstreet/">On Jackson Street</a>.
</figcaption>
</figure>
<figure itemscope itemtype="http://schema.org/VisualArtwork">
<img itemprop="image" src="274318274_272458628207816_4108877841162984035_n.gif" alt="The feeling I get when I hang out with my friends" loading="lazy">
<img itemprop="image" src="274318274_272458628207816_4108877841162984035.jpg" alt="The feeling I get when I hang out with my friends detail" loading="lazy">
<figcaption itemprop="description">
<span itemprop="name">The feeling I get when I hang out with my friends</span>,
<time itemprop="dateCreated" datetime="2022">2022</time>.
<span itemprop="artForm">3D printed sculpture</span>,
<span itemprop="artMedium">acrylic and felt on 3D printed PLA
</span>.
Exhibited at <a href="https://www.instagram.com/brunswickstreetgallery/">Brunswick Street Gallery, Brunswick, Victora, Australia</a>.
</figcaption>
</figure>
<figure itemscope itemtype="http://schema.org/VisualArtwork">
<img itemprop="image" src="135544844_219477669659976_8082382790554566207_n.jpg" alt="R U OK?" loading="lazy">
<figcaption itemprop="description">
<span itemprop="name">R U OK?</span>,
<time itemprop="dateCreated" datetime="2022">2022</time>.
<span itemprop="artForm">Mural</span>,
<span itemprop="artMedium">house paint on stone wall</span>.
Painted at Brookside College, Caroline Springs, Victoria, Australia</a> for <a href="https://www.instagram.com/ruokday/">R U OK? Day</a>. Painting assistant <a href="https://www.instagram.com/toxic.tiger.arts/">toxic.tiger.arts</a>.
</figcaption>
</figure>
<figure itemscope itemtype="http://schema.org/VisualArtwork">
<img itemprop="image" src="74347076_146763189956744_2916946423516682973_n.jpg" alt="Festival of the Photocopier 2020" loading="lazy">
<figcaption itemprop="description">
<span itemprop="name">Festival of the Photocopier 2020</span>,
<time itemprop="dateCreated" datetime="2020">2020</time>.
<span itemprop="artForm">A0 digital print</span>.
Promo material for <a href="https://www.instagram.com/sticky_institute/">Sticky Institute</a>'s Festival of the Photocopier 2020.
</figcaption>
</figure>
<figure itemscope itemtype="http://schema.org/VisualArtwork">
<img itemprop="image" src="150368613_250371263230578_1168245046173628781_n.jpg" alt="going on a coles run" loading="lazy">
<img itemprop="image" src="155291403_438352330552490_251463901880351470_n.jpg" alt="going on a coles run detail" loading="lazy">
<figcaption itemprop="description">
<span itemprop="name">going on a coles run</span>,
<time itemprop="dateCreated" datetime="2020">2020</time>.
<span itemprop="artForm">A4 digital print paste-up</span>.
Exhibited around Brunswick, Victoria, Australia with Loser Unit.
</figcaption>
</figure>
<figure itemscope itemtype="http://schema.org/VisualArtwork">
<video itemprop="video" src="flipphone_01.mp4" title="flip phone" autoplay muted loop controls loading="lazy"></video>
<img itemprop="image" src="flipphone_02.png" alt="flip phone" loading="lazy">
<figcaption itemprop="description">
<span itemprop="name">flip phone</span>,
<time itemprop="dateCreated" datetime="2019">2019</time>.
<span itemprop="artForm">Mixed media sculpture</span>,
<span itemprop="artMedium">felt, foam, arduino, led screen, motor</span>.
Exhibited in Art Show in the Small Long House, Malvern, Victoria, Australia.
</figcaption>
</figure>
</section>
<footer>
(c) Tim Sta-Ana 2023 | I acknowledge the Traditional Custodians, the Wurundjeri Woi Wurrung and Boon Wurrung peoples of the Kulin Nation, of the land on which I live, work and play, and recognise their continuing connection to land, water and community. We pay respect to Elders past, present and emerging. This always was, always will be, Aboriginal land.
</footer>
<script>
var favicon_images = [
'./favicon/frame_00.png',
'./favicon/frame_01.png',
'./favicon/frame_02.png',
'./favicon/frame_03.png',
'./favicon/frame_04.png',
'./favicon/frame_05.png',
'./favicon/frame_06.png',
'./favicon/frame_07.png',
'./favicon/frame_08.png',
'./favicon/frame_09.png',
'./favicon/frame_10.png',
'./favicon/frame_11.png',
'./favicon/frame_12.png',
'./favicon/frame_13.png',
'./favicon/frame_14.png',
'./favicon/frame_15.png',
'./favicon/frame_16.png',
'./favicon/frame_17.png',
'./favicon/frame_18.png',
'./favicon/frame_19.png',
'./favicon/frame_20.png',
'./favicon/frame_21.png',
'./favicon/frame_22.png',
'./favicon/frame_23.png',
'./favicon/frame_24.png',
'./favicon/frame_25.png',
'./favicon/frame_26.png',
'./favicon/frame_27.png',
'./favicon/frame_28.png',
'./favicon/frame_29.png',
'./favicon/frame_30.png',
'./favicon/frame_31.png',
'./favicon/frame_32.png',
'./favicon/frame_33.png',
'./favicon/frame_34.png',
'./favicon/frame_35.png',
'./favicon/frame_36.png',
'./favicon/frame_37.png',
'./favicon/frame_38.png',
'./favicon/frame_39.png',
'./favicon/frame_40.png',
'./favicon/frame_41.png',
'./favicon/frame_42.png',
'./favicon/frame_43.png',
'./favicon/frame_44.png',
'./favicon/frame_45.png',
'./favicon/frame_46.png',
'./favicon/frame_47.png',
'./favicon/frame_48.png',
'./favicon/frame_49.png',
],
image_counter = 0; // To keep track of the current image
setInterval(function() {
// remove current favicon
if(document.querySelector("link[rel='icon']") !== null)
document.querySelector("link[rel='icon']").remove();
if(document.querySelector("link[rel='shortcut icon']") !== null)
document.querySelector("link[rel='shortcut icon']").remove();
// add new favicon image
document.querySelector("head").insertAdjacentHTML('beforeend', '<link rel="icon" href="' + favicon_images[image_counter] + '" type="image/gif">');
// Increase image counter
image_counter += 2;
// If the counter exceeds the length of the array, reset it
if (image_counter >= favicon_images.length)
image_counter = 0;
}, 250);
</script>
</body>
</html>