Kinoma Curriculum for Kids’ Vision

Lizzie Prader
  

Lizzie Prader

December 9, 2015

For the past ten weeks, Kinoma has had the pleasure of working with Kids’ Vision every Wednesday. Kids’ Vision is an afterschool program for girls ages 8-12 to further their knowledge of the wonders of engineering and coding. The Kids’ Vision mission is to empower 3rd to 6th grade girls by increasing their interest and knowledge of STEAM (Science, Technology, Engineering, Art+Design, and Math). Kids’ Vision previously conducted a program with Tesla Motors, where the girls applied the math they are taught in school.

kidsviion

What was Kinoma’s program for Kid’s Vision?

With Kinoma, the girls learned how to think like programmers. They learned coding concepts, were introduced to visual programming, conducted a hardware teardown, and even soldered! They even wrote apps for Kinoma Create by following our KinomaJS Blocks tutorials, our KinomaJS integration of Google’s Blockly.

Educators: Kinoma Curriculum

Screen Shot 2015-12-08 at 6.14.54 PM

Want to know the specific lesson plans? Check out the curriculum we used; educators can use this plan to teach kids about hardware, software, and design.

IMG_8625

The girls were so much fun to work with, and it was a great experience for the Kinoma team to guide them through prototype development. By the conclusion of the program, they were coding and wiring up hardware with familiarity and ease.

Stay tuned

Stay tuned for a more in-depth blog post on our time with Kids’ Vision!

 


IoT Device UI Beyond the ‘Companion App’

Alistair Inglis
  

Alistair Inglis

October 20, 2015

Thinking beyond the companion app

Today I want to talk a little bit about interaction design and how it relates to IoT.

Smartphones have afforded us new opportunities to design useful and exciting products, and they have given us new ways to interact with information. We can push and pinch, swipe and drag, peek and press. This has proven useful when developing IoT devices that rely on companion apps to be initiated, managed, and updated. For this reason, Kinoma Studio is able to package iOS and Android apps from the same code scripted for the connected device. images

But has smartphone-centric interaction design become somewhat limiting? We have confined the internet to screens at the expense of exploring how we could integrate the internet in the world around us. But is this a bad thing? The internet is really just information that we can express in any way we want. When starting out on my first project as a Kinoma Maker in Residence, I began asking myself if there was an enhanced way for IoT products to communicate directly with us, in addition to—or instead of—employing companion apps. Kinoma’s prototyping platform enabled me to explore all these possibilities.

Nature as IoT inspiration

A lot of the class work I did at Stanford University was an exploration of how our smartphones are starting to engulf our limited cognitive resources. Every time we get a notification, alert, or alarm, our focus is taken away from what we’re doing. As more information becomes useful and available, it will become increasingly important to find inventive and unobtrusive ways to express this information.

In the natural world, objects have a very good way of communicating information. When your avocados are ripe, you don’t get an iPhone notification; the avocado tells you itself in how it smells and how it feels. When the weather turns and it’s about to rain, clouds gather. As autumn approaches, the leaves change color.  When your plant needs to be watered, it visibly begins to droop.

Screen Shot 2015-10-06 at 12.38.42 PM

While these things seem very ordinary to us, in essence they’re communications of information. There’s no reason that hardware shouldn’t communicate information every bit as elegantly.

Elegant communication with IoT devices

The “drop: Smart Umbrella” is an early foray into this idea. It’s not particularly complicated. It’s designed to live at the periphery of the focus of the user. When an umbrella is needed later in the day, it begins to glow. If the user shakes it, it will stop its glow and therefore stop intruding on the her/his focus. If no rain is forecast, the umbrella will stay silent — it has nothing to say.

dropumbrella

It’s not a revolutionary product, and it’s not for sale. But it does demonstrate how to think outside the confines of our smart phones in order to achieve a more natural way to express information. Objects can communicate information when they’re required to, and fade away when they’re not.

Applying this thinking to the world around you

Imagine this design approach as applied to objects around you:

  • Instead of a Fitbit notification letting you know you haven’t exercised in a while, your running shoes gain your attention by vibrating as if restless to be worn on a run.
  • In addition to your bank’s smartphone app sending an alert when your credit card has been maxed out for the day’s spending limit, that credit card itself displays an “X” so you don’t mistakenly hand it to the next cashier.
  • As you’re getting ready to leave, your car keys become warm to the touch when traffic on your route is particularly bad, suggesting you should look into an alternative.
  • On lazy days, your remote powers down according to a television limit you’ve set for yourself, making it difficult to watch shows after too many hours on the couch.

