Teaching High School Robotics with the Spark Photon

Getting Started
1

I have a few things to finish and then I am ready for September 2015 to start teaching about the Internet of Things. I will be teaching a Game Development class of 2D and 3D games to teach computer programming, a Robotics class to teach electronics and the Spark Core or Photon web connectivity and a 3D Printing class, so that we can actually build things. The last class is a Robotics Construction class in which we put all these abilities together.

Most of my journey so far I have documented at:

Various programs are at my github site at

And many videos are at my youtube site at

This entry is for anyone else who wants to teach about Robotics. I am a bit of a beginner at Robotics but have better experience on 3D Animation and Computer Programming. I think the Spark Core is much easier to use than the Raspberry Pi or Arduino for the classroom and I am not a fan of Lego EV3 or VEX as they are very restrictive about what else you can connect to their systems.

I can't guarantee I will stay with the Spark Devices, since like Computer Programming new languages come along while others fade away, but for the moment I think Spark Devices are the best micro-controller / online IDE available for the classroom. My only concern is the quality of Wifi at the school I am going to.

So far, I have developed:

For Mobile App Design, Game programming a good video is

For 3D animation using Blender (Also 3D Printing basics) a good video is

Spark Core / Photon web page connectivity:

On this forum is information about:

Using the Spark Core when Wifi may be down

Using the Spark Core with a Pixy Camera (Shows a SPI serial connection working)

Using sockets to speed up the connection between Spark and a website or Mobile App.

I am almost done with what I need to learn before I can teach my courses. I hope some of this is interesting to other people whether you teach or not.

5 Likes
2

Someone asked about controlling the Photon using a webpage after viewing my video at https://www.youtube.com/watch?v=-CyKv4UC1OA Started thinking that my solution was not very userfriendly, so I added a new simple.html page at

You still have to load the .ino file onto the Photon from

but my simple.html page is much easier to work with.

3

Hey guys: @ScruffR @peekay123 @bko I got my 15 class set of Photons (the maker kits) and have loaded the new Android Particle app, but having a hard time setting up multiple wifi ssids. (Home, cell phone hotspot, school1, school2, school3 ). It seems on the app that only one SSID is used per photon, when I try to add another, it seems to forget the first. Do you know of a work-around? Can the app do it or do I have to use the other methods to setup multiple SSIDs

4

@rocksetta, the Photon can take up to 5 SSID credential entries so I’m not sure why you are only able to have a single entry. To have working entries, you need to actually have access to the APs so the Photons can connect and, of course, put the Photon in listen mode. You can also use Particle CLI to set things up but again, you need access to the APs to complete the setup. :smile:

1 Like
5

I’m not sure what you mean with “It seems on the app that only one SSID is used per photon”.

The app only shows you currently available networks to connect a currently present Photon to.
Once you select one of the available networks and provide the credentials, this info is sent to the Photon and stored there.
Then you put your Photon into listening mode again, add the next available network and the Photon will add that to the list of possible networks (keeping all previous if there is space).

Unless you keep SETUP pushed too long (or do a factoey reset or your code calls WiFi.clearCredentials), the WiFi list should not be cleared.

@peekay123 beat me again.

1 Like
6

Setting up all these sounds like a lot of work. What I would do is write a small app that sets the credentials using the WiFi.setCredentials() method for all the networks.

https://docs.particle.io/reference/firmware/photon/#wifi-setcredentials-

However you compile it, get the binary file and load it over USB with dfu-util or the CLI.

3 Likes
7

I thought of that but I need to keep the credentials away from my students. Good idea.

8

Remember that I am not a beginner, so if I am having issues, others are giving up!

Any idea who is working on the Particle App that connects with the Tinker program?

What I am seeing is that there is no official way to add another set of wifi credentials. I have to click the plus sign at the bottom right of the screen, even though my Photon has already been claimed. (would be nice for the menu to give the option to add more wifi credentials) see image

Once I have gone through the steps to setup my second set of wifi credentials, things work fine (you must have good signal strength and very few others on the network), but when the Photon try’s to connect to the cloud it can’t since the Photon has already been claimed so I get this error.

I then re power the Photon and things seem fine. I can now change from my home wifi to my cell phone hotspot and the Photon works fine. (Note: the App does not refresh well, you have to swipe the screen. It only takes a few seconds to identify that the core is online, but a few minutes to identify that the core is offline.)

I noticed that a new version of the App is available today so maybe some of this confusion has changed.

1 Like
9

Even non-beginners might overlook things or misinterpret symptoms, and this is how I (still) do understand the statement above (despite the bold font of your opening sentence).

It might be confusing, that you get the error your second screen shot shows, and it definetly is something @ido might want to look into.
But the way I outlined above and you tried out it is one of the "official" ways to do it.

Other "official" ways might be more suitable for your use case, but as you are an experienced user, you'll figure out which one will be best suited for you.

BTW:

Setting WiFi credentials and claiming a device to a user account are two quite different things.

10

So I gave up connecting my 15 photons at school. Being several feet and doors away from the wifi access point and 1000 students on the network was just too much traffic for the photons to handle downloading the new firmware. So now I am trying to setup my photons using my cell phone hotspot. With the Core you used to have to have two cell phones to make it work, but with the Photon you can do it with one cell phone. The steps are:

  1. turn on your cell phone wifi, load the particle app and power up your photon
  2. On particle app click the plus sign and find your photon (must be flashing blue, hold the setup button for about 3-4 seconds -NOT LONGER, note you may have to power up a few times for this to work)
  3. while it is searching for networks click “Manual Network Name” and enter your cell phone hot spot name and then password.
  4. The photon will try to connect and get several steps down but hang on the last step “Verifying product ownership” It may even say Oops and tell you to retry
  5. Now activate your cell phone hotspot and repower up your core.
  6. Photon logs in and starts downloading firmware and tinker. Not really sure how many Megs this is but it takes a few minutes. I have a good cell phone plan (6GB) so I am not worried about the amount of data. Wait until the photon is breathing cyan.
  7. Logout of the particle app and log back in and your photon should be visible and online
  8. Rename your photon. Click on the online photon and check that tinker works.

This process is a bit of a pain but good to know when you do not have another cell phone. The process is much easier using 2 cell phones as you donot have to deactivate your hotspot or re-login to the particle app.

Once the Photon has the new firmware installed and at least one working set of wifi credentials it is then much easier to work with in a busy wifi environment. I am in the process of getting antennae to help with the crappy wifi at my school.

11

With access to a computer this would be even easier. You could then use the CLI to both update and configure the devices. You wouldn’t have to use your mobile plan. You can also leave the hotspot on, and connect all of them after each other without having to constantly switch.

1 Like
12

As @Moors7 said, using CLI to set the WiFi credentials/update the firmware of the devices would be much easier and quicker in this case

13

Everything is fine. The kids can setup the schools wifi using the particle app. I have found 8 u.fl antennae from old laptops, modems, and friends. Some kids get fine wifi depending on where they are sitting in the class, others not so good so they can use the antennae. We are doing fine. When the schools wifi is overloaded, I can switch on my hotspot for which all 15 photons are pre-configured. So it is all good.

1 Like
14

Now I need to teach how to program the Photon using a web page. My github site at https://github.com/hpssjellis/spark-core-web-page-html-control works fine but is a bit confusing for the students. The out-of-date youtube video is at https://www.youtube.com/edit?video_referrer=watch&video_id=-CyKv4UC1OA .

So I made a new file called simple.html, which shows how to digital or analog write to any output, unfortunately it is a bit simplistic and does not do any analog or digital read.

So I improved it with Ajax and this is as easy as I can get it. The new file is called AjaxBetter.html and you still have to load spark-web.ino to the photon.

It uses local storage to store the Token and Core_ID and very simply shows how to activate D7 on or off and how to read from A1. Anyone with basic web page ability should be able to make use of it. To fully understand the page you may need some higher javascript Ajax knowledge.

The D7 button code is very easy to understand. It looks like

<input type="button" value="d7-send-1" onClick="{
    sendToSpark('d7-send-1')
}">

Not very hard for the students to understand that all these commands would work

d3-send-High
d5-send-off
d2-send-0
a3-send-100
a3-read
d4-read
a2-send-0
a2-send-255

