MakeSort: Drag ‘n’ Drop Sorting Games Maker & Player

 

MakeSort

Welcome to MakeSort, the ultimate tool for creating and playing sorting games! Build interactive, drag-and-drop sorting activities for education, training, or fun—all within Google Slides.

Features

    • Quickly create custom sorting games with drag-and-drop functionality.
    • Validate solutions with automatic feedback.
    • Seamlessly integrate with Google Slides.
    • Designed for both makers and players—perfect for teachers, trainers, and learners.

How It Works

  1. Sign in with your Google account to enable MakeSort in Google Slides.
  2. Create a new sorting activity or choose from templates.
  3. Share your game with others or challenge yourself to solve it!

Read the Article:

From Scissors to Scripts:

A Sorting Games Implementation in Google Slides

Sorting and categorizing activities are a cornerstone of education, from early childhood to advanced computer science. Whether it’s sequencing the steps for making tea, understanding taxonomic hierarchies, or organizing historical events, these tasks engage students in logical thinking and problem-solving.

However, traditional approaches to these activities often present significant challenges:

  • Printing and cutting: Preparing multiple sets of cards or slips is time-intensive and often wasteful.
  • Fragility: Paper slips tear, fold, or go missing.
  • Laminating: While this can extend durability, it adds cost, time, and effort.
  • Managing sets: Keeping multiple sets intact and preventing them from mixing can be frustrating.
  • Sustainability: The environmental impact of repeated printing and discarding materials is hard to ignore.

As a teacher of MYP Design, I’ve frequently encountered these issues, which inspired me to create MakeSort, a digital solution for sorting activities. Built using Google Slides, MakeSort eliminates the need for physical materials while retaining the interactive nature of sorting tasks. The design cycle provided an excellent framework for tackling this problem, allowing me to model practical problem-solving for my students.


The Solution: Gamifying Sorting with Google Slides

MakeSort is a digital, interactive sorting tool designed to address these challenges. Built entirely in Google Slides, it offers:

  • Paperless functionality: No more printing or laminating.
  • Scalability: A single template can be shared with hundreds of students via platforms like Google Classroom.
  • Gamification: Engaging features like drag-and-drop and feedback for correct sorting make learning fun.

Watch the demo video to see MakeSort in action:

Demo Video:

 

Google Slides proved to be an ideal platform. Its intuitive drag-and-drop interface is easy for students to use, and its scripting capabilities enabled the automation of answer-checking and other interactive features.


The Journey: Step-by-Step Development

The creation of MakeSort was an iterative process that addressed one challenge at a time. Here’s how it evolved:


Setting the Stage: The Need for Shape Creation

One of the first hurdles was enabling teachers to dynamically create shapes for sorting tasks. It was designed to simplify this process, allowing users to input steps (e.g., “Kingdom, Phylum, Class, Order…”) and have the tool automatically generate draggable shapes on the slide. Each shape fulfills specific requirements:

  • Display the Step: Each shape clearly shows a unique step as input by the teacher.
  • Be Uniquely Identifiable: Shapes are assigned unique IDs, ensuring the activity can be validated later.

Key Function: createAndStoreDraggables(steps, slide)

This function handles the entire process of generating shapes dynamically while ensuring usability and flexibility. Here’s a breakdown of its core tasks:

  1. The function reads the teacher’s input from the sidebar and splits it into distinct steps using delimiters like commas or newlines.
  2. The parsed list of steps serves as the blueprint for creating shapes on the slide.
  3. For each step, a shape is created on the slide with a text box containing the step and a transparent overlay to enhance usability (e.g., by expanding the draggable area).
  4. Each shape is positioned randomly within the slide area for a shuffled initial layout.
  5. Every shape group is assigned a unique object ID upon creation, which is stored in the script properties to enable later operations like order validation or reshuffling.

 

Example activity

createAndStoreDraggables

Here’s how createAndStoreDraggables ensures dynamic shape creation:

