Tuesday, December 27, 2016

How can we program Mobile Phones etc in a learner-friendly way? - Part 1



Big question: How can we program Mobile Phones etc in an learner-friendly way? I want high school students to be able to join in. My own programming work and teaching is website coding so I would like Mobile Phone programming to be like that. My ideal system would have these features:
  1.  Free or low-cost resources for students and teachers.
  2. Exercising widely relevant skills - I would prefer based on HTML5, CSS and JavaScript.
  3. Works across a range of device systems, with "Android" as the priority target.
  4. Works in a straightforward manner following straightforward instructions.
  5. Works smoothly and quickly using the kinds of computers students have access to.
  6. Be able to "interpret" scripting code so I can experiment with an artificial intelligence idea I have of machine learning happening by the machine rewriting and adding to its own programming code.
  7. Learners can program phones by typing code into the phone. Bring back the educational glory days of the "Sinclair ZX81" and the "Commodore Pet".

Over the last week I have been test running systems. Cause for concern! Nothing comes near filling all of the above list and some mainstream industry systems much beloved of my colleagues and expert friends test out in my opinion as delivering bad experiences to enthusiastic new learners and could send them screaming off to dance classes, literature classes, singing competitions, anything but STEM! Not the empowering experiences we want.

We can eliminate 6 and 7 from the above list. With the remote possibility I have run across of actually creating a new mini-system using Android's built in browser to run JavaScript - more about that in a later article.

How I am doing this
I am testing while away from home in a place without Internet. The machine is a 2011 laptop with an early i7 processor and 8 Gig of RAM running Windows 10. This is close to our current student BYOD spec of an i5 laptop with 8 Gig of RAM. I downloaded and installed the systems before leaving home. Since then I am simulating student life in that my internet access is via a mobile phone on prepay. That has highlighted the way many of these systems demand big downloads to plug in additional components whenever we try anything new.

Still experimenting but here are some indications:.

AVOID COMMAND LINES - the free open source systems depend a lot on typing in commands like the days of MS-DOS. I believe this would be a disaster for engaging new learners and it is bad enough for my ancient self. Online instructions and tutorials included many example commands that simply did not work and needed a lot of detective work to sort out. I got one system partly working by giving up on pasting in the example commands and typing everything out directly - and there was a lot of it.
AVOID EMULATORS - These test-run the code in a phone-sized window on the laptop screen.
Best to test run by plugging the actual phone into the computer with a USB cable.
Some simple emulators are OK but most attempts to realistically "emulate" (imitate) a phone fall into the swamp of error messages and hours of internet searches and detective work to move to the next error message. Some use "virtualisation" so they interfere with our "Virtual Machines" and/or our "Virtual Machines" interfere with them. Also a lot of our robotics experimentation does not "emulate" well because "full" computers tend to lack the interesting sensors that phones have.


The Systems

System: Adobe AIR - Flash-based version
The current surprise leader. Not the result I expected or even wanted because Adobe AIR is a controversial system. An earlier version of it was famously and publicly criticised by Steve Jobs, then CEO of Apple::
http://www.apple.com/hotnews/thoughts-on-flash/
Steve Jobs banned it from the iPhone. It is now fixed and permitted on iPhones. It also runs on Android. It has had a high profile success with the game "Angry Birds". It is an old desktop programming system around since the mid-1990s and it works in almost exactly the same way for programming mobile devices. I am finding it to be fast, light, smooth and easy in a way that is a long way ahead of the others tested.
Stacking it up against my checklist:

  1. Free or low-cost resources for students and teachers?
    NO .. BUT
    The development environment is "Adobe Animate CC" which is a recent name change from "Adobe Flash" - the name change is possibly an attempt to escape the controversial past! A lot of schools and students have this for animation purposes but it also retains its past as a general programming system including business forms and this surprise gem of phone programming talent. The price is a rental of about USD 20 per month. Students and schools usually rent it as part of an educational bundle along with other Adobe software.
     
  2. Exercising widely relevant skills? - I would prefer based on HTML5, CSS and JavaScript. PARTLY - The programming language is "ActionScript" which is an Adobe variation on "JavaScript" so I can score it well for general programming skills. Getting particular I can find zero "Adobe AIR" or "Adobe Flash" jobs advertised in New Zealand although the situation is better overseas. I have run into rumours that it is more popular than it appears but people programming with it are keeping quiet about using a controversial toolkit!
     
  3. Works across a range of device systems, with "Android" as the priority target?
    Targets "Android" and "iOS" (Apple).
     
  4. Works in a straightforward manner following straightforward instructions?
    LEADER
    Well ahead of the other systems tested. Just start the authoring software "Adobe Animate" or old "Adobe Flash" if you have that as a relic. Select "Adobe AIR for Android" as the project type and get into it. It is the only system tested to have an effective User Interface "designer" where you draw your UI as a realistic diagram on screen.
      
  5. Works smoothly and quickly using the kinds of computers students have access to?
    LEADER
    Very self-contained without the issues of dealing with other software components. Fast smooth testing. Has a useful emulator built in. 


System: Adobe AIR - HTML+CSS+JavaScript based version
Looks like an excellent candidate by its description. Similar to Adobe AIR Flash-based but achieved with mainstream web programming methods. It even has a free version although that involves the dreaded command line. But I have not been able to get this working.


