Posts Tagged ‘DSL’

I’ve written an article introducing the syntax, the semantic model and the graphical model of the BarModel script I’ve designed for “drawing” bar models by writing scripts.





Read Full Post »

Bar modeling, also known as Singapore Math Method, is a method that helps students to visualize and understand word problems in Math. However, drawing an effective bar model is challenging, teaching a student to draw bar models is even more so. In most cases, students just see the final models without the explanation about how the models were drawn step by step.

Drawing a model of a complex word problem on paper can be messy and tedious: oftentimes, you have to worry about the size of each box; you have to redraw a bar because the sizes of the boxes are too inaccurate; you have to cut 7 boxes into 3 parts each. After some time, you may forget how a model was drawn.

Isn’t it great if there is a tool that allow a student to specify what to draw rather than draw it manually? The student tells the tool to add a bar, add a box with an unknown size, add another box with a known size, specify the relations between bars or boxes, cut a box into some smaller boxes, shift two boxes from this bar to another bar. And the tool draws the model automatically for you as you are adding your instructions. And you can “replay” the model step by step.

That is why I designed the Bar Model Language-a domain specific language-that allows you to do exactly what I just described. You describe a bar model by writing code, which not only specifies the model, but also serves as the explanation of each step. The code can be saved and “played” later, or translated into an SVG document, which can be put in a Web page, or pasted into a Word document.

Let’s look at an example. Here is a word problem.

Ryan had $200 more than Danish at first. Ryan gave ¾ of his money to Danish. Danish in return gave 2/3 of his money to Ryan. In the end, Ryan had $180 more than Danish. Find the amount of money Danish had in the end.

Here is the final model. You can click on the SVG document and play the model step by step.

Bar Model

From the last two bars we can easily see that

10u = 50 + 180 – 150 = 80

And therefore

u = 8

So Danish had 7u+50 = 7 x 8 + 50 = 106 in the end.

The following is the code of this bar model:

add bar title='R1' as r1
add bar title='D1' as d1
add box to r1
add box to d1
r1 - d1 = 200
cut box[1] from right size=200
add label title="200" position=above to r1[2]
cut each of r1[1 to 2] into 4
add label title="50" position=below to r1[5]
cut d1 into 4
add bar title='R2' as r2
add bar title='D2' as d2
shift r1[1] to r2
shift r1[5] to r2
add label title="50" position=above to r2[2]
shift d1[1 to 4] to d2
shift r1[2 to 4] to d2
shift r1[6 to 8] to d2
cut each of d2[1 to 7] into 3
add label title="21u" position=above to d2[1 to 21]
add bar title='R3' as r3
add bar title='D3' as d3
shift r2[1 to 2] to r3
cut r3[1] into 3
shift d2[1 to 14] to r3
shift d2[22 to 23] to r3
add label title="14u" position=above to r3[5 to 18]
shift d2[15 to 21] to d3
shift d2[24] to d3
add label title="7u" position=above to d3[1 to 7]
add label title=50 position=above to d3[8]
add box size=180 stroke-style=dashed to d3 with label title="180" position=above
r3 = d3
add bar title='R4' as r4
shift r3[1 to 3] to r4
shift r3[5 to 18] to r4
shift r3[4] to r4
shift r3[19 to 20] to r4
add label title="17u" position=above to r4[1 to 17]
add label title=150 position=above to r4[18 to 20]

It seems to be a lot of code. But there are only 6 kinds of statements in the code:

  • add bar
  • add box
  • add label
  • cut box
  • shift box
  • constraints, e.g. r3 = d3

Although the language is pretty simple, it is really a programming language, which may help inspire the students’ interest in computer programming.

Read Full Post »