Skip to content

Instantly share code, notes, and snippets.

@jacksonvoelkel
Created September 20, 2017 19:57
Show Gist options
  • Save jacksonvoelkel/2da77d316da5f1588b62f59c7dfdd173 to your computer and use it in GitHub Desktop.
Save jacksonvoelkel/2da77d316da5f1588b62f59c7dfdd173 to your computer and use it in GitHub Desktop.
<!DOCTYPE html>
<!--[if lt IE 7]> <html class="no-js lt-ie9 lt-ie8 lt-ie7"> <![endif]-->
<!--[if IE 7]> <html class="no-js lt-ie9 lt-ie8"> <![endif]-->
<!--[if IE 8]> <html class="no-js lt-ie9"> <![endif]-->
<!--[if gt IE 8]><!--> <html class="no-js"> <!--<![endif]-->
<head>
<!-- BASICS -->
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
<title>Jackson Voelkel, Badass</title>
<meta name="description" content="">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<link rel="stylesheet" type="text/css" href="css/isotope.css" media="screen" />
<link rel="stylesheet" href="js/fancybox/jquery.fancybox.css" type="text/css" media="screen" />
<link rel="stylesheet" href="css/bootstrap.css">
<link rel="stylesheet" href="css/bootstrap-theme.css">
<link rel="stylesheet" href="css/style.css">
<!-- skin -->
<link rel="stylesheet" href="skin/default.css">
</head>
<body>
<section id="header" class="appear"></section>
<div class="navbar navbar-fixed-top" role="navigation" data-0="line-height:100px; height:100px; background-color:rgba(0,0,0,0.3);" data-300="line-height:60px; height:60px; background-color:rgba(0,0,0,1);">
<div class="container">
<div class="navbar-header">
<button type="button" class="navbar-toggle" data-toggle="collapse" data-target=".navbar-collapse">
<span class="fa fa-bars color-white"></span>
</button>
<h1><a class="navbar-brand" href="index.html" data-0="line-height:90px;" data-300="line-height:50px;"> </a></h1>
</div>
<div class="navbar-collapse collapse">
<ul class="nav navbar-nav" data-0="margin-top:20px;" data-300="margin-top:5px;">
<li class="active"><a href="index.html">Home</a></li>
<li><a href="#section-about">About</a></li>
<li><a href="#section-works">Projects</a></li>
<li><a href="#section-works">CV</a></li>
<li><a href="#section-works">Publications</a></li>
<li><a href="#section-contact">Contact</a></li>
</ul>
</div><!--/.navbar-collapse -->
</div>
</div>
<section class="featured">
<div class="container">
<div class="row mar-bot40">
<div class="col-md-6 col-md-offset-3">
<div class="align-center">
<i class="fa fa-map-marker fa-5x mar-bot20"></i>
<h2 class="slogan">Jackson Lee Voelkel</h2>
<p>
Geospatial Research Analyst and Master of Urban Studies Student
at Portland State University.
&nbsp;
Crashing computers one map at a time.
</p>
</div>
</div>
</div>
</div>
</section>
<!-- services -->
<section id="section-services" class="section pad-bot30 bg-white">
<div class="container">
<div class="row mar-bot40">
<div class="col-lg-4" >
<div class="align-center">
<i class="fa fa-code fa-5x mar-bot20"></i>
<h4 class="text-bold">Valid HTML5</h4>
<p>Lorem ipsum dolor sit amet, mutat graeco volumus ad eam, singulis patrioque comprehensam nam no.
Mei cu dicat voluptaria volumus.
</p>
</div>
</div>
<div class="col-lg-4" >
<div class="align-center">
<i class="fa fa-terminal fa-5x mar-bot20"></i>
<h4 class="text-bold">Responsive</h4>
<p>Lorem ipsum dolor sit amet, mutat graeco volumus ad eam, singulis patrioque comprehensam nam no.
Mei cu dicat voluptaria volumus.
</p>
</div>
</div>
<div class="col-lg-4" >
<div class="align-center">
<i class="fa fa-bolt fa-5x mar-bot20"></i>
<h4 class="text-bold">Customizable</h4>
<p>Lorem ipsum dolor sit amet, mutat graeco volumus ad eam, singulis patrioque comprehensam nam no.
Mei cu dicat voluptaria volumus.
</p>
</div>
</div>
</div>
</div>
</section>
<!-- spacer section:testimonial -->
<section id="testimonials" class="section" data-stellar-background-ratio="0.5">
<div class="container">
<div class="row">
<div class="col-lg-12">
<div class="align-center">
<div class="testimonial pad-top40 pad-bot40 clearfix">
<h5>
Nunc velit risus, dapibus non interdum quis, suscipit nec dolor. Vivamus tempor tempus mauris vitae fermentum. In vitae nulla lacus. Sed sagittis tortor vel arcu sollicitudin nec tincidunt metus suscipit.Nunc velit risus, dapibus non interdum.
</h5>
<br/>
<span class="author">&mdash; MIKE DOE <a href="#">www.siteurl.com</a></span>
</div>
</div>
</div>
</div>
</div>
</section>
<!-- about -->
<section id="section-about" class="section appear clearfix">
<div class="container">
<div class="row mar-bot40">
<div class="col-md-offset-3 col-md-6">
<div class="section-header">
<h2 class="section-heading animated" data-animation="bounceInUp">Our Team</h2>
<p>Neque porro quisquam est, qui dolorem ipsum quia dolor sit amet consectetur, adipisci velit, sed quia non numquam.</p>
</div>
</div>
</div>
<div class="row align-center mar-bot40">
<div class="col-md-3">
<div class="team-member">
<figure class="member-photo"><img src="img/team/member1.jpg" alt="" /></figure>
<div class="team-detail">
<h4>Jason Doe</h4>
<span>User experiences</span>
</div>
</div>
</div>
<div class="col-md-3">
<div class="team-member">
<figure class="member-photo"><img src="img/team/member2.jpg" alt="" /></figure>
<div class="team-detail">
<h4>Timothy Clark</h4>
<span>Web developer</span>
</div>
</div>
</div>
<div class="col-md-3">
<div class="team-member">
<figure class="member-photo"><img src="img/team/member3.jpg" alt="" /></figure>
<div class="team-detail">
<h4>Vicky Tan</h4>
<span>Web designer</span>
</div>
</div>
</div>
<div class="col-md-3">
<div class="team-member">
<figure class="member-photo"><img src="img/team/member4.jpg" alt="" /></figure>
<div class="team-detail">
<h4>Kevin Peterson</h4>
<span>UI designer</span>
</div>
</div>
</div>
</div>
</div>
</section>
<!-- /about -->
<!-- spacer section:stats -->
<section id="parallax1" class="section pad-top40 pad-bot40" data-stellar-background-ratio="0.5">
<div class="container">
<div class="align-center pad-top40 pad-bot40">
<blockquote class="bigquote color-white">Indoctum accusamus comprehensam</blockquote>
<p class="color-white">Bootstraptaste</p>
</div>
</div>
</section>
<!-- section works -->
<section id="section-works" class="section appear clearfix">
<div class="container">
<div class="row mar-bot40">
<div class="col-md-offset-3 col-md-6">
<div class="section-header">
<h2 class="section-heading animated" data-animation="bounceInUp">Portfolio</h2>
<p>Neque porro quisquam est, qui dolorem ipsum quia dolor sit amet consectetur, adipisci velit, sed quia non numquam.</p>
</div>
</div>
</div>
<div class="row">
<nav id="filter" class="col-md-12 text-center">
<ul>
<li><a href="#" class="current btn-theme btn-small" data-filter="*">All</a></li>
<li><a href="#" class="btn-theme btn-small" data-filter=".webdesign" >Web Design</a></li>
<li><a href="#" class="btn-theme btn-small" data-filter=".photography">Photography</a></li>
<li ><a href="#" class="btn-theme btn-small" data-filter=".print">Print</a></li>
</ul>
</nav>
<div class="col-md-12">
<div class="row">
<div class="portfolio-items isotopeWrapper clearfix" id="3">
<article class="col-md-4 isotopeItem webdesign">
<div class="portfolio-item">
<img src="img/portfolio/img1.jpg" alt="" />
<div class="portfolio-desc align-center">
<div class="folio-info">
<h5><a href="#">Portfolio name</a></h5>
<a href="img/portfolio/img1.jpg" class="fancybox"><i class="fa fa-plus fa-2x"></i></a>
</div>
</div>
</div>
</article>
<article class="col-md-4 isotopeItem photography">
<div class="portfolio-item">
<img src="img/portfolio/img2.jpg" alt="" />
<div class="portfolio-desc align-center">
<div class="folio-info">
<h5><a href="#">Portfolio name</a></h5>
<a href="img/portfolio/img2.jpg" class="fancybox"><i class="fa fa-plus fa-2x"></i></a>
</div>
</div>
</div>
</article>
<article class="col-md-4 isotopeItem photography">
<div class="portfolio-item">
<img src="img/portfolio/img3.jpg" alt="" />
<div class="portfolio-desc align-center">
<div class="folio-info">
<h5><a href="#">Portfolio name</a></h5>
<a href="img/portfolio/img3.jpg" class="fancybox"><i class="fa fa-plus fa-2x"></i></a>
</div>
</div>
</div>
</article>
<article class="col-md-4 isotopeItem print">
<div class="portfolio-item">
<img src="img/portfolio/img4.jpg" alt="" />
<div class="portfolio-desc align-center">
<div class="folio-info">
<h5><a href="#">Portfolio name</a></h5>
<a href="img/portfolio/img4.jpg" class="fancybox"><i class="fa fa-plus fa-2x"></i></a>
</div>
</div>
</div>
</article>
<article class="col-md-4 isotopeItem photography">
<div class="portfolio-item">
<img src="img/portfolio/img5.jpg" alt="" />
<div class="portfolio-desc align-center">
<div class="folio-info">
<h5><a href="#">Portfolio name</a></h5>
<a href="img/portfolio/img5.jpg" class="fancybox"><i class="fa fa-plus fa-2x"></i></a>
</div>
</div>
</div>
</article>
<article class="col-md-4 isotopeItem webdesign">
<div class="portfolio-item">
<img src="img/portfolio/img6.jpg" alt="" />
<div class="portfolio-desc align-center">
<div class="folio-info">
<h5><a href="#">Portfolio name</a></h5>
<a href="img/portfolio/img6.jpg" class="fancybox"><i class="fa fa-plus fa-2x"></i></a>
</div>
</div>
</div>
</article>
<article class="col-md-4 isotopeItem print">
<div class="portfolio-item">
<img src="img/portfolio/img7.jpg" alt="" />
<div class="portfolio-desc align-center">
<div class="folio-info">
<h5><a href="#">Portfolio name</a></h5>
<a href="img/portfolio/img7.jpg" class="fancybox"><i class="fa fa-plus fa-2x"></i></a>
</div>
</div>
</div>
</article>
<article class="col-md-4 isotopeItem photography">
<div class="portfolio-item">
<img src="img/portfolio/img8.jpg" alt="" />
<div class="portfolio-desc align-center">
<div class="folio-info">
<h5><a href="#">Portfolio name</a></h5>
<a href="img/portfolio/img8.jpg" class="fancybox"><i class="fa fa-plus fa-2x"></i></a>
</div>
</div>
</div>
</article>
<article class="col-md-4 isotopeItem print">
<div class="portfolio-item">
<img src="img/portfolio/img9.jpg" alt="" />
<div class="portfolio-desc align-center">
<div class="folio-info">
<h5><a href="#">Portfolio name</a></h5>
<a href="img/portfolio/img9.jpg" class="fancybox"><i class="fa fa-plus fa-2x"></i></a>
</div>
</div>
</div>
</article>
</div>
</div>
</div>
</div>
</div>
</section>
<section id="parallax2" class="section parallax" data-stellar-background-ratio="0.5">
<div class="align-center pad-top40 pad-bot40">
<blockquote class="bigquote color-white">Indoctum accusamus comprehensam</blockquote>
<p class="color-white">Bootstraptaste</p>
</div>
</section>
<section id="section-cv">
<div>
<div style="margin:20px">
<h1>Curriculum Vitae</h1>
<h2>Education</h2>
<ul>
<li><i>Master of Urban Studies (MUS)</i> (2017, current student), Portland State University, Portland, Oregon.
<br><u>Concentrations</u>: Geocomputation, urban spatial modeling
<br><u>Thesis</u>: Assessing issues of data quality variation in modeling the urban heat island effect across multiple North American cities.</li>
<br>
<li><i>BA Geography</i> (2014), Portland State University, Portland, Oregon
Minor: Geographic Information systems</li>
</ul>
<h2>Experience</h2>
<ul>
<li><i>Geospatial Research Analyst</i>, 2014 &ndash; Current
<br>Sustaining Urban Places Research Lab (SUPR Lab), Portland State University
<br>Projects:
<ul>
<li>CWS (Dasymetric and forcasting)</li>
<li>Metro (canopy classification)</li>
<li>BPS (Vulnerability tool)</li>
<li>PP&R Urban Forestry (Plantability tool)</li>
<li>Urban heat work (Portland, Eugene, Hermosillo, Richmond, Surrey)</li>
</ul>
<br>
<li><i>Graduate Research Assistant</i>, 2016 – Current
<br>Toulan School of Urban Studies and Planning, Portland State University
<br><u>Projects</u>: DVS, Plantabilty</li>
<br>
<li><i>Cartographer II, 2014</i>
<br>Center for Spatial Analysis and Research (CSAR), Portland State University
<br><u>Projects</u>: Cultural Atlas of Portland</li>
</ul>
<h2>Research Projects</h2>
<ul>
<li>Condec. Published in Oregon Metro’s Regional Land Information System (RLIS).</li>
<li>Canopy Analytics</li>
<li>Urban Heat Island Assessments <ul>
<li>Portland</li>
<li>Eugene</li>
<li>Hermosillo</li>
<li>Richmond</li>
<li>Surrey</li>
</ul></li>
<li>Clean water services</li>
<li>Plantability Assessment. Portland Parks and Recreation Urban Forestry</li>
<li>PDX Resiliency Application</li>
<li>Data Visualization Studio</li>
</ul>
<h2>Presentations</h2>
<ul>
<h4>Presentation</h4>
<li>Jackson Voelkel (2016). Canopy Analytics. Portland Parks and Recreation Urban Forestry Tree Inventory Summit, Portland, Oregon.</li>
<li>Jackson Voelkel (2016). Urban Canopy: Methods and Tools for Assessing Trees in the Portland Metro Area. City of Oregon City Natural Resources Committee.</li>
<li>Jackson Voelkel (2017). Towards Systematic Prediction of Urban Heat Islands. XIX International Botanical Congress – International Symposium on the Study of Advanced Ecological System Monitoring, Shenzhen, China.</li>
<li>Jackson Voelkel, Vivek Shandas (2016). Analytics for Characterizing Urban Heat Islands in Data Rich and Data Poor Locations. Portland State University Systems Science Seminar Series, Portland, Oregon.</li>
<li>Jackson Voelkel (2016). Keynote Address: Canopy Analytics – An interactive resource for tree discovery in the Portland Metro Area. West Multnomah Soil and Water Conservation District Annual Meeting, Portland, Oregon.</li>
<li>Jackson Voelkel (2016). Canopy Story. Annual Urban and Community Forestry Conference, Portland, Oregon.</li>
<li>Jackson Voelkel (2016). R for Spatial Analysis. Portland State University ASPRS Student Chapter Speaker Series, Portland, Oregon.</li>
<li>Jackson Voelkel (2017). R for Spatial Analysis. GIS in Action, Portland, Oregon.</li>
<li>Jackson Voelkel (2016). Evaluating Urban Heat Islands: A case study from Portland, Oregon. GIS in Action, Portland, Oregon.</li>
<li>Jackson Voelkel (2015). Evaluating Green Infrastructure: Fostering Interdisciplinary Research and Community Engagement. Part III: Urban Heat Islands in a Non-Desert Environment. University of Nagoya, Nagoya, Japan; University of Hokkaido, Hokkaido, Japan; Architectural Institute of Japan, Tokyo, Japan. [Lecture Series]</li>
<br>
<h4>Poster</h4>
<li>Voelkel, J., Shandas, V., Rao, M., & Thompson, A. (2015). Geocomputation for Urban Planning in the Era of Big Data: Developing Automated Tools for Analyzing LiDAR data to Inform Urban Planning and Policy in Portland, OR. Geocomputation, University of Texas, Dallas, Texas.</li>
<li>Jackson Voelkel, Vivek Shandas, Anandi van Diepen-Hedayat, Meenakshi Rao, Linda George. Toward neighborhood-scale climate adaptation: stakeholders, strategies, and decision support. Presented at the 14th Annual Urban Ecology and Conservation Symposium, Portland, Oregon, USA</li>
<li>Jackson Voelkel, Evan Kent, Angel Gomez (2014). Proximity to Pollution: A study of socioeconomic status in Los Angeles County, California. GIS in Action, Portland, Oregon.</li>
</ul>
<h2>Publications</h2>
<ul>
<p>&emsp;&emsp;Voelkel, J., & Shandas, V. (2017). Towards Systematic Prediction of Urban Heat Islands: Grounding Measurements, Assessing Modeling Techniques. <i>Climate</i>, 5(2), 41.</p>
<p>&emsp;&emsp;Shandas, V., van Diepen, A., Voelkel, J., & Rao, M. (2016). Coproducing Resilience through Understanding Vulnerability. <i>Building a Climate Resilient Economy and Society – Challenges and Opportunities</i>.</p>
<p>&emsp;&emsp;Voelkel, J., Shandas, V., & Haggerty, B. (2016). Developing High-Resolution Descriptions of Urban Heat Islands: A Public Health Imperative. <i>Preventing chronic disease</i>, 13.</p>
<p>&emsp;&emsp;Shandas, V., Voelkel, J., Rao, M., & George, L. (2016). Integrating High-Resolution Datasets to Target Mitigation Efforts for Improving Air Quality and Public Health in Urban Neighborhoods. <i>International journal of environmental research and public health</i>, 13(8), 790.</p>
<p>&emsp;&emsp;Banis, D., & Shobe, H. (2015). <i>Portlandness: A Cultural Atlas</i>. Sasquatch Books. [Contributing Cartographer].</p>
</ul>
<h2>Skills</h2>
<h2>Press</h2>
</div>
</div>
</section>
<!-- contact -->
<section id="section-contact" class="section appear clearfix">
<div class="container">
<div class="row mar-bot40">
<div class="col-md-offset-3 col-md-6">
<div class="section-header">
<h2 class="section-heading animated" data-animation="bounceInUp">Contact us</h2>
<p>Neque porro quisquam est, qui dolorem ipsum quia dolor sit amet consectetur, adipisci velit, sed quia non numquam.</p>
</div>
</div>
</div>
<div class="row">
<div class="col-md-8 col-md-offset-2">
<div class="cform" id="contact-form">
<div id="sendmessage">
Your message has been sent. Thank you!
</div>
<div id="errormessage"></div>
<form action="" method="post" role="form" class="contactForm">
<div class="form-group">
<label for="name">Your Name</label>
<input type="text" name="name" class="form-control" id="name" placeholder="Your Name" data-rule="minlen:4" data-msg="Please enter at least 4 chars" />
<div class="validation"></div>
</div>
<div class="form-group">
<label for="email">Your Email</label>
<input type="email" class="form-control" name="email" id="email" placeholder="Your Email" data-rule="email" data-msg="Please enter a valid email" />
<div class="validation"></div>
</div>
<div class="form-group">
<label for="subject">Subject</label>
<input type="text" class="form-control" name="subject" id="subject" placeholder="Subject" data-rule="minlen:4" data-msg="Please enter at least 8 chars of subject" />
<div class="validation"></div>
</div>
<div class="form-group">
<label for="message">Message</label>
<textarea class="form-control" name="message" rows="5" data-rule="required" data-msg="Please write something for us"></textarea>
<div class="validation"></div>
</div>
<button type="submit" class="btn btn-theme pull-left">SEND MESSAGE</button>
</form>
</div>
</div>
<!-- ./span12 -->
</div>
</div>
</section>
<!-- map -->
<section id="section-map" class="clearfix">
<div id="google-map" data-latitude="40.713732" data-longitude="-74.0092704"></div>
</section>
<section id="footer" class="section footer">
<div class="container">
<div class="row animated opacity mar-bot20" data-andown="fadeIn" data-animation="animation">
<div class="col-sm-12 align-center">
<ul class="social-network social-circle">
<li><a href="#" class="icoRss" title="Rss"><i class="fa fa-rss"></i></a></li>
<li><a href="#" class="icoFacebook" title="Facebook"><i class="fa fa-facebook"></i></a></li>
<li><a href="#" class="icoTwitter" title="Twitter"><i class="fa fa-twitter"></i></a></li>
<li><a href="#" class="icoGoogle" title="Google +"><i class="fa fa-google-plus"></i></a></li>
<li><a href="#" class="icoLinkedin" title="Linkedin"><i class="fa fa-linkedin"></i></a></li>
</ul>
</div>
</div>
<div class="row align-center copyright">
<div class="col-sm-12"><p>Copyright &copy; Jackson Voelkel</p>
<div class="credits">
<a href="https://bootstrapmade.com/">Bootstrap Themes</a> by <a href="https://bootstrapmade.com/">BootstrapMade</a>
</div>
</div>
</div>
</div>
</section>
<a href="#header" class="scrollup"><i class="fa fa-chevron-up"></i></a>
<script src="js/modernizr-2.6.2-respond-1.1.0.min.js"></script>
<script src="js/jquery.js"></script>
<script src="js/jquery.easing.1.3.js"></script>
<script src="js/bootstrap.min.js"></script>
<script src="https://maps.google.com/maps/api/js?sensor=true"></script>
<script src="js/jquery.isotope.min.js"></script>
<script src="js/jquery.nicescroll.min.js"></script>
<script src="js/fancybox/jquery.fancybox.pack.js"></script>
<script src="js/skrollr.min.js"></script>
<script src="js/jquery.scrollTo-1.4.3.1-min.js"></script>
<script src="js/jquery.localscroll-1.2.7-min.js"></script>
<script src="js/stellar.js"></script>
<script src="js/jquery.appear.js"></script>
<script src="js/main.js"></script>
<script src="contactform/contactform.js"></script>
</body>
</html>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment