Manipul8: An Interactive Experience toInspire Pattern-Based AlgebraicThinking and RepresentationalFluency

Kelly L. BolesStanford UniversityStanford, CA 94305, USAkboles@stanford.edu

Livia MacedoTLT Lab, Stanford UniversityStanford, CA 94305, USAliviamm@stanford.edu

Chris ProctorTLT Lab, Stanford UniversityStanford, CA 94305, USAcproctor@stanford.edu

Paulo BliksteinTLT Lab, Stanford UniversityStanford, CA 94305, USApaulob@stanford.edu

Permission to make digital or hard copies of part or all of this work for personal orclassroom use is granted without fee provided that copies are not made or distributedfor profit or commercial advantage and that copies bear this notice and the full citationon the first page. Copyrights for third-party components of this work must be honored.For all other uses, contact the owner/author(s).

Copyright held by the owner/author(s).IDC ’18, June 19–22, 2018, Trondheim, NorwayACM 978-1-4503-5152-2/18/06.https://doi.org/10.1145/3202185.3210763

AbstractTransitioning students from arithmetic to algebraic thinkingis a primary challenge in mathematics education. Visualpatterns and physical manipulatives can be helpful, but stu-dents often struggle to see the connections between dif-ferent representations. Manipul8 combines visual patternswith physical manipulatives and provides digital scaffoldingto help students develop representational fluency. Using atabletop tangible user interface, students manipulate equa-tion frames with cutouts for quadratic, linear, and constantterms. Tangible, interchangeable terms are represented ei-ther traditionally or as quantities of shapes. The projecteddigital image provides real-time feedback showing algebraicgrowth patterns generated from the user-chosen equationstructure and terms. Color provides scaffolding for noticingthe connections between the equation’s terms and visual-pattern-based representations.

Author Keywordsmath; algebra; tangible user interfaces; multiple representa-tions; visual patterns; functions; representational fluency

CCS Concepts•Applied computing → Interactive learning environ-ments;

Art Installations & Demonstrations IDC 2018, June 19–22, 2018, Trondheim, Norway

IntroductionUnderstanding algebraic functions is a prerequisite for suc-cess in advanced mathematics, physics, computing, andrelated fields. However, the movement from arithmetic to al-gebraic thinking, which occurs sometime between late ele-mentary to early high school, is often a significant hurdle forstudents [2]. We posit that intentional use of visualizationand structured embodied interaction may ease the transi-tion and enable students to more fully and naturally realizethis type of mathematical thinking.

Figure 1: A child exploresfunctions with Manipul8.

Visual patterns are a common entry to algebraic think-ing [12], as they allow learners to conceptualize algebraicgrowth in various ways (See Figure 3) [8]. Manipul8 inte-

Figure 2: A typical visual growthpattern students consider whenbeginning to work with algebraicconcepts.

grates visual patterns, physical manipulatives, and real-timefeedback which scaffolds student thinking toward the explo-ration of and relationships between algebraic concepts.

Background and Related WorkWe focus on the development of algebraic intuition andnoticing within visual growth patterns. Research has specif-ically identified the multiple representations and accesspoints for these patterns as rich for the development ofstudent understanding [8, 7] but also problematic in thatstudents struggle to make representational connections be-

Figure 3: Three ways to visualizea single growth pattern.

tween the visual and symbolic forms [5]. Manipul8 buildson: 1. the utility of concrete manipulatives [11] to promotealgebraic fluency, 2. the importance of physical manipula-tion in promoting mathematical understanding and transfer[6], and 3. the clarity of color to aid in the visualization ofmathematic ideas [3]. Manipul8 contributes to this schol-arship but separates itself from the field in that its dual tan-gible and digital visualizations allow for the considerationof pattern-based algebraic growth ideas in ways that areconcrete, exploratory, yet tightly-coupled; further Manipul8includes integrated, but fadeable scaffolding, explicitly sup-

porting users in noticing connections between representa-tional forms.

Visual Patterns and Algebraic ThinkingVisual patterns are often an entry point to algebraic reason-ing. Pattern questions ask students to generalize growth,generate missing steps, and re-conceptualize growth asfunctions [12]. Students often encounter difficulties withthis pattern work. Typical student weaknesses include: ge-ometric visualization of functions, visualization of additionalpattern terms, and formation of conceptual connections be-tween position value (’n’) to the pattern itself [5].