As IoT products become increasingly prevalent where we live and work, developers can distinguish their products with inventive and unobtrusive ways to express information. There’s a wealth of potential for IoT products to learn from examples in nature, and communicate directly with us, in addition to (or instead of) through companion apps.

 

 

Alistair comes to us from Stanford University, where he studies Product Design Engineering and Computer Science. He has experience with product design, business, and consumer outreach.

 



Kinoma now shipping JavaScript 6th Edition (ES6) support

Peter Hoddie
  

Peter Hoddie

October 15, 2015

JS6 launch cropToday, the Kinoma team has completed the move to JavaScript 6th Edition by delivering a firmware update to Kinoma Create and a new version of Kinoma Studio. Both use Kinoma’s XS6 JavaScript engine, an independent implementation optimized for embedding JavaScript in hardware products and applications. XS6 remains the most thorough implementation based on the Kangax compatibility tests, implementing 96% of the new language features.

Using new language features in KinomaJS apps

Our main motivation in investing to update to JavaScript 6th Edition ahead of the rest of the industry is our belief that the improvements in the language make it better for building products. Developers working in 6th Edition will develop more robust products more quickly. In my Language Matters blog post, I wrote about our enthusiasm for new features that include true modules, more compact syntax, traditional classes, promises, generators, and symbols.

In this first official release of JavaScript 6th Edition support, we have begun to update our KinomaJS application framework to take advantage of some of these new features. In his blog post “Using JavaScript 6th Edition Features in KinomaJS,” our software architect Patrick Soquet introduces how to use these new capabilities of KinomaJS in your applications.

We are just getting started adding support for JavaScript 6th Edition features in KinomaJS. We’d like to hear your ideas for making KinomaJS even easier to use by building on new language features. We’re available to discuss them on the Kinoma Forum’s Coding area.

In the App Store now

Application developer Sébastien Burel of Haruni has been working with the Kinoma team to update the iOS version of his Frigo Magic app to use XS6 and our KinomaJS implementation with JavaScript 6th Edition support. That version of Frigo Magic is in the App store today, quite possibly making it the first app built on JavaScript 6th Edition (no polyfills and no transpiler needed). Congratulations to Sébastian for leading the way in using KinomaJS for mobile app development.

Screen Shot 2015-06-15 at 10.15.47 PM

“Using KinomaJS and XS6 has allowed Haruni to deliver the first ES6 iOS application without a transpiler, giving us an advantage over the competition. The transition was really easy because the language changes are backwards compatible. We took the opportunity to rewrite our code using ES6 features to be even more clear, modular, and reliable. We are using a lot of the new features including class, arrow function, promise, and many syntax. A big ‘Thank You!’ to the Kinoma team for the great work and support.”

– Sébastien Burel of Haruni

Performance

XS6 is considerably faster than XS, our JavaScript 5th Edition engine. In our own benchmarks, the overall performance is nearly doubled for key operations. Of course, benchmarks cannot represent all code in the real world. If you notice performance differences in your apps—much better or much worse—please let us know.

Open source

Today we have also updated our open source repository with the latest version of XS6, the same version built into Kinoma Create and Kinoma Studio.

github-mark

Compatibility

Our primary goal in this release of Kinoma Create and Kinoma Studio has been to provide a stable foundation for working in JavaScript 6th Edition. Bringing up a new implementation of a new version of the language while maintaining compatibility with existing code has taken the summer. We didn’t try to achieve 100% backwards compatibility in situations where backwards compatibility would have introduced overhead and complexity in XS6. We prioritized maintaining the high performance and low memory usage of XS6 for the long term.

Once you upgrade, be prepared to spend a little bit of time verifying that your projects are working as expected. In our experience, there are not many issues, and many of them throw an exception, which makes them straightforward to track down. We’ve updated all of our sample code (over 100 samples now!) in our GitHub repository to be compatible with JavaScript 6th Edition.

In updating our apps and samples to use XS6, the majority of problems fall into two groups. First, because modules in XS6 use strict mode by default, implicit references to global variable generate an exception. Second, XS6 modules no longer share the global variable scope with the application that loads them using require.

Get started

