A Splash of Colour – Art + CS

Logo Design by FlamingText.com

 

There are many ways to incorporate art and CS that engages students and embraces creativity. If we know that computers read data then we can focus on data representation with images, colours, designs and so on. Students need to understand how digital systems work, specifically how input → processing → output work together. They need to know how numbers and patterns play a crucial part in the processing of data.  We can teach kids coding however not all students are going to use this in their future rather they will use the skills they have developed to through the process. This places a huge emphasis on problem-solving, collaboration, communication, innovation, reflecting, creativity and critical thinking.

The activities within this post are examples of how activities can be adapted as the students move through their education going from one building block to the next. It’s the throughlines we see in the curriculum that helps teachers to truly personalise learning to allow all students to succeed.

 

Colour Systems

Many art teachers will teach students from a young age the primary colours. However, did you know that there is more than one lot of primary colours? Primary colours change according to the context and space you are working in. In visual arts they red, yellow and blue however for technology this is not the case. computers have to read colours from a black background instead of white so the primary colours change to red, green and blue. It is good for junior students to learn that there are different colour systems and how they can create their own colour system. For example using light green, dark green and aqua. Here is an interactive colour mixer to have a play.

Junior School

Using Colour by Numbers helps students to make connections between colours numbers. This activity is often to strengthen number recognition, however, there is a bigger concept using data recognition.  As students become more familiar with the idea of the activity they can start to increase the colours they are using and add more complex numbers. At a higher level, students could use hex numbers associated with colours which they could investigate. Students could design their own pictures and colour system. This activity could be differentiated according to the knowledge of numbers the student has. You will find many online examples and apps for this activity.

 

Middle Primary

Pixel Art is a great way to get students to understand that each colour is represented by a number. Start by discussing what a pixel is. It is important here to note that computers store images and graphics in small squares each representing a number.  Look firstly at the basics in the unplugged activity with graph paper and letters. You will find the full image representation activity here. This activity helps to clarify understanding of image representation before moving into online activities.

The next step is to look at how colours work in digital images. The pixel viewer is a great way to upload an image and zoom in to see specific colour codes. Once the students have investigated this more closely I wonder how they would go having to use the colour codes and recreate the picture converting the codes to hex codes. Use the RGB – Hex Converter to find the codes and put these in a Google Sheet recreating an image. Students can find colours they like and use the colour palette website to find a colour scheme by using the hex code they generated. Once they have their palette they can create beautifully presented websites, presentations and more.

Alice Keeler’s pixel art is also a great example of using Google Sheets. It would be
great if students have to work out the colours themselves using the converter from the previous lesson.

 

Upper Primary

Did you know that there are 16,777,216 possible colours that the human eye can see! Discuss with your students that red, green and blue in a computer are stored in bits. Each of these bits hold the value of 256. Here we can jump into introducing binary and how this represents the values in these colours. Adjusting the binary number changes the value of the primary colour reflecting a different colour. If binary is unfamiliar territory you may like to consider reading section 5.3 of the CSfield guide and using the interactive activity with the cards with your students. 

Pixel art can take this further. Look at creating pictures using only colour codes will help to cement the connection between the codes and colours. Discuss how there are 256 bits in each of the primary colours for a computer. Look at a colour mixer and ask the students what they notice about the bits in each of the primary colours to create other colours. Have them play with the pixel viewer, colour matcher (specifically looking at how binary works here), image bit comparison (looking at how the binary makes the bits) and image bit comparer (looking at how different bits effect a picture). The students can discuss how input → process → output works in a system.  Students with a higher understanding can begin to use art in an online programming environment such as pencil code.

Secondary Students

Continuing the idea of Pixel Art in Sheets or offline is a great starting point with secondary students especially if they haven’t experienced any activities this way before.