System: Android Studio
Home website including download: https://developer.android.com/studio/index.html
This is the full industry programming toolkit for "Android" phones etc. Involves engaging with the Java Programming language although with careful guidance we can avoid the mysteries of its generated code and concentrate on value-added coding which may be do-able for our learners.
Avoid the emulator and plug in the phone - although that means suffering the slow "build" process for test runs. I tried selecting "instant run" for my first test run and it took 23 minutes to start up a simple "Hello World" test. I have read since that "instant run" means that we suffer a long first run because that puts resources in place to make 2nd and later tests faster. I have not had the chance to test this yet. Android Studio gives me the first impression of being resource hungry and therefore too slow. That risks losing enthusiastic learners.

  1.  Free or low-cost resources for students and teachers?
    FREE - BUT what value do you put on your time? Student learning time has its own value.
      
  2. Exercising widely relevant skills? - I would prefer based on HTML5, CSS and JavaScript.
    YES - Android Studio and its JAVA programming language are mainstream industry skills.
      
  3. Works across a range of device systems, with "Android" as the priority target?
    PARTLY - Android only.
      
  4. Works in a straightforward manner following straightforward instructions?
    PARTLY .. learning Java may be a challenge. Android Studio does have a primitive UI designer.
      
  5. Works smoothly and quickly using the kinds of computers students have access to?
    PARTLY - Actually works on my laptop, The "build" process is slow.


System: XAMARIN
Obtain by starting a "Xamarin" App from inside Microsoft Visual Studio.
Xamarin is an independent project recently adopted by Microsoft. My colleagues went to a Microsoft workshop day in late Nov 2016 and they reported that it was the featured technology. The idea is to take mainstream Windows programming methods including the Visual Studio Development Environment (good), the C# ("C-Sharp") programming language (good) and the XAML UI design code (IMO not so good, see comment below) and translate the results into code for many kinds of phones. I have tested this for Windows Phone and Android. Xamarin makes use of the same "Android Software Development Kit" as Android Studio with similar slow builds. However there is a trick to make this bearable. If you plug in a Windows Phone then Xamarin runs reasonably smoothly and fast, as in 40 seconds to start a test run. The run on Windows Phone is consistent with the way it runs on Android. Windows 8.1 Phones, eg secondhand Nokia 520, seem to be available on auction websites for around $40. So we can do the grunt work with a Windows phone and switch to an Android to finish off.

XAML is a markup language like HTML. IMO the owners of this system should get with the standards and use HTML5. I am criticising all "proprietary" markup languages here including the Android one.
When used for Windows Desktop programming XAML has a nice UI Designer. But this does not work for Phone programming. I did confirm that it was not my fault or my laptop's limitation when I read this on the Xamarin website:
https://developer.xamarin.com/guides/xamarin-forms/troubleshooting/questions/forms-xaml-designer/ - retrieved 24 Dec 2016.
"There is not yet a visual designer for generating XAML in Xamarin.Forms applications, so all XAML must be hand-written."
Comment: Needs to do better!


System: Apache Cordova
Open source project about using HTML+CSS+JavaScript to program Apps in a similar way to creating websites. Excellent idea in theory and this is the system I expected to stand out as the winner. I am now disappointed with it.

Cordova "base" as downloaded from its home website: depends on the dreaded "command lines", so variations eg "TACO", "PhoneGap" have appeared with more user-friendly "IDE" user interfaces.
I have tested the base command-line version as well as "taco" which packages Apache Cordova as a plugin for Microsoft Visual Studio. Using Visual Studio Community Edition delivers a free package.

On the laptop I could only get the base version working and only with the fortunately very simple "browser" emulator. All attempts at targeting my plugged in Android phone failed with hours of playing "whack a mole" with a cycle of:
error messages - search Google - fix usually involving another download - new error messages.
The bitter end came with Cordova demanding that I update my Java from 1.7 to 1.8. I already had 1.8 but I updated to a slightly newer 1.8. No way could I get Cordova to recognise my updated Java.

Just before going away with the laptop, I did get the "taco" version of Cordova working on my more powerful desktop computer with my Android phone. Cordova is at least as resource-hungry and slow-to-test-run as Android Studio and Xamarin and possibly more so. Cordova also starts app projects with get-started code which IMO is learner-unfriendly in a distracting way. Cordova needs better learner example apps, tutorials and documentation presented with a sense of progressing step by step. I am considering creating some but the other learner-unfriendly elements of this beast lessen the motivation to give a lot of time to it.

  1. Free or low-cost resources for students and teachers?
    YES - if they have good bandwidth to do 5 Gig or more of downloads.
      
  2. Exercising widely relevant skills? - I would prefer based on HTML5, CSS and JavaScript.
    YES - HTML5, CSS and JavaScript.
       
  3. Works across a range of device systems, with "Android" as the priority target?
    YES - wide range of targets.
      
  4. Works in a straightforward manner following straightforward instructions?
    NO - needs improvement.
     
  5. Works smoothly and quickly using the kinds of computers students have access to?
    NO - resource hungry, slow, and with unusual coding requirements that took me too much detective work time to figure out.


Summary
In my opinion, the frameworks, especially Cordova, suffer from being collections of software from different suppliers that need to work together and often have issues doing that. The error messages need to be better and the developers need to work harder on error handling code that can run diagnostics and take corrective action. Adobe AIR stands apart in that it is based on one piece of software "Adobe AIR" that already runs on phones and acts as our "interpreting" agent. We only need to work with Adobe AIR and then Adobe AIR deals with the phone and its issues for us. This different approach is what draws some critical fire but I am now seeing it as a major advantage in enabling learners including me to simply get into creating apps without the "component wars" drama.

The video at the top of this article shows a result in action - created with Adobe AIR.