For a couple years now, JavaScript programmers have been buzzing with excitement about the new features coming in JavaScript 6th Edition. It is here today, ready for use in IoT products, your own projects, and mobile apps. We’ve delivered product-ready code, not an experiment. You can start developing today using Kinoma Create or the desktop simulators built into Kinoma Studio. The Kinoma team has worked very hard on Javascript 6th Edition this year to keep developers on the leading edge of adopting and deploying this new technology.

 

js6-box



Big Apple: NY IoT Central Meetup; Maker Faire New York

Rachel Bennett
  

Rachel Bennett

October 9, 2015

Screen Shot 2015-10-06 at 6.45.59 PM

Team Kinoma flew across the country for two great events: the New York IoT Central Meetup and Maker Faire New York.

Meetup: developing with IoT platforms

IoT Central, a meetup based in Manhattan, invited Kinoma and MediaTek Labs to present development platforms for the Internet of Things. Peter Hoddie discussed the importance of bringing the maker manifesto and open source to IoT. He also made the case for adopting Kinoma technology when prototyping IoT products by highlighting its key benefits, including the ability to script for hardware, and the path from product idea to mass production on the same chipset.

Screen Shot 2015-10-06 at 6.40.09 PM

Kinoma’s first meetup in New York certainly gave a warm welcome, with a very engaged audience, a ton of great questions, and true NY pizza pie. Thank you to Mitchell Golner for arranging the event, and for being a gracious host to those of us from Silicon Valley.

Maker Faire New York: robots, visual programming, and gamification

The majority of our weekend was spent in Queens, in the Maker Pavilion of World Maker Faire New York. We had a blast! We were excited to show new demos that illustrate what’s possible with JavaScript for connected devices, implementation of emerging protocols such as CoAP, integration with cloud services, and an experiment in visual programming that makes it all even more accessible than ever before to the new maker.

Screen Shot 2015-10-06 at 5.29.48 PM

Crowd pleasers

Screen Shot 2015-10-07 at 3.05.04 PM

Engaging demos is what it’s all about at MFNY, and we brought some popular attractions:

  • Tank Bot gave MFNY attendees the chance to drive a robot with motors and controllers powered by Kinoma Create. Kinoma’s Makers in Residence built a mini tank and controllers using two Kinoma Create devices that communicate over CoAP. Rotate potentiometers effect the voltage outputted, and the changes in voltage are translated to varying speeds and direction of the robot. A Kinoma Create is used to interpret varying voltage values and send motor commands to another Kinoma Create hooked up to a mini tank. We covered a lot of ground — figuratively and literally — with Tank Bot.

coaptank1-300x274

  • Blockly is a client-side JavaScript library for building visual programming editors, first introduced by Google at a Maker Faire in 2012. We are testing an implementation of Blockly for KinomaJS, for developers to script KinomaJS apps for Kinoma hardware in a visual way. While this is still exploratory, we couldn’t resist bringing it to MFNY. We’re experimenting with how developers can create apps for their Kinoma hardware with blocks, and then see the code it generates as a way to learn how to program with KinomaJS. We’re also testing how it could speed up scripting for Kinoma hardware.

Screenshot 2015-09-22 15.21.46

  • Fingerprint Lock integrates a TTL fingerprint scanner with a 5v solenoid to prototype a home security system. The project—very popular with MFNY attendees of all ages—registers and stores authorized fingerprints on the scanner. Authorized fingerprints can then unlock the door controlled by the solenoid. The prototype was first demonstrated at Maker Faire Bay Area 2015 and shows how to control the fingerprint scanner via a serial BLL and the solenoid using a digital output. The prototype also shows how to integrate the Kinoma Create full screen keyboard, play sounds, build scrolling lists and display rotated graphics.

serial-fingerprint-lock-example

  • Monster Match builds on top of the I2C-NFC sample by using the same Adafruit PN532 NFC/RFID Controller shield to create an interactive game that makes use of the NFC cards as a “controller.” The player places a card on the reader and is able to select an avatar (a friendly monster!) from more than a dozen options. The program takes advantage of the fact that data can also be written to an NFC card and uses it as a storage medium: the player’s choice is effectively serialized onto the card as JSON data, and the card can now be brought to another Kinoma Create where the companion project is running to proceed with gameplay. The visualizations of wins or losses are connected to a TV via a Mac Mini and WebSockets.