function createAndStoreDraggables(steps, slide) {
  const groupIds = [];
  const stepCount = Math.min(steps.length, 16); // Limit to 16 steps

  // Dimensions and scaling for shapes
  const shapeWidth = SHAPE_CONFIG.shapeWidth;
  const shapeHeight = SHAPE_CONFIG.shapeHeight;
  const baseFontSize = SHAPE_CONFIG.fontSize;
  const pageWidth = SlidesApp.getActivePresentation().getPageWidth();
  const pageHeight = SlidesApp.getActivePresentation().getPageHeight();

  steps.forEach((step, index) => {
    try {
      // Random position within slide area
      const left = Math.random() * (pageWidth - shapeWidth);
      const top = Math.random() * (pageHeight - shapeHeight);

      // Create the text shape
      const textShape = slide.insertShape(SlidesApp.ShapeType.RECTANGLE, left, top, shapeWidth, shapeHeight);
      textShape.getText().setText(step);
      textShape.getText().getRange(0, step.length).getTextStyle()
        .setFontFamily(SHAPE_CONFIG.fontFamily)
        .setFontSize(baseFontSize);
      // Create a transparent overlay for better interaction
      const overlayShape = slide.insertShape(SlidesApp.ShapeType.RECTANGLE, left, top, shapeWidth, shapeHeight);
      overlayShape.getFill().setTransparent();
      overlayShape.getBorder().setTransparent();

      // Group text and overlay
      const group = slide.group([textShape, overlayShape]);
      groupIds.push(group.getObjectId());
    } catch (error) {
      Logger.log(`Error creating shape for step "${step}": ${error.message}`);
    }
  });

  return groupIds; // Return IDs for tracking
}

Highlights of This Approach

  • Dynamic Input Handling: Teachers have complete flexibility to input steps in natural formats (e.g., comma-separated or newline-separated). The tool intelligently processes these inputs to generate activity shapes.
  • Visual and Interactive Design: By grouping text shapes with transparent overlays, the function ensures that shapes are:
  • Robust Back-End Tracking: Each shape’s ID is stored persistently, allowing future operations like order validation, reshuffling, or clearing to reference the correct objects seamlessly.

Enhancing Usability with Grouped Transparent Covers

One of the subtle yet significant challenges in creating MakeSort was managing the user’s interaction with shapes. By default, Google Slides changes the cursor depending on the user’s hover position relative to a shape. Hovering near the edges or corners of a shape changes the cursor to indicate resizing or moving actions, while hovering in the center suggests text editing is possible. This behavior reflects Google’s thoughtful UX design, anticipating the user’s most likely desired action based on their pointer position.

text edit cursor and drag cursor

For sorting activities, however, where the primary goal is to move shapes rather than edit text, this default behavior can sometimes lead to confusion. Users may unintentionally enter text-editing mode instead of dragging the shape, disrupting the flow of the activity.

To address this, each shape in the sorting tool is grouped with a transparent rectangle slightly larger than the text box itself. This approach extends the draggable area while leaving the text untouched, allowing users to interact confidently with the shapes.

A transparent overlay that is placed over each draggable and grouped with it.

From the createAndStoreDraggables function above:

 // Create a transparent overlay for better interaction
      const overlayShape = slide.insertShape(SlidesApp.ShapeType.RECTANGLE, left, top, shapeWidth, shapeHeight);
      overlayShape.getFill().setTransparent();
      overlayShape.getBorder().setTransparent();

      // Group text and overlay
      const group = slide.group([textShape, overlayShape]);
      groupIds.push(group.getObjectId());

This simple yet effective design adjustment improves usability in several ways:

  • Increased Accuracy: A larger clickable area reduces the likelihood of missing the intended interaction, especially on devices with touchscreens.
  • Streamlined Interactions: Grouping the transparent cover with the text shape makes the action of moving shapes more intuitive and consistent.
  • Preserved Text Integrity: Users can focus on dragging and dropping without accidentally activating text-editing mode, maintaining the activity’s flow.

Adding Interactivity: Shuffling Shapes

A key aspect of MakeSort is engaging students by presenting them with a challenge. To do this, the shapes are deliberately shuffled, creating a “mess” on the slide. This chaotic arrangement encourages students to take charge, fostering a sense of control as they actively work to restore order.


The Value of Random Placement

