Creators – Week 12

Importing an FBX

We downloaded the Gem Detector FBX from from our Teams channel and imported it into Unity, in a new folder called ‘Models’. In the Inspector, we used the “Extract Textures” and “Extract Materials” options to take the textures and materials stored inside the FBX and place them into our project as items we could edit. When extracting the textures, Unity warned that two were Normal Maps and offered to mark them as such for us, which we accepted.

What is a Normal Map?

A normal map is just a texture file. It is used to cheaply, from the point of view of rendering time, provide fine detail in models. The little video below illustrates this. There are two square plates, side-by-side.

The plate on the left has been modelled to have a circular feature that rises up in a lip and then back down again. It uses many vertices and polygons to model this.

The plate on the right is just a single quad, but it has a normal map applied to it. How was this normal map created? It was “baked” from the plate on the left. This plate is always flat, but it reacts to light as if it isn’t.

See how they both behave very similarly when a light is passed over them. It isn’t until the camera tilts down to a very low angle that the illusion breaks and the plate on the right starts to look a little odd. The video shows the wireframes at the end so you can see the difference in the two plates from a geometry standpoint.

Adding A Light and Sound To Our Detector

To light up the detector, we need two elements. A point light to cast light on the rest of the model and an emissive material we can switch to to make the glass cover on the bulb look lit-up.

With our extracted materials and textures, we now had a material called ‘Light Cover’ in our ‘Models’ folder. This is used for the lamp cover at the top of the sensor. It’s supposed to be transparent, so we selected that material and in the Inspector changed the Rendering Mode setting from Opaque to Transparent and we then opened the Albedo colour and reduced the A value (which stands for Alpha and is the degree of transparency) down to about 175.

We then duplicated this material and renamed this copy as ‘Light Cover (On)’. We edited this one to enable emission by clicking on the Emission check box, then opening the Emission Colour dialog and setting the colour to a red colour and finally pressing +2 at the bottom of that dialog once to brighten the colour.

Then we added a new object, a point light, as a child of the “Light Cover” object in the detector and manoeuvred it into position.

Finally, we downloaded a sound file, of a beep sound, from our Teams channel to an ‘Audio’ folder in our project and set it as the AudioClip for an AudioSource component, with Play On Wake disabled, attached to our Light Cover object.

Script for Turning on the Light and Sounding A Beep

Here is the code for turning on and off the light and swapping the material on the light cover:

using System.Collections;
using System.Collections.Generic;
using UnityEngine;

public class SensorLight : MonoBehaviour
{
  public Material MaterialOff;
  public Material MaterialOn;
  
  private bool _isOn = false;
  private MeshRenderer _mr;
  private AudioSource _as;
  private Light _bulb;

  // Start is called before the first frame update
  void Start()
  {
    _mr = GetComponent<MeshRenderer>();
    _as = GetComponent<AudioSource>();
    _bulb = GetComponentInChildren<Light>();
  }

  // Update is called once per frame
  void Update()
  {
    if (_isOn)
    {
      _mr.material = MaterialOn;
      _bulb.enabled = true;
    }
    else
    {
      _mr.material = MaterialOff;
      _bulb.enabled = false;
    }
  }

  public void TurnOn()
  {
    _as.Play();
    _isOn = true;
  }

  public void TurnOff()
  {
    _isOn = false;
  }
}

Note that it uses GetComponent<T>() and GetComponentInChildren<T>() to find the different components we need to interact with, rather than having them as public property we’d have to set manually. This approach can be a little easier to maintain.

Connecting it all to the Gem Sensor

We downloaded a finished version of the Gem Sensor ProximitySensor.cs script from our Teams channel. Very much based on last week’s code, but with the addition of logic to work out the flashing light’s timing.

The final thing was a very simple class to tie the ProximitySensor and the ItemScatterer together:

using System.Collections;
using System.Collections.Generic;
using UnityEngine;

public class LinkScatterToSensor : MonoBehaviour
{
    public ItemScatterer ItemScatter;
    public ProximitySensor ProximitySensor;

    // Update is called once per frame
    void Update()
    {
        if (ItemScatter.nearestItem != null)
        {
            ProximitySensor.Target = ItemScatter.nearestItem.transform;
        }

    }
}

Code Download

The code for this week’s project is on our GitHub, as always. 

Modellers – Week 12

This week we looked at colour and generating textures.

White light contains all other colours; we can see this when a prism splits it into a rainbow. A green object appears green because it absorbs other colors and bounces the green light back and into our eyes.

When we render an object in Blender, or any other 3D software, we want the renderer to generate the highlights (specular reflections) and shadow on the object. Any texture we use should be as free of highlights and shadow as possible.

To generate a relatively highlight and shadow-free texture of an apple, we used a pop-up portable photo studio. The interior of this box is white and reflective and lights the object relatively evenly on all sides.

IMG_0725

We photographed the object, an apple in this case, at four angles around the circumference and once again for the top and bottom of the apple respectively. This left us with six shots of the apple from all sides.

combined.jpg

I then opened each shot in Gimp (the image editing software), and removed as much of the rest of the image, everything that wasn’t apple, as possible. To do this I:

  1. Used the Rectangle Selection Tool to select a box close in around the apple and then used Image | Crop to Selection to remove the rest of the image
  2. Used the Fuzzy Selection Tool (aka. Magic Wand tool) to select white areas. I adjusted the Threshold value in the Tool Options panel as high as possible so that no parts of the apple were being selected when I clicked. I then used Edit | Cut to remove those portions.
  3. Finally, there were portions of the supporting bowl that were still remaining. I used the  Free Select Tool (aka. Lasso Tool) to select these and remove them.

Once I had each photo of the apple cleaned up, I created a new image, and pasted all the individual images into it, scaling them so that they were close to the same size. The result is here:

apple.png

We also built a simple apple model by shaping a UV sphere. Next week we are going to stencil paint the apple model with this texture.

The apple model can be found here.

Intermediate Scratch – Challenge 11 – Learn About Networking

CDA-S2-Challenge11-NetworkChatThese are the notes from our first week of 2013 in CoderDojo Athenry.

This was a really exciting new challenge: to learn about how computers communicate with each other, and apply these ideas to setting up Meshing in Scratch so that Scratch programs running on two different computers can exchange information with each other.

The big ideas behind this challenge were:

  1. How networks work
  2. Communications between programs running on two different computers
  3. Variables (used for exchange of data).

We started to apply these ideas to build a multi-player, multi-computer chat game. We will extend this next week and move on to other networked games. Stay tuned!

Here are my notes from the day (PDF format): CDA-S2-Challenge11-NetworkChat

Here is my version of the chat program: http://scratch.mit.edu/projects/cdathenry/2591598 (note that you need a separate version for each person in the chat, and you have to have enabled Mesh networking as described in the notes.)

If you would like a copy of my slides in PowerPoint format, get in touch via Twitter or the comments.

Scratch Advanced – Week 12 – Welcome back

What are we going to do this week:

1. Re Cap on the exam.

2. A Magic Eight Ball, Question and Answer Game.

3. Flow Charts – how to explain code with pictures 🙂

1. Re Cap on the exam

I though we might have a quick review of a couple of the questions from the Exam. There was one question that nearly everyone missed and I think it might have been the way I wrote the question, so we’ll just go over it quickly.

Question 8:

If you want two pieces of code to run together (parrallel processing) circle all the ones that you could use:

a. Broadcast

b Broadcast and wait

c. Green Flag

The Broadcast and wait will NOT run things in parallel, it will Wait for the other code to finsh before continueing.

2. A Magic Eight Ball, Question and Answer Game.

I thought we would use some of the List skills that we used in the Christmas Game to build a Magic Eight Ball type Question and Answer game.

So here are the requirements:

1. A Genie should appear from a Lamp.

2. There should be a friendly Sprite Character who will ask if you if you have any questions.

3. There will be a place to type in your Question

4. Questions can only be ones that have a Yes or No Answer.

5. A nice background to match your friendly Sprite

6. A random answer should be selected from the following list:

It is certain
It is decidedly so
Without a doubt
Yes – definitely
You may rely on it
As I see it, yes
Most likely
Outlook good
Yes
Signs point to yes
Reply hazy, try again
Ask again later
Better not tell you now
Cannot predict now
Concentrate and ask again
Don’t count on it
My reply is no
My sources say no
Outlook not so good
Very doubtful

I decided to use a Genie in the Desert, emerging from a Lamp to answer my Questions.

Here are my Sprites:

Genie

 

Lamp

 

 

 

 

And here is my stage:

Giraffe

 

 

 

The Code is Quite simple, again I have used the Stage as the Starting point for all the Code as I think this makes quite good sense as there is only one Stage, but generally many Sprites.

First we have to populate our Answer List with the different possible answers.

Then we can let the Genie know it is time to do the talking…

Now, I added the Lamp as, we need code under the Lamp to get things started. I decided that you should have to rub the Lamp to make the Genie appear. Once the Genie was out of the Lamp, we will let you ask the Genie a Question.

The code, well you know how to populate lists, so I’m not going to go through that.

For the Lamp, we need to check to see if the Mouse is touching the lamp and the Mouse Button is down, if it is we will keep counting up till we reach 10 and then let the Genie take over. We can do that with a Broadcast. But don’t forget that we also want the Genie to appear out of the Lamp, so as we are counting to 10, we need to make the Genie grow.

This is what I came up with…

LampCode

 

 

 

 

 

For the Genie, there are a few pieces of code, one to set him up, one to make him appear and grow, and finally the one where he gets you to ask a Question.

GenieCode

 

 

 

 

 

 

 

And finally, I came up with a third, invisible Sprite, but it allows the Giraffe on the background to say a few things as well. I came up with another list of things that he could say and populated those at the begining as well.

GiraffeCode

 

 

And I have been really kind and uploaded the finished Scratch Project onto the Scratch WebSite.