Screen Shot 2015-10-06 at 10.57.44 PM

  • wot.io, out of Manhattan, was a guest in Kinoma’s Maker Faire New York booth. They introduced Ship IoT, a solution for enterprise and industrial customers, enabling IoT solutions to be quickly built based on a core set of data services. To demonstrate the power of Kinoma Create combined with cloud services, they used a temperature sensor suitable for giving a very precise reading on our favorite beverage—coffee! As described in their blog post about the event, data from the temperature sensor was captured by an attached Kinoma Create device, sent through PubNub, and routed to wot.io data services bip.io, scriptr.io, and Circonus.

Screen Shot 2015-10-06 at 11.31.09 PM

Another bite

The Kinoma team was thrilled to have opportunity to bring our IoT prototyping platform to NYC. Thank you everyone at the IoT Central meetup and at Maker Faire New York for the warm welcome. We look forward to returning, and taking another bite out of the Big Apple.

mf15ny_badge



Iterating a Gumball-Dispensing Game Design

John Bordoni
  

John Bordoni

October 8, 2015

Kinoma team members created a gumball machine that served as the platform for Monster Match, a game showing the capabilities of two Kinoma Creates talking to each other. However, this gumball machine lacked an effective dispensing mechanism, and a bit of character. The Makers in Residence took on the challenge of reimagining the gumball machine to give it a unique identity. Thus, the brainstorming began.

Screen Shot 2015-09-11 at 10.00.12 AM  IMG_0044

We knew how to make it work…

We set out to improve the dispensing mechanism, and to make it more sturdy so it could be more easily transported to events.  The dispensing mechanism was a rotating disk with a hole the size and depth of a single gumball, designed to select one at a time and drop it into the dispensing chute with the help of a servo. Initial sketches for improvement involved a metal base with a thicker wall of acrylic tubing on top. Simple enough, but not good enough.

…but we knew we could make it better.

Additional ideas batted around to really make this game engaging:

  • Build a Plinko-style dispenser.
  • Build upon the metal, cylindrical idea with a second, outer acrylic tube that houses an individually-addressable LED string that could illuminate to add eye-catching personality to the dispenser.
  • Make a simple reaction game, where a single light would race around the string of lights and the user would try to stop the speeding light with the press of a button to halt it within a certain zone, similar to a fairly popular arcade game.
  • Build a rectangular array of vertical gumball chutes, each designated a particular color. Turn the gumball machine into an infographic to show the popularity of a variety of different topics (for example, each column could be designated a presidential candidate, and a gumball would dispense when a Twitter hashtag is used related to that candidate). However, this infographic form factor seemed impractical for a machine dispensing an item the user would eat – there would be very little user control.

IMG_0041  IMG_0039  IMG_0013

The ideas kept coming until I finally decided to continue the “arcade game” theme. Having always been a fan of Skeeball, I wanted to make a Skeeball-like game that dispenses a gumball if you hit a certain target.

The first idea was to create a ramp. The player would shoot a ball using a pinball plunger into a horizontal playing field with holes through they could “win” and claim their gumball. I mocked up this idea in CAD and had a fully 3D-printable, handheld version of this game created in two days. It used a small, spherical magnet as its “gumball”, and would return the ball if you failed to get it inside one of the three holes. If you successfully launched the ball into the hole, your prize was dispensed through a series of chutes under the playing field. This small mockup was an interesting tool to see what kind of games might be intriguing to play and how they might look. However, I was still unsure how the ball would actually be dispensed into the playing field.

Simple is always best

Eventually, I wondered why we weren’t just building a Skeeball game? What happens if we just shrank the size of a skeeball court into gumball sized dimensions? So, we used a CAD program to model this scaled version so we could 3D print it. Since the max dimensions of the 3D printer we had were 6” x 6” x 6”, and the part was nearly 10” x 14”, the part had to be broken into six 3D-printed parts. After a day of printing, I glued the skeeball mockup on top of a sheet of cardboard for support, and cut holes in the cardboard to match the playing field.

IMG_0007  IMG_0011  IMG_0012

Next, a system of tubes was needed to return the gumball once a point had been scored. Originally, we planned to use PVC tubes, but the joints were too large to connect all the holes together. So, we designed a special system of tubes using CAD software to successfully return the ball. This system was designed with holes in each tube so that a small IR light transmitter and receiver could be installed to figure out which point value had been scored. We hot glued these tubes onto the back of the game board, and created a ramp out of cardboard to finish the basic gameplay prototype.