A good starter is an offline activity (that can be completed online as well). In the Compressed Pixel activity, students need to problem solve to create the picture. They can do this either online in Google or Excel or students can do it as a hard copy. Students need to work out the correct placement of the blocks to make sure they construct the correct picture. The number next to the rows tell you how many black cells there are in one block. For example, the number is 6, 2 means there is one block of 6 black cells and one block of 2. They are separated by white blocks however the amount in between are unknown. you need to work this out. Make a copy of this sheet and see if you can work out the picture. Here is another one to have a go at from cs4fn.  It would be great to create your own for others to have a go. Post some in the comments if you are happy to share them. To add more difficulty students could create the picture but need to make sure there is an even number of both black and white blocks to represent bits.

I have mentioned using Google Sheets a bit because it lends itself to high levels of collaboration and it’s easy to navigate around. When moving into the area of graphic design or using programming it becomes more and more important to have a basic understanding of using conditions and variables. Sheets to Streets was a collaborative project by two designers that had never met or seen the space they were working with. Here is a rundown of their project and they have shared the ability to learn and reinvent their project with your students. To add another dimension students could work out the formula for converting RGB codes to hex numbers.

Australian Curriculum

Digital Technologies

Foundation – Year 2

Years 3 – 4

  • Recognise different types of data and explore how the same datacan be represented in different ways (ACTDIK008)
  • Collect, access and present different types of data using simple software to create information and solve problems (ACTDIP009)

Years 5 – 6

  • Examine how whole numbers are used to represent all data in digital systems (ACTDIK015)
  • Acquire, store and validate different types of data, and use a range of software to interpret and visualise data to create information (ACTDIP016)

Years 7 – 8

Years 9 – 10

Art

  • explore how and why artworks are created and ways to use and apply visual conventions, such as line, shape, colour and texture
  • learn how their ideas or subject matter can be developed through different forms, styles, techniques, materials and technologies
  • extend their awareness of visual conventions, and observe closely visual detail as they use materials, techniques and technologies and processes in visual arts forms
  • explore and experiment with visual conventions such as line, shape, colour and texture to develop an individual approach to a theme or subject matter
  • test and innovate with properties and qualities of available materials, techniques, technologies and processes, combining two or more visual arts forms to test the boundaries of representation.
  • research and analyse the characteristics, qualities, properties and constraints of materials, technologies and processes across a range of forms, styles, practices and viewpoints
  • adapt, manipulate, deconstruct and reinvent techniques, styles and processes to make visual artworks that are cross-media or cross-form

Mathematics: number recognition, sequencing. recognise and read 3 digit numbers, place value, binary, reasoning, order, classify. patterns, groups, conversions, algorithms

Advertisements

Superhero Transformation

superheroes
blank-print-document

Here is a good one. I came across this activity while looking for more advanced ways to use Google Drawings to help teach computational thinking. This is called the Superhero Transformation Project. The idea was originally from the High School Maths Project. It could easily be adapted to an upper primary class.

capture

The project was then taken and adapted Mandi Tolen to include the use of Google Drawings for her students. You can read her blog post here. Using Cartesian Coordinates in this way can is fun and interactive but also it helps students use a context around the graph. Thinking about maths and teaching transformation is one way we move these characters around our grid. This would help students to understand flipping,

Using Cartesian Coordinates in this way can is fun and interactive but also it helps students use a context around the graph. Thinking about how we teach transformation we can move characters around our grid. This would help students to understand the concepts of flipping, translations and rotations. Younger students could use a grid or part of a graph rather than the coordinates.

untitled-drawing-3

Many elements are covered in the curriculum in this activity including writing and digital storytelling. If the students were to take screenshots of their work they can import it into a presentation to retell the events that took place in their superhero story. The students can keep  with the superheroes theme or we can change it to any character we want.

When students create their superhero in Google Drawings they can save it as a png file which would make the background transparent allowing the superhero to be placed more accurately on the graph.

Mandi used this project outline with her students. I have created a Google Drawings Graph for beginners so anyone can make a copy of it. Once you have imported your superhero you can drag them to spot you would like and perform the task as in the story.

 Make a copy of the Google Drawings graph here.

Related Cybersmart Lesson:

Students will be creating their own stories and superheroes online. It is important for them to understand the piracy and plagiarism and their ethical responsibilities online. 

A Creator’s Responsibility

capture

Australian Digital Technologies Curriculum

