/
index.html
238 lines (180 loc) · 11.2 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
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML+RDFa 1.0//EN" "http://www.w3.org/MarkUp/DTD/xhtml-rdfa-1.dtd">
<html class="no-js" lang="en">
<head>
<meta charset="utf-8">
<!--[if lt IE 9]>
<script src="https://html5shim.googlecode.com/svn/trunk/html5.js"></script>
<![endif]-->
<meta name='viewport' content='width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no' />
<meta http-equiv="x-ua-compatible" content="ie=edge">
<meta name="description" content=""/>
<!--facebook-->
<meta property="og:title" content="">
<meta property="twitter:title" content="">
<meta property="og:url" content="https://cag-org-in.github.io/scroll-map/">
<meta property="og:site_name" content="">
<meta property="og:description" content="">
<meta property="og:image" content="">
<meta property="twitter:image" content="">
<meta property="og:type" content="website">
<!-- stylesheets -->
<link rel="icon" href="images/about.png" type="image/x-icon">
<link rel="shortcut icon" href="images/about.png" type="image/x-icon">
<link rel="apple-touch-icon" href="images/about.png">
<link rel="apple-touch-icon-precomposed" href="images/about.png">
<title>CAG Stories</title>
<link href='http://fonts.googleapis.com/css?family=Pacifico' rel=
'stylesheet' type='text/css'>
<link href='http://fonts.googleapis.com/css?family=Montserrat' rel=
'stylesheet' type='text/css'>
<link href="css/foundation-icons.css" rel="stylesheet">
<link href="bower_components/foundation/css/foundation.css" rel=
"stylesheet" type="text/css">
<link rel="stylesheet" href="//api.mapbox.com/mapbox.js/v3.1.1/mapbox.css"/>
<link href="css/app.css" rel="stylesheet">
<!-- js -->
<script src="//api.mapbox.com/mapbox.js/v3.1.1/mapbox.js"></script>
<script src="bower_components/underscore/underscore.js"></script>
<script src="bower_components/modernizr/modernizr.js"></script>
</head>
<body class="section-0">
<!-- Splash page -->
<div id="pan">
<div class="fullscreen background" id="splash">
<div class="content-a">
<div class="content-b">
<span class="sub target fadeEl">Whose Right to the (Smart) City?</span>
<!--
<img id="logo" src="images/logo.png">
-->
<h1 class="target fadeEl">Street Vendors of T Nagar</h1>
<h2 class="target fadeEl">
<!-- -->
</h2>
<div class="content-c target fadeEl">
<a class="button secondary cust-button" href="#">Enter</a>
</div>
</div>
</div>
</div>
</div>
<!-- Main content -->
<div id="main-content-wrapper">
<!-- Map -->
<div id="map"></div>
<!-- Content -->
<article id='narrative'>
<section class='cover active' id='cover'>
<h2>Introduction</h2>
<p> Under the Smart Cities Mission, Chennai is striving to improve the lives of its urban population. However, this project is failing to involve citizens in what changes will be made, and thus it is failing to provide a sustainable and inclusive space for every citizen. In order to craft an inclusive city, we must hear from all voices. One group that needs addressed are the street vendors of T Nagar. This storymap aims to get a better grasp on the lives and business endeavors of the street vendors so that they too can be incorporated into the city.</p>
<img class="scroll" src="images/mouse_grey.png">
<h3>scroll</h3>
</section>
<section id='4693-2'>
<h3>Joining Forces</h3>
<img class="feature-img" src="images/IMG_4693 (2).jpg">
<p>The location choice for street vendors varies by vendor. This, in part, has to do with the product that the vendor sells. For these snack and tea vendors, they explained that they are located next to one another with the goal of attracting a large crowd. Groups of men will often congregate to have afternoon snacks and tea. In order to be thoughtfully incorporated into the Smart City space, the business strategy of the different types of street vendors must be investigated.</p>
</section>
<section id='5226'>
<h3>Interdependence</h3>
<img class="feature-img" src="images/IMG_5226.jpg">
<p>This street vendor has found a source of refuge in Naidu Hall, and the two maintain an interdependent relationship. This business utilizes its contacts to protect the vendors surrounding the shop during unjust times of eviction and confiscation. Furthermore, Naidu Hall provides the street vendors with water, security for themselves and their goods, and access to restroom facilities. </p>
</section>
<section id='5266'>
<h3>Forced Relocation</h3>
<img class="feature-img" src="images/IMG_5266.jpg">
<p>Despite being among the first businessmen to occupy T Nagar, street vendors are now deemed “encroachments.” Street vendors are often tossed around by the larger and stronger entities, therefore leaving the vendor’s business endeavors left to suffer. In particular, this vendor was forced to move from his past vending location which was located in front of Globus. </p>
</section>
<section id='828'>
<h3>Unpredictable</h3>
<img class="feature-img" src="images/DSC00828.jpg">
<p>To simply maintain his place on the street, this street vendor has to provide weekly payments to the police. No receipts for this payment are given, therefore providing the opportunity for further methods of injustice to be exerted onto the street vendor at a later date.</p>
</section>
<section id='842'>
<h3>The Right to Human Necessities</h3>
<img class="feature-img" src="images/DSC00842.jpg">
<p>With the groundbreaking of the Smart Cities mission in T Nagar soon to start, basic human necessities should be available to all. It is essential that each citizen’s needs are thought of—and acted upon—in the implementation of the Smart Cities mission. For the majority of vendors along this stretch and in T Nagar, a common complaint were distant toilets (or a lack thereof).</p>
</section>
<section id='4434-2'>
<h3>Enhancing the Experience</h3>
<img class="feature-img" src="images/IMG_4434 (2).jpg">
<p>Despite a pathway that is packed with parked autos, vendors, and pedestrians; many pedestrians flock to this central area of T Nagar for its vibrant shopping experience. For these shoppers, the street vendors enhance their experience: these vendors provide them with inexpensive jewelry to accompany their new sari and supply them with snacks to boost their energy so they can continue shopping under the afternoon sun.</p>
</section>
<section id='851'>
<h3>Cramped Quarters</h3>
<img class="feature-img" src="images/DSC00851.jpg">
<p>Street vendors have every right to this space and its consumers. However, Ranganathan and Natesan streets are small, cramped streets with no space between the building fronts and the street pavement. As a result, street vendors must locate themselves on the street if they want to profit from the multitude of shoppers in this area of T Nagar.
</p>
</section>
<section id='819'>
<h3>Neglecting a Means of Sustenance</h3>
<img class="feature-img" src="images/DSC00819.jpg">
<p>After speaking with several of these vendors, we came to find that the income that these street vendors make is the main source of revenue for their families. For many of these vendors, they are the only earners of the family. With expenses to cover such as their children’s education, food, household items, health care, and transportation; how can we neglect to positively incorporate the street vendors into the fabric of the city?</p>
</section>
<!--
<section id='about'>
<h3>The Team</h3><img class="feature-img" src=
"images/about.png">
<h4>The Staff</h4>
<div class="row">
<div class=" medium-4 columns">
<img class="round" src="images/team/asha.jpg">
<p>Asha Richardson<br>
<small>Project Manager</small></p>
</div>
<div class="medium-4 columns">
<img class="round" src="images/team/lob.jpg">
<p>Lo Benichou<br>
<small>Interactive News Developer</small></p>
</div>
<div class="medium-4 columns">
<img class="round" src="images/team/teresa.jpg">
<p>Teresa Chin<br>
<small>Producer and Designer</small></p>
</div>
</div>
<div class="row">
<div class=" medium-4 columns text-center">
<img class="round" src="images/team/lissa.jpg">
<p>Lissa Soep<br>
<small>Senior Editor</small></p>
</div>
<div class=" medium-4 columns text-center">
<img class="round" src="images/team/cliff.jpg">
<p>Clifford Lee<br>
<small>Scholar-in-Residence</small></p>
</div>
<div class=" medium-4 columns text-center">
<img class="round" src="images/team/ike.jpg">
<p>Ike Sriskandarajah<br>
<small>Science Producer</small></p>
</div>
</div>
<div class="row">
<div class=" small-12 columns text-center">
<p><small>This interactive was inspired by and adapted from <em>Young
Hahn's</em><a href=
"http://alistapart.com/article/hack-your-maps"> Shelock
Holmes map.</a></small></p>
</div>
</div>
</section>
-->
</article>
</div>
<!-- social -->
<div class="share-bttn"></div>
<!-- Modal trigger -->
<div class="text-center hide-for-touch" id="modal-trigger">
<a class="fi-plus large" id="plus" data-reveal-id="myModal" href="#" style=
"font-style: italic"></a>
<p class="hidden">Add Your Story!</p>
</div>
<!-- Script -->
<script src="bower_components/jquery/dist/jquery.min.js?v=2"></script>
<script src="bower_components/foundation/js/foundation.min.js?v=2"></script>
<script src="js/share.min.js"></script>
<script src="js/app.js"></script>
<script src="js/mailer.js"></script>
</body>
</html>