Coding with text art is an engaging way to introduce the beginning concepts of coding as well as practice typing and utilizing symbol keys on the keyboard. ASCII Art in the classroom can be created on any device with any word processing program. Learn more about coding with text art and ASCII text art and how to integrate it into the classroom!
What is ASCII Text Art?
ASCII Text Art is art that is created using the characters on a standard keyboard. The term ASCII refers to the code that specifies the characters. In the US, the 128 letters, numbers, and symbols needed to create the English Language are specifically called US-ASCII.
Text Art is made using any word processing program by thoughtfully and deliberately using characters, spaces and the Enter key to approximate an image.
ASCII Text Art has been around since 1966 – even earlier if you include its predecessor on the typewriter. Check out this post for a free PDF download of typewriter coding from 1982! Learn more about the history and use of ASCII text art. The most popular ASCII text art that remains in use today are the text emoticons.
Coding with Text Art
Text Art can be integrated into the classroom as a coding and typing activity. Rather than haphazardly create text art, have students follow a code to create a specific, secret image!
I created a set of text art activities that includes the code to create each image and a guide to creating text art.
Check out the Coding With ASCII Text Art sets I currently have available.
I create the code line by line with each line specifying exactly what character to type and how many. I also include the spaces and when to hit the Enter key. By writing out the code this way, students are practicing one of the first coding lessons – be precise!
Students can follow the coding sheets in ANY word processing program on ANY device, such as Google Drive shown above. The easiest way to get started is by using the native notepad apps on iPad, Microsoft and Mac but it even works in apps like Seesaw and Pic Collage and with the word processing program on Kindle Fire.
I did include directions for the more common devices and programs. In general, the font needs to be a monospace font and the text should be aligned to the left. Monospaced fonts typically have “mono” in the name or you can recognize them because every character takes up the same amount of space. You may be familiar with Courier New on Word if you ever had to type an essay that was a minimum amount of pages!
Coding with Text Art also makes for a great activity on days the WIFI is down but you still want to teach with tech because you can use native notepad apps or Google Docs offline to create it. Check out these other unplugged technology activities.
You can introduce the idea of precision in coding using the fantastic free lesson from the Applied Digital Skills Curriculum on Google and then follow up with some Text Art Coding challenges.
I have sets of Coding with ASCII Text Art at www.shoperintegration.com and you can also try a sample in my resource library. If you are already signed up, just log in to download it. If not, be sure to sign up!
Try a free sample of my Coding With ASCII Text Art:
Student-Created Text Art Coding
After students complete the challenges by following the code in the packet, have them create their own ASCII Text Art. I included a guide in my resources that walks students through the process as with visual diagrams for making various lines and shapes.
After creating their image, they can then type out the code to create it and trade with a friend. Students will know their code is successful if their friend can reproduce the image.
Just for Fun: ASCII Text Art Converter
This Text Art converter will take any text you type and convert it into various styles of ASCII text art. Have students create ASCII Text Art for spelling words, sight words, their names, or the names of friends and family!
______ _ _ _ _
| ____| (_) | | | | (_)
| |__ _ __ _ _ __ | |_ ___ __ _ _ __ __ _| |_ _ ___ _ __
| __| | '__| | '_ \| __/ _ \/ _` | '__/ _` | __| |/ _ \| '_ \
| |____| | | | | | | || __/ (_| | | | (_| | |_| | (_) | | | |
|______|_| |_|_| |_|\__\___|\__, |_| \__,_|\__|_|\___/|_| |_|
__/ |
|___/
Extending the Activity
I didn’t include it in the packet since my focus is elementary, but if you teach middle or above, you can add an additional challenge to coding with ASCII Art by having students write out the ASCII codes for the characters instead of the symbols.
This official ASCII coding chart shows how each character is represented. Advanced students can even write the code in HTML!
I love this live HTML Editor for HTML writing practice. To create ASCII Text Art on the HTML editor, use the HTML coding chart here. Copy the character needed.
Paste the HTML character code between the <p> brackets in the correct order. I use a space between characters to visually see the code. At the end of each line, use a <br> to indicate the Enter Key.
To create this one line ASCII Text Art, I used the HTML code: <p>= ^ . . ^ =</p>
Have you tried ASCII Text Art in the classroom or coding with text art? What devices, programs, and set up tips do you have? Be sure to tag me in your coding with text art social media posts so I can see how your class is integrating ASCII Text Art in the classroom!