-
Notifications
You must be signed in to change notification settings - Fork 2
Expand file tree
/
Copy pathindex.html
More file actions
774 lines (686 loc) · 49.7 KB
/
index.html
File metadata and controls
774 lines (686 loc) · 49.7 KB
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
247
248
249
250
251
252
253
254
255
256
257
258
259
260
261
262
263
264
265
266
267
268
269
270
271
272
273
274
275
276
277
278
279
280
281
282
283
284
285
286
287
288
289
290
291
292
293
294
295
296
297
298
299
300
301
302
303
304
305
306
307
308
309
310
311
312
313
314
315
316
317
318
319
320
321
322
323
324
325
326
327
328
329
330
331
332
333
334
335
336
337
338
339
340
341
342
343
344
345
346
347
348
349
350
351
352
353
354
355
356
357
358
359
360
361
362
363
364
365
366
367
368
369
370
371
372
373
374
375
376
377
378
379
380
381
382
383
384
385
386
387
388
389
390
391
392
393
394
395
396
397
398
399
400
401
402
403
404
405
406
407
408
409
410
411
412
413
414
415
416
417
418
419
420
421
422
423
424
425
426
427
428
429
430
431
432
433
434
435
436
437
438
439
440
441
442
443
444
445
446
447
448
449
450
451
452
453
454
455
456
457
458
459
460
461
462
463
464
465
466
467
468
469
470
471
472
473
474
475
476
477
478
479
480
481
482
483
484
485
486
487
488
489
490
491
492
493
494
495
496
497
498
499
500
501
502
503
504
505
506
507
508
509
510
511
512
513
514
515
516
517
518
519
520
521
522
523
524
525
526
527
528
529
530
531
532
533
534
535
536
537
538
539
540
541
542
543
544
545
546
547
548
549
550
551
552
553
554
555
556
557
558
559
560
561
562
563
564
565
566
567
568
569
570
571
572
573
574
575
576
577
578
579
580
581
582
583
584
585
586
587
588
589
590
591
592
593
594
595
596
597
598
599
600
601
602
603
604
605
606
607
608
609
610
611
612
613
614
615
616
617
618
619
620
621
622
623
624
625
626
627
628
629
630
631
632
633
634
635
636
637
638
639
640
641
642
643
644
645
646
647
648
649
650
651
652
653
654
655
656
657
658
659
660
661
662
663
664
665
666
667
668
669
670
671
672
673
674
675
676
677
678
679
680
681
682
683
684
685
686
687
688
689
690
691
692
693
694
695
696
697
698
699
700
701
702
703
704
705
706
707
708
709
710
711
712
713
714
715
716
717
718
719
720
721
722
723
724
725
726
727
728
729
730
731
732
733
734
735
736
737
738
739
740
741
742
743
744
745
746
747
748
749
750
751
752
753
754
755
756
757
758
759
760
761
762
763
764
765
766
767
768
769
770
771
772
773
774
<!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">
<link rel="icon" type="image/jpg" href="img/yellowBrickLogo.png" />
<title>Innovation Fellowship | Charlie Cuddy</title>
<!-- Bootstrap -->
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css">
<link href="bootstrap/css/bootstrap.min.css" rel="stylesheet">
<link href="style.css" rel="stylesheet">
<!-- Display for Mobile Only -->
<style type="text/css">
.mobileShow { display: none;}
/* Smartphone Portrait and Landscape */
@media only screen
and (min-device-width : 320px)
and (max-device-width : 480px){ .mobileShow { display: inline; }}
</style>
<!-- Javscript for Scrolling -->
<script src="//ajax.googleapis.com/ajax/libs/jquery/2.2.0/jquery.min.js"></script>
<script>
$(function() {
$('a[href*="#"]:not([href="#"])').click(function() {
if (location.pathname.replace(/^\//,'') == this.pathname.replace(/^\//,'') && location.hostname == this.hostname) {
var target = $(this.hash);
target = target.length ? target : $('[name=' + this.hash.slice(1) +']');
if (target.length) {
$('html, body').animate({
scrollTop: target.offset().top
}, 1000);
return false;
}
}
});
});
</script>
</head>
<body>
<!-- ################################################
############### NAV BAR ################
################################################ -->
<nav class="navbar navbar-fixed-top navbar-inverse">
<div class="container">
<div class="navbar-header">
<button type="button" class="navbar-toggle collapsed" data-toggle="collapse"
data-target="#navbar-collapse">
<span class="sr-only">Toggle Navigation</span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
</button>
<a class="navbar-brand" href="#home"><img class="initial" src="img/legos.png"></a>
</div>
<div class="collapse navbar-collapse" id="navbar-collapse">
<ul class="nav navbar-nav navbar-right">
<li><a href="#goal">Goal</a></li>
<li><a href="#firstDays">Getting Started</a></li>
<li><a href="#browserCode">Code in Browser</a></li>
<li class="dropdown">
<a href="#" class="dropdown-toggle" data-toggle="dropdown" role="button"
aria-haspopup="true" aria-expanded="false">BrickLayer
<span class="caret"></span></a>
<ul class="dropdown-menu">
<li><a href="#downloads">Downloads</a></li>
<li><a href="#twoDcode">Coding in Bricklayer</a></li>
<li><a href="#projects" target="_blank">Projects</a></li>
</ul>
<li><a href="#innovationTeam">Innovation Team</a></li>
<li><a href="#contact_info">Contact Me</a></li>
</ul>
</div>
</div>
</nav>
<!-- ################################################
############## INTRODUCTION ##############
################################################ -->
<div id="home" class="cover">
<div class="cover-text">
</br></br>
<h2 id="headline">Innovation Fellowship</h2>
<div class="introIcons">
<a href="http://dospace.org/" target="_blank">
<img src="img/doSpace.jpg" id="doSpaceIcon"></a>
<a href="https://bricklayerdotorg.wordpress.com/" target="_blank">
<img src="img/bricklayer.jpg" id="bricklayerIcon"></a>
</div>
<h3 id="description">Do Space Innovation Fellowship by
<a href="https://codecuddy.github.io" target="_blank">Charlie Cuddy</a> with Bricklayer</h3>
</br>
<h4><i>Flip the classroom: Learn to code with your students!</i></h4>
</br></br></br>
</div>
</div>
<!-- ################################################
################ GOAL ################
################################################ -->
<section class="objective" id="goal">
<div class="container">
<blockquote>
<h3 class="objective-heading">The Goal of Innovation Fellowship:</h3>
<p class="objective-text">My focus is to help get computer
programming into more classrooms, libraries, and after school
programs by giving teachers a guide on how to easily use
Bricklayer in their classroom
without the teacher needing to have previous knowledge themselves.
Bricklayer is a local non-profit which combines the use of code,
math, art, spatial recognition, creativity, and problem-solving
to teach computer science. </p>
</blockquote>
</div>
</section>
<!-- ################################################
######## 1st Days with Bricklayer ########
################################################ -->
<section id="firstDays">
<div class="container">
<h2 class="section-title">Getting Started: First Few Sessions with Bricklayer</h2>
<div class="row">
<div class="col-sm-3">
<button class="btn-link" data-toggle="collapse" data-target=".theGrid"
class="aboutHeadings">
<h3 class="aboutHeader">The Grid<span class="caret"></span></h3>
</button>
<p class="theGrid hiddenDetails collapse">Use <a href="https://bricklayer.org/apps/grid_lite/grid.html"
target="_blank">the grid</a> like digital graph paper...
(or use actual graph paper if you prefer) to allow students to become
comfortable creating artifacts with pixels.</br></br>
Simply select the size of grid at the top, pick a color, and
select the box you want colored.</br></br>
You can save your designs and loaded them later.</br></br>
Some ideas: Make a smily face, write your name, or create a
random design.</br></br>
Challenge: Create a pattern, zoom the grid out, and see if
a partner can continue the pattern.
</p>
</div>
<div class="col-sm-3">
<button class="btn-link" data-toggle="collapse" data-target=".vitruvia"
class="aboutHeadings">
<h3 class="aboutHeader">Vitruvia<span class="caret"></span></h3>
</button>
<p class="vitruvia hiddenDetails collapse">Give the grid more meaning, and test
your understanding of specific block placement with Vitruvia's built in assessments.</br></br>
<i>[Think coordinate, xy, grid from math class...</br>
Hint: turn on coordinates for beginners.]</i></br></br>
For more information on Vitruvia, types of blocks available, and the order
in which to work through Vitruvia read through the <a href="https://bricklayerdotorg.wordpress.com/vitruvia/"
target="_blank">documentation</a>.</br></br>
Suggestions Before Moving to Bricklayer-Lite:</br>
<div class="vitruvia hiddenDetails collapse">
<a href="https://www.youtube.com/watch?v=D32e4c7Ob78&feature=youtu.be" target="_blank">
•Concept 1: <i>Placing 1x1 Blocks</i></a></br>
•<i>Skip Concept 2 for now</i></br>
<a href="https://www.youtube.com/watch?v=NfLKQZJIrp4&feature=youtu.be" target="_blank">
•Concept 3: <i>Placing Larger Blocks</i></a></br>
<a href="" target="_blank">
•Concept 4: <i>Placing Multiple Blocks</i></a></br>
<a href="https://www.youtube.com/watch?v=ZdUHqJCnJ64&feature=youtu.be" target="_blank">
•Concept 5: <i>Changing Syntax for 'Put' Calls</i></a></br>
<a href="" target="_blank">
•Concept 6: <i>More Practice with Level 1 Calls</i></a></br>
<a href="https://www.youtube.com/watch?v=5ABJAKJhLk4&feature=youtu.be" target="_blank">
•Concept 7: <i>Overwriting Previous Calls</i></a></br></br>
Continue to use these as daily review problems. Encourage students to take note of the
syntax in Vitruvia as it will become very important as they move on to Bricklayer-Lite.
</p>
</div>
</div>
<div class="col-sm-3">
<button class="btn-link" data-toggle="collapse" data-target=".bricklayerLite"
class="aboutHeadings">
<h3 class="aboutHeader ">Bricklayer-Lite<span class="caret"></span></h3>
</button>
<div class="bricklayerLite hiddenDetails collapse">
<p class="bricklayerLite ">
<strong><i>Important Note: </i></strong>If this is your first time using BrickLayer-Lite
it is highly recommended that you read through the <a href="https://bricklayer-lite.appspot.com/static/index.html"
target="_blank">documentation </a>provided in order to gain an understanding
of how to get started coding with Bricklayer-Lite. In the documentation you will learn how
to drag, drop, and connect code blocks to create artifacts. Additionally, the documentation
will show you examples of how to run, save, and upload your code.</br></br>
Once in Bricklayer-Lite, you will use the calls on the left side of your screen, as
outlined in the documentation, to essentially, piece your code together like a puzzle.
Do not forget to close lines with semicolons when needed
[located in 'Symbols']. To see your artifact, [click 'Run'] at the top of the screen.</br></br>
Challenge: Re-create the images that you previously created in
your grid, with concepts learned in Vitruvia, in Bricklayer-Lite.</br></br></br>
<strong>Bricklayer-Lite Levels:</strong></br>
<p>Play around in Bricklayer-Lite, creating artifacts, similar to what you
did in The Grid.
</p>
</br>
<a href="https://bricklayer-lite.appspot.com/static/level1_index.html" target="_blank">
•Level 1: Placing Individual Blocks</br></a>
[Focus on <a href="https://bricklayer.org/apps/VitruviaApp/main.html#concepts/5/1" target="_blank">
Vitruvia</a> Concepts 5-7]</br></br>
<a href="https://bricklayer-lite.appspot.com/static/level2_index.html" target="_blank">
•Level 2: Introducing Functions</br></a>
[Focus on <a href="https://bricklayer.org/apps/VitruviaApp/main.html#concepts/10/1" target="_blank">
Vitruvia</a> Concepts 10-13]</br></br>
<a href="https://bricklayer-lite.appspot.com/static/level3_index.html" target="_blank">
•Level 3: Expanding on Functions</br></a>
[Focus on <a href="https://bricklayer.org/apps/VitruviaApp/main.html#concepts/15/1" target="_blank">
Vitruvia</a> Concepts 14-15]</br></br></br>
Allow students to show their code, and compare/contrast how each was made with an emphasis on the ideas
that multiple answers can/will appear!</br></br>
<p>For more ideas on what to code in Bricklayer-Lite, move on to
<a href="#browserCode">More Coding in the Browser</a>.
</p>
</br></br>
<i>Note: If some students are not quite ready for
Bricklayer-Lite, they can continue to do the exercises in the grid while practicing Vitruvia,
and becoming familiar with Bricklayer-Lite.</i></br></br>
Encourage students to reference Vitruvia, or the documentation, in order
to become more familiar with Bricklayer-Lite. The more comfortable students are
the more helpful it will be as they transition to Bricklayer.
</p>
</div>
</div>
<div class="col-sm-3">
<button class="btn-link" data-toggle="collapse" data-target=".extraStuff"
class="aboutHeadings">
<h3 class="aboutHeader">Additional Apps<span class="caret"></span></h3>
</button>
<p class="extraStuff hiddenDetails collapse"><a href="https://bricklayer.org/mystique/"
target="_blank">Mystique</a> is an app that introduces the idea of reflection, rotation, and completion.
The user is tested on their ability to work in space, and is given immediate feedback on the task.
</br></br>
<a href="https://bricklayer.org/lynx/" target="_blank">Lynx</a> is another great app that has additional
<a href="https://bricklayer.org/apps/LynxApp/main.html#concepts/1/1" target="_blank">exercises</a>
that work specifically with identifying patterns and expanding on them. Additionally users will work on ratios and scale.
</br></br>
Both of these apps have tests that can be created as well.
</p>
</div>
</div>
</section>
<!-- ################################################
######### 2D in the Browser #############
################################################ -->
<section id="browserCode">
<h2 class="section-title">More Coding in the Browser</h2>
<h4>Continue to use <a href="https://bricklayer-lite.appspot.com/static/index.html" target="_blank">
Bricklayer-Lite</a> for the following activities.</h4></br>
<div class="container">
<div class="row">
<div class="col-sm-4">
<button class="btn-link" data-toggle="collapse" data-target=".reviewBricks"
class="aboutHeadings"><h3 class="browswerTabs">Review Vitruvia.</br> Create
in Bricklayer-Lite<span class="caret"></span></h3></button>
<p class="reviewBricks hiddenDetails collapse">Continue to review
with <a href="https://bricklayer.org/apps/VitruviaApp/main.html#concepts/1/1" target="_blank">
Vitruvia</a>, and <a href="https://bricklayer-lite.appspot.com/static/index.html" target="_blank">
Bricklayer-Lite</a>.</br></br> These are great warm up problems.</br></br>
Give time to allow students to explore on their own, in order to
gain a better understanding of how to place specific blocks where.</p>
</div>
<div class="col-sm-4">
<button class="btn-link" data-toggle="collapse" data-target=".challenge"
class="aboutHeadings"><h3 class="browswerTabs">Challenges by
Replicating Artifacts<span class="caret"></span></h3></button>
<p class="challenge hiddenDetails collapse">
Suggestions for Coding Examples:</br></br>
•Create your own Bricklayer-Lite, or
use a student volunteers, artifact as a guide, and ask students to re-create it.</br></br>
•Students can continue through the exercises <a href="https://bricklayerdotorg.wordpress.com/exercise-summary/"
target="_blank">here</a>.</br></br>
•Have students code a <a href="http://www.photius.com/flags/alphabetic_list.html">country's flag</a>
and have a nice segue into history, and cultural conversations.</br></br>
Open a discussion on how students recreated the artifacts,
with specific questions to explain their thought process.
Ask questions like 'did anyone else do it different?', and
'what was the hardest part for you, and how did you overcome
it?'</br></br>
Challenge: Ask students how many different ways they can think of
to create the same image. Give hints if needed, like, can anyone
think of a way to create this with four function calls? What about
with twelve function calls?</p>
</div>
<div class="col-sm-4">
<button class="btn-link" data-toggle="collapse" data-target=".pentominoes"
class="aboutHeadings"><h3 class="browswerTabs">Pentominoes</br> [Unplugged]<span class="caret"></span></h3></button>
<p class="pentominoes hiddenDetails collapse">The following coding activities can be
done on graph paper, if computers aren't available, in the grid,
or in Bricklayer-Lite, as a coding challenge.</br></br>
Use <a href="https://bricklayer.org/apps/assignments/By%20Hand/content/regular/Some%20Polyominoes.pdf"
target="_blank">pentominoes</a> to create tiling patterns.</br></br>
Bricklayer has some phenomenal problems already created, that involve regular patterns,
geometric patterns, and even some evolutionary patterns. The example problems
with some solutions are provided <a href="https://bricklayerdotorg.wordpress.com/by-hand/"
target="_blank">here</a>.</br></br>
</p>
</div>
</div>
</br></br>
<div class="row">
<div class="col-sm-4">
<button class="btn-link" data-toggle="collapse" data-target=".pixelArt"
class="aboutHeadings"><h3 class="browswerTabs">Pixel Art<span class="caret"></span></h3></button>
<div class="pixelArt hiddenDetails collapse">
<p>Allow students some time to be creative, and build
something that interests them.</br></br>
Some Suggestions:</br></br>
•Google: 'Pixel Art' and find and image they want to code</br>
•Team logos, favorite brands, etc.</br>
•Code their name or initials</br>
•Sketch a custom design in the grid or on graph paper, and code it</br></br>
Allow students time to showcase, explain, and answer questions about their
project, and their thought process in creating it.</br></br>
<i>Note: </i>Personally I think it is important for the students to
learn at this stage without the need for putting a grade
on their work. However, if you must enter a grade, some ideas
for a rubric could be based on, <i>size of grid, number of colors used,
presentations, etc.</i>
</p>
</div>
</div>
<div class="col-sm-4">
<button class="btn-link" data-toggle="collapse" data-target=".codingExercises"
class="aboutHeadings"><h3 class="browswerTabs">Get Creative<span class="caret"></span></h3></button>
<div class="codingExercises hiddenDetails collapse">
<p>As you and the students get more familiar with
Bricklayer-Lite come up with your own applications.</p>
<p>Find objects around town that could be re-created,
like the <a href="http://www.pbase.com/dieseldoctor/image/159443129">
We Don't Coast </a>wall.</p>
<p>Share your awesome ideas on <a href="https://www.facebook.com/bricklayer.org/"
target="_blank" class="ref-email">Facebook</a>.</p>
</div>
</div>
<div class="col-sm-4">
<button class="btn-link" data-toggle="collapse" data-target=".unplugged"
class="aboutHeadings"><h3 class="browswerTabs">Resources<span class="caret"></span></h3></button>
<div class="unplugged hiddenDetails collapse">
<strong>Documentation</strong>
<p>•<a href="https://bricklayer-lite.appspot.com/static/index.html">Bricklayer-Lite</a>
specific documentation. How to create, run, save, and load Bricklayer-Lite programs.</br></br>
•<i>Note: This additional<a href="https://bricklayerdotorg.wordpress.com/level-1-document/"
target="_blank"> documentation</a> is more geared toward
Bricklayer than Bricklayer-Lite, but is applicable if needed.</i></p>
</div>
</div>
</div>
</div>
</section>
<!-- ################################################
######### Downloads ##########
################################################ -->
<section id="downloads">
<div class="container">
<h2 class="section-title ed-title">Bricklayer Downloads</h2>
<h4>Moving out of the browser to Bricklayer, an environment for
editing and executing Bricklayer programs.</br>
Everything you'll need can be downloaded below.</h4>
<div class="row">
<div class="col-sm-4">
<button class="btn-link eduHeadings" data-toggle="collapse" data-target=".bricklayer">
<h3>Bricklayer<span class="caret"></span></h3></button>
<div class="bricklayer hiddenDetails collapse">
<p>The file you are about to download is where you will write your code.
It is essentially the place where you connected the puzzle pieces in
Bricklayer-Lite.</p></br>
<h4><em>Download Bricklayer:</em></h4>
<h3><a href="https://bricklayer.org/mac-os-download/">
For Mac</h3></a>
<h3><a href="https://bricklayer.org/windows-download/">
For Windows</h3></a>
</div>
</div>
<div class="col-sm-4">
<button class="btn-link eduHeadings" data-toggle="collapse" data-target=".LDraw">
<h3>LDraw<span class="caret"></span></h3></button>
<div class="LDraw hiddenDetails collapse">
<p>LDraw is another way to view
the code written in Bricklayer.</p>
<p>It can handle much larger artifacts; up to
150,000 or less piece artifacts. It
should be noted the amount of pieces able to be rendered
depends on the individual computer.</p>
<p>You have the ability to view the artifact from multiple angles
at one time with LDraw, a nice feature.</p></br>
<h3>It can be downloaded <a href="http://www.ldraw.org/help/getting-started.html" target=""_blank>here</a>.</h3>
</div>
</div>
<div class="col-sm-4">
<button class="btn-link eduHeadings" data-toggle="collapse" data-target=".cura">
<h3>Minecraft and Cura<span class="caret"></span></h3></button>
<div class="cura hiddenDetails collapse">
<p>These are additional downloads, that are not needed at
first. They add another dimension to Bricklayer as you
get more comfortable, and want to explore additional ways
to play with your code.</p>
<strong>Minecraft</strong>
<p>For instructions on what additional software
needs to be downloaded and installed in order to
integrate Bricklayer with Minecraft click
<a href="https://bricklayerdotorg.wordpress.com/minecraft-download/"
target="_blank">here</a>.</p></br>
<strong>Cura</strong>
<p>"<a href="https://ultimaker.com/en/products/cura-software"
target="_blank">Cura</a>
prepares your model for 3D printing. For
novices, it makes it easy to get great results.
For experts, there are over 200 settings to adjust
to your needs. As it’s open source, our community
helps enrich it even more."</p></br>
</div>
</div>
</div><!-- row -->
</div><!-- container -->
</section>
<!-- ################################################
############ Coding in Bricklayer ############
################################################ -->
<section id="twoDcode">
<div class="container">
<div class="row">
<h2 class="center section-title twoThreeDcode">Coding in Bricklayer</h2>
<div class="col-sm-4">
<button class="btn-link" data-toggle="collapse" data-target=".resources">
<class="aboutHeadings"><h3 class="aboutHeader">Video Resources & Code Alongs<span class="caret"></span></h3></button>
<div class="resources hiddenDetails collapse">
<p>The following links will provide you videos and step
by step Code-Alongs to help your transition to Bricklayer.</p>
<p>The correlation between Bricklayer-Lite, and Bricklayer is strong
and you'll begin to notice the similarities almost immediately.</p>
<p><i>Suggestion:</i> After Level 1, begin to create on your own and come back
to the other levels after you're comfortable to do so. Everything done with
Bricklayer-Lite, can be done in Bricklayer once you have a basic
understanding of Level 1 concepts below.</p>
<p>•<a href="https://bricklayerdotorg.wordpress.com/level-1/"
target="_blank">Level 1</a>: Coding Sessions, Overwriting, and Debugging videos.</br>
<i>Note:</i> Code from videos is available at the links next to each video.</br>
Rework, or continue working the exercises to become familiar with the
transition to the Bricklayer environment.</p>
<p>•<a href="https://bricklayerdotorg.wordpress.com/level-2/"
target="_blank">Level 2</a>: Code-Alongs, and Exercises. </p>
<p>•<a href="https://bricklayerdotorg.wordpress.com/level-3/"
target="_blank">Level 3</a>: Code-Alongs, Exercises, and Special Projects.</p>
<p>•<a href="https://bricklayerdotorg.wordpress.com/level-4/"
target="_blank">Level 4</a>: Exercises, and Special Projects.</p>
<p>•<a href="https://bricklayerdotorg.wordpress.com/level-5/"
target="_blank">Level 5</a>: Code-Alongs, Exercises, and Special Projects.</p>
</div>
</div>
<div class="col-sm-4">
<button class="btn-link" data-toggle="collapse" data-target=".reviewBrick">
<class="aboutHeadings"><h3 class="aboutHeader">Bricklayer-Lite Activities in Bricklayer<span class="caret"></span></h3></button>
<div class="reviewBrick hiddenDetails collapse">
<p>After the 'Level 1: Coding Sessions, Overwriting, and Debugging' from
the 'Video Resources and Code Along' tab, you're ready to write your own code.</p>
<p>Revisit the activities from <a href="#browserCode">Bricklayer-Lite in the Browser</a>,
and now attempt them in Bricklayer.</p>
<p>An idea: Have students load their saved code from Bricklayer-Lite,
and now code it in Bricklayer by copying
what they had previously done. It is great practice,
that builds confidence, and helps them make the connection
to previous knowledge.</p>
<p>Challenge: Replicate artifact, use pentominoes,
code pixel art in Bricklayer, or find items around town
that could be built out of Legos, and code it in
Bricklayer.</p>
</div>
</div>
<div class="col-sm-4">
<button class="btn-link" data-toggle="collapse" data-target=".documentation">
<class="aboutHeadings"><h3 class="aboutHeader">Documentation<span class="caret"></span></h3></button>
<div class="documentation hiddenDetails collapse">
<p>Get specific help on how to write the code needed in Bricklayer. You can
copy and paste code examples found in the documentation onto your computer
and manipulate it to make it your own. Brief descriptions of what can be found
in each level are below, and more information is provided at each link.</p>
<p>•<a href="https://bricklayerdotorg.wordpress.com/level-1-document/"
target="_blank">Level 1</a>: Getting Started: Basic 'put' functions</p>
<p>•<a href="https://bricklayerdotorg.wordpress.com/level-2-document-2/"
target="_blank">Level 2</a>: Circle | Rings | Offsets</p>
<p>•<a href="https://bricklayerdotorg.wordpress.com/level-3-document/"
target="_blank">Level 3</a>: Show in LDD, LDraw, for 3D prints | Lines</p>
<p>•<a href="https://bricklayerdotorg.wordpress.com/level-4-document/"
target="_blank">Level 4</a>: 3D: Spheres | Cubes | Hollow | Multibrick | Show in 3D</p>
<p>•<a href="https://bricklayerdotorg.wordpress.com/level-5-document/"
target="_blank">Level 5</a>: Traverse Region</p>
</div>
</div>
</div>
</div>
</section>
<!-- ################################################
############## PROJECTS ###############
################################################ -->
<section id="projects">
<div class="container">
<h2 class="center section-title">Projects</h2>
<p class="center">Below you can find the code for some projects I built throughout
the Innovation Fellowship. I have grouped them into three categories
based on the anticipated time it will take to complete. Some individuals may go faster/slower
based on comfort level with Bricklayer.</br></br>
It is assumed that the Vitruvia exercises have been completed,
and familiarity with Bricklayer exists.</br></br>
<i>The code for each of the following projects can be found in the .bl files on GitHub (linked),
and then copy and pasted into your Bricklayer environment and adjusted as you see fit.</br></br>
<div class="row">
<div class="col-sm-4">
<button class="btn-link" data-toggle="collapse" data-target=".smallProject">
<class="aboutHeadings"><h3 class="aboutHeader">Small Project<span class="caret"></span></h3></button>
<div class="smallProject hiddenDetails collapse">
<p class="projectDescription">These projects can be completed in a couple sessions.</p>
•<a class="projectLinks" href="https://github.com/codecuddy/bricklayer/tree/master/__howManyFunctionCalls" target="_blank"> How Many Bricks</a></br>
•<a class="projectLinks"href="https://github.com/codecuddy/bricklayer/tree/master/__2DgreenCross" target="_blank"> A Cross</a></br>
•<a class="projectLinks"href="https://github.com/codecuddy/bricklayer/tree/master/__2Darch" target="_blank"> Arch</a></br>
•<a class="projectLinks"href="https://github.com/codecuddy/bricklayer/tree/master/__2Dcircles" target="_blank"> Circles</a></br>
•<a class="projectLinks"href="https://github.com/codecuddy/bricklayer/tree/master/__2Dcode" target="_blank"> 'Code'</a></br>
•<a class="projectLinks"href="https://github.com/codecuddy/bricklayer/tree/master/__pyramid" target="_blank"> Pyramid</a></br>
•<a class="projectLinks"href="https://github.com/codecuddy/bricklayer/tree/master/__demo" target="_blank"> Geometric Shapes</a></br>
</div>
</div>
<div class="col-sm-4 ">
<button class="btn-link" data-toggle="collapse" data-target=".mediumProject">
<class="aboutHeadings"><h3 class="aboutHeader">Medium Project<span class="caret"></span></h3>
</button>
<div class="mediumProject hiddenDetails collapse">
<p>These projects can be completed over multiple sessions.</p>
•<a class="projectLinks"href="http://wintercoding.com/guide/Curriculum-B.pdf" target="_blank"> Curriculum: 10+ 50 minute lessons</a></br>
•<a class="projectLinks"href="https://github.com/codecuddy/bricklayer/tree/master/__dice" target="_blank"> Dice</a></br>
•<a class="projectLinks"href="https://github.com/codecuddy/bricklayer/tree/master/__cuddyWithBackground" target="_blank"> 'Cuddy'</a></br>
•<a class="projectLinks"href="https://github.com/codecuddy/bricklayer/tree/master/__stripesWithMod" target="_blank"> Stripes</a></br>
•<a class="projectLinks"href="https://github.com/codecuddy/bricklayer/tree/master/__layeredCheckers" target="_blank"> Chessboard</a></br>
•<a class="projectLinks"href="https://github.com/codecuddy/bricklayer/tree/master/__2DblackWhiteSquares" target="_blank"> Black & White Squares</a></br>
•<a class="projectLinks"href="https://github.com/codecuddy/bricklayer/tree/master/__3DsphereRing" target="_blank"> Sphere & Ring</a></br>
</div>
</div>
<div class="col-sm-4">
<button class="btn-link" data-toggle="collapse" data-target=".largeProject">
<class="aboutHeadings"><h3 class="aboutHeader">Large Project<span class="caret"></span></h3>
</button>
<div class="largeProject hiddenDetails collapse">
<p>These projects can take several sessions and require
some additional knowledge, and resources to code buildings.</p>
•<a class="projectLinks" href="https://github.com/codecuddy/bricklayer/tree/master/__memorialStadium"
target="_blank"> Memorial Stadium's</a> code hosted on GitHub</br></br>
<p>• Screen shots can be found here:<a class="projectLinks" href="img/memorialStadium.png" target="_blank">
Memorial Stadium</a> was coded in Bricklayer and rendered in LDraw.
The stadium was then <a class="projectLinks" href="img/3dMemorial.jpg"
target="_blank">3D printed</a>, and uploaded onto a
<a class="projectLinks" href="img/minecraftMemorial.jpg" target="_blank">Minecraft</a>
server.</p>
<p>I used <a class="projectLinks" href="https://www.google.com/earth/">Google Earth</a>
to get accurate measurements of the stadium, and then converted
it to the scale that I decided to use for this project.</p>
</div>
</div>
</div><!--- row -->
<div>
</br></br>
<h4 class="center">Link to <a class="projectLinks" href="http://www.omaha.com/news/education/after--week-do-space-fellowship-educators-share-their-education/article_ddae7ba4-0915-5c42-a773-52c6c38c074b.html"
target="_blank">Omaha World Herald News Article</a> from August 6, 2017.</h4>
<h4 class="center">Link to <a class="projectLinks" href="attachments/FellowshipPresentationCuddy.pptx">
Power Point</a> from presentation at Do Space August 5, 2017.</h4>
<h4 class="center">Link to <a class="projectLinks" href="http://siliconprairienews.com/2017/07/do_space_fellows_prepare_to_showcase_summer_grant_projects/?utm_medium=Email&utm_source=Infusionsoft&utm_campaign=DailySPNEmail&utm_content=072017_DoSpaceFellows&inf_contact_key=b3664721741bd201f8709d3b8a35cf2be816ab6b1af6583162e3eb914f96d9b1"
target="_blank">Silicon Prairie News Article</a> from July 20, 2017.</h4>
</div>
</div><!-- container -->
</section>
<!-- ################################################
############## Team ###############
################################################ -->
<section id="innovationTeam">
<div class="container">
<h2 class="center section-title">Bricklayer and Do Space Team</h2>
<div class="row">
<div class="col-sm-3">
<div class="center">
<a href="mailto:victor.winter@bricklayer.org?subject=Bricklayer" class="ref-email">
<h3>Dr. Victor<br>Winter</h3>
<h6>victor.winter@bricklayer.org</h6></a>
<img src="img/drWinter.jpg" class="img-circle reference-pic"/>
<h4>PhD, professor in the Department of Computer Science at the
University of Nebraska-Omaha</h4>
<h4>Creator of <a href="https://bricklayerdotorg.wordpress.com/" class="ref-info">Bricklayer.org</h4>
</div>
</div>
<div class="col-sm-3">
<div class="center">
<a href="mailto:jennifer.winter@bricklayer.org?subject=Bricklayer" class="ref-email">
<h3>Jennifer<br>Winter</h3>
<h6>jennifer.winter@bricklayer.org</h6></a>
<img src="img/jennifer.jpg" class="img-circle reference-pic"/>
<h4>Executive Director of
<a href="https://bricklayerdotorg.wordpress.com/" class="ref-info">Bricklayer.org</h4></a>
</div>
</div>
<div class="col-sm-3">
<div class="center">
<a href="mailto:betty.love@bricklayer.org?subject=Bricklayer" class="ref-email">
<h3>Dr. Betty<br>Love</h3>
<h6>betty.love@bricklayer.org</h6></a>
<img src="img/drLove.jpg" class="img-circle reference-pic"/>
<h4>PhD, associate professor in the Mathematics Department at the University of Nebraska-Omaha</h4>
</div>
</div>
<div class="col-sm-3">
<div class="center">
<a href="mailto:hello@dospace.org?subject=Do Space Fellowship" class="ref-email">
<h3>Rebecca<br>Stavick</h3>
<h6>hello@dospace.org</h6></a>
<img src="img/rebecca.jpg" class="img-circle reference-pic"/>
<h4>Executive Director at <a href="http://www.dospace.org" class="ref-info">Do Space</h4></a>
</div>
</div>
</div><!-- row -->
<div class="row">
</br>
<h4 class="center">Bricklayer is on <a href="https://www.facebook.com/bricklayer.org/" target="_blank" class="ref-email">Facebook</a>
and Twitter <a href="https://twitter.com/bricklayer_org" target="_blank" class="ref-email">@bricklayer_org</a></h4>
<h4 class="center">Do Space is on <a href="https://www.facebook.com/DoSpaceOmaha/?rf=514869222035039" target="_blank" class="ref-email">Facebook</a>
and Twitter <a href="https://twitter.com/DoSpaceOmaha" target="_blank" class="ref-email">@DoSpaceOmaha</a></h4>
</div>
</div><!-- container -->
</section>
<!-- ################################################
############## CONTACT ME ###############
################################################ -->
<section id="contact_info">
<div class="container contactInfoPhone">
<h2 class="center section-title">Contact Me</h2>
<div class="row">
<div class="col-sm-2">
<a href="mailto:charliecuddy4@gmail.com">
<img src="img/email.png" alt="email icon" class="img-circle">
<h4 class="center-title">Email</h4>
</div>
<div class="col-sm-2">
<a href="https://codecuddy.github.io/" target="_blank">
<img src="img/web.png" alt="web icon" class="img-circle">
<h4 class="center-title">Website</h4>
</div>
<div class="col-sm-2">
<a href="https://www.twitter.com/charliecuddy" target="_blank">
<img src="img/twitter.png" alt="twitter icon" class="img-circle">
<h4 class="center-title">Twitter</h4></a>
<!--Twitter 'Follow Me' Button
<a href="https://twitter.com/CharlieCuddy" class="twitter-follow-button" data-show-count="false">Follow @CharlieCuddy</a>
<script>!function(d,s,id){var js,fjs=d.getElementsByTagName(s)
[0],p=/^http:/.test(d.location)?'http':'https';
if(!d.getElementById(id)){js=d.createElement(s);js.id=id;js.src=p+
'://platform.twitter.com/widgets.js';fjs.parentNode.insertBefore(js,fjs);}}(document,
'script', 'twitter-wjs');</script> -->
</div>
<div class="col-sm-2">
<a href="https://www.facebook.com/charlie444" target="_blank">
<img src="img/facebook.png" alt="facebook icon" class="img-circle">
<h4 class="center-title">Facebook</h4></a>
</div>
<div class="col-sm-2">
<a href="https://www.github.com/codecuddy" target="_blank">
<img src="img/github.png" alt="github icon" class="img-circle">
<h4 class="center-title">GitHub</h4></a>
</div>
<div class="col-sm-2">
<a href="https://www.linkedin.com/in/charliecuddy" target="_blank">
<img src="img/linkedIn.png" alt="linkedin icon" class="img-circle">
<h4 class="center-title">LinkedIn</h4></a>
</div>
</div>
</div>
</section>
<!-- ################################################
################# FOOTER ##############
################################################ -->
<footer>
site created by <a href="https://codecuddy.github.io/" target="_blank">charlie cuddy</a>
| <a href="mailto:charliecuddy4@gmail.com">charliecuddy4@gmail.com</a> with
<a href="https://pages.github.com/" target="_blank">Github Pages</a>
<br/> © copyright 2020
</footer>
<!-- jQuery (necessary for Bootstrap's JavaScript plugins) -->
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.1.1/jquery.min.js"></script>
<!-- Include all compiled plugins (below), or include individual files as needed -->
<script src="bootstrap/js/bootstrap.min.js"></script>
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script>
<script src=""></script>
</body>
</html>