Random placement serves several purposes:

  1. Engagement Through Challenge: When faced with a disordered slide, students feel empowered to sort it out. The task taps into a natural desire to organize and problem-solve, creating a more rewarding experience.
  2. Minimized Physical Effort: Random placement often means students don’t need to move blocks out of the way to place others in their correct position. This reduces unnecessary interactions and keeps the activity flowing smoothly.
  3. A Deliberate “Mess”: The scattered arrangement of shapes contrasts sharply with the final sorted order, making the activity visually impactful and reinforcing the importance of organization.

Key Function: shuffleGroups()

The shuffleGroups function randomizes the positions of the grouped shapes on the slide. Here’s how it works:

  1. Retrieve All Groups: The function identifies the draggable shapes on the slide using their unique group IDs.
  2. Randomize Placement: Each shape is assigned a new random position within the slide area. The placement logic ensures shapes don’t overlap excessively while spreading them out.
  3. Iterative Swapping: To ensure randomness, the function performs repeated swaps of two shapes’ positions, creating a dynamic and unpredictable arrangement.

Implementation of shuffleGroups

Here’s the function in action:

function shuffleGroups() {
  const slide = SlidesApp.getActivePresentation().getSelection().getCurrentPage();
  if (!slide) return "Error: Please select a slide to shuffle groups.";

  const slideId = slide.getObjectId();
  const props = PropertiesService.getScriptProperties();
  const groupIds = JSON.parse(props.getProperty(`SHAPE_IDS_${slideId}`) || "[]");

  if (!Array.isArray(groupIds) || groupIds.length === 0) {
    return "Error: No valid groups found to shuffle. Please recreate the activity.";
  }

  const groups = slide.getGroups();
  const groupMap = groups.reduce((map, group) => {
    map[group.getObjectId()] = group;
    return map;
  }, {});

  const groupsToShuffle = groupIds.map((id) => groupMap[id]).filter(Boolean);
  if (groupsToShuffle.length === 0) return "Error: No matching groups found to shuffle.";

  // Shuffle logic: Assign random positions
  const slideWidth = SlidesApp.getActivePresentation().getPageWidth();
  const slideHeight = SlidesApp.getActivePresentation().getPageHeight();

  groupsToShuffle.forEach((group) => {
    const left = Math.random() * (slideWidth - group.getWidth());
    const top = Math.random() * (slideHeight - group.getHeight());
    group.setLeft(left).setTop(top);
  });

  return "Success: Groups have been shuffled.";
}

Impact on the Learning Experience

  1. Active Participation: The randomness keeps the activity unpredictable, requiring students to engage fully with each task.
  2. Power Dynamics: Starting with a “mess” gives students a sense of authority as they bring order to chaos. This sense of accomplishment boosts confidence and satisfaction.
  3. Efficiency and Flow: Unlike a sequential layout, where students must move blocks out of the way to rearrange them, random placement minimizes unnecessary interactions, allowing them to focus on solving the puzzle.

Why This Matters

Random shuffling transforms the activity from a static exercise into a dynamic challenge. By creating a deliberate “mess” and encouraging students to take control, MakesSort fosters problem-solving skills and active participation. The psychological effect of resolving disarray into order is powerful, making the sorting activity both memorable and impactful.


3. Validating the Solution: Checking the Order

At the heart of the sorting tool lies its ability to validate whether students have arranged the shapes correctly. This validation is achieved through a straightforward yet elegant approach: comparing the vertical positions of shapes on the slide to the predefined correct order. The simplicity of this technique ensures that the tool is fast, reliable, and intuitive.


The Magic of Y-Values

Google Slides assigns every shape a set of coordinates (top, left) to define its position on the slide. The top coordinate, often referred to as the Y-value, determines the vertical position of a shape:

  • Smaller Y-values indicate shapes higher on the slide.
  • Larger Y-values correspond to shapes lower on the slide.

This inherent property of Google Slides allows us to efficiently validate the order of shapes by sorting them based on their Y-values.


Key Function: checkShapeOrder()