Years 5 and 6

  • Examine how whole numbers are used to represent all data in digital systems (ACTDIK015)
  • Acquire, store and validate different types of data, and use a range of software to interpret and visualise data to create information (ACTDIP016)
  • Design, modify and follow a sequence of steps (ACTDIP019)
  • Plan, create and communicate ideas and information, including collaboratively online, applying agreed ethical, social and technical protocols (ACTDIP022)

Years 7 and 8

  • Design algorithms represented diagrammatically and in English, and trace algorithms to predict output for a given input and to identify errors (ACTDIP029)
  • Evaluate how student solutions and existing information systems meet needs, are innovative (ACTDIP031)
  • Plan and manage projects that create and communicate ideas and information collaboratively online, taking safety and social contexts into account (ACTDIP032)

Mathematics
Sequencing, algorithm, conditional, reasoning, directions, data, graphs, symmetry, patterns, shapes (regular/irregular), interpret,  construct tables using data, grid reference, translations, reflections, rotations, line and rotational symmetry, transformation, Cartesian coordinates, Cartesian plane, positive and negative numbers, order, trial and error

Literary
Navigating, explanation,  instructions, directions, cause and effect, storytelling, imaginative, creative and narrative texts, illustrations to support text, understanding and interpreting coordinates, participate, contribute, develop ideas, clarify, analyse information, imagery

The Arts
Creating, designing, interpretation, apply techniques

General Capabilities
Criteria, reasoning, thinking processes, evaluate, logical thinking, reflect and adjust thinking, collaborate, respond, communicate

 

Sploder

download-2

Sploder is a game creator where students can explore how to make puzzles or games that others can play. They learn to code by using design by creating environments and levels using different features. This program gets the students really thinking about positions, placement and forward thinking about how the game could work.

Students can be as creative as they want with Sploder creating digital stories that challenge and lead others through a range of levels. Thanks to Anthony Speranza for this resources.

Play on your computer or download it for free from the itunes store.

Get started with this youtube clip.

 

Australian Digital Technologies Curriculum

Years 3 and 4

  • Define simple problems, and describe and follow a sequence of steps and decisions (algorithms) needed to solve them (ACTDIP010)
  • Implement simple digital solutions as visual programs  involving branching (decisions) and user input (ACTDIP011)
  • Plan, create and communicate ideas and information independently and with others, applying agreed ethical and social protocols (ACTDIP013)

Years 5 and 6

  • Implement digital solutions as simple visual program involving  branching,  iteration  (repetition) and user input (ACTDIP020)
  • Design, modify and follow simple algorithms involving sequences of steps,branching, and iteration (repetition) (ACTDIP019)
  • Plan, create and communicate ideas and information, including collaboratively online, applying agreed ethical, social and technical protocols (ACTDIP022)

Mathematics
Sequencing, variables, algorithm, conditional, reasoning, directions

Literary
Navigating, explanation,  instructions, directions, cause and effect, story telling

The Arts
Creating, designing

Critical and Creative Thinking
Criteria, investigate, reason, visual models, thinking processes

Science
Variables, patterns, test, trial, error, record, methods, cause and effect

 

Tech Girls are Superheroes

“With great power comes great responsibility”

  ~ Benjamin Parker aka Uncle Ben (Spiderman, Marvel) ~

FullSizeRender 7

Today my package arrived!!

I’m so excited to be apart of this movement. I can’t wait to read these short stories and I look forward to sharing this with you all. I was fortunate enough to listen to Jenine Beekhuyzen about this movement and her journey in creating Tech Girls are Superheroes.  I am super intersted in promoting STEM amongst girls so I am totally inspired by the idea behind this initative.  If you want to find out more about Tech Girls are Superheroes check  out the website. They run an annual competition ‘Search for the next Tech Girl Superhero’ but also promote many ways in which schools can get girls into learning more about technology. Also check them out on Twitter where they are spreading the love!

Tech Girls Movement

Tech Girls are Superheroes

GoldieBlox Coding App Launch

 

download (1)

 

