-
Notifications
You must be signed in to change notification settings - Fork 0
/
Copy pathindex.html
450 lines (447 loc) · 22 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
<!DOCTYPE html>
<html>
<head>
<title>Fletcher.io</title>
<meta charset="UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<link rel="stylesheet" href="assets/css/bootstrap.min.css" />
<link rel="stylesheet" href="assets/css/font-awesome.min.css">
<link rel="stylesheet" href="assets/css/maximage.css">
<link rel="stylesheet" href="assets/css/spirito.css" />
<script src="assets/js/modernizr.custom.min.js"></script>
</head>
<body data-color="turquoise">
<div id="loader">
<div class="windows8">
<div class="wBall" id="wBall_1">
<div class="wInnerBall">
</div>
</div>
<div class="wBall" id="wBall_2">
<div class="wInnerBall">
</div>
</div>
<div class="wBall" id="wBall_3">
<div class="wInnerBall">
</div>
</div>
<div class="wBall" id="wBall_4">
<div class="wInnerBall">
</div>
</div>
<div class="wBall" id="wBall_5">
<div class="wInnerBall">
</div>
</div>
</div>
</div>
<div id="wrapper">
<header id="home">
<div id="maximage" class="maximage-slider">
<img src="assets/img/demo/website_bg.jpg" alt=""/>
<img src="assets/img/demo/website_bg_2.jpg" alt="" />
<img src="assets/img/demo/website_bg_3.jpg" alt="" />
</div>
<div class="fullscreen-controls">
<a class="img-prev"></a>
<a class="img-next"></a>
</div>
<div class="pattern"></div>
<div class="home-wrapper">
<div class="logo">
<h1>Fletcher Richman</h1>
</div>
<div id="home-slider">
<div class="star-line">
<span class="line-pre"></span>
<span class="icons">
<i class="glyphicon glyphicon-star"></i>
<i class="glyphicon glyphicon-star"></i>
<i class="glyphicon glyphicon-star"></i>
</span>
<span class="line-after"></span>
</div>
<ul class="bxslider">
<li><h1>Engineer & Entrepreneur</h1></li>
<li><h1>Student & Innovator</h1></li>
<li><h1>Skiier & Climber</h1></li>
</ul>
</div>
<div class="buttons">
<a class="btn" href="#about" data-scroll="#about">Get to know me</a>
</div>
</div>
</header>
<nav>
<div class="logo">
<h1>Fletcher.io</h1>
</div>
<div class="menu-trigger">
<a href="#"><i class="fa fa-bars"></i></a>
</div>
<ul>
<li class="active"><a href="#home">Home</a></li>
<li><a href="#about">About</a></li>
<li><a href="#portfolio">Portfolio</a></li>
<li><a href="#blog">Blog</a></li>
<li><a href="#contact">Contact</a></li>
</ul>
</nav>
<section id="about">
<div class="container page">
<div class="section-title">
<h1 class="super-title" data-animate="fade-in-top">Hi! I'm Fletcher.</h1>
<p class="subheading" data-animate="fade-in-top">I'm graduating from University of Colorado at Boulder with a degree in Electrical and Computer Engineering in May of 2014 and looking to join a growing startup.</p>
</div>
</div>
</section>
<section class="dark">
<div class="container page">
<div class="connect text-center" data-animate="fade-in-top">
<ul class="social-media">
<li><a href="https://www.facebook.com/frichman"><i class="fa fa-facebook"></i></a></li>
<li><a href="https://twitter.com/fletchrichman"><i class="fa fa-twitter"></i></a></li>
<li><a href="https://www.linkedin.com/in/fletchrichman"><i class="fa fa-linkedin"></i></a></li>
<li><a href="http://instagram.com/richyfletch"><i class="fa fa-instagram"></i></a></li>
<li><a href="https://github.com/fletchrichman"><i class="fa fa-github"></i></a></li>
</ul>
</div>
</div>
</section>
<section class="grey">
<div class="container page">
<div class="section-title">
<h4 data-animate="fade-in">My passions</h4>
<h2 data-animate="fade-in">I love to create - and I'm good at it</h2>
</div>
<div class="row">
<div data-animate="fade-in-top" class="col-xs-12 col-sm-4 col-md-4 col-lg-4">
<div class="feature-box">
<i class="fa fa-info-circle"></i>
<h4>FAST LEARNER</h4>
<p> I'm a life-long learner, it's what I love to do. I've taught myself web development, design thinking, and lean startup tools. I'm confident in my ability to learn the tools and systems I need to succeed.</p>
</div>
</div>
<div data-animate="fade-in-top" class="col-xs-12 col-sm-4 col-md-4 col-lg-4">
<div class="feature-box">
<i class="fa fa-arrows-alt"></i>
<h4>ENGAGES IN DO-EROCRACY</h4>
<p> In the Colorado startup community, I've embraced the 'Give before you get' mentality. I look out for ways to get involved and build the community, and whether its organizing events, connecting people, or any way I can stay involved, I give it my all.</p>
</div>
</div>
<div data-animate="fade-in-top" class="col-xs-12 col-sm-4 col-md-4 col-lg-4">
<div class="feature-box">
<i class="fa fa-globe"></i>
<h4>LOVES BIG CHALLENGES</h4>
<p> I'm excited about companies that can completey disrupt and entire industry. I prefer taking on tasks that I've never done before, or even that no one has ever done.</p>
</div>
</div>
</div>
</div>
</section>
<section id="portfolio">
<div class="page">
<div class="container">
<div class="section-title">
<h1 data-animate="fade-in-top"><span class="text-primary">My</span> Work</h1>
<hr data-animate="fade-in" />
<p class="subheading" data-animate="fade-in-top">I've built software and harware products, started companies and much more.</p>
</div>
</div>
<ul id="portfolio-filters" class="portfolio-grid-controls" data-animate="fade-in">
<li class="filter" data-filter="all">
All
</li>
<li class="filter" data-filter="web">
Software Applications
</li>
<li class="filter" data-filter="hardware">
Hardware Projects
</li>
<li class="filter" data-filter="startups">
Startups
</li>
<li class="filter" data-filter="events">
Events
</li>
</ul>
<div id="portfolio-items" class="portfolio-grid" data-animate="fade-in">
<div class="portfolio-item web startups" data-title="MusikFly" data-description="MusikFly is a music submission platform that helps independent musicians deliver their music to musical influencers such as bloggers.
I started the company with a few other students at CU and we grew it to thousands of users in about 6 months. I led a team of 3 computer science students and one other engineer as the CEO while also contributing to the development of the Ruby on Rails web application." data-largesrc="assets/img/demo/portfolio/musikfly.png">
<div class="portfolio-item-inner">
<div class="portfolio-image">
<div class="portfolio-overlay">
<div class="portfolio-details">
<h3>MusikFly</h3>
<h6>Co-Founder</h6>
</div>
</div>
<img src="assets/img/demo/portfolio/musikfly_small.jpg" alt="" />
</div>
</div>
</div>
<div class="portfolio-item web startups" data-title="PivotDesk" data-description="I taught myself Ruby on Rails and built a variety of products and features for PivotDesk (Techstars Boulder '12). This includes integrations with ZenDesk, scraping data from CrunchBase and AngelList to improve sales processes, and developing a data analytics infrastructure. I also helped hire and manage a team of three other interns in the summer of 2013 to create a software application that helped create and automate the inside sales process." data-largesrc="assets/img/demo/portfolio/pd_logo.png">
<div class="portfolio-item-inner">
<div class="portfolio-image">
<div class="portfolio-overlay">
<div class="portfolio-details">
<h3>PivotDesk</h3>
<h6>Growth Engineer</h6>
</div>
</div>
<img src="assets/img/demo/portfolio/pivotdesk.jpg" alt="" />
</div>
</div>
</div>
<div class="portfolio-item startups" data-title="Spark Boulder" data-description="Spark is a non-profit student incubator and coworking space in Boulder, Colorado designed to progress talent, foster creativity, and accelerate innovative ideas. I helped raise $140K from the community to turn this center for innovation into a reality. I'm currently managing a team of 10+ students to complete construction, manage sales and operations, and oversee financials. I'm also on the board of directors." data-largesrc="assets/img/demo/portfolio/spark.jpeg">
<div class="portfolio-item-inner">
<div class="portfolio-image">
<div class="portfolio-overlay">
<div class="portfolio-details">
<h3>Spark Boulder</h3>
<h6>Managing Director</h6>
</div>
</div>
<img src="assets/img/demo/portfolio/spark_small.jpg" alt="" />
</div>
</div>
</div>
<div class="portfolio-item hardware startups" data-title="Virtuoso" data-description="Virtuoso is a motion-controlled music device. Utilizing signals from finger motions, hand position, and acceleration of the hand, Virtuoso creates over 2,000 unique MIDI signals that can control various aspects of a song including volume, notes, loops, and filters. Virtuoso is my engineering capstone project that myself and 4 other engineers are building. I've been mostly working on integrating C++ libraries to develop the software that recieves a variety of Bluetooth signals and turns them into unique MIDI data." data-largesrc="assets/img/demo/portfolio/virtuoso-glove.png">
<div class="portfolio-item-inner">
<div class="portfolio-image">
<div class="portfolio-overlay">
<div class="portfolio-details">
<h3>Virtuoso</h3>
<h6>Co-Founder</h6>
</div>
</div>
<img src="assets/img/demo/portfolio/virtuoso.jpg" alt="" />
</div>
</div>
</div>
<div class="portfolio-item events" data-title="TEDxCU" data-description="TEDx is an independtly organized TED event. I helped organize and sell out the first ever TEDxCU in April of 2013. We had over 250 attendees, and an awesome group of speakers. We are currently setting up another TEDxCU for this April." data-largesrc="assets/img/demo/portfolio/tedxcu.jpg">
<div class="portfolio-item-inner">
<div class="portfolio-image">
<div class="portfolio-overlay">
<div class="portfolio-details">
<h3>TEDxCU</h3>
<h6>Co-Organizer</h6>
</div>
</div>
<img src="assets/img/demo/portfolio/tedxcu_small.jpg" alt="" />
</div>
</div>
</div>
<div class="portfolio-item hardware" data-title="Accelerometer Bike Lights" data-description="Myself and one other student developed a bike light system that changes the color of the lights based on how fast the bike is moving. We utilized an ARM microprocessor along with LPCXpresso. The microprocessor used I2C communication to recieve data from an accelerometer, and we designed a small amplifier circuit to recieve PWM signals that could display various colors on RGB LEDs depending on the speed of the bike wheels." data-largesrc="assets/img/demo/portfolio/bike_lights_big.png">
<div class="portfolio-item-inner">
<div class="portfolio-image">
<div class="portfolio-overlay">
<div class="portfolio-details">
<h3>Acceleromoter Bike Lights</h3>
<h6>Class Project</h6>
</div>
</div>
<img src="assets/img/demo/portfolio/bike_lights.jpg" alt="" />
</div>
</div>
</div>
<div class="portfolio-item events" data-title="InnovateCU" data-description="InnovateCU is a student club dedicated to connecting developers at CU to the startup community. I helped them connect with speakers and organize events including panels, coding workshops, and a startup focused internship fair." data-largesrc="assets/img/demo/portfolio/icu-big.jpg">
<div class="portfolio-item-inner">
<div class="portfolio-image">
<div class="portfolio-overlay">
<div class="portfolio-details">
<h3>InnovateCU</h3>
<h6>Community Manager</h6>
</div>
</div>
<img src="assets/img/demo/portfolio/icu.jpg" alt="" />
</div>
</div>
</div>
<div class="portfolio-item events" data-title="Open Angel Forum" data-description="The Open Angel Forum (OAF) is dedicated to providing entrepreneurs with free and open access to the angel investors that they need. We are firmly committed to fighting against “pay-to-pitch” schemes. I helped organize Boulder Open Angel Forum #8 in fall of 2013. I contacted and organized over 40 active angel investors to attend, secured sponsorship to pay for a nice meal, and picked the top 6 companies out of more than 50 that applied to present at the event." data-largesrc="assets/img/demo/portfolio/oaf.png">
<div class="portfolio-item-inner">
<div class="portfolio-image">
<div class="portfolio-overlay">
<div class="portfolio-details">
<h3>Open Angel Forum</h3>
<h6>Lead Organizer</h6>
</div>
</div>
<img src="assets/img/demo/portfolio/oaf.jpg" alt="" />
</div>
</div>
</div>
<div class="portfolio-item hardware" data-title="IBM" data-description="I worked for the Real Estate and Operations team at IBM Boulder in the summer of 2012. I helped improve the redundancy of power systems for data centers and collected data on reliability. I also helped develop an Android application to increase the productivity of industrial maintenence alongside two other IBM interns." data-largesrc="assets/img/demo/portfolio/ibm-large.jpg">
<div class="portfolio-item-inner">
<div class="portfolio-image">
<div class="portfolio-overlay">
<div class="portfolio-details">
<h3>IBM</h3>
<h6>Electrical Systems Intern</h6>
</div>
</div>
<img src="assets/img/demo/portfolio/ibm.jpg" alt="" />
</div>
</div>
</div>
<div class="portfolio-item events" data-title="StartupCU" data-description="StartupCU is a cross-campus club for enterpeneurship. I helped organize and promote the monthly speaking events." data-largesrc="assets/img/demo/portfolio/startupcu.jpg">
<div class="portfolio-item-inner">
<div class="portfolio-image">
<div class="portfolio-overlay">
<div class="portfolio-details">
<h3>StartupCU</h3>
<h6>Leader</h6>
</div>
</div>
<img src="assets/img/demo/portfolio/startup_cu.jpg" alt="" />
</div>
</div>
</div>
</div>
</div>
</section>
<section class="grey">
<div class="container">
<div class="call-to" data-animate="fade-in-left">
<h3>
Want to get <span class="text-primary">in </span> touch?
<a class="btn btn-primary btn-lg" data-scroll="#contact">Contact Me</a>
</h3>
</div>
</div>
</section>
<section id="blog">
<div class="container page">
<div class="section-title">
<h1 data-animate="fade-in-top">A few of my<span class="text-primary"> thoughts</span> </h1>
<hr data-animate="fade-in" />
<p data-animate="fade-in-top" class="subheading">
Ideas, updates, etc.
</p>
</div>
<div class="blog-home">
<div class="row posts">
<div class="col-xs-12 col-sm-6 col-md-4 col-lg-4">
<article class="post" data-animate="fade-in-bottom">
<a href="blog/blog_post.html" class="post-image">
<img src="assets/img/demo/startupofyou.jpg" alt="">
<div class="overlay"><i class="fa fa-picture-o"></i></div>
</a>
<h3 class="post-title"><a href="blog/startupofyou.html">The Startup of You at CU</a></h3>
<p class="post-meta"><span class="meta-date">October 2013</span><span class="meta-by"><a href="#">Fletcher</a></span></p>
<p class="post-content">
A perspective on how and why to get involved as a student entrepreneur at CU Boulder through the themes of The Startup of You by Reid Hoffman and Ben Casnocha.
</p>
<p class="post-read-more"><a href="blog/startupofyou.html" class="btn btn-primary btn-sm">Read More</a></p>
</article>
</div>
<div class="col-xs-12 col-sm-6 col-md-4 col-lg-4">
<article class="post" data-animate="fade-in-bottom">
<a href="blog/blog_post.html" class="post-image">
<img src="assets/img/demo/spark_blog.png" alt="">
<div class="overlay"><i class="fa fa-film"></i></div>
</a>
<h3 class="post-title"><a href="http://sparkboulder.com/igniting-university-entrepreneurship-a-student-perspective/">Igniting University Entrepreneurship</a></h3>
<p class="post-meta"><span class="meta-date">August 15 2013</span><span class="meta-by"><a href="#">Fletcher</a></span></p>
<p class="post-content">
Learn about the inspiration and energy behind Spark Boulder, a student incubator and coworking space I helped start.
</p>
<p class="post-read-more"><a href="http://sparkboulder.com/igniting-university-entrepreneurship-a-student-perspective/" class="btn btn-primary btn-sm">Read More</a></p>
</article>
</div>
<div class="col-xs-12 col-sm-6 col-md-4 col-lg-4">
<article class="post" data-animate="fade-in-bottom">
<a href="blog/blog_post.html" class="post-image">
<img src="assets/img/demo/foursquare.jpeg" alt="">
<div class="overlay"><i class="fa fa-film"></i></div>
</a>
<h3 class="post-title"><a href="http://blog.pivotdesk.com/603/startups/how-pivotdesk-used-the-ruby-foursquare-api-to-help-startups-find-office-space/#.Uu4Y1nddXA4">How PivotDesk Used the Ruby Foursquare API</a></h3>
<p class="post-meta"><span class="meta-date">May 2013</span><span class="meta-by"><a href="#">Fletcher</a></span></p>
<p class="post-content">
I explain my work using the Foursquare API to create PivotDesk lists in markets around the country.
</p>
<p class="post-read-more"><a href="http://blog.pivotdesk.com/603/startups/how-pivotdesk-used-the-ruby-foursquare-api-to-help-startups-find-office-space/#.Uu4Y1nddXA4" class="btn btn-primary btn-sm">Read More</a></p>
</article>
</div>
</div>
</div>
</div>
</section>
<section id="quote" class="dark">
<div class="container">
<div class="quote white" data-animate="fade-in">
<h2>Fletcher Richman has been an effective leader at CU-Boulder. In my 8 years of involvement at CU, he is easily among the top 3 student leaders we've had involved in entrepreneurship, and he might be the strongest. He's easily in the Tim Falls category of people who will leave CU better than he found it. He has lots of energy, is remarkably persistent, and is going to be a winner.</h2>
<p>- Brad Bernthal, Executive Director, Silicon Flatirons Entrepreneurship Initiatve -</p>
</div>
</div>
</section>
<section id="contact">
<div class="container page">
<div class="section-title">
<h1 data-animate="fade-in-top" data-delay="none">Contact</h1>
<hr data-animate="fade-in" data-delay="none" />
<p data-animate="fade-in-top" class="subheading">
I love emails!
</p>
</div>
<form id="contact-form" name="contact-form" action="#" method="post">
<div class="row">
<div class="col-xs-12 col-sm-12 col-md-offset-2 col-md-4 col-lg-offset-2 col-lg-4" data-animate="fade-in-left" data-delay="none">
<div class="form-group">
<input class="form-control input-lg" type="text" name="" placeholder="Name" />
</div>
<div class="form-group">
<input class="form-control input-lg" type="text" name="" placeholder="E-mail" />
</div>
<div class="form-group">
<input class="form-control input-lg" type="text" name="" placeholder="Subject" />
</div>
</div>
<div class="col-xs-12 col-sm-12 col-md-4 col-lg-4" data-animate="fade-in-right" data-delay="none">
<div class="form-group">
<textarea class="form-control" placeholder="Your message"></textarea>
</div>
<div class="form-group">
<input type="submit" class="btn btn-primary btn-lg btn-block" value="Submit" />
</div>
</div>
</div>
</form>
</div>
</section>
<section id="location-map">
<div id="google-map" class="map"></div>
</section>
<footer>
<h3>Fletcher.io</h3>
</footer>
</div>
<script src="assets/js/jquery.min.js"></script>
<script src="assets/js/bootstrap.min.js"></script>
<script src="assets/js/waypoints.min.js"></script>
<script src="assets/js/waypoints.sticky.js"></script>
<script src="assets/js/jquery.nav.js"></script>
<script src="assets/js/jquery.scrollTo.min.js"></script>
<script src="assets/js/jquery.bxslider.min.js"></script>
<script src="assets/js/jquery.cycle.all.min.js"></script>
<script src="assets/js/jquery.mixitup.min.js"></script>
<script src="assets/js/jquery.appear.js"></script>
<script src="assets/js/jquery.maximage.min.js"></script>
<script src="http://maps.google.com/maps/api/js?sensor=false"></script>
<script src="assets/js/jquery.gmap.min.js"></script>
<script src="assets/js/jquery.parallax.js"></script>
<script src="assets/js/spirito.js"></script>
<script src="assets/js/portfolio-grid.js"></script>
<script>
$(document).ready(function() {
Spirito.init().initSliders().initPortfolio().initMaps();
Grid.init();
$(window).load(function(){
$('#loader').fadeOut(1000,function(){ $(this).remove(); });
Spirito.parallax();
});
});
</script>
<script>document.write('<script src="http://' + (location.host || 'localhost').split(':')[0] + ':35729/livereload.js?snipver=1"></' + 'script>')</script>
</body>
</html>