Scaffolding for Representational FluencyVisual representations can allow for "new and deep un-derstandings" [3] when considering patterns as functions.While physical manipulatives can be helpful [11], their usein classrooms does not guarantee student understanding.One common explanation is that students often do not linkmanipulatives and symbols with representational fluency[4]. Manipul8 supports the development of representationalfluency with clear ties between visualizations; the visualpatterns dynamically respond as terms are interchanged inan equation frame, and color scaffolding components areincluded to help users conceptually connect a term to itscorresponding portion of the generated pattern. As studentalgebraic thinking and representational fluency builds, thecolor scaffolds can fade [10].

Tangibles and Multiple External RepresentationsResearch has shown that Multiple External Representa-tions (MERs) further support the formation of connectionsbetween representations, in that learners can view manyrepresentations, try multiple strategies, and may under-stand an unfamiliar representation via its juxtaposition witha familiar form [1]. Further, tangible representations canreduce a learner’s cognitive load, appropriately constrain

Art Installations & Demonstrations IDC 2018, June 19–22, 2018, Trondheim, Norway

user inferences, promote exploratory behavior, and en-Representational FluencyThe ability to fluidly translatebetween and relate rep-resentations of the samemathematical idea

Figure 4: Users have sevenequation frame options,representing all combinations ofquadratic, linear, and constantforms.

Figure 5: Equation frames havecutouts for interchangeable termmanipulatives. Circles arequadratic terms; squares are linearterms; and hexagons areconstants. Negative spaces at theupper-right of each manipulativeserve as both fingerholds and aredigitally backlit with color to providescaffolding betweenrepresentations.

hance learning relative to multi-touch interfaces. Addition-ally, tabletop tangible user interface environments allow fortightly-coupled inputs and outputs, as both the input andoutput can overlap in the same plane [9].

DesignManipul8 allows students to concretely experience theideas and necessity of mathematical structure and vari-able representation using physical manipulatives within adigital platform. Shapes represent different types of alge-braic growth, minimizing formal barriers to access. Usersfirst choose an equation structure - a physical frame withnegative space(s) that allows for any combinatorial possibil-ities of quadratic, linear, and constant terms (See Figures 4,5). Using manipulatives representative of algebraic terms,students fill the frame, generating a digital growth pattern.Learners physically explore math in a fluid way, while ex-periencing scaffolds, such as color-codes, that support theassociation of symbolic representations with correspondingportions of the visual pattern (See Figure 6).

Manipulatives and Physical StructureDuring user testing we found the tangible componentsmake essential contributions to the fluidity of the explo-ration. The wooden equation frames are particularly impor-tant, as they demand the user to first conceptualize the typeof growth an idea requires, choose the appropriate com-plementary frame, and then select the terms. This physicaldistinction between mathematical structure and term valueshifts the learner’s cognitive load from considering the ideassynchronously to considering each separately. In this way,the technology encourages the user to consider distinctsubcomponents of the function’s structure, an importantconceptual process for the making of connections betweenportions of the equation and their representations.

Scaffolds in Digital and Physical RepresentationsA common learner issue when building algebraic reason-ing with pattern growth problems is difficulty in conceptuallymapping the corresponding components of each repre-sentation. Manipul8 includes intentional scaffolding, boththrough digital colorization and physical interchangeabilityof terms, allowing students to visualize the portion of eachpattern generated by individual terms within the equationas well as to transfer these terms to new equation struc-tures. A particularly important affordance of the equationframe structure is the negative space in the upper-right ofeach cutout (See Figure 5). This feature functions both asa fingerhold and zone for digital color backlighting, bathinga chosen term in the same color as the portion of the pat-tern it generates (See Figure 6). In this way, students aresupported in forming connections between mathematicalstructure, term, and pattern portions that are transferablethroughout the Manipul8 experience.

Learner Agency and AssistanceThe dual sets of term manipulatives - shape-based faces(See Figure 7) and traditional term-based faces (See Fig-ure 8) - allow for learner agency and choice in how he/shewould like to engage with the mathematic ideas. Addition-ally, the shapes of the negative cutouts within the equationframes as well as the matching shapes of the term manip-ulatives allow the user flexibility of exploration while stillfocusing on mathematically simplified standard forms ofquadratic, linear, or constant equations.

