🗃️U1LA4 Mini Project: Custom Emoji

How can I create a function for a custom emoji?

Teacher Notes && Overview

In this project, students will use all of the concepts they have been practicing from the start of the year to create a custom emoji function. They are also asked to write a prompt explaining why their emoji should be added to the Unicode Consortium.

This project focuses on a student's ability to create a function with parameters to make it vary and their creative use of code. Mini projects are best implemented through class lab time, but they can also roll over into home projects, depending on student access to technology and the culture of your school. Having small mini-presentations is also a great opportunity to build a positive and collaborative classroom culture.

Objectives

Students will be able to:

• Create a custom function that will draw a design when called

• Utilize parameters to make their function changeable

• Use system variables

• Use custom variables

• Utilize random() function

• Create a digital image for an audience and defend and validate their creation

Suggested Duration

~1-2 period(s) (~45-90 minutes)

If students are focused and working, you can allow for as much time as you'd like for them to make something they're happy with!

NYS Standards

9-12.CT.4 Implement a program using a combination of student-defined and third-party functions to organize the computation.

9-12.CT.5 Modify a function or procedure in a program to perform its computation in a different way over the same inputs, while preserving the result of the overall program.

9-12.DL.1 Type proficiently on a keyboard.

9-12.DL.2 Communicate and work collaboratively with others using digital tools to support individual learning and contribute to the learning of others.

Vocabulary

No new vocabulary is introduced in this mini project.

Planning Notes && Materials

Planning Notes	Materials
Students can work in pairs Allow time for planning. Students will need 3 tabs open for every lesson of this course: p5.js Editor, Slide Decks (optional), P5.js Reference Guide	No extra materials required outside of a computer.

Resources

• Unicode Website

• Emoji Day Video

Project Launch (~5 - 8 minutes)

Share students this Emoji Day video. Explain that they will be tasked with making their own emoji using code!

Ask students:

• What is your favorite emoji and why?

• What would a world without emojis be like?

• How do emojis influence our society?

• Are emojis harmful or beneficial to society?

Project Prompt

For this project, each student will be tasked with creating a custom emoji using all the skills that they have learned so far. The emoji can be anything they'd like, and if they are struggling for inspiration, they are welcome to recreate an existing emoji in p5.js.

Project Requirements:

1. Design a custom emoji or recreate an existing emoji using shapes you learned this year.

2. Make sure you use color and any other styling elements you'd like. Your choice of color mode!

3. Turn your emoji into a function with several parameters that will allow you to control the output.

4. Create a design by calling your function multiple times.

   1. When calling your function, be sure to utilize both system and custom variables as arguments. This is part of your grade!

5. Include code comments to explain your work.

6. Submit your work along with a paragraph explaining why you chose your emoji.

Sample Emoji and Paragraph:

Sample emoji and paragraph

Please note that your program, while it should house the function that draws your emoji, should have several displaying on the canvas because you have called your function several times.

Suggestions for Getting Started:

Allow time for students to brainstorm their ideas in a group, as pairs or whole class discussion.

Ask students to:

Write down 3 ideas without sharing them with anyone for 3 mins. Share their ideas with their peers in a quick, round-robin approach. Pick and finalize one idea.

Wrap Up

Mix students into groups of 4 and allow them to present their work to each other. If you'd prefer all students see everyone's work, consider a gallery walk where students can use post-its to add feedback and comments.

Culturally Responsive Best Practices

All projects in the ICM curriculum are meant to be adaptable to your student population, and this one is no different. The purpose of this project is to allow for student creativity and to assess their ability to create an algorithm composed of a sequence of functions that creates a final design they are proud of - what that design is can be anything! If your students would respond better to something that is not emoji-based, consider adjusting the prompt accordingly.

Other things to consider:

• You could make this a more activist-focused lesson by asking students to specifically design emojis that they feel their community needs and are currently lacking in the current library. Reviewing the history of emojis - they were created in Japan and the designer never thought they would catch on outside of Japan - can help the framing of this project.

• Another activist-focused lesson could be to ask students to reimagine an emoji that could be problematic, as Apple did for the gun emoji. (Emojis look different across platforms for the same reason different fonts have different appearances if students are curious.)

• As a CS and design-focused course, students are asked to explain not only the code of the programs but their design decisions throughout the year. To better reach all students, consider the different ways that you can collect responses. In lieu of a written response, could students create an explanatory video, or submit to a platform like FlipGrid? Are there ways you can offer support for students who may struggle with written expression or written expression in English?

Extensions

Some students may finish early; ask them to use the p5 reference to try to teach themselves something new, or to push their design even further.