MathPlotAI Logo MathPlotAI

Solving One-Step Equations: Visualizing with Strip Diagrams

Solving One-Step Equations: Visualizing with Strip Diagrams
Loading the math board and drawing, please wait…
2023-07-18 05:00
FunctionSequenceInequalitySlider AnimationGraphing
This GeoGebra example demonstrates how to solve one-step equations by finding the value of a variable in a number sentence, using both an equation and a strip diagram for visual exploration. The core math concepts include one-variable linear equations, inverse operations (addition, subtraction, multiplication, division), and the balance property of equality. The construction uses commands such as RandomUniform to generate random problems, Textfield and InputBox1 for user input, Text, Take, If, Element, Sequence for dynamic content, and PointToPixels, centerBox, Corner, Translate, Segment, Min for layout and animation controls (animateControl, animateAddition). It is designed for grades 4-5 students to practice algebraic thinking, and also serves as an introductory tool for middle school algebra. The resource is verified, includes Spanish translation, and can be shared via Google Classroom or GeoGebra lesson links.

GeoGebra Commands & Parameters

  1. RandomUniform(0, 0.99, 200) → allRandomSeeds, {0.24309416209828497, 0.23575968388160132, 0.05637143677548921, 0.7663634909605562, 0.6843540034428994, 0.03173646648991745, 0.7480307932851396, 0.447237517991689, 0.4039964793829785, 0.7713820619874071, 0.45809155280153324, 0.8596886144955532, 0.46276755961442617, 0.21898020772482568, 0.32328197297151007, 0.9727205620943419, 0.7831270658301578, 0.38826426125976976, 0.6768351615810564, 0.24192065960284068, 0.8676927803882839, 0.04941569465163856, 0.43798648025720877, 0.603222984606823, 0.7765947799953208, 0.07095313286882719, 0.9442698619976504, 0.2057673284306999, 0.4344054398573109, 0.2019313047207908, 0.8798916288804389, 0.37106510724567854, 0.07558366364362334, 0.5933755219371996, 0.7465753644655122, 0.23778368781117376, 0.3728291967915565, 0.7660703120795281, 0.19857435452880412, 0.23324739855256496, 0.39539077758759, 0.9647021086063126, 0.20103858780017866, 0.6742282055295554, 0.9542049433021985, 0.4559239861591829, 0.520600228401039, 0.08076091023819311, 0.5077642107147805, 0.8601662946344996, 0.6189078136306079, 0.8775678490229782, 0.8168221591118795, 0.6539606033420841, 0.2838911230382109, 0.2382144948696543, 0.1574396919259567, 0.6211748199120799, 0.8397796019099308, 0.6873426926347507, 0.5404603636965887, 0.5678763793384387, 0.8053246752440516, 0.9162396954362756, 0.9712743269052319, 0.5765454545210382, 0.030291540427799083, 0.2766013536159407, 0.2066896031247761, 0.7210541270614637, 0.3730888126193086, 0.32663439279513673, 0.6358756312801304, 0.6942080892968363, 0.06739459826632864, 0.7226179611634703, 0.7096779532177, 0.5647156255028781, 0.2928152187611787, 0.3277059171295252, 0.6271247730250025, 0.8302049319476487, 0.8739783700087319, 0.9181017500279075, 0.019654717694082134, 0.007353674046759228, 0.04401468648149956, 0.004774702045388483, 0.5024918637423577, 0.1093259177823831, 0.14212257495852462, 0.5566100936213371, 0.5986777676157804, 0.05452979559564425, 0.5308381972143849, 0.40829954886672454, 0.5245422485559347, 0.15921510848745055, 0.21674847435821581, 0.3633759132609266, 0.8558531918483919, 0.9696233932971632, 0.008686978386047888, 0.3595849970450599, 0.9715320104298864, 0.3372841068668233, 0.4099434012156451, 0.8902606694105346, 0.2066562433069596, 0.5736184496383566, 0.18569482371188953, 0.11153236244096866, 0.5984910264336895, 0.06726857815656265, 0.7837319403336064, 0.45104328884606765, 0.028501300760129206, 0.4995135653198859, 0.6456066289206982, 0.19939475499091155, 0.9196922712120189, 0.8797633378705944, 0.12656728507428538, 0.940756801564691, 0.8722099563562037, 0.7444414783098166, 0.5760758304089827, 0.8839975416283762, 0.4609055355294768, 0.008572576233774849, 0.7963160207872346, 0.8302826946880881, 0.496525118294161, 0.7300837203437597, 0.303904942735752, 0.9073847356223177, 0.007334306781938987, 0.3122106127743558, 0.6800100458342836, 0.4149147055473462, 0.510320039649063, 0.5794665733992769, 0.33625205211048326, 0.468352726569357, 0.5206338982075878, 0.15738947821711893, 0.2881386072253394, 0.09310251114022591, 0.9446503619289418, 0.5257241825653521, 0.8043270856047782, 0.7028317953223625, 0.395909492552568, 0.4088291671898534, 0.7787545379782896, 0.41908646819063744, 0.9342977672013733, 0.575914818185117, 0.49360103041166475, 0.12157668794645299, 0.9570924893434051, 0.5772261729094923, 0.6341674445586456, 0.05063429618948855, 0.17595357077729445, 0.8204761068122595, 0.8320517237290249, 0.5851271281734549, 0.6265936371192506, 0.9747169218484317, 0.9404978503753142, 0.8305905699798128, 0.037690958931394854, 0.056405172226775664, 0.6554695129843771, 0.003499107257445866, 0.0326312586392705, 0.25467143188043395, 0.757865390363651, 0.7784499806500158, 0.4718738274668245, 0.5397499117346121, 0.4863463848492693, 0.6755679708478345, 0.9651330577943193, 0.7301532882053272, 0.9464845389308749, 0.5656655484693643, 0.021151316535512856, 0.2004968843041442, 0.6603717963758396, 0.06060414915868328, 0.15861013340942773, 0.45288210880050395, 0.41144154900490315, 0.7859022229282462, 0.5146857098549239, 0.43044214640516076, 0.652058873088471, 0.32192270494829744}
  2. Textfield(input1) → InputBox1
  3. Text(InputBox1) → inputText
  4. Take(allRandomSeeds, randIndex, randIndex + numRandoms - 1) → currentRandomSeeds
  5. If(isAddition ∨ isSubtraction, num1 + 2, 2) → num2Start
  6. Element({num2 - num1, num1 + num2, num2Mult / num1Mult, (num1Div * num2Div)}, indexQuestion) → answer
  7. If(isAddition, animateControl, 0) → animateAddition
  8. Sequence(equationStart + ((0, (-spaceBetweenEquationLines)) * k), k, 0, 2) → equationPoints
  9. Element({"x", "y"}, indexVariable) → variable
  10. Sequence(startHome + (k * (spaceHome, 0)), k, 0, 10) → allHomeAnchors
  11. PointToPixels(onboardingPoint, Corner[1], Corner[3], Corner[5]) → onboardingPointPixels
  12. Sequence(startEnd + (K * (spaceEnd, 0)), K, 0, 10) → boxAnchors
  13. centerBox(boxWidth, boxHeight, boxAnchors(8)) → frame8
  14. centerBox(boxWidth, boxHeight, boxAnchors(7)) → frame7
  15. centerBox(boxWidth, boxHeight, boxAnchors(6)) → frame6
  16. centerBox(boxWidth, boxHeight, boxAnchors(5)) → frame5
  17. centerBox(boxWidth, boxHeight, boxAnchors(4)) → frame4
  18. centerBox(boxWidth, boxHeight, boxAnchors(3)) → frame3
  19. centerBox(boxWidth, boxHeight, boxAnchors(2)) → frame2
  20. centerBox(boxWidth, boxHeight, boxAnchors(1)) → frame1
  21. Textfield(input2) → InputBox2
  22. Corner(5) → layoutAppSize
  23. PointToPixels(Corner[onboardingDisplayText, 2], Corner[1], Corner[3], Corner[5]) → layoutOnboarding
  24. onboardingTextOffset(Corner[onboardingText, 1], Corner[onboardingText, 3], onboardingCase, Corner[1], Corner[3], Corner[5]) → OnboardingTextOffset
  25. Sequence(k, k, 1, 10) → homeIndices
  26. Zip(allHomeAnchors(J), J, homeIndices) → homeLocations
  27. Take({P1, P2, P3, P4, P5, P6, P7, P8}, 1, numDragBoxes) → movingPoints
  28. centerBox(boxWidth, boxHeight, P1) → box1
  29. centerBox(boxWidth, boxHeight, P2) → box2
  30. centerBox(boxWidth, boxHeight, P3) → box3
  31. centerBox(boxWidth, boxHeight, P4) → box4
  32. centerBox(boxWidth, boxHeight, P5) → box5
  33. centerBox(boxWidth, boxHeight, P6) → box6
  34. Element(movingPoints, movingIndex) → PMove
  35. centerBox(boxWidth, boxHeight, PMove) → highlightBox
  36. Text(("" * boxText(movingIndex)), If[Defined[PMove], PMove, (300, 300)], false, true, 0, 0) → textHightlight
  37. Sequence(HOME, k, 1, numDragBoxes) → allHome
  38. centerBox(boxWidth, boxHeight, P7) → box7
  39. centerBox(boxWidth, boxHeight, P8) → box8
  40. Sequence((((("SetValue(P" * K) * ",homeLocations(") * K) * "))"), K, 1, numDragBoxes) → cmdSendHome
  41. Zip(Text[("" * K), J, true, true, 0, 0], K, Take[boxText, 1, numDragBoxes], J, Take[movingPoints, 1, numDragBoxes]) → boxTextDisplay
  42. expandQuad(Vertex[box1, 1], Vertex[box1, 2], Vertex[box1, 3], Vertex[box1, 4], (7 * pulsing), Corner[1], Corner[3], Corner[5]) → pulsingBox1
  43. expandQuad(Vertex[box2, 1], Vertex[box2, 2], Vertex[box2, 3], Vertex[box2, 4], (7 * pulsing), Corner[1], Corner[3], Corner[5]) → pulsingBox2
  44. expandQuad(Vertex[box3, 1], Vertex[box3, 2], Vertex[box3, 3], Vertex[box3, 4], (7 * pulsing), Corner[1], Corner[3], Corner[5]) → pulsingBox3
  45. expandQuad(Vertex[box4, 1], Vertex[box4, 2], Vertex[box4, 3], Vertex[box4, 4], (7 * pulsing), Corner[1], Corner[3], Corner[5]) → pulsingBox4
  46. expandQuad(Vertex[box5, 1], Vertex[box5, 2], Vertex[box5, 3], Vertex[box5, 4], (7 * pulsing), Corner[1], Corner[3], Corner[5]) → pulsingBox5
  47. expandQuad(Vertex[box6, 1], Vertex[box6, 2], Vertex[box6, 3], Vertex[box6, 4], (7 * pulsing), Corner[1], Corner[3], Corner[5]) → pulsingBox6
  48. expandQuad(Vertex[box7, 1], Vertex[box7, 2], Vertex[box7, 3], Vertex[box7, 4], (7 * pulsing), Corner[1], Corner[3], Corner[5]) → pulsingBox7
  49. expandQuad(Vertex[box8, 1], Vertex[box8, 2], Vertex[box8, 3], Vertex[box8, 4], (7 * pulsing), Corner[1], Corner[3], Corner[5]) → pulsingBox8
  50. makeBox(pointStrip1, lengthStrip, heightStrip) → strip1
  51. Element({questionAddition, questionSubtraction, questionMultiplication, questionDivision}, indexQuestion) → question
  52. makeBox(pointStrip2, lengthStrip, heightStrip) → strip2
  53. makeBox(pointStrip1, (unitLengthAddition * (num2 - num1)), heightStrip) → addS1XBox
  54. makeBox(additionS1P1, (num1 * unitLengthAddition), heightStrip) → addS1NumBox
  55. Translate(addS1XBox, Vector[pointStrip1, pointStrip2]) → addS2XBox
  56. Translate(addS1NumBox, Vector[additionS1P1, additionS2P1]) → addS2NumBox
  57. makeBox(pointStrip2, lengthStrip, heightStrip) → addS2WholeBox
  58. Text((("" * variable) * ""), additionS1XLabel, true, true, 0, 0) → additionS1X
  59. Text((("" * num1) * ""), additionS1NumLabel, true, true, 0, 0) → additionS1Num1
  60. Text((("" * answer) * ""), additionS2AnswerLabel, true, true, 0, 0) → additionS2Answer
  61. Text((("" * num2) * ""), additionS2Num2Label, true, true, 0, 0) → additionS2Num2
  62. Segment(lineStart, lineStart + (2, 0)) → equationLine
  63. makeBox(pointStrip1, lengthStrip, heightStrip) → subS1XBox
  64. makeBox(pointStrip2, (unitLengthSubtraction * num2), heightStrip) → subS2Num1Box
  65. makeBox(subS2P1, (unitLengthSubtraction * num1), heightStrip) → subS2NumBox
  66. If(isSubtraction, animateControl, 0) → animateSubtraction
  67. Text(variable, subS1XLabelPos, true, true, 0, 0) → subS1XLabel
  68. Text((("\minus" * num1) * ""), subS1NumLabelPos, true, true, 0, 0) → subS1NumLabelNeg
  69. Text((("" * num2) * ""), subS2Num1LabelPos, true, true, 0, 0) → subS2Num1Label
  70. Text(answer, subS2AnswerLabelPos, true, true, 0, 0) → subS2AnswerLabel
  71. Text(num1, subS2Num2LabelPos, true, true, 0, 0) → subS2Num2Label
  72. Text((("" * num1) * ""), subS1NumLabelPos, true, true, 0, 0) → subS1NumLabel
  73. makeBox(pointStrip2, lengthStrip, heightStrip) → subS2SolBox
  74. If(animateAddition ≤ 0.5, greyNum, ((animateAddition - 0.5) * 2)) → animateAdditionFade
  75. makeBox(pointStrip1, lengthStrip, heightStrip) → multS1FullBox
  76. makeBox(pointStrip2, lengthStrip, heightStrip) → multS2FullBox
  77. If(isMultiplication, animateControl, 0) → animateMultiplication
  78. Sequence(pointStrip2 + (((unitLengthMult * answer), 0) * k), k, 1, num1Mult - 1) → multS2TopPoints
  79. Sequence(pointStrip1 + (((unitLengthMult * answer), 0) * k), k, 1, num1Mult - 1) → multS1TopPoints
  80. Sequence(pointStrip1 + (((unitLengthMult * answer) * k), 0) + ((unitLengthMult * answer / 2), ((-heightStrip)) / 2), k, 0, num1Mult - 1) → multS1LabelPoints
  81. Sequence(pointStrip2 + (((unitLengthMult * answer) * k), 0) + ((unitLengthMult * answer / 2), ((-heightStrip)) / 2), k, 0, num1Mult - 1) → multS2LabelPoints
  82. Zip(Segment[A, A + ((0, (-heightStrip)) * animateMultiplication)], A, multS2TopPoints) → multS2Segs
  83. Zip(Text[variable, A, true, true, 0, 0], A, multS1LabelPoints) → multS1Labels
  84. Zip(Text[(("" * answer) * ""), A, true, true, 0, 0], A, multS2LabelPoints) → multS2LabelsAnswer
  85. Text((("" * num2Mult) * ""), multS2LabelPoint, true, true, 0, 0) → multS2Label
  86. makeBox(pointStrip1, lengthStrip / num1Div, heightStrip) → divStrip1Initial
  87. makeBox(pointStrip2, lengthStrip / num1Div, heightStrip) → divStrip2Initial
  88. If(isDivision, animateControl, 0) → animateDivision
  89. Sequence(pointStrip1 + (k * ((num2Div * unitLengthDiv), 0)), k, 1, num1Div - 1) → divS1TopPoints
  90. Sequence(pointStrip2 + (k * ((num2Div * unitLengthDiv), 0)), k, 1, num1Div - 1) → divS2TopPoints
  91. Min(1, (animateDivision * 2)) → animateDivisionBoxes
  92. Sequence(divS1LabelStart + (k * (lengthStrip / num1Div, 0)), k, 1, num1Div - 1) → divS1LabelPoints
  93. Sequence(divS2LabelStart + (k * (lengthStrip / num1Div, 0)), k, 1, num1Div - 1) → divS2LabelPoints
  94. Text((("" * num2Div) * ""), divS2LabelStart, true, true, 0, 0) → divS2Label
  95. If(animateDivision ≤ 0.5, greyNum, ((animateDivision - 0.5) * 2)) → animateDivisionFade
  96. If(animateDivision ≤ 0.5, 1, Max[((1 - animateDivision) * 2), greyNum]) → animateDivisionIncrease
  97. makeBox(pointStrip1, lengthStrip, heightStrip) → divStrip1Outline
  98. makeBox(pointStrip2, lengthStrip, heightStrip) → divStrip2Outline
  99. Text((("" * variable) * ""), divS1LabelCenter, true, true, 0, 0) → divS1FinalLabel
  100. Text((("" * answer) * ""), divS2LabelCenter, true, true, 0, 0) → divS2FinalLabel
  101. If(animateSubtraction < greyNum, greyNum, animateSubtraction) → animateSubtractionFade
  102. If(1 - animateSubtraction > greyNum, 1 - animateSubtraction, greyNum) → animateSubtractionIncrease
  103. Text((((("" * num1) * "") * variable) * ""), multS1LabelPoint, true, true, 0, 0) → multS1Label
  104. Text("=", pointStrip2 - (spaceBetween / 2, heightStrip / 2), true, true, 0, 0) → textEquals
  105. Zip(Segment[A, A + (0, (-heightStrip))], A, multS1TopPoints) → multS1Segs
  106. Translate(divStrip1Initial, Vector[pointStrip1, animateStartPointS1]) → divStripInitialAnimateS1
  107. Translate(divStrip2Initial, Vector[pointStrip2, animateStartPointS2]) → divStripInitialAnimateS2
  108. Zip(Translate[divStripInitialAnimateS2, Vector[animateStartPointS2, K]], K, Take[divS2TopPoints, 1, animateDivisionBoxesIndex]) → divS2Boxes
  109. Translate(divStripInitialAnimateS1, Vector[(animateDivisionBoxesMove * Vector[animateStartPointS1, divS1TopPoints(animateDivisionBoxesIndex + 1)])]) → divMovingBox1
  110. Translate(divStripInitialAnimateS2, Vector[(animateDivisionBoxesMove * Vector[animateStartPointS2, divS2TopPoints(animateDivisionBoxesIndex + 1)])]) → divMovingBox2
  111. Zip(Text[(("" * num2Div) * ""), divS2LabelStart + K - divS2LabelStart, true, true, 0, 0], K, Take[divS2LabelPoints, 1, animateDivisionBoxesIndex]) → divS2Labels
  112. Take(question, 1, IndexOf["=", question] - 2) → questionS1
  113. Take(question, IndexOf["=", question] + 1) → questionS2
  114. Sequence(equationStart + ((spaceBetweenEquation * k), 0), k, -1, 1) → equationL1
  115. Sequence(equationStart + (0, (-spaceBetweenEquationLines)) + ((spaceBetweenEquation * k), 0), k, -1, 1) → equationL2
  116. Sequence(equationStart + (0, (-2 * spaceBetweenEquationLines)) + ((spaceBetweenEquation * k), 0), k, -1, 1) → equationL3
  117. Text("=", equationL1(2), true, true, 0, 0) → questionL1equals
  118. Text("=", equationL3(2), true, true, 0, 0) → questionL3equals
  119. Text(questionS1, equationL1(1), true, true, -1, 0) → questionL1S1
  120. Text(questionS2, equationL1(3), true, true, 1, 0) → questionL1S2
  121. Element({(("\minus" * num1) * ""), (("+" * num1) * ""), (("\div" * num1Mult) * ""), (("\times" * num1Div) * "")}, indexQuestion) → questionOp
  122. Text(questionOp, equationL2(1), true, true, -1, 0) → questionL2S1
  123. Text(questionOp, equationL2(3), true, true, 1, 0) → questionL2S2
  124. Text((("" * variable) * ""), equationL3(1), true, true, -1, 0) → questionL3S1
  125. Text((("" * answer) * ""), equationL3(3), true, true, 1, 0) → questionL3S2
  126. Text((((("" * variable) * "\div") * num1Div) * ""), divS1LabelStart, true, true, 0, 0) → divS1Label
  127. Zip(Translate[divStripInitialAnimateS2, Vector[animateStartPointS2, K]], K, Take[divS2TopPoints, animateDivisionBoxesIndex + 1, num1Div - 1]) → divS2DashedBoxes
  128. Min((animateAddition * 2), 1) → animateAdditionDivide
  129. Segment(additionS2P1, additionS2P1 + (0, ((-heightStrip) * animateAdditionDivide))) → additionSegS2
  130. Text((("" * num1) * ""), additionS2Num1Label, true, true, 0, 0) → additionS2Num1Neg
  131. Text((("" * num1) * ""), additionS1NumLabel, true, true, 0, 0) → additionS1Num1Neg

AI Drawing Prompt Reference

An interactive exercise interface for solving one-step equations. It includes an input box for entering numbers, a display box showing equations with variables, and movable adjustment boxes. Users input numbers and see equations and answers. The interface features randomly generated numbers, equations, and variables.
The prompt above was compiled from the original drawing commands and is for reference only.