Since being introduced to GoldieBlox I have been following the action. Today I came across this new little App. GoldieBlox has grown from a Kickstarter campaign and is now a massive hit in the US. There is a whole marketing campaign around GoldieBlox where stores such as Toys ‘R’ Us and Target are selling building sets aimed to promote and encourage young girls to become involved in STEM.

GoldieBlox: Adventures in Coding follows the coding concept of problem-solving pathways to get from A to B. GoldieBlox helps with learning the fundamental concepts of coding. It has over 20 levels of puzzles. There is the ability, to use the variables, to code your own game. The App is aimed to build confidence and empower girls although boys would love this app as well!

Related Article:

Toymaker GoldieBlox Launches Coding App for Girls as Young as 4

Links to Curriculum:

This Apps is new on the market. Once I have explored it I’ll post the links.

Check back soon 🙂

 

Create A Robot Face

download

Unplugged activities are just as good or even better than plugged ones. In this activity the class can learn how a robot responds to emotion. Here they will learn about the importance of rules and how computers follow sets of rules in their output. This activity is about input and output.

In a snapshot:

The teacher uses parts of pictures to create a bigger picture. In this example, it is a Robot Face. They use people to recreate the robot face with the students using the templates provided. The class can either set criteria where a certain movement is made when they make a sound or they can follow the rules set in the instructions. This activity can be taken further through having students use branching to show thinking behind the rules that have been developed.

I really love the flexibility in this idea. It can be used in many forms. By adding different pictures the activity can be transformed into movements by people or animals. This activity can be adapted at to age group.

 

Australian Digital Technologies Curriculum

Foundation – Year 2

  • Follow, describe and represent a sequence of steps and decisions (algorithms) needed to solve simple problems (ACTDIP004)
  • Collect, explore and sort data, and use digital systems to present the data creatively (ACTDIP003)

Years 3 and 4

  • Recognise different types of data and explore how the same data can be represented in different ways (ACTDIK008)
  • Define simple problems, and describe and follow a sequence of steps and decisions (algorithms) needed to solve them (ACTDIP010)
  • Implement simple digital solutions as visual programs with algorithms involving branching (decisions) and user input (ACTDIP011)

Years 5 and 6

Mathematics
Sequencing, variables, algorithm, branching, iteration, conditional, reasoning, directions

Literary
Reading, navigating, explanation,  instructions, directions, cause and effect

The Arts
Creating, designing, composition

Critical and Creative Thinking
Criteria, investigate, reason, visual models, thinking processes

Science
Hypothesis, variables, patterns, test, trial, error, record, methods, cause and effect

 

 

PencilCode

Have you seen PencilCodePencilCode is a collaborative programming site for drawing art, playing music, and creating games. It is also a place to experiment with mathematical functions, geometry, graphing, webpages, simulations, and algorithms. Programs are open for everyone to see and copy. This is a way to explore different types of code such as CSS, HTML and javascript. PencilCode is open source to allow flexibility in the way it can be used.

PencilCode guides teachers with their teacher materials page. This page enables  to teachers to look at ways in which they can embrace the use ofPencilCode in their class with their students. It includes online and offline activities.

This programme suits students who want to take their coding further. This is a full functioning programming platform where students can create games, music or joust enjoy some drawing.

PencilCode uses Coffeescript which software engineers use to build complex websites.

 

Australian Digital Technologies Curriculum

PencilCode covers all areas of the Digital Technology curriculum for years 5 and up

The following concepts are covered in this program across the curriculum for Years 5 and up

Mathematics
Sequencing, lines, angles, shape, variables, algorithm, branching, iteration, time, calculating, arrays, conditional, reasoning, cartesian coordinates, measurements, directions

Literary
Reading, navigating, explanation,  instructions, directions, cause and effect, predict

The Arts
Creating, designing, composition, manipulating elements and combinations, conceptualise

Critical and Creative Thinking
Criteria, investigate, reason, visual models, thinking processes, propose, strategize

Science
Hypothesis, predict, variables, range of representation, graph, patterns, relationships, test, trial, error, record, methods, cause and effect

Chrome Music Lab