The checkShapeOrder function validates the arrangement of shapes with the following steps:

  1. Retrieve Shapes: The function identifies all draggable groups on the slide using their unique IDs stored in the script properties.
  2. Sort by Y-Values: The groups are sorted in ascending order of their Y-values (getTop()), representing their vertical order from top to bottom on the slide.
  3. Compare with Correct Order: The sorted order of shapes is compared against the pre-defined correct order stored in the MASTER_LIST during activity creation.
  4. Provide Feedback: If the two orders match, a success message is returned. If they don’t match, the function provides an error message, encouraging students to try again.

Implementation of checkShapeOrder

Here’s how the function works under the hood:

function checkShapeOrder() {
  const slide = SlidesApp.getActivePresentation().getSelection().getCurrentPage();
  if (!slide) {
    return "Error: Please select a slide to check the order.";
  }

  const slideId = slide.getObjectId();
  const props = PropertiesService.getScriptProperties();
  const masterList = JSON.parse(props.getProperty(`MASTER_LIST_${slideId}`) || "[]");
  const groupIds = JSON.parse(props.getProperty(`SHAPE_IDS_${slideId}`) || "[]");

  if (!Array.isArray(masterList) || !Array.isArray(groupIds)) {
    return "Error: Activity data is corrupted. Please recreate the activity.";
  }

  const groups = slide.getGroups();
  const groupMap = new Map(groups.map((group) => [group.getObjectId(), group]));

  // Validate all group IDs exist in the map
  const validGroups = groupIds.map((id) => groupMap.get(id)).filter(Boolean);

  if (validGroups.length !== groupIds.length) {
    const missingIds = groupIds.filter((id) => !groupMap.has(id));
    Logger.log(`Missing group IDs: ${JSON.stringify(missingIds)}`);
    return `Error: Some groups are missing or have been deleted. Missing IDs: ${missingIds.join(", ")}`;
  }

  // Sort by vertical position
  const sortedGroups = validGroups.sort((a, b) => a.getTop() - b.getTop());
  const currentOrder = sortedGroups.map((group) => group.getObjectId());

  if (JSON.stringify(currentOrder) === JSON.stringify(groupIds)) {
    Logger.log("Groups are in the correct order. Triggering winner dialog.");
    triggerWinnerDialog();
    return "Success: The groups are in the correct order!";
  } else {
    Logger.log(`Expected order: ${JSON.stringify(groupIds)}`);
    Logger.log(`Current order: ${JSON.stringify(currentOrder)}`);
    return "Error: Groups are not in the correct order. Try again!";
  }
}

Why Y-Values Work So Well

The Y-value method for validating shape order is not only intuitive but also highly efficient and robust. MakeSort simplifies the process by leveraging the inherent properties of Google Slides to streamline what would otherwise be a tedious manual task.

Key Advantages

  • Intuitive Logic: Since the Y-value corresponds directly to a shape’s vertical position, sorting by it mirrors the natural top-to-bottom order of items as they appear visually on the slide. This makes the process both logical and predictable.
  • Simplicity and Efficiency: By using the getTop() property, the function avoids the need for complex tracking, iterative comparisons, or external references. Sorting the Y-values and comparing them with the correct order is a single-step operation, making it highly efficient.
  • Seamless Feedback: Students receive instant feedback on whether their arrangement matches the correct order. This reinforces their understanding of the task and encourages them to refine their approach as needed.

Key Benefits

  • Accuracy in Validation: Sorting by Y-values ensures that the tool reliably identifies the correct top-to-bottom order, regardless of small positional variations.
  • Interactive Learning: Instant feedback keeps students engaged and allows them to learn through trial and error. They can visually see their progress and adjust their sorting accordingly.
  • Robust and Resilient: Even if shapes are slightly misaligned or overlap, the Y-value sorting remains accurate as long as the general vertical hierarchy is preserved.

Here’s why this method is more efficient:

  • The Y-value approach provides unmatched precision and speed compared to manual validation.
  • Manual validation requires a human verifier to repeatedly check each item’s position on the slide against the correct order, a process that becomes slower and more error-prone as the number of shapes increases.
  • The tool automates the entire process by retrieving all Y-values, sorting shapes in a single step, and instantly comparing the order to the correct answer.
  • This automation makes validation nearly instantaneous and eliminates the risk of human error or bias.