basically all the simple Photon commands are very easy to understand and manipulate. Hope this is helpful to someone. I will be changing things as I try stuff out with the students.

The code to convert the analog value to volts is a bit more complex but still not too bad.

<div width="400" height="200" name="myDivName" id="myDivId"> output here </div><br>

<input type=button id="myToVolts" value="Convert Sensor A1 reading into Volts" onclick="{
  var myTemp = parseFloat(getElementById('myDivId').innerHTML)
  document.all.myCalc1.value = (myTemp * 3.3 / 4095).toFixed(2);
}">
: <input type=text id="myCalc1" value=0 size=5>Volts <br>

You will have to look at the Github site above to see all the magic that the Ajax function sendToSpark() does.

15

Perhaps you can use the JavaScript library. That should allow the students to log in with their ‘normal’ credentials, without having to hunt for the deviceID/accesstoken. You could also create a drop-down from which they can select their device, and/or call the appropriate functions. A bit like I’ve got it over here.
Additionally, might I suggest to keep the background color a bit more neutral. The red is rather unpleasant to look at (especially for longer periods of time). I might also be problematic for colorblind people.
Perhaps you can let the kids do the voltage calculation themselves. Make two input boxes into which they have to enter the right values (3.3 and 4095). That way, they get a better understanding of what’s going on.
Other than that, keep going, great job!

16

@Moors7 I am trying to make things easier, not harder. As soon as you use frameworks the kids eyes glaze over

<script src="http://ajax.googleapis.com/ajax/libs/jquery/2.1.3/jquery.min.js"></script>
<script src="http://cdn.jsdelivr.net/sparkjs/1.0.0/spark.min.js" type="text/javascript" charset="utf-8"></script>  

<link href="bootstrap.min.css" rel="stylesheet">  
<script src="bootstrap.min.js"></script>

Also I only used the red so you could see what was the webpage, the github site has no background color, but on a side note. The best way to teach students about background colors is to have them make a webpage with the ugliest background color. Takes about 2 minutes before a kid asks how to change it.

As far as the voltage suggestions, tech is hard. Kids need a working example that they then can then change or improve. I want the kids to be able to create their own products but the frustration level needs to be reduced or they give up. That is why I spend hours and hours trying to make the stuff easier.

I would however really appreciate better ways to make secure websockets work with the Photon.

17

@christine

Just updating this forum with some of the things I have been working on. Found a way to use the Photon with Phonegap using cloud9 online free ubuntu service. Have been working on getting the Wifi Credentials for the Photon setup without a user having to login to the particle.io build site.

Also I have updated my Github site for teaching the Photon in the classroom. My new webpage is called ajaxBetter.html and it is very easy for students to work with

a running version of that page is at

http://rocksetta.com/spark-core-photon/ajaxBetter.html

which anyone can use since it uses local storage to safe the Photon's ID and token

I am working on improving the .ino file at

as students are getting close to wanting more control of serial devices. Amazing that students in the robotics class without any webpage design are having no problem editing the webpage since the command to control the photon is so easy.

    <input type="button" value="d7-send-1" onClick="{
        sendToSpark('d7-send-1')
    }">
    
    
    
    <input type="button" value="d7-send-0" onClick="{
        sendToSpark('d7-send-0')
    }">



<input type="button" value="a1-read" onClick="{
    sendToSpark('a1-read')
}"><br>



<input type="button" value="a4-send-0" onClick="{
    sendToSpark('a4-send-0')
}">


<input type="button" value="a4-send-255" onClick="{
    sendToSpark('a4-send-255')
}">

With those five website buttons, students clue in instantly how to control all analog and digital pins on the photon.

I will try to make a change in the code to allow some of the alternate ways to control the pins (Allow D0 to analog write etc) but for now the simplicity of the webpage is perfect for my needs.

2 Likes
18

One small thingy; for the accesstoken, you refer to the Web IDE, write particle.io, and link to spark.io. You might want to change that to particle.io/build

19

Thanks @Moors7

Good catch.

1 Like
20

You can also get to it at build.particle.io (rather than particle.io/build). This is regularly how we write and reference it.

1 Like