Have you played with Chrome Music Lab yet? IT IS EPIC!!

It’s a fun and great way to explore technology and music with kids. Chrome Music Lab is a collection of experiments that let students of all age, explore how music works. They’re collaborations between musicians and coders, all built with the freely available Web Audio API. These experiments are just a start. Check out each experiment to find open-source code you can use to build or create your own.

You can play with sound, rhythm, melody, and more. Chrome Music Lab is all built for the web, so you can start playing instantly, whether you’re on a tablet, phone, or laptop.

Exploring music can help spark curiosity in all kinds of ways. These experiments will inspire you – whether they give you a new perspective on music, make you more curious about math and science, or even make you think of new ways to teach or code.

 

Australian Digital Technologies Curriculum

Foundation – Year 2

Digital Technology

  • Collect, explore and use digital systems to present the data creatively (ACTDIP003)

The Arts/Music

Year 3 and 4

Music

Year 5 and 6

Digital Technology

  • Plan, create and communicate ideas and information, including collaboratively online, applying agreed ethical, social and technical protocols (ACTDIP022)

The Arts/Music

LEGO

There are many ways to use LEGO to help students understand different elements of code on and offline. The creation of patterns and sequences can help students to problem solve and think logically. LEGO is great because it can be used in multiple ways. Students can enjoy the hands-on experience of exploring their creativity and making their designs. They can use LEGO with robotic where students build and use a program to make their design move. Students can use LEGO to create animations allowing them to discover how to use a series of short steps to achieve an effective outcome.

I personally love Build with Chrome and LEGO Builder (Chromestore App). Both of these programs allow students to build and share their designs beyond the school. Students can even choose a design to copy if they just want to focus on the problem solving around building. Even though these ideas do not include specfic coding using loops and repetition the art of problem solving and creativity still uses the concepts of computational thinking.

On the other hand you could instruct a partner to recreate what you have built using the coding language and algorithms. Have students show their thinking through using branches to show how they created a design. The possibilities are endless!!!

LEGO also have various iPad Apps.

art_lego

Australian Digital Technologies Curriculum

Foundation – Year 2

  • Recognise and explore patterns in data and represent data as pictures, symbols and diagrams (ACTDIK002)
  • Follow, describe and represent a sequence of steps and decisions (algorithms) needed to solve simple problems (ACTDIP004)
  • Create and organise ideas and information using information systems independently and with others, and share these with known people in safe online environments (ACTDIP006)

Years 5 and 6

  • Design, modify and follow simple algorithms involving sequences of steps,branching, and iteration (repetition) (ACTDIP019)
  • Plan, create and communicate ideas and information, including collaboratively online, applying agreed ethical, social and technical protocols (ACTDIP022)

Mastermind

Mastermind was invented in the 70’s as a code breaker game. It is another version of the game bulls and cows which is also another code breaker game and great for offline problem solving. It might be hard to find an old school Mastermind gameborad these days, although there might be some in an antique or vintage store. Here is an alternative. It’s online and it’s got multiple ways to play. This gives players great visuals when it comes to thinking about what code looks like. The need to break down and decode at each level and use of sequencing helps to enrich the computational thinking processes.

This game can be played from prep to year 6 on and offline. The online versions has up to 5 colours to work with on the board wih abilitly to choose from 8 colours in the colour spots. This could be adapted for preps using 2 or 3 colours to start with. Having students talk through their thinking and working through these problems will help them to explain what is happening showing a clear understanding of the data they are creating.

Mastermind

 

Australian Digital Technologies Curriculum

Foundation – Year 2

  • Recognise and explore patterns in data and represent data as pictures, symbols and diagrams (ACTDIK002)
  • Follow, describe and represent a sequence of steps and decisions (algorithms) needed to solve simple problems (ACTDIP004)
  • Collect, explore and sort data, and use digital systems to present the data creatively (ACTDIP003)
  • Create and organise ideas and information using information systems independently and with others, and share these with known people in safe online environments (ACTDIP006)

Years 3 and 4

  • Recognise different types of data and explore how the same data can be represented in different ways (ACTDIK008)

Years 5 and 6