-
Notifications
You must be signed in to change notification settings - Fork 0
/
Copy pathindex.html
246 lines (220 loc) · 11.7 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
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1">
<!-- The above 3 meta tags *must* come first in the head; any other head content must come *after* these tags -->
<meta name="description" content="Introduction to Tabletop Game Design">
<meta name="author" content="HasGeek and friends">
<meta name="keywords" content="Workshops, Tabletop, Game development, gamedev, board games, game design, Bangalore, Bengaluru, India">
<meta property="og:title" content="Introduction to Tabletop Game Design"/>
<meta property="og:image" content=""/>
<meta property="og:url" content="https://tabletopdesign.hasgeek.com/"/>
<meta property="og:description" content="Introduction to the elements of tabletop games as well as a hands on experience with the game design process."/>
<meta name="twitter:card" content="summary_large_image" />
<meta name="twitter:site" content="@hasgeek" />
<meta name="twitter:title" content="Introduction to Tabletop Game Design" />
<meta name="twitter:image" content="">
<title>Introduction to Tabletop Game Design</title>
<!-- Bootstrap -->
<link href="css/bootstrap.min.css" rel="stylesheet">
<!-- Main CSS file -->
<link rel="stylesheet" href="css/main.css">
<!-- Leaflet CSS file -->
<link rel="stylesheet" href="css/leaflet.min.css" />
<!-- Font Awesome CSS file for social buttons-->
<link href="css/font-awesome.min.css" rel="stylesheet">
<link rel="manifest" href="/manifest.json">
<script>window._izq = []; window._izq.push(["init", { "auto_prompt" : false } ]);</script>
<script>
try{window.izConfig=JSON.parse('{"client":9977,"sourceOrigin":"https://tabletopdesign.hasgeek.com","domainRoot":"","webPushId":"","webServiceUrl":"","isSdkHttps":1,"customPixelLink":"","mobileAllowed":1,"serviceWorkerName":"/sw.js","manifestName":"/manifest.json","desktopAllowed":1,"setEnr":1,"izootoStatus":1,"debug":0,"siteUrl":"https://tabletopdesign.hasgeek.com","promptDelay":0,"repeatPromptDelay":0,"tagsEnabled":1,"welcomeNotification":{"status":0,"title":"","body":"","icon":"","url":"","showAfter":0,"clickTimeout":0},"locale":"en"}');var container=document.body?document.body:document.head;if(""!==izConfig.customPixelLink){var _izAlt=document.createElement("script");_izAlt.id="izootoAlt",_izAlt.src=izConfig.customPixelLink,container.appendChild(_izAlt)}else{var _iz=document.createElement("script");_iz.id="izootoSdk",_iz.src="https://cdn.izooto.com/scripts/sdk/izooto.js?v=3.7.2",container.appendChild(_iz)}}catch(err){}
</script>
</head>
<body>
<div id="fb-root"></div>
<script>(function(d, s, id) {
var js, fjs = d.getElementsByTagName(s)[0];
if (d.getElementById(id)) return;
js = d.createElement(s); js.id = id;
js.src = "//connect.facebook.net/en_US/sdk.js#xfbml=1&version=v2.8&appId=1601103083538049";
fjs.parentNode.insertBefore(js, fjs);
}(document, 'script', 'facebook-jssdk'));</script>
<div id="networkbar" data-siteid="workshops"></div>
<header class="header">
<div class="content container">
<h1 class="text-left title">Introduction to</h1><h1 class="text-left title">Tabletop Game Design</h1>
<p class="text-left date">Sunday, 26 Feb 2017</p>
<p class="text-left date">11am to 4pm</p>
<p class="text-left venue-text"><a href="https://goo.gl/maps/Mn3ycephnB62" target="_blank">HasGeek, Bangalore</a></p>
<p class="text-left price"></p>
<div class="text-left">
<a class="btn btn-primary btn-transparent btn-lg buy-ticket smooth-scroll" href="#tickets">Sold out!</a>
</div>
</div>
</header>
<!-- Workshop details -->
<div class="container workshop-details">
<div class="intro">
<!-- Event Blurb -->
<p class="text-left">
For over 6 years now, HasGeek’s focus has been to provide a platform for people in technology meet each other, collaborate on new opportunities and share knowledge and ideas. We’ve done this by organizing conferences, hacknights, workshops and meetups around topics such as <a href="https://metarefresh.in">front end engineering</a>, <a href="https://fifthelephant.in">big data and cloud computing</a>, <a href="https://jsfoo.in">JavaScript</a>, <a href="https://droidcon.in">Android</a>, and <a href="https://rootconf.in">devops</a>
<br>
<br>
In 2017 we want to explore how we can do the same for game development.</p>
</div>
<div>
<p>To receive updates and information about tickets, speakers, schedule and more</p>
<button class="btn btn-primary" id="subscribe" onclick="window._izq.push(['triggerPrompt']);">Subscribe</button>
<button class="btn btn-primary hide" id="unsubscribe" onclick='_izq.push(["updateSubscription","unsubscribe"]);'>Unsubscribe</button>
</div>
<!-- Why attend? -->
<div class="section">
<h2 class="text-left heading">Who is this for?</h2>
<p class="text-left para">
Anyone who is curious about what goes into building a tabletop game and the game design mechanics that make them work. If you’ve been thinking about making a board game, remixing a favourite, or just enjoy learning something new, you should attend this workshop.
</p>
</div>
<!-- What will you learn? -->
<div class="section clearfix">
<h2 class="text-left heading">What will be covered?</h2>
<div class="col-sm-12 col-xs-12">
<ul class="para">
<li>
<p>An introduction to basic elements of game-design (mechanics, actions, goal, narrative)</p>
</li>
<li>
<p>You will come up with a narrative with the help of randomly distributed picture cards(which we’ll provide)</p>
</li>
<li>
<p>We’ll add a layer of action points and goals on top of this storyline and implement one single mechanic (from a list of 10 basic ones)</p>
</li>
<li>
<p>You’ll test the new game against 5 random lenses (We’ll be using the deck of lenses by Jesse Schell)</p>
</li>
<li>
<p>Making a pitch for the refined game</p>
</li>
</ul>
</div>
</div>
<!-- Why attend? -->
<div class="section">
<h2 class="text-left heading">What is the takeaway?</h2>
<p class="text-left para">
Participants will have their very own prototypes by the end of the workshop, which they can build on, refine, and play with others.
</p>
<div class="text-center">
<a class="btn btn-primary btn-transparent btn-lg buy-ticket smooth-scroll" href="#tickets">Sold out!</a>
</div>
</div>
<!-- Prerequisites? -->
<div class="section">
<h2 class="text-left heading">Prerequisites</h2>
<p class="text-left para">
Come mentally prepared for a super fun hands-on session.
</p>
</div>
<div class="section">
<p class="text-left para">
Feel free to reach out to Karthik at <a href="mailto:karthikb351">[email protected]</a> or <a href="https://twitter.com/karthikb351">@karthikb351</a> with any questions.
</p>
</div>
</div> <!-- End of workshop details -->
<div class="trainer-wrapper">
<div class="trainer-bio">
<h2 class="text-left heading">About the instructor</h2>
<div class="row">
<div class="col-sm-2 col-xs-12">
<img src="https://imgee.s3.amazonaws.com/imgee/a439cbdb833642478c1e77be76144a87.png" class="instructor-image">
</div>
<div class="col-sm-10 col-xs-12">
<h3 class="instructor">Veethika Mishra</h3>
<p class="para">Veethika is a tabletop game experience designer based out of Bangalore. She completed her post graduation in Toy and Game design from National Institute of Design. She has also explored the licensing and pedagogy scope in tabletop games and has endorsed it in events like NGDC, OER and FUEL GILT.</p>
</div>
</div>
</div>
</div>
<div class="container ticketing" id="tickets">
<div class="text-center">
<h2>Register</h2>
<p>We've sold out!</p>
</div>
<div id="boxoffice-widget"><p class="text-center">Loading...</p></div>
</div>
<div class="container venue">
<!-- Venue Section -->
<div class="text-center">
<h2>Venue</h2>
</div>
<div class="venue-location">
<div class="col-sm-4 col-sm-offset-2 col-sm-12">
<p class="address-description">
<strong>HasGeek House</strong>
</p>
<p class="address">
#2699, 19th Main, 5th Cross<br/>
Behind Carlton tower<br/>
Indiranagar HAL 2nd Stage<br/>
Bangalore - 560008<br/>
</p>
</div>
<div class="col-sm-4 col-sm-12">
<div id="map" class="leaflet-map"></div>
</div>
</div>
</div>
<!--Footer-->
<footer>
<div class="logo-wrapper">
<img src="images/hg-logo-192x192.png" class="hasgeek-logo" alt="HasGeek">
</div>
<div class="about">
<p><a href="https://hasgeek.com" target="_blank">HasGeek</a> creates discussion spaces for geeks. Come to our events to meet like-minded people, learn new things and discover new opportunities. We operate <a href="https://hasjob.co/" target="_blank">Hasjob</a>, hang out on a <a href="https://friends.hasgeek.com/" target="_blank">Slack channel</a>, and publish our code. Our activities reach thousands of developers every month. <a href="https://talkfunnel.com/" target="_blank">Speak at our events</a>, or <a href="http://eepurl.com/duGmH" target="_blank">sign up to be notified</a> when we do one. Watch videos from past events on <a href="https://hasgeek.tv/" target="_blank">HasGeek TV</a>.</p>
</div>
</footer>
<!-- necessary for HasGeek networkbar -->
<script src="js/networkbar.js"></script>
<!-- jQuery (necessary for Bootstrap's JavaScript plugins) -->
<script src="js/jquery-1.12.4.min.js"></script>
<!-- Include all compiled plugins (below), or include individual files as needed -->
<script src="js/bootstrap.min.js"></script>
<!-- necessary for loading maps -->
<script src="js/leaflet-0.6.3.js"></script>
<script src="js/main.js"></script>
<script>window.twttr = (function(d, s, id) {
var js, fjs = d.getElementsByTagName(s)[0], t = window.twttr || {};
if (d.getElementById(id)) return t;
js = d.createElement(s);
js.id = id;
js.src = "https://platform.twitter.com/widgets.js";
fjs.parentNode.insertBefore(js, fjs);
t._e = [];
t.ready = function(f) {
t._e.push(f);
};
return t;
}(document, "script", "twitter-wjs"));
</script>
<script>
if ('serviceWorker' in navigator) {
navigator.serviceWorker.register('/sw.js').then(function() {
console.log("Service Worker Registered");
});
navigator.serviceWorker.ready.then(function(serviceWorkerRegistration) {
serviceWorkerRegistration.pushManager.getSubscription().then(
function(pushSubscription) {
console.log("pushSubscription", pushSubscription);
// Check we have a subscription to unsubscribe
if (pushSubscription) {
$("#subscribe").hide();
$("#unsubscribe").show().removeClass('hide');
return;
}
}
);
});
}
</script>
</body>
</html>