The Takeaway

By leveraging Y-values, MakeSort transforms what could be a labor-intensive validation process into an automated, efficient, and error-free operation. It aligns perfectly with the tool’s goal of providing an intuitive, interactive experience for students while ensuring teachers can trust the accuracy of the results.


4. Gamifying Success: Adding Celebration

Considering a Listener: Why Not Automate Validation

During development, I explored adding a listener to MakeSort. The concept was simple: a background function, called after shuffling is complete, that would automatically check the order every 2 seconds, eliminating the need to click the “Check Answer” button. To implement, I repeatedly call the checkShapeOrder function at set intervals to verify whether the shapes were arranged in the correct order. At first glance, this seemed like a user-friendly enhancement, streamlining the process and providing immediate feedback.

/**
 * Listener function to repeatedly check the order of shapes.
 * This function can be set to run at regular intervals to validate the current arrangement.
 */
function startValidationListener() {
  const interval = 2000; // Interval in milliseconds (2 seconds)

  // Function to repeatedly check the order
  function validateOrderPeriodically() {
    const isValid = checkOrder(); // Assuming checkOrder is implemented to validate current order

    if (isValid) {
      clearInterval(listener); // Stop validation once correct
      triggerWinnerDialog();  // Trigger success dialog or action
    }
  }

  // Set an interval for validation
  const listener = setInterval(validateOrderPeriodically, interval);
}

Here’s why I realized the drawbacks outweighed the benefits:

  1. Encouraging Thoughtful Interaction: Clicking “Check Answer” encourages students to reflect on their arrangement before submitting, reinforcing deliberate problem-solving. In contrast, a listener could promote brute-force trial and error, bypassing the critical thinking that makes sorting activities valuable.
  2. Maintaining Learning Integrity: Actively submitting an answer mirrors real-world scenarios, like test-taking, where deliberate action is required. Automating validation might reduce the cognitive engagement students bring to the activity.
  3. Avoiding Performance Overhead: A listener constantly checking for correctness introduces background processing, which could impact performance on devices with limited resources or large datasets.

Ultimately, I chose to keep validation as a deliberate, user-initiated action. This decision reflects a balance between user convenience and MakeSort’s primary educational purpose: fostering logical reasoning and intentional interaction. As a result, the “Check Answer” button remains central to the tool, providing clear feedback while preserving the integrity of the learning process.


Feedback and Celebration: Toasts and the Winner Dialog

Clear, engaging feedback is a cornerstone of the sorting activity tool. To achieve this, two separate UI elements were implemented: toast notifications for routine feedback and a Winner dialog for celebrating success. Each plays a distinct role in enhancing the user experience.

Toast Notifications: Streamlining Sidebar Functionality

Every action triggered from the sidebar (e.g., creating shapes, shuffling, checking answers) provides immediate feedback via a toast notification. These toasts:

  • Purpose: Communicate success or failure for routine actions like validating an order or resetting the activity.
  • Design: Styled as small, non-intrusive messages that appear temporarily at the bottom of the screen, they

Example toast notifications

function showToast(message) {
  const toast = document.getElementById("toast");
  toast.textContent = message;
  toast.className = "toast show";
  setTimeout(() => { toast.className = toast.className.replace("show", ""); }, 3000);
}

This function is called after every sidebar-triggered action using the google.scrit.run API, ensuring users receive contextual feedback whether an operation succeeds or fails.

 

winner dialog box

The Winner Dialog: Celebrating Success

The “Winner” dialog takes feedback a step further, offering a dedicated celebration when students correctly arrange the shapes. Unlike toasts, which provide routine updates, the Winner dialog:

  • Purpose: Rewards users for achieving the correct order, reinforcing their accomplishment.

Design: A modal dialog appears with a styled HTML banner featuring celebratory visuals like balloons, a bold “Winner!” message, and congratulatory text. For example:

