Level up your CodeHopJr skills with these handy Interface and Paint Editor Guides! These resources are packed with helpful information to make the most of the editing tools in our ScratchJr-based platform.
Interface Guide
The Interface Guide provides step-by-step instructions on navigating CodeHopJr’s layout, programming blocks, and characters.
What’s Covered in the Interface Guide?
Project Controls
Save – Save the current project and exit to the Home page
Presentation Mode – Expand the stage to full screen
Undo / Redo – Reverse recent actions
Stage & Layout Tools
Stage – Where the action takes place (press and hold a character to delete)
Grid – Toggle the x-y coordinate grid on or off
Change Background – Select or create a stage background
Add Text – Add titles and labels
Reset Characters – Return characters to their starting positions
Pages & Navigation
Pages – Add, delete, or reorder project pages (each page has its own characters and background)
Programming Tools
Programming Area – Connect blocks to create scripts
Blocks Palette – Drag blocks into the programming area
Block Categories
Triggering (Yellow)
Motion (Blue)
Looks (Purple)
Sounds (Green)
Control (Orange)
End Blocks (Red)
Green Flag – Start all scripts that begin with a “Start on Green Flag” block
Characters
Add, rename, edit, duplicate, move, or delete characters
Tap the paintbrush icon to edit a character’s image
Drag characters between pages
Encourage students to review the Interface Guide before beginning a new project to build a better understanding of the tools and familiarity navigating the page.
Paint Editor Guide
The Paint Editor Guide helps students create custom backgrounds and characters in CodeHopJr.
What’s Covered in the Paint Editor Guide?
Editing Tools
Undo / Redo – Reverse recent changes
Cut – Remove a selected shape or character
Duplicate – Create a copy
Rotate – Rotate around the center
Drag – Move and resize shapes
Drawing Tools
Shape Tool – Line, circle/ellipse, rectangle, triangle
Fill – Fill shapes with selected color
Color – Choose drawing and fill colors
Line Width – Adjust thickness of lines
Advanced Tools
Camera – Fill shapes with a photo
Character Name – Edit the character’s name
Save – Save changes and exit the Paint Editor
Directing students to the Paint Editor Guide before creative projects can help them better understand design tools and reduce classroom troubleshooting time.
CodeHop Curriculum is included with a CodeHop License. If you believe you should have access to the CodeHop Platform, please reach out to your Customer Success Manager, or send an email to sales@codehs.com.