The prototype provided us with the angles of the backboard and ramp to mimic the actual Skeeball game, and the appropriate sizing necessary for easy transportation. The tubing allowed for testing of the sensors to establish how precise they were and how quickly they could recognize a hit.

IMG_0018  IMG_0017  IMG_0024

Addressing challenges

1. A big challenge was figuring out how the player would shoot the gumball. It would be unsanitary for them to handle a gumball, and a pinball plunger might not have enough power to shoot a gumball into the playing field. So we quickly designed a customized launcher using CAD software and 3D printed parts. We only needed four screws and nuts, and a thick rubber band. This provided plenty of power that could easily be added or removed with more or less rubber bands.

2. Another challenge was figuring out how the gumball would be dispensed. The original idea was to have all the gumballs underneath the ramp, providing a colorful background, and a small wheel powered by a servo to select a gumball and raise it into the ramp for play. However, this proved difficult due to the lack of a significant enough slope (and therefore gravity) to ensure a ball would be dispensed. Eventually, we decided to make the dispenser part a separate, vertical part so it could be easily removed and dispense without as many jams.

3. An additional goal was to figure out how to make the game easily extendable. What if you wanted to play a full game of Skeeball with your gumball instead of just a single roll? What if you wanted to play a game where you only get your gumball after hitting a point value greater than 40? To make this happen, a part was 3D printed to house a servo that could take a gumball coming from the gameboard and send it back into the playing field or back to the user, thus allowing numerous game possibilities.

Design: Pretty lights!

IMG_0028  IMG_0027  IMG_0006

We also wanted this Skeeball machine to be unique and attract attention. There’s no better way to do that than to add pretty, eye-catching lights. We gave each chute an individual ring of LEDs that would light up to celebrate getting the points from that chute. Different animations and colors could be programmed for different point values.

Since the final product was going to be made out of clear acrylic and the chutes were to be 3D printed, there were numerous options on where to place each hole’s LED strip. A series of chutes were 3D printed, and we experimented with different colored filament (white vs. semi-transparent to see how the light appeared in each), and placement of the LED strip (flush with the outside, flush with the inside, or inside the chute itself). We found it was possible to fit each strip inside the chute despite being only 1/8” thick. Soon, we printed each chute in semi-transparent filament, cut each LED strip to size, and embedded them with the proper wiring. We then created the code to show certain animations for certain actions.

Let the construction commence

At last, construction began on the final product. I laser cut and etched guidelines on 3/8” and 1/4” acrylic  to make assembly and placement as easy as possible. Then, I installed and 3D-printed each of the chutes and tubes along with their sensors for the gameboard. We used black filament for the chutes to eliminate the impact of ambient light on the receiver. Since each chute uses five wires for the transmitter and receiver of the IR beam sensor, a PCB was made to make organization easier for all 35+ wires. An addition of the three wires for each LED strip (nine total for 27 additional wires) made for a mess. To help, each set of transmitter/receiver wires were zip tied together, and all wires were labeled with PWR, GND, and DATA. We used and connected a separate power supply for the LED light strips.

IMG_0020  IMG_0022

Next, we constructed the ramp. Each piece was cut to size and then put in place with acrylic cement. Two solid 1” OD acrylic rods were used to hold the rubber band launcher. The ramp was 3D printed in a variety of different trial angles before deciding on the best one. The ramp was supported with rubber foam and padded with cork to provide a more natural motion and dampen any impacts on the hard plastic. A holder for the dispenser was 3D printed, as well as return chutes for any ball going back into the playing field and for any ball coming back to the player. The housing for the servo that controlled where a previous played ball was going to go (either back to the user or back into the ramp) was then added.

Conclusions

The Skeeball Gumball Machine was full of its own unique challenges, each needing to be solved before continuing on to create the final product. The game was designed with extensions in mind, and these extensions could end up making the game even more special. Maybe a second Kinoma Create could talk to the Kinoma Create that is operating the board? Maybe this second Kinoma Create would be in the hands of an observer, who might have special powers to select a certain point value that would reward double the points if the player hits it on the next launch? Maybe you can be the one to make this extension?

We can’t wait to bring it to an event near you!

John is a Mechanical Engineering and Computer Science student at Stanford University with a background in content creation, manufacturing, and graphic design.