Further, the slider for values of n affords the user additionalagency in how he/she wishes to explore pattern growth. Inthe default view, Manipul8 displays the first three patterns(n=1, n=2, and n=3) for a specified equation (See figure6); however, the user can change the value of the slider toconsider the visualizations generated by larger values of n.

Art Installations & Demonstrations IDC 2018, June 19–22, 2018, Trondheim, Norway

Conclusion and Future Work

Figure 6: The function’s pattern ofalgebraic growth is shown for threepositions.

Figure 7: Shape-based faces forterm manipulatives allow users tointeract without the barrier ofalgebraic/symbolic notation.

Figure 8: Traditional term-basedfaces for manipulatives allowManipul8 to grow with the user’smathematical development.

Manipul8 is a tangible user interface allowing students toexplore algebraic thinking through pattern analysis andbuilding. Physical manipulatives and the digital projectionare tightly-coupled, allowing for scaffolding that meaning-fully supports the learner in making connections towardrepresentational fluency. Future empirical work will includeanalysis of student noticing and sense-making practices aswell as several additional modes of co-designed interaction.

AcknowledgementsThe authors wish to thank the Stanford Lemann Center forEntrepreneurship and Educational Innovation in Brazil for itssupport.

REFERENCES1. Shaaron Ainsworth. 2006. DeFT: A conceptual

framework for considering learning with multiplerepresentations. Learning and Instruction 16, 3 (2006),183–198.

2. Deborah Lowenburg Ball. 2003. Mathematicalproficiency for all students: Toward a strategic researchand development program in mathematics education.RAND Corporation. 122 pages.

3. Jo Boaler, Lang Chen, Cathy Williams, and MontserratCordero. 2016. Seeing as understanding: Theimportance of visual mathematics for our brain andlearning. Journal of Applied & ComputationalMathematics 5, 5 (2016), 1–6.

4. James J. Kaput. 1989. Linking representations in thesymbol systems of algebra. In Research Issues in theLearning and Teaching of Algebra, S. Wagner andC. Kieran (Eds.). NCTM, Reston, Virginia, 167–194.

5. Mollie MacGregor and Kaye Stacey. 1995. The effect ofdifferent approaches to algebra on students’

perceptions of functional relationships. MathematicsEducation Research Journal 7, 1 (1995), 69–85.

6. Taylor Martin and Daniel L. Schwartz. 2005. Physicallydistributed learning: Adapting and reinterpretingphysical environments in the development of fractionconcepts. Cognitive Science 29, 4 (2005), 587–625.

7. Manolis Mavrikis, Richard Noss, Celia Hoyles, andEirini Geraniou. 2013. Sowing the seeds of algebraicgeneralization: Designing epistemic affordances for anintelligent microworld. Journal of Computer AssistedLearning 29, 1 (2013), 68–84.

8. John Pegg and Edward Redden. 1990. Procedures for,and experiences in, introducing algebra in New SouthWales. The Mathematics Teacher 83, 5 (1990),386–391.

9. Bertrand Schneider, Patrick Jermann, GuillaumeZufferey, and Pierre Dillenbourg. 2011. Benefits of atangible interface for collaborative learning andinteraction. IEEE Transactions on LearningTechnologies 4, 3 (2011), 222–232.

10. Bruce Sherin, Brian J. Reiser, and Daniel Edelson.2004. Scaffolding analysis: Extending the scaffoldingmetaphor to learning artifacts. The Journal of theLearning Sciences 13, 3 (2004), 387–421.

11. Evelyn J. Sowell. 1989. Effects of manipulativematerials in mathematics instruction. Journal forResearch in Mathematics Education 20, 5 (1989),498–505.

12. Elizabeth Warren and Tom Cooper. 2008. Generalisingthe pattern rule for visual growth patterns: Actions thatsupport 8 year olds’ thinking. Educational Studies inMathematics 67, 2 (2008), 171–185.

Art Installations & Demonstrations IDC 2018, June 19–22, 2018, Trondheim, Norway