Codemoji is an engaging tool that helps teachers guide students through the main coding technologies that drive websites: HTML, CSS, and JavaScript. It's ideal to supplement direct instruction as an option for flipped or blended classrooms or for an after-school enrichment program or summer camp offering. Content-wise, Codemoji easily fits into a computer science, STEM, or media arts course.
Students can work individually or collaboratively, either by exploring in the Playground (HTML and CSS) or tinkering around in the Beta-mode Workshop (JavaScript). The teacher dashboard manages classes, tracks student progress, and presents data and assessments in a variety of ways, but it can be temperamental in unsupported browsers, so stick to Chrome and Safari for now.
Continue reading
Tip Sheet: Get Started with Coding
3 Great Ways to Get Students Coding in the ClassroomWith Codemoji, the inner workings of websites are demystified as students get hands-on experience building webpages and animations. The "emoji" part of Codemoji is exactly that: a library of relatable emoticons that represent specific, text-based commands in HTML, CSS, and JavaScript (for example, an HTML head tag is represented by a panda head emoji). Emojis are strung together to create lines of code that follow standard coding logic and syntax. Run the Codemoji in the Live Display box to instantly see the webpage or animation in action. The Show Tags tab displays the text version of the code.
Each lesson starts with step-by-step, multimodal instructions: text and a computerized text-to-speech option, followed by drag-and-drop animated instructions showing Codemoji moving from the Emoji Box into the Text Editor (in HTML lessons only). Students can run and get instant feedback on their code and progress at their own speed. There's a live-chatting feature, several how-to videos on YouTube, and a Codemoji Facebook page for additional resources.
Codemoji is a solid intro to web coding that's icon-based. Cumbersome coding text is transformed into a relatable emoji, and each emoji function is taught conceptually. There's no need to memorize strings of code, be a proficient typist, or have a deep understanding of coding syntax. This is especially helpful for emerging typists, ELLs, and visually based learners. Students can work at their own pace, have access to clear, multimodal instructions, and instantly see webpages and animations their code creates.
Codemoji is mostly drag-and-drop, and students can opt to add text into HTML code (to customize titles, for instance). That said, they'll be required to enter text and numbers in CSS and JavaScript lessons to specify certain commands, such as assigning color and animation coordinates. It's easy to run code, see it in action, get feedback, and showcase creations.
Overall Rating
Community Rating
Explore Our Favorite Tools
-
Best News- and Media-Literacy Resources for Students
Great apps and websites for building critical literacy skills.Grades Pre-K–12Critical Thinking -
Websites and Apps for Making Videos and Animation
Put students in the spotlight with these great video and animation creation apps.Grades K–12ArtsCreativity -
Research and Citation Tools for Students
Help students find and cite scholarly work for research projects.Grades K–12English Language ArtsCritical Thinking