function triggerWinnerDialog() {
  const html = HtmlService.createHtmlOutput(`
    <div style="text-align: center; padding: 20px;">
      <h1 style="color: green;">🎉 Winner! 🎉</h1>
      <p>Congratulations, you arranged the steps correctly!</p>
    </div>
  `).setWidth(300).setHeight(200);
  SlidesApp.getUi().showModalDialog(html, "Winner!");
}

When Each Element Appears

  1. Toasts: Triggered after every sidebar function. They provide feedback for actions like validating the order with “Check Answer,” indicating the success of “Shuffle Shapes” or “Clear Shapes,” or alerting users about missing input or errors.
  2. Winner Dialog: Triggered only when the checkShapeOrder() function confirms the shapes are in the correct sequence. It appears as a modal to emphasize the accomplishment.

Why Two Feedback Systems?

  1. Toasts: These provide quick, continuous feedback for routine interactions, ensuring users are informed without disrupting their workflow.
  2. Winner Dialog: This offers a dedicated moment of recognition for successfully completing the activity, reinforcing motivation and engagement.

Together, these UI elements balance functionality and celebration, supporting the tool’s focus on usability and ensuring users feel rewarded at every step.

5. Tailoring for Teachers and Students

To provide a streamlined experience for both teachers and students, the tool dynamically customizes the sidebar interface based on the logged-in user’s email. For students, unnecessary features are hidden, ensuring they only access the “Check Order” button. Teachers, on the other hand, have full access to all functionality.

This was achieved by analyzing the structure of student email addresses. In this system, student emails follow a specific format:

Email Format: [firstInitial][lastName][graduationYear]@schoolname.edu For example:

Key Function: checkUserRole

The checkUserRole function identifies whether a user is a teacher or student based on their email. It uses a regular expression (regex) to match the typical student email structure:

function checkUserRole() {
  const email = Session.getActiveUser().getEmail();
  const studentEmailPattern = /^[a-zA-Z]\w*\d{2}@kas$/; // Matches "[email protected]"

  if (studentEmailPattern.test(email)) {
    return "student"; // Graduation year pattern indicates a student
  } else {
    return "teacher"; // Otherwise, assume it's a teacher
  }
}

How the Regex Works

  1. ^[a-zA-Z]: Ensures the email starts with a single letter, which represents the first initial of the first name.
  2. \w*: Matches any combination of letters, numbers, or underscores (to represent the last name).
  3. \d{2}: Matches exactly two digits at the end of the name, representing the graduation year.
  4. @kas$: Matches the domain @schoolname.edu at the end of the email.

For example:

Dynamic Role-Based UI and Sidebar Adjustments

The checkUserRole function seamlessly integrates with the sidebar logic, dynamically adapting the interface based on whether the user is a teacher or a student. This ensures that each role has access to only the necessary features, enhancing both usability and security.

Student-view of Sidebar

 

Teacher-view of Sidebar

Key Sidebar Code

The following code dynamically adjusts the sidebar based on the user’s role detected by the checkUserRole function:

document.addEventListener("DOMContentLoaded", function () {
  const buttons = document.querySelectorAll("button");
  const checkOrderButton = document.getElementById("checkButton");
  const playAgainButton = document.getElementById("playAgainButton");
  const textArea = document.getElementById("stepsInput");
  const studentInstructionsButton = document.getElementById("studentInstructionsBtn");
  const bgImageDiv = document.querySelector("div > h3"); // Get Background Image section
  // Hide all elements by default
  buttons.forEach((button) => (button.style.visibility = "hidden"));
  if (textArea) textArea.style.visibility = "hidden";
  if (bgImageDiv) bgImageDiv.parentElement.style.visibility = "hidden";

  // Adjust visibility based on user role
  google.script.run.withSuccessHandler(function (role) {
    if (role === "teacher") {
      // Show all elements for teachers
      buttons.forEach((button) => (button.style.visibility = "visible"));
      if (textArea) textArea.style.visibility = "visible";
      if (bgImageDiv) bgImageDiv.parentElement.style.visibility = "visible";
    } else if (role === "student") {
      // Show limited elements for students
      if (checkOrderButton) checkOrderButton.style.visibility = "visible";
      if (playAgainButton) playAgainButton.style.visibility = "visible";
      if (studentInstructionsButton) studentInstructionsButton.style.visibility = "visible";
    }
  }).checkUserRole();
});

The Outcome: A Digital Sorting Tool

MakeSort successfully addresses the challenges it set out to solve. By eliminating the need for printed materials, it removes paper waste and the tedious process of cutting, laminating, and managing sorting cards. The digital format ensures that teachers save time and resources while also adopting a more sustainable approach.

Students benefit from an engaging, interactive experience through the tool’s drag-and-drop functionality. This hands-on approach not only makes sorting tasks enjoyable but also reinforces learning by integrating gamified feedback. Each correct solution is met with celebratory prompts, keeping students motivated and eager to engage with the activity.

Moreover, the tool is highly scalable. With a single script-enabled Google Slides file, teachers can create activities that are easily distributed to hundreds of students through platforms like Google Classroom. This simplicity makes the tool a powerful asset for educators managing large groups or diverse subjects.


Reflections: Why This Project Worked

The success of this project lies in its foundations:

It began with a clear, tangible need. As a teacher, I personally experienced the frustrations of managing traditional sorting activities. This firsthand understanding provided the motivation and clarity needed to develop a solution that directly addressed the problem.

The project was shaped by iterative development. Instead of attempting to create a perfect tool from the start, each feature was built step by step. New challenges arose throughout the process, and the tool was refined at every stage to overcome them. This flexible approach ensured continuous improvement.

Collaboration was key, with much of the coding and debugging done through conversations with ChatGPT. This approach allowed for brainstorming ideas, solving problems, and generating code in real time. Each feature reflects the creative synergy of coding alongside an AI partner, streamlining the development process and enhancing the tool’s design.


Next Steps: Expanding the Tool

While MakeSort already offers significant benefits, there’s still room for enhancement. Future versions could introduce features that extend its functionality and deepen its educational impact.

Hints or partial feedback for incorrect answers could provide students with additional guidance while preserving the challenge of sorting tasks. This would make the tool more accessible for learners who may struggle with certain topics.

A database of prebuilt sorting tasks for various subjects could save teachers even more time. Ready-made activities for subjects like history, science, or mathematics could help educators quickly integrate the tool into their lesson plans.

Allowing students to create their own sorting activities would open up a new realm of possibilities. By designing tasks for their peers, students could deepen their understanding of the material and develop their creativity in the process.

Closing Thoughts

Transforming Challenges into Opportunities

This project demonstrates the power of applying innovative thinking and technology to address practical challenges in education. By replacing paper-based sorting activities with an interactive, scalable digital tool, we’ve not only streamlined logistics but also redefined how students engage with learning tasks. Teachers now have a sustainable, efficient solution that prioritizes usability while empowering students through gamified, hands-on experiences.

The success of this project underscores a few key principles:

  • Design Thinking in Action: Starting with a real-world problem, each step of development focused on refining solutions to meet both teacher and student needs.
  • Collaboration and Adaptability: The iterative process ensured continuous improvement, turning obstacles into opportunities for innovation.
  • Sustainability and Scalability: By leveraging existing platforms like Google Slides, the tool eliminates waste and can easily be adapted for diverse educational contexts.

Looking ahead, the possibilities for enhancing MakeSort are boundless. From incorporating subject-specific sorting tasks to enabling students to design their own activities, this foundation sets the stage for broader applications in fostering creativity and critical thinking.

At its core, MakeSort serves as a testament to the transformative potential of digital tools in education. By focusing on solving real problems, we can create meaningful, lasting change in how we teach and learn.

I would love any and all feedback on MakeSort, especially from teachers who choose to use it in their classrooms or assign it through Google Classroom. Your insights and experiences are invaluable in refining and expanding this tool to better meet the needs of educators and students alike. Let’s keep exploring how technology can empower educators and inspire learners together.

 

Contact Us

If you have any questions, feel free to contact us at megiddo at gmail dot com.

Privacy Policy

Your privacy is important to us. MakeSort only uses Google account information to authenticate your access and ensure your activities are saved securely. Learn more in our Privacy Policy.

Terms of Service

 

Leave a Reply

Your email address will not be published. Required fields are marked *