# Using Codex to Create a Better SLS Drag-and-Drop Activity

Standard SLS question types are useful for checks of understanding, but some learning ideas need more than a click-and-click interaction. Sorting activities are a good example. When students need to compare ideas, move examples into categories, revise their thinking, and receive targeted feedback, a custom HTML5 interactive can make the learning much richer.

This AC/DC sorting activity was created with Codex App as a single offline HTML file for SLS. Students sort everyday objects into **AC**, **DC**, or **AC-to-DC** categories using drag-and-drop, tap-to-place, mouse, touch, or keyboard controls.

## Why This Is Superior to a Standard SLS Click Question

A normal SLS click question can ask students to choose an answer. That is helpful, but it often captures only the final choice. It does not easily show how students reason, revise, or confuse related ideas.

This Codex-created activity gives students a more active learning experience:

- Students manipulate examples directly instead of only selecting an option.
- The same activity works on laptops, tablets, mobile phones, and classroom smartboards.
- Students can use drag-and-drop or the accessible click-to-place method.
- Feedback appears after each placement, so misconceptions are addressed immediately.
- The teacher action log records the sequence of student actions, attempts, and results.
- The whole activity is self-contained in one HTML file and can run offline inside SLS.

## What Students Learn Better

The activity is not just about labelling items. It helps students distinguish between:

- **AC supply** from wall sockets and mains-powered appliances.
- **DC supply** from batteries and cells.
- **AC-to-DC conversion** in devices such as phones, laptops, and power adaptors.

This is important because students often think, "If it plugs into the wall, it must be AC." The activity makes that misconception visible. A phone or laptop may be charged from an AC wall socket, but the device itself uses DC after conversion by an adaptor or charger.

## Why Codex App Makes This Possible

Creating this kind of interactive by hand would normally require a lot of web-development knowledge: responsive layout, touch events, drag-and-drop logic, keyboard accessibility, feedback tooltips, and analytics logging.

With Codex App, the teacher can describe the learning activity in natural language, including SLS constraints, mobile requirements, smartboard requirements, and pedagogy. Codex then helps create the working HTML, CSS, and JavaScript in the correct folder.

In this case, Codex produced:

- A complete `index.html` file with no external libraries.
- Mobile-first responsive design for a 450 px SLS iframe.
- Touch and mouse drag-and-drop.
- Click-to-place support for accessibility.
- Keyboard support.
- Post-drop feedback tooltips.
- Real-time teacher analytics.
- Smartboard-friendly target sizes and spacing.

## The Teacher Benefit

The biggest improvement is not just that the activity looks more interactive. It changes what the teacher can observe.

Instead of only seeing whether a student got a final answer correct, the teacher can see the learning process:

- Which item the student selected.
- Which category the student chose.
- Whether it was correct or wrong.
- How many attempts were made.
- Which misconceptions appeared.
- Whether the student corrected their thinking.

This supports better classroom discussion. A teacher can ask, "Why did many students place the laptop under AC?" and then guide the class towards the idea of AC-to-DC conversion.

## Why It Fits SLS Well

The activity is designed for SLS deployment:

- It is a single self-contained HTML file.
- It does not need internet access or external JavaScript libraries.
- It fits inside an iframe.
- It works with mouse, touch, and smartboard input.
- It includes visible instructions and feedback.
- It keeps the interface compact for classroom use.

This means teachers can go beyond the default question types while still staying within the SLS interactive learning environment.

## Conclusion

Codex App allows teachers to turn a teaching idea into a working interactive activity quickly. For concepts like AC and DC, where students benefit from sorting, comparing, correcting, and explaining, a custom drag-and-drop activity is far more powerful than a standard click question.

The result is not just a prettier question. It is a more diagnostic, more inclusive, and more active learning experience.