-
Notifications
You must be signed in to change notification settings - Fork 0
/
store.html
166 lines (147 loc) · 7.17 KB
/
store.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
<!DOCTYPE HTML>
<!--
Helios by HTML5 UP
html5up.net | @ajlkn
Free for personal and commercial use under the CCA 3.0 license (html5up.net/license)
-->
<html>
<head>
<title>ndcartography-STORE</title>
<link rel="shortcut icon" href="images/favicon.ico" />
<meta charset="utf-8" />
<meta name="viewport" content="width=device-width, initial-scale=1" />
<!--[if lte IE 8]><script src="assets/js/ie/html5shiv.js"></script><![endif]-->
<link rel="stylesheet" href="assets/css/main.css" />
<!--[if lte IE 8]><link rel="stylesheet" href="assets/css/ie8.css" /><![endif]-->
</head>
<body class="no-sidebar">
<div id="page-wrapper">
<!-- Header -->
<div id="header">
<!-- Inner -->
<div class="inner">
<header>
<h1><a href="store.html" id="logo">STORE</a></h1>
</header>
</div>
<!-- Nav -->
<nav id="nav">
<ul>
<li><a href="index.html">RECENT WORK</a></li>
<li><a href="cv.html">CV</a></li>
<li><a href="store.html">STORE</a></li>
<li><a href="about.html">ABOUT</a></li>
<!--<li>
<a href="#">OTHER</a>
<ul>
<li><a href="#">Utilities</a></li>
<li>
<a href="#">Classwork …</a>
<ul>
<li><a href="#">GSP 316 (Cartography)</a></li>
<li><a href="#">GSP 416 (Advanced Cartography)</a></li>
<li><a href="#">GSP 318 (Programing)</a></li>
<li><a href="#">GSP 470 (Advanced GIS)</a></li>
</ul>
</li>
<li><a href="#">Published Works</a></li>
</ul>
</li> -->
</ul>
</nav>
</div>
<!-- Main -->
<div class="wrapper style1">
<div class="container">
<article id="main" class="special">
<h2><a href="#">Sierra Nevada</a></h2>
<p>
<b>Snow Cover 2017</b>
</p>
<p>
<i>20.8"x50.8" | $60.00</i>
</p>
<div class="row">
<article class="4u 12u(mobile) special">
<a href="images/thumbs/sierra-thumbs/thumb1.png" class="image featured"><img src="images/thumbs/sierra-thumbs/thumb1.png" alt="" /></a>
</article>
<article class="4u 12u(mobile) special">
<a href="images/thumbs/sierra-thumbs/thumb2.png" class="image featured"><img src="images/thumbs/sierra-thumbs/thumb2.png" alt="" /></a>
</article>
<article class="4u 12u(mobile) special">
<a href="images/thumbs/sierra-thumbs/thumb3.png" class="image featured"><img src="images/thumbs/sierra-thumbs/thumb3.png" alt="" /></a>
</article>
<article class="4u 12u(mobile) special">
<a href="images/thumbs/sierra-thumbs/thumb4.png" class="image featured"><img src="images/thumbs/sierra-thumbs/thumb4.png" alt="" /></a>
</article>
<article class="4u 12u(mobile) special">
<a href="images/thumbs/sierra-thumbs/thumb5.png" class="image featured"><img src="images/thumbs/sierra-thumbs/thumb5.png" alt="" /></a>
</article>
</div>
<p>
The early months of 2017 marked the highest snow cover levels for the Sierra Nevada Range in more than a decade. The snow land cover class on
this map was created from Landsat 8 imagery collected between January 1st and March 30th. This data was used to create false-color images that
highlight areas of snow that were then extracted and used as a masking layer in photoshop. This map captures the dramatic increase in snow cover
while only attempting to portray the breathtaking beauty of the Sierra Nevada. <br>
<div></div>
<b>Cartographic details worth mentioning:</b> <br>
I used a lightened swiss <a href="https://vimeo.com/humboldtgeography">hillshade</a> style relief (thank you <a href="http://ateliercarto.co/"> Aaron</a>), with isolated light blue shadowing on the areas of snow to give it a little more "frosty-ness".
The most difficult part of this map was making sure the snow cover had some textual dimension, instead of just appearing as a white blanket, placed
on top of some trees. For this, I added a slight gradient map in photoshop to distinguish snow covered areas at high elevations, versus those at lower
elevations. I also included additional texturing in areas where tree cover and snow cover intersected. A lot of hours, tears, love and joy went into
this map. Handle it with care and have fun exploring a landscape that's so near and dear to many of our hearts! Feel free to message me with any
questions, concerns or updates about this map: <a href='[email protected]'>[email protected]</a>
</p>
<footer>
<a href="https://www.zazzle.com/sierra_snow_cover_2017_poster-228736070856426598" target="_blank" class="button">Purchase Here</a>
<br>
<br>
<br>
<b><i>*Be sure to use the most current Zazzle coupon code when purchasing!* </i></b>
<br>
</footer>
<hr/>
</div>
</div>
</div>
<!-- Footer -->
<div id="footer">
<div class="container">
<div class="row">
<div class="12u">
<!-- Contact -->
<section class="contact">
<header>
<h3>Drop me a line:</h3>
</header>
<p> [email protected]</p>
<ul class="icons">
<li><a href="https://github.com/nadouglass7" class="icon fa-github"><span class="label">Github</span></a></li>
<li><a href="https://twitter.com/ndouglass7" class="icon fa-twitter"><span class="label">Twitter</span></a></li>
<li><a href="https://www.linkedin.com/in/nathaniel-douglass-480abb8a/" class="icon fa-linkedin"><span class="label">Linkedin</span></a></li>
</ul>
</section>
<!-- Copyright -->
<div class="copyright">
<ul class="menu">
<li>© ndcartography. All rights reserved.</li><li>Special thanks to: <a href="http://html5up.net">HTML5 UP</a></li>
</ul>
</div>
</div>
</div>
</div>
</div>
</div>
<!-- Scripts -->
<!-- fade out -->
<script>document.body.className += ' fade-out';</script>
<script src="assets/js/jquery.min.js"></script>
<script src="assets/js/jquery.dropotron.min.js"></script>
<script src="assets/js/jquery.scrolly.min.js"></script>
<script src="assets/js/jquery.onvisible.min.js"></script>
<script src="assets/js/skel.min.js"></script>
<script src="assets/js/util.js"></script>
<!--[if lte IE 8]><script src="assets/js/ie/respond.min.js"></script><![endif]-->
<script src="assets/js/main.js"></script>
</body>
</html>