-
Notifications
You must be signed in to change notification settings - Fork 0
/
index.html
230 lines (227 loc) · 13.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
<!DOCTYPE html>
<html lang="en" class="no-js">
<head>
<meta charset="UTF-8">
<title>John Boese</title>
<meta name="description" content="Founder of GoFindFriends.com and co-founder of FairClaims.com.">
<meta name="viewport" content="width=device-width, initial-scale=1">
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.2/css/bootstrap.min.css">
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.2/css/bootstrap-theme.min.css">
<link rel="stylesheet" type="text/css" href="css/styles.css">
<link href="https://fonts.googleapis.com/css?family=Montserrat" rel="stylesheet">
<link rel="icon" type="image/png" href="/favicon-32x32.png" sizes="32x32">
<link rel="icon" type="image/png" href="/favicon-16x16.png" sizes="16x16">
</head>
<body>
<!-- <nav class="navbar navbar-default navbar-static-top">
<div class="container">
<div class="navbar-header">
<button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target="#navbar" aria-expanded="false" aria-controls="navbar">
<span class="sr-only">Toggle navigation</span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
</button>
</div>
<div id="navbar" class="navbar-collapse collapse">
<ul class="nav navbar-nav">
<li><a href="#web-development">Web & App Development</a></li>
<li><a href="#product-management">Product Management</a></li>
<li><a href="#marketing-innovation">Marketing Innovation</a></li>
</ul>
<ul class="nav navbar-nav navbar-right">
<li><a href="https://www.linkedin.com/in/johnboese" target="_blank" class="social-media-icons"><img src='img/link.png' /></a></li>
<li><a href="https://github.com/johncodesgood" target="_blank" class="social-media-icons"><img src='img/gh.png' /></a></li>
<li><a href="https://twitter.com/johnboese" target="_blank" class="social-media-icons"><img src='img/tw.png' /></a></li>
<li><a href="https://www.facebook.com/john.o.boese" target="_blank" class="social-media-icons"><img src='img/fb-square.png' /></a></li>
</ul>
</div>
</div>
</nav> -->
<div class="container-fluid homepage">
<div class="row hero-box">
<div class="col-xs-12 col-md-8 hidden-sm hidden-xs">
<img class="hero-image shadow" src="img/nypost-top.jpeg" />
</div>
<div class="col-xs-12 col-md-4">
<div class="profile-box">
<!-- <p>I'm a <a href="#web-development" class="home-words-color">Web Developer</a> and <a href="#product-management" class="home-words-color">Product Manager</a> looking for freelance projects. <a href="" class="home-words-color" data-toggle="modal" data-target="#hireModal">Hire Me.</a></p> -->
<!-- <p>I'm a <a href="#web-development" class="home-words-color">Web Developer,</a> <a href="#product-management" class="home-words-color">Product Manager,</a> and <a href="https://GoFindFriends.com" target="_blank" class="home-words-color">Founder of GoFindFriends.com</a></p> -->
<p class="name">Hey, I'm John.</p>
<p class="headline">Co-founder and CTO of FairClaims.</p>
<!-- <p class="headline">I help startups get started.</p> -->
<div class="spotlight inset"><a href="#web-development" class="btn btn-secondary button large dark primary glyph-globe"><span class="text ellipsis">View my latest work</span></a></div>
<!-- <p>By building sites and getting users.</p> -->
<div class="bio">
<p>I've co-founded two companies and they've been featured in the <a href="https://nypost.com/2015/09/01/i-have-300-facebook-friends-and-nobody-to-hang-out-with/" target="_blank" class="media-links">New York Post</a> and <a href="https://techcrunch.com/2017/07/12/fairclaims-raises-1-8-million-to-be-a-virtual-judge-judy/" target="_blank" class="media-links">TechCrunch</a>. I've also been quoted in the <a href="https://www.wsj.com/articles/the-importance-of-having-friends-for-older-guys-1445220135" target="_blank" class="media-links">Wall Street Journal</a>, <a href="https://www.forbes.com/sites/kaytiezimmerman/2016/08/08/can-a-millennial-quarter-life-crisis-be-cured-by-their-employer/#168c6166446f" target="_blank" class="media-links">Forbes</a>, and <a href="https://www.fastcompany.com/3061094/six-habits-of-people-who-make-friends-easily" target="_blank" class="media-links">FastCompany</a>.</p>
<!-- <p>I've co-founded two companies and I help people go from an idea to the first version of their product.</p> -->
<p class="hidden-md">I've been a Product Director and Marketing Director at companies including IBM, Ogilvy, and American Express.</p>
<!-- <p>My claims to fame are that I have a YouTube video with 100,000+ views and I wrote a song that was featured on the MTV show "The Real World."</p> -->
<div class="meta-header">Education</div>
<ul class="education-section">
<li>MBA, Duke University</li>
<li>BS Electrical Engineering, Penn State University</li>
</ul>
<ul class="social-media-section">
<li><a href="https://www.linkedin.com/in/johnboese" target="_blank" class="social-media-icons"><img class="shadow" src='img/link.png' /></a></li>
<li><a href="https://github.com/johncodesgood" target="_blank" class="social-media-icons"><img class="shadow" src='img/gh.png' /></a></li>
<li><a href="https://twitter.com/johnboese" target="_blank" class="social-media-icons"><img class="shadow" src='img/tw.png' /></a></li>
<li><a href="https://www.facebook.com/john.o.boese" target="_blank" class="social-media-icons"><img class="shadow" src='img/fb-square.png' /></a></li>
</ul>
</div>
<!-- <a href="#web-development" class="home-words-color">Web Developer,</a> <a href="#product-management" class="home-words-color">Product Manager,</a> and <a href="https://GoFindFriends.com" target="_blank" class="home-words-color">Founder of GoFindFriends.com</a></p> -->
</div>
</div>
</div>
<!-- <video class="hidden-xs" autoplay id="bgvid" loop>
<video class="hidden-xs" autoplay poster="img/speaking-still.jpg" id="bgvid" loop>
<source src="img/Ogilvy3.webm" type="video/webm">
<source src="img/Ogilvy3.mp4" type="video/mp4">
</video> -->
<!-- <video preload="auto" id="bgvid" autoplay="autoplay" onended="run()">
<source src="https://player.vimeo.com/external/293075620.hd.mp4?s=e13e1e0671c3c4dea410f53c399b70b3b2d9b239&profile_id=174" type="video/mp4">
</video> -->
</div>
<div class="container-fluid">
<a name="web-development"></a>
<div class="row">
<div class="col-xs-12" id="web-development">
<div class="col-xs-12 section-header">
<p>Web & App Development</p>
</div>
<div class="row">
<div class="col-xs-12 col-md-6 text-center">
<h4><strong>GoFindFriends</strong></h4>
<p class="no-margin">Social networking site to meet new people and join fun events</p>
<p>AngularJS • Firebase • Facebook API</p>
<a href="https://gofindfriends.com/" target="_blank">
<img src="img/gofindfriends2.gif" class="img-scale center-block shadow">
</a>
</div>
<div class="col-xs-12 col-md-6 text-center">
<h4><strong>GoFindFriends iPhone App</strong></h4>
<p class="no-margin">App with all the features of the GoFindFriends website</p>
<p>AngularJS • Ionic • Phonegap</p>
<img src="img/gff-appstore-screenshot.png" class="img-scale center-block shadow inline">
</div>
</div>
<div class="row">
<div class="col-xs-12 col-md-6 text-center">
<h4><strong>FairClaims</strong></h4>
<p class="no-margin">Resolve disputes online without going to court</p>
<p>Ruby on Rails • Vue.js • PostgreSQL</p>
<a href="https://www.fairclaims.com/" target="_blank">
<img src="img/fairclaims-home.png" class="img-scale center-block shadow">
</a>
</div>
<div class="col-xs-12 col-md-6 text-center">
<h4><strong>EliteHired</strong></h4>
<p class="no-margin">Sources top talent in the advertising and media industries</p>
<p>AngularJS • LinkedIn API • Indeed API</p>
<a href="https://elitehired.com/" target="_blank">
<img src="img/elitehired.gif" class="img-scale center-block shadow">
</a>
</div>
</div>
<div class="row">
<div class="col-xs-12 col-md-6 text-center">
<h4><strong>Trendsight</strong></h4>
<p class="no-margin">Independent clothing retailers share data to more quickly identify trends</p>
<p>JavaScript • jQuery • Tableau</p>
<a href="http://johnboese.com/trendsight/" target="_blank">
<img src="img/trendsight-home.png" class="img-scale center-block shadow">
</a>
</div>
<div class="col-xs-12 col-md-6 text-center">
<h4><strong>DateSpeak</strong></h4>
<p class="no-margin">Personal project to recommend date ideas in NYC</p>
<p>Backbone.js • Express • PostgreSQL</p>
<a href="http://datespeak.com/" target="_blank">
<img src="img/datespeak.gif" class="img-scale center-block shadow">
</a>
</div>
</div>
</div>
</div>
<a name="product-management"></a>
<div class="row">
<div class="col-xs-12" id="product-management">
<div class="col-xs-12 section-header">
<p>Product Management</p>
</div>
<div class="row">
<div class="col-xs-12 col-md-6 text-center">
<h4><strong>American Express Video Chat</strong></h4>
<p>Video chat with customer service on the Amex iPad app</p>
<img src="img/video-chat.jpg" class="img-scale center-block shadow">
</div>
<div class="col-xs-12 col-md-6 text-center">
<h4><strong>The Matching Game</strong></h4>
<p>Facebook dating app where you match up your friends</p>
<img src="img/matching-game.jpg" class="img-scale center-block shadow">
</div>
</div>
<div class="row">
<div class="col-xs-12 col-md-6 text-center">
<h4><strong>American Express iPhone and iPad Apps</strong></h4>
<p>Amex iPhone apps launched in 10 international markets</p>
<img src="img/amex-iphone.png" class="img-scale center-block">
</div>
<div class="col-xs-12 col-md-6 text-center">
<h4><strong>Urban Dash iPhone App</strong></h4>
<p>Location-based augmented reality game for New Balance Shoes</p>
<img src="img/new-balance.jpg" class="img-scale center-block">
</div>
</div>
</div>
</div>
<a name="marketing-innovation"></a>
<div class="row">
<div class="col-xs-12" id="marketing-innovation">
<div class="col-xs-12 section-header">
<p>Marketing Innovation</p>
</div>
<div class="row">
<div class="col-xs-12 col-md-6 text-center">
<h4><strong>Ogilvy & Mather Innovation Lab</strong></h4>
<p>Former Head of Ogilvy's Digital Innovation Lab in New York</p>
<div class="embed-responsive embed-responsive-16by9 video-bottom">
<iframe class="embed-responsive-item video-scale" src="https://www.youtube.com/embed/BAUfjQLKruQ"></iframe>
</div>
</div>
<div class="col-xs-12 col-md-6 text-center">
<h4><strong>Mobile Marketing</strong></h4>
<p>Panel speaker at App Development conference</p>
<div class="embed-responsive embed-responsive-16by9 video-bottom">
<iframe class="embed-responsive-item video-scale" src="https://www.youtube.com/embed/bFGMOPRl2fI?start=1178"></iframe>
</div>
</div>
</div>
</div>
</div>
<!-- <div class="row">
<div class="col-xs-12 footer">
<p> </p>
</div>
</div> -->
</div>
<div class="modal fade" id="hireModal" tabindex="-1" role="dialog" aria-labelledby="basicModal" aria-hidden="true">
<div class="modal-dialog">
<div class="modal-content">
<div class="modal-header">
<button type="button" class="close" data-dismiss="modal" aria-hidden="true">×</button>
<h4 class="modal-title" id="myModalLabel">Hire Me</h4>
</div>
<div class="modal-body">
<p>I'm currently looking for freelance opportunities in Web Development and Product Management. You can email me at <a href="mailto:john@gofindfriends.com">john(at)gofindfriends(dot)com</a> and we can set up some time to chat!</p>
</div>
<div class="modal-footer">
<button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
</div>
</div>
</div>
</div>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.11.2/jquery.min.js"></script>
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.2/js/bootstrap.min.js"></script>
</body>
</html>