Technologies

HTML • CSS • Bootstrap • Canvas • Canva • JS

A showcase of classroom tech and interactive tools I build and use: Canvas course design, Dreamweaver & Bootstrap sites, quick utilities for math classes, and media created during my CSUSB IDT internship. Links and screenshots below.

Interactive Tools

Z‑Score Calculator

Z‑Score Calculator

Enter a value, mean, and standard deviation to get z, plus a quick Normal-curve interpretation for class demos.

AP StatsJavaScript
Quadratic Explorer

Quadratic Explorer

Graph any quadratic typed with ^ for exponents; highlights intercepts, vertex, domain/range, and formula plug‑in.

Math 1Desmos‑style UI
Noise Meter

Noise Meter

Simple visual meter for classroom volume checks during group work. Clean, readable, and student‑friendly.

Classroom MgmtUI
Roster Randomizer

Roster Randomizer

Equitable name picker with no repeats until cycle completes. Handy for cold calls and formative checks.

EngagementUtility
Comprehensive Study Tool Screenshot

Comprehensive Study Tool

An interactive HTML tool designed to organize study materials, reflections, and progress tracking for my IDT comprehensive exam preparation. Built with clean Bootstrap-inspired styling.

Study AidHTMLBootstrap

Course & Media

Canvas Courses

Screenshots of organized modules, rubrics, and assessments for Math 1 and AP Statistics.

LMSCurriculum
AP Stats Canvas course modules
AP Statistics course modules
Group CSS module in Canvas
Group CSS module
Dreamweaver code Hostinger files

Dreamweaver & Bootstrap

Hand‑coded portfolio using Bootstrap components and custom CSS variables for a cohesive dark theme.

DreamweaverBootstrap
ChatGPT Collaboration Preview

ChatGPT Collaboration

Prototyping ideas, generating scaffolds, and iterating code/content quickly to ship classroom tools faster.

AI WorkflowPrototypes

Quick edit: Replace the Open Tool links with your actual file paths (e.g., /zscore.html, /quadratic.html), and swap gallery paths to your real screenshots. Thumbnails are simple gradients; drop in real images by replacing each .thumb with an <img alt>.