forked from sugarlabs/www
-
Notifications
You must be signed in to change notification settings - Fork 0
/
music-blocks.html
executable file
·178 lines (169 loc) · 10.1 KB
/
music-blocks.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
---
layout: default
title: Music Blocks - Sugar Labs
permalink: /music-blocks/index.html
---
<!-- Title section -->
<div class="section-title1" >
<span class="tag tag-regular">MUSIC BLOCKS</span>
</div>
<!-- Introduction section -->
<section id="testimonial" class="zeroMarPadBtm">
<div class="container">
<div class="row">
<div class="col-md-12" >
<div class="row justify-content-center">
<div class="col-md-8 col-md-push-2" >
<div class="section-title text-center">
<h2>MUSIC BLOCKS: <br/><br/> A MUSICAL MICROWORLD</h2>
<p class="customParagraphStyle"><i><b>“All musicians are subconsciously mathematicians” – Monk</b></i></p>
<br>
<p class="customParagraphStyle">Music Blocks is a collection of manipulative tools for exploring fundamental musical concepts in an integrative and fun way.</p>
<br><a class="try-mb" href="https://musicblocks.sugarlabs.org" target="_blank">Try Music Blocks</a>
</div>
</div>
</div>
</div>
</div>
</div>
</section>
<!-- Slideshow section -->
<section id="intro" class="zeroMarPadBtm">
<div class="container" >
<div class="row">
<div class="col-md-12" >
<div class="row justify-content-center">
<div class="col-md-8 col-md-push-2">
<div class="testimonial-carousel">
<div id="testimonial-slider1" class="owl-carousel">
<div>
<img src="{{ site.baseurl }}/assets/mb1.png" alt="Music Blocks screenshot 1" class="customImageStyle">
</div>
<div>
<img src="{{ site.baseurl }}/assets/mb2.png" alt="Music Blocks screenshot 2" class="customImageStyle">
</div>
<div>
<img src="{{ site.baseurl }}/assets/mb3.png" alt="Music Blocks screenshot 3" class="customImageStyle">
</div>
<div>
<img src="{{ site.baseurl }}/assets/mb4.png" alt="Music Blocks screenshot 4" class="customImageStyle">
</div>
<div>
<img src="{{ site.baseurl }}/assets/mb5.png" alt="Music Blocks screenshot 5" class="customImageStyle">
</div>
</div>
</div>
</div>
<br><p style="text-align: center;">Projects Featured: <a href="https://musicblocks.sugarlabs.org/index.html?id=1523029986215035&run=True" target="_blank">music-tree</a>, <a href="https://musicblocks.sugarlabs.org/index.html?id=1523027573669254&run=True" target="_blank">hot-cross-buns-graphics</a>, <a href="https://musicblocks.sugarlabs.org/index.html?id=1523043014570349&run=True" target="_blank">musical nautilus</a>, <a href="https://musicblocks.sugarlabs.org/index.html?id=1522885323588493&run=True" target="_blank">crab-canon-plot</a> and <a href="https://musicblocks.sugarlabs.org/index.html?id=1525372574369507&run=True" target="_blank">fun-with-fifths-and-sixths</a></p>
</div>
</div>
</div>
</div>
</section>
<!-- "Using music blocks" section -->
<section id="testimonial" class="zeroMarPadBtm">
<div class="container">
<div class="row">
<div class="col-md-12" >
<div class="row justify-content-center">
<div class="col-md-8 col-md-push-2" >
<div class="section-title text-center">
<h2>USING MUSIC BLOCKS</h2>
<p class="customParagraphStyle">
Music Blocks is designed to run in the browser. It is derived from Turtle Blocks JS which can be found
<a href="https://github.com/sugarlabs/turtleblocksjs" class="hrefCustomColor">here</a>.
You can run the software locally from the index.html file, from the
<a href="http://musicblocks.sugarlabs.org" class="hrefCustomColor">GitHub</a> repository,
or by setting up a local server.
</p>
<p class="customParagraphStyle">
If you want to run Music Blocks offline, download this repo and point your browser to the index.html
file found in the musicblocks directory on your local file system.</p>
<p class="customParagraphStyle">
See <a href="http://github.com/sugarlabs/musicblocks/tree/master/documentation"
class="hrefCustomColor">Using Music Blocks</a>
and <a href="http://github.com/sugarlabs/musicblocks/tree/master/guide"
class="hrefCustomColor">Music Blocks Guide</a></p>
</div>
</div>
</div>
</div>
</div>
</div>
</section>
<!-- "Credits" section -->
<section id="call-to-action">
<div class="container">
<div class="row">
<div class="col-md-12" >
<div class="row justify-content-center">
<div class="col-md-8 col-md-push-2" >
<h2>CREDITS</h2>
<p class="customFontSize">
Music Blocks is a fork of TurtleArtJS created by Walter Bender.
(Turtle Blocks JS has many <a href="https://github.com/sugarlabs/turtleblocksjs/graphs/contributors" class="hrefCustomColor">contributors</a>).</p>
<br>
<p class="customFontSize">
Devin Ulibarri has contributed functional and user-interface designs.
Many of his contributions were inspired by the music education ideas,
representations and practices (e.g. aspects of matrix, musical cups)
developed and published by Dr. Lawrence Scripp with whom Devin studied
at New England Conservatory and for whom he worked at Affron Scripp & Associates, LLC.</p>
<br>
<p class="customFontSize">
<a href="https://necmusic.edu/faculty/larry-scripp" class="hrefCustomColor">Larry Scripp</a></p>
<br>
<p class="customFontSize">
<a href="http://centerformie.org/" class="hrefCustomColor">Center for Music and the Arts in Education (CMAIE)</a></p>
<br>
<p class="customFontSize">
<a href="http://music-in-education.org/" class="hrefCustomColor">Music in Education</a></p>
<br>
<p class="customFontSize">
Some of the graphics were contributed by Chie Yasuda.
</p>
<br>
<p class="customFontSize">
Much of the initial coding of the fork from Turtle Blocks was done by Yash Khandelwal
as part of Google Summer of Code (GSoC) 2015. Hemant Kasat contributed to additional
widgets as part of GSoC 2016. Additional contributions are being made by Tayba Wasim,
Dinuka Tharangi Jayaweera, Prachi Agrawal, Cristina Del Puerto, and Hrishi Patel
as part of GSoC 2017. During GSoC 2018, Riya Lohia developed a Temperament Widget.
Ritwik Abhishek added a keyboard widget and a pitch-tracking widget.</p>
<br>
<p class="customFontSize">
Many students contributed to the project as part of Google Code-in
(2015–16, 2016–17, and 2017–2018). Sam Parkinson built the Planet during GCI 2016–17.
Euan Ong redesigned the Planet code as a series of GCI tasks in 2017–18.</p>
<br>
</div>
</div>
</div>
</div>
</div>
</section>
<!-- "Reporting bugs" section -->
<section id="testimonial" >
<div class="container">
<div class="row">
<div class="col-md-12" >
<div class="row justify-content-center">
<div class="col-md-8 col-md-push-2" >
<h2 class="text-center">REPORTING BUGS</h2>
<p class="customParagraphStyle">Bugs can be reported in the <a href="https://bugs.sugarlabs.org/newticket?component=Turtleart" class="hrefCustomColor">Sugar Labs bug tracker</a> or in the <a href="https://github.com/sugarlabs/musicblocks/issues" class="hrefCustomColor">issues section</a> of this repository.</p>
</div>
</div>
</div>
</div>
</div>
</section>
<!-- "Return to main page" button section -->
<section id="call-to-action">
<div class="container">
<div class="row">
<div class="col-md-12" >
<a href="{{ site.baseurl }}/" ><button type="button" class="btn bt-raised btn-custom bt lastButtonMargin" >Return to main page</button></a>
</div>
</div>
</div>
</section>