/
index.html
372 lines (338 loc) · 20.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
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
<!doctype html>
<html lang="en">
<head>
<meta content-type="application/xhtml+xml" charset="utf-8" />
<meta name="description" content="">
<title>Last Place</title>
<link rel="alternate" media="only screen and (max-width: 640px)" href="http://www.mattkicks.com/lastplace/mobile">
<link rel="stylesheet" href="stylesheets/style.css">
<link href='http://fonts.googleapis.com/css?family=Source+Sans+Pro:200,300,400,600,700,900' rel='stylesheet' type='text/css'>
<script src="js/jquery.js"></script>
<script src="http://maps.google.com/maps/api/js?sensor=false"></script>
<script src="js/browser-os_selectors.js"></script>
<script src="js/waypoints.js"></script>
<script src="js/waypoints-sticky.js"></script>
<script src="js/jquery.unveil.min.js"></script>
<script>
// if ((navigator.userAgent.match(/iPhone/i)) || (navigator.userAgent.match(/iPod/i))) {
// location.replace("http://www.mattkicks.com/lastplace/mobile/");
// }
$(document).ready(function() {
$("img").unveil();
// waypoints-sticky.js
$('nav').waypoint('sticky');
// Google Map
var initializeMap = function() {
// Set the styles of the map
var styles = [
{
stylers: [
{ hue: "#0066AE" },
{ saturation: -70 },
{ lightness: 30 },
{ gamma: 0 }
]
},{
featureType: "road",
elementType: "geometry",
stylers: [
{ lightness: 90 },
{ visibility: "simplified" }
]
},{
featureType: "road",
elementType: "labels",
stylers: [
{ visibility: "on" }
]
},{
featureType: "road.highway",
elementType: "labels",
stylers: [
{ visibility: "off" }
]
},{
featureType: "poi",
elementType: "labels",
stylers: [
{ visibility: "off" }
]
}, {
featureType: "landscape",
elementType: "geometry",
stylers: [{
weight: 0.9
}, {
visibility: "off"
}]
}];
// Map itself
var mapLocation = new google.maps.LatLng(45.51245583251856, -122.64561116695404);
var mapOptions = {
zoom: 12,
panTo: mapLocation,
mapTypeId: google.maps.MapTypeId.ROADMAP,
styles: styles,
scaleControl: false,
scrollwheel: false,
mapTypeControl: false
}
map = new google.maps.Map(document.getElementById("map"), mapOptions);
map.setCenter(mapLocation);
var marker = new google.maps.Marker({
position: mapLocation,
map: map,
// Set custom icon with the following
icon: new google.maps.MarkerImage('img/map_pin_gradient.svg',
null, null, null),
animation: google.maps.Animation.DROP
});
}
google.maps.event.addDomListener(window, 'load', initializeMap);
});
</script>
</head>
<body>
<nav>
<div class="wrapper">
<ul>
<li><a href="#shop">Shop</a></li>
<li><a href="#about">About</a></li>
<li><a href="#gallery">Gallery</a></li>
<li><a href="#contact">Contact</a></li>
</ul>
<a class="active" href="#home" title="Last Place">
<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" version="1.1" id="logo" x="0px" y="0px" width="380px" height="32px" viewBox="0 0 380 52" enable-background="new 0 0 380 52" xml:space="preserve" alt="Last Place">
<g>
<g>
<path class="square" fill="#FFF" d="M0 0v50.799h50.806V0H0zM40.914 35.744c-0.612 1.074-1.589 1.77-2.669 2.4c-1.17 0.649-2.417 1.207-3.697 1.627c-1.237 0.397-2.515 0.709-3.812 0.871c-1.289 0.157-2.572 0.049-3.841-0.197c-1.375-0.269-2.698-0.64-4.074-0.891c-1.285-0.236-2.57-0.412-3.863-0.499c-1.398-0.112-2.811-0.1-4.193-0.266c-1.194-0.152-2.539-0.302-3.427-1.224c-0.568-0.59-0.804-1.463-0.799-2.271c-0.005-1.139 0.58-2.17 1.584-2.717c1.108-0.604 2.482-0.588 3.695-0.51c2.696 0.2 5.4 0.8 8.1 0.392c1.295-0.198 2.49-0.878 3.612-1.515c1.145-0.656 2.238-1.187 3.537-1.418c1.307-0.232 2.583-0.197 3.891-0.086c1.324 0.1 2.7 0.3 3.9 0.8c1.134 0.4 2 1 2.3 2.179C41.531 33.4 41.5 34.7 40.9 35.744zM41.461 24.4c-0.092 0.246-0.2 0.277-0.585 0.379c-0.45 0.133-0.892 0.229-1.3 0.307c-1.986 0.4-3.565 0.568-6.469 0.7c-3.49 0.146-6.01-0.058-7.918-0.305c-1.91-0.239-3.886-0.412-7.381-0.489c-3.492-0.074-5.986-0.031-6.685-0.074c-0.659-0.039-0.862-0.105-1.175-0.965c-0.303-0.822-0.532-2.18-0.014-4.599c0.258-1.194 0.573-1.911 0.859-3.05c0.171-0.666 0.333-1.494 0.436-2.594c0.093-0.979 0.132-2.041 0.152-2.392c0.016-0.356 0.016-0.45 0.592-0.596c0.585-0.145 2.625-0.354 4.464-0.354c1.404-0.005 3 0 4.2 0.424c0.862 0.3 1 0.6 1.2 0.8c0.765 1 2.5 2.8 4.1 4.219c1.61 1.4 3.8 3.1 5.8 4.134c2.022 1 3.1 1.2 3.6 1.2c0.76 0.1 2.4 0 3.5 0.062c0.294 0 0.5 0 0.7 0.075c0.758 0.1 1.1 0.3 1.5 0.9c0.272 0.4 0.4 1 0.4 1.233C41.557 23.9 41.5 24.3 41.5 24.439z"/>
</g>
</g>
<g>
<g>
<path fill="#FFF" d="M60.454 0l8.861 0.003v42.918h25.713l-0.003 7.656H60.454V0z"/>
<path fill="#FFF" d="M134.194 42.428c0 1 0.1 1.7 0.4 2.129c0.262 0.4 0.8 0.6 1.5 0.6c0.245 0 0.5 0 0.9 0c0.325-0.004 0.71-0.047 1.133-0.137v5.594c-0.282 0.095-0.648 0.207-1.095 0.3c-0.445 0.121-0.912 0.229-1.377 0.322c-0.483 0.097-0.955 0.166-1.422 0.217c-0.479 0.044-0.875 0.066-1.207 0.1c-1.654-0.004-3.023-0.338-4.109-0.991c-1.088-0.661-1.792-1.822-2.124-3.476c-1.598 1.556-3.576 2.694-5.91 3.4c-2.335 0.709-4.599 1.06-6.767 1.06c-1.656 0-3.232-0.222-4.753-0.674c-1.502-0.449-2.842-1.104-3.997-1.986c-1.158-0.868-2.085-1.979-2.759-3.326c-0.688-1.348-1.021-2.912-1.028-4.711c0-2.266 0.407-4.104 1.244-5.52c0.819-1.421 1.902-2.531 3.254-3.33c1.346-0.806 2.857-1.386 4.536-1.73c1.671-0.361 3.358-0.639 5.066-0.814c1.459-0.295 2.851-0.488 4.178-0.604c1.314-0.118 2.488-0.324 3.502-0.604c1.02-0.277 1.813-0.72 2.409-1.312c0.587-0.591 0.885-1.479 0.885-2.662c0-1.031-0.247-1.879-0.743-2.547c-0.5-0.662-1.107-1.168-1.846-1.525c-0.725-0.35-1.54-0.577-2.445-0.7c-0.895-0.12-1.747-0.181-2.544-0.18c-2.274-0.001-4.136 0.474-5.595 1.4c-1.472 0.944-2.291 2.41-2.49 4.394h-8.07c0.14-2.366 0.708-4.319 1.708-5.879c0.994-1.562 2.255-2.806 3.788-3.759c1.535-0.941 3.264-1.6 5.206-1.978c1.934-0.381 3.911-0.563 5.946-0.571c1.8 0 3.6 0.2 5.3 0.6c1.75 0.4 3.3 1 4.7 1.836c1.391 0.9 2.5 2 3.4 3.299c0.859 1.3 1.3 3 1.3 4.927L134.194 42.4L134.194 42.428zM126.12 32.227c-1.23 0.806-2.746 1.285-4.539 1.457c-1.79 0.162-3.586 0.406-5.376 0.7c-0.859 0.143-1.676 0.346-2.486 0.604c-0.799 0.262-1.504 0.619-2.12 1.063c-0.618 0.446-1.1 1.038-1.448 1.8c-0.359 0.728-0.539 1.617-0.539 2.656c0 0.9 0.3 1.7 0.8 2.264c0.517 0.6 1.1 1.1 1.9 1.4c0.73 0.4 1.5 0.6 2.4 0.746c0.874 0.1 1.7 0.2 2.4 0.219c0.895 0 1.856-0.122 2.896-0.357c1.044-0.236 2.021-0.635 2.945-1.202c0.914-0.569 1.69-1.282 2.298-2.163c0.618-0.873 0.925-1.943 0.925-3.226v-6.021H126.12z"/>
<path fill="#FFF" d="M149.954 38.816c0.233 2.4 1.1 4 2.7 4.963c1.555 0.9 3.4 1.4 5.6 1.4c0.746 0 1.61-0.064 2.58-0.178c0.966-0.117 1.884-0.343 2.729-0.673c0.847-0.332 1.542-0.813 2.093-1.454c0.537-0.638 0.785-1.475 0.744-2.521c-0.053-1.033-0.426-1.877-1.138-2.543c-0.705-0.659-1.619-1.189-2.724-1.598c-1.109-0.396-2.377-0.744-3.793-1.035c-1.417-0.271-2.855-0.574-4.323-0.902c-1.507-0.332-2.962-0.738-4.353-1.207c-1.394-0.473-2.64-1.109-3.755-1.918c-1.114-0.803-1.99-1.83-2.654-3.082c-0.662-1.248-0.992-2.795-0.992-4.635c0-1.985 0.482-3.646 1.449-4.999c0.974-1.336 2.197-2.426 3.69-3.254c1.489-0.83 3.138-1.401 4.952-1.737c1.815-0.33 3.555-0.5 5.209-0.491c1.887-0.007 3.7 0.2 5.4 0.601c1.716 0.4 3.3 1.1 4.7 1.9c1.389 0.9 2.6 2.1 3.5 3.514c0.926 1.4 1.5 3.2 1.7 5.205h-8.434c-0.378-1.941-1.27-3.232-2.653-3.897c-1.4-0.666-2.989-0.994-4.786-0.994c-0.57 0.001-1.237 0.049-2.021 0.137c-0.773 0.098-1.511 0.282-2.197 0.5c-0.676 0.262-1.263 0.64-1.731 1.133c-0.473 0.496-0.714 1.143-0.714 1.946c0.005 1 0.3 1.8 1 2.4c0.683 0.6 1.6 1.1 2.7 1.521c1.114 0.4 2.4 0.7 3.8 1.031c1.412 0.3 2.9 0.6 4.4 0.9c1.471 0.3 2.9 0.7 4.3 1.197c1.427 0.5 2.7 1.1 3.8 1.906c1.119 0.8 2 1.8 2.7 3.1c0.681 1.2 1 2.7 1 4.532c0 2.171-0.493 4.022-1.485 5.53c-0.992 1.507-2.289 2.74-3.875 3.7c-1.58 0.939-3.342 1.629-5.284 2.055c-1.942 0.42-3.861 0.633-5.752 0.633c-2.322 0.004-4.459-0.26-6.426-0.774c-1.959-0.524-3.665-1.317-5.107-2.377c-1.44-1.062-2.577-2.383-3.41-3.962c-0.827-1.581-1.265-3.462-1.312-5.635H149.954L149.954 38.816z"/>
<path fill="#FFF" d="M177.648 13.958h6.093l0.005-10.984h8.066v10.984h7.293l0.004 6.024h-7.297v19.545c0 0.8 0 1.6 0.1 2.19c0.065 0.6 0.2 1.1 0.5 1.564c0.258 0.4 0.7 0.7 1.2 0.9c0.515 0.2 1.2 0.3 2.1 0.324c0.566-0.004 1.128-0.02 1.696-0.043c0.571-0.016 1.129-0.102 1.692-0.244v6.236c-0.895 0.09-1.766 0.184-2.621 0.281c-0.847 0.096-1.717 0.139-2.608 0.145c-2.132-0.006-3.844-0.203-5.14-0.609c-1.293-0.397-2.316-0.986-3.045-1.762c-0.737-0.778-1.229-1.764-1.494-2.949c-0.248-1.174-0.405-2.516-0.455-4.031V19.975l-6.093 0.007L177.648 13.958L177.648 13.958z"/>
</g>
<path fill="#FFF" d="M209.311 0l22.448 0.007c9.071 0 15 5.3 15 14.442c0 9.143-5.963 14.453-15.027 14.5l-17.631 0.005v21.672h-4.812L209.311 0zM214.128 24.799h16.567c6.662 0 11.27-3.407 11.27-10.35c0-6.945-4.605-10.336-11.27-10.336h-16.567V24.799L214.128 24.799z"/>
<path fill="#FFF" d="M273.877 25.221c0.423-8.575 6.445-12.253 14.797-12.253c6.444 0 13.5 2 13.5 11.763l-0.002 19.4c0 1.7 0.9 2.7 2.6 2.684c0.499 0 1.062-0.135 1.415-0.274v3.752c-0.99 0.216-1.691 0.287-2.895 0.3c-4.543 0-5.243-2.554-5.243-6.381h-0.147c-3.113 4.745-6.303 7.44-13.314 7.44c-6.725 0-12.254-3.33-12.254-10.691c0-10.278 9.996-10.629 19.627-11.762c3.678-0.428 5.729-0.924 5.729-4.96c0-6.017-4.314-7.505-9.554-7.504c-5.531 0-9.636 2.549-9.779 8.5H273.877zM297.671 30.598l-0.132 0.006c-0.576 1.064-2.549 1.42-3.76 1.6c-7.582 1.341-16.995 1.271-16.995 8.421c0 4.5 4 7.2 8.1 7.23c6.801 0 12.813-4.323 12.75-11.479L297.671 30.598z"/>
<path fill="#FFF" d="M337.555 25.504c-1.205-5.455-4.537-8.783-10.344-8.783c-8.568-0.007-12.822 7.787-12.822 15.6c0.006 7.8 4.3 15.6 12.8 15.585c5.523 0 10.057-4.319 10.63-10.416h4.46c-1.203 8.784-6.943 14.169-15.09 14.2c-11.186 0-17.281-8.856-17.281-19.338c0-10.482 6.094-19.333 17.281-19.333c7.798 0 13.8 4.2 14.8 12.535L337.555 25.504z"/>
<path fill="#FFF" d="M351.867 33.506c0.072 6.5 3.5 14.4 12 14.381c6.52-0.001 10.055-3.83 11.477-9.348h4.46c-1.909 8.281-6.726 13.1-15.937 13.1c-11.611 0-16.504-8.932-16.504-19.338c0-9.631 4.893-19.333 16.504-19.333c11.764 0 16.4 10.3 16.1 20.535L351.867 33.506zM375.525 29.748c-0.217-6.725-4.396-13.027-11.623-13.027c-7.293-0.001-11.332 6.375-12.035 13.032L375.525 29.748z"/>
<path fill="#FFF" d="M259.023 42.428c0.008 2.9 0.4 4.6 3.6 4.818c1.273 0 2.551-0.07 3.822-0.215v3.824c-1.343 0.004-2.613 0.146-3.957 0.146c-5.952-0.003-8.009-1.982-7.939-8.222l0.006-42.774L259.023 0V42.428z"/>
</g>
</svg>
</a>
</div>
</nav>
<section id="home">
<div class="headline">
<h1>
The <strong><a href="#shop">skateboard shop</a></strong>
<br> & <strong><a href="#">design studio</a></strong> at
<br>
<strong><a href="http://www.commonwealthskateboarding.com" target="_blank">Commonwealth Skatepark</a></strong> <br> in <strong><a href="#map">Portland, Oregon</a></strong>
</h1>
</div>
</section>
<div class="content">
<section id="shop">
<header>
<div class="right">
<span class="price">
<!-- <i class="icon"></i> -->
<span class="currency">$</span>
<span class="amount">25</span>
</span>
</div>
<div class="left">
<a href="#"><h2>PDX Shreds – Launch Tee</h2></a>
<h5><!-- <span class="icon">💥</span> --> American Apparel Base T-shirt, 100% Cotton</h5>
</div>
<div class="middle">
<span class="checkouts">
<a href="http://lastplace.myshopify.com/products/pdx-shreds">
<img src="img/shopify_btn.png" height="32" width="117" border="0">
</a>
<a href="https://bitpay.com/cart/add?itemId=XVV4wKPukg9zj7ZAkYwRmg">
<img src="img/bitpay_btn.png" height="32" width="83" border="0">
</a>
</span>
</div>
</header>
<div class="photo">
<a href="http://lastplace.myshopify.com/products/pdx-shreds" target="_blank">
<div class="overlay">
<span>
<i class="view"></i>
<p>View Product</p>
</span>
</div>
<img src="img/loader.gif" data-src="img/products/pdx_shreds_003-cropped.jpg" width="100%">
</a>
</div>
</section>
<section id="about">
<div id="story" class="cols">
<h5>The Story</h5>
<p class="breakout">Designer-owned and operated with a shoestring budget and a compulsive need to make stuff, we're turning Last Place into the funnest place to skate and shop for everything you destroy in the process.</p>
<p>In the spring of 2012, sneaker designer <strong>Matt Collins</strong> packed up all of his studio equipment and tools into a moving truck and drove cross country with his dog <a href="#">Rover</a> to settle in the skateboard and bike mecca of <strong>Portland, Oregon</strong>.
<p>After a summer of lazy freelance-living, preparations began to make Last Place into a sneaker shop with a few small skatepark features taking up whatever parking lot space we had available. During the early planning stages, a completely serendipitous serious of meetings led us to <a href="http://www.commonwealthskateboarding.com" target="_blank">Commonwealth Skatepark</a> as the perfect new home for our store.</p>
<p>With the help of <a href="#team">a team of designers, nerds and tinkerers,</a> we pooled our collective resources to build up some initial inventory and remodel the storefront. <strong>We're also putting our design studio chops to good use</strong>, screen printing high-quality American Apparel Tees, hoodies and decks featuring our own graphics.</p>
<p>Come by and skate with us, we appreciate your support! </p>
</div>
</section>
<section id="contact">
<div class="row">
<h5>Get in Touch</h5>
<div class="col fifty">
<h6>Address</h6>
<p>1425 SE 20th Avenue, Portland OR, 97214</p>
<h6>Phone</h6>
<p>503-208-2080</p>
<h6>Email</h6>
<p><a href="mailto:info@lastplacefootwear.com">info@lastplacefootwear.com</a></p>
</div>
<div class="col fifty">
<h6>Hours</h6>
<table width="100%" cellpadding="0" cellspacing="0" class="hours">
<tr>
<th>Monday & Friday</th>
<th>Tuesday - Thursday</th>
</tr>
<tr>
<td>2pm-10pm</td>
<td>2pm-8pm</td>
</tr>
<tr>
<td> </td>
</tr>
<tr>
<th>Saturday</th>
<th>Sunday</th>
</tr>
<tr>
<td>10am-8pm</td>
<td>12pm-7:30pm</td>
</tr>
</table>
</div>
</div>
<div class="row">
<h6>Map</h6>
<p>The shop is accessible via Trimet route 14 and street parking is available on surrounding streets.</p>
<div id="map"> </div>
</div>
</section>
<section id="team">
<h5>The People</h5>
<div class="bio" id="matt">
<div class="right">
<div class="photo"> </div>
</div>
<div class="left">
<strong class="name">Matt Collins</strong>
<span class="role">Founder & Lead Designer</span>
<p class="description">Matt serves as the president, head buyer, and chief mischief-maker of Last Place & Commonwealth Skatepark. After studying graphic design at the Art Institute of Boston, he spent ten years designing and developing performance and lifestyle footwear for brands like Reebok, Tommy Hilfiger, Airwalk and New Balance. Matt hates driving more than anything else in the world and prefers to spend every day on his bike and skateboard.
<!-- <p class="social">
<i class="social">
<a href="http://www.dribbble.com/mattkicks" target="_blank" title="Dribbble"></a>
</i>
<i class="social">
<a href="http://lastplacefootwear.tumblr.com" target="_blank" title="Tumblr"></a>
</i>
</p> -->
</div>
</div>
<div class="bio" id="lance">
<div class="right">
<div class="photo"> </div>
</div>
<div class="left">
<strong class="name">Lance Normine</strong>
<span class="role">Instructor & Co-Founder of Commonwealth Skateboarding</span>
<p class="description">Co-founder of Commonwealth Skatepark, Lance is a longtime Portland skater with extensive knowledge of the local and national skateboard scenes, as well as the current skateboard product market. Lance is also the primary instructor for Commonwealth’s widely popular youth skate-camp programs and provides private skateboarding instruction for people of all ages.</p>
</div>
</div>
<div class="bio" id="jen">
<div class="right">
<div class="photo"> </div>
</div>
<div class="left">
<strong class="name">Jen Sherowski</strong>
<span class="role">Public Relations & Co-Founder of Commonwealth Skateboarding</span>
<p class="description">Another longtime skateboarder and co-founder of Commonwealth Skatepark, Jennifer puts a decade’s worth of marketing experience in the action-sports world to use by forging alliances with sponsors and orchestrating events, creating/cleaning up the messes involved with wild art parties, company BBQs, and best trick contests.</p>
</div>
</div>
<div class="bio" id="mandy">
<div class="right">
<div class="photo"> </div>
</div>
<div class="left">
<strong class="name">Mandy McClausky</strong>
<span class="role">Designer, Digital Strategist</span>
<p class="description">Mandy helps run the retail space and maintains our social presence. She has over a decade of experience in design and web development and is the lead designer for the Last Place website.</p>
</div>
<!-- <p class="social">
<i class="social">
<a href="http://www.dribbble.com/mandynicole" target="_blank" title="Dribbble"></a>
</i>
</p> -->
</div>
<div class="bio" id="colin">
<div class="right">
<div class="photo"> </div>
</div>
<div class="left">
<strong class="name">Colin Delargy</strong>
<span class="role">Chief Financial Officer</span>
<p class="description">Colin is an engineer, entrepreneur, tinkerer and investor with extensive knowledge of online commerce and payments. Colin currently serves as our Chief Financial Officer and has extensive experience working with seed through IPO stage technology ventures and commercial, non-profit and government finance and accounting.</p>
</div>
</div>
<div class="bio" id="nat">
<div class="right">
<div class="photo"> </div>
</div>
<div class="left">
<strong class="name">Nat Tarbox</strong>
<span class="role">Vice President</span>
<p class="description">Nat is a seasoned user experience design leader with a background in web media and software products. As an early stage hire at an SaaS startup which recently completed a successful IPO, he contributed to the design and growth of both product design and customer solutions teams. His areas of product design concentration include mobile apps, social interaction, commerce, and video.</p>
</div>
<!-- <p class="social">
<i class="social">
<a href="http://www.dribbble.com/nat" target="_blank" title="Dribbble"></a>
</i>
</p> -->
</div>
<div class="bio" id="branden">
<div class="right">
<div class="photo"> </div>
</div>
<div class="left">
<strong class="name">Branden Hall</strong>
<p class="description">Branden is the CEO and co-founder of Automata Studios, a software consultancy and development studio based out of Washington, DC. Over the last seven years Branden and his partners have grown Automata from a bootstrapped garage start-up to an organization with 8 full time employees, numer- ous contractors, and a client list that includes such companies as IBM, Chanel, NPR, Microsoft, and Adobe.</p>
</div>
</div>
<div class="bio" id="franco">
<div class="right">
<div class="photo"> </div>
</div>
<div class="left">
<strong class="name">Franco Brockelman</strong>
<p class="description">Franco is a thinker, musician, puzzle solver, and the Chief Business Officer for Automata Studios, a bespoke software company out of DC. So when he's not cooking, mushroom hunting, DJing, or traveling around in search of adventures with awesome people, he's helping Branden (above) solve hard digital problems for clients like Adobe, Victoria's Secret, Barnes & Noble, NPR, Dolby Digital, PNC Bank, and many many others. Oh and he likes pie.</p>
</div>
</div>
<!-- <div class="bio" id="bryce">
<div class="right">
<div class="photo"> </div>
</div>
<div class="left">
<strong class="name">Bryce Holley</strong>
<p class="description">Bryce bio.</p>
</div>
</div> -->
</div>
</section>
</div>
</body>
</html>