App Inventor – automatic texts

The design of the notext app is very simple - a message to explain what it does and a box to type in a new message to send

The screen layout is simple

Today I was trying out a new book called App Inventor – Create your own Android Apps, which starts with the tutorials from the app inventor site but with more background explanation then continues to introduce further concepts via example apps.  The first of the new apps is called No Texting While Driving, and the authors are anxious to explain that this app was thought up by a new student during a session to introduce app inventor, and developed by the group as the session went on.  A similar app has since been developed commercially; whether it was inspired by this student’s original idea or not is not known.

The purpose of the app is to provide an automatic message in reply to any texts received while the app is open – this may simply say “I’m driving and will contact you when I’m free” or can be edited to a custom message.

Instructions are given to develop the app further in order to read the incoming message and sender details out loud and provide a geographical location with the outgoing message so the recipient knows where you are, but I didn’t continue that far as I was anxious to test out the main functionality.

blocks for the beginning of the no texting while driving app

The beginning of the NoText app

I found the instructions themselves fairly straightforward to follow, and good explanations are given as to how things work, but I did find it easiest to skip straight to the pictures showing the assembled blocks, referring to the table of components where necessary to find out what section a block was in.

The app seemed to work fairly well, with the only issue being changing the message to be sent – my version ended up sending any new message in addition to the old message, rather than replacing it.

Still, I was impressed with the ease of connecting to the text message system in order to read and reply to incoming messages, and feel that the system really is simple enough that having seen many of these concepts in use once it’s easy to adapt them for your own uses.

The book looks like it continues with many more interesting apps, such as using a barcode scanner, geographical locations, animated apps, games, quizzes and a chapter on web APIs for anyone who’s really serious about app design.

I do, however, find it fiddly at times to get app inventor up and running, particularly the code editor, as on my main machine it seems to get nowhere and on my laptop it takes a while to load – not ideal when in a classroom setting. Still, I would love to have App Inventor available for computer club sessions, and maybe for the coursework task from OCR if it proves reliable enough.

 

Yousrc – introduction

yousrc logo

Yousrc

Yousrc is an online resource that promises to teach programming skills by building simple programs that can easily be played on an android mobile phone via their own yousrc app.  Now I finally have an android phone with a large enough screen (touch wood!) I can have a play and try this out properly.

simple yousrc code

simple program

The resource contains many features useful to schools, including the ability to register as a teacher and then register your own students and provide them with their logins and monitor their accounts without having to go via students’ email addresses.  It also promises that all apps are moderated before publishing and therefore child-friendly, and this goes for all resources and forum posts as well.  I’m not sure how they would maintain that on a much larger scale, but for now all this is available for free, with an optional paid version offering more online space, more support and more teaching/learning resources.

Currently if you have students registered within your school they submit apps for your approval.  If you approve them, they then go to a member of the yousrc team for further checking, before they are published and available to anyone.  The site features some projects if you wish to see the sorts of things that have been produced.  This is an example game made by the project’s owner.

I’ll be starting by working through the teachers’ resources available from the site.  There are six lessons available to teachers, which take you from creating your first “Hello World” program to displaying, moving and bouncing an image, plus using input via mouse and adding sound effects.  These promise to introduce the basic programming structures: loops, if statements, functions, global and local variables etc.  By the end of the sixth lesson the student will have written a program that has a logo moving around the screen, making a sound as it bounces off the edges and stopping and ending the app if the logo is clicked on.

Yousrc uses its own language, ELC, and all sourcecode for published apps is freely available.  It makes use of the Java runtime environment.  Code is written into the browser, in an editing window which can be run fullscreen if preferred.  Code is colour coded for ease of understanding, and there is a built-in checker to pick up syntax errors.  Apps can then be run onscreen from the editor, and you can optionally see all variable values as the app is run.

a program to animate the logo

animating a logo

Running apps on your mobile phone entails installing the free yousrc android app and then logging in with your details.  You can then access all your apps, published or unpublished, or look at other published apps, although I couldn’t find a search feature and I found the main app rather slow to respond at times and very difficult to work with.  There is a search feature on the main website, however.

One issue could well be the difference between designing an app with mouse input and with touchscreen input, so I’ll be looking into how that is handled.  When an app is played on the phone, a touch pad appears at the right of it with arrow keys and a space key, or there is the option to switch to motion sensors.  I found dragging my finger onscreen had the same effect that moving the mouse would have done on the computer version of the game.

First impressions are that there is a lot of support available for this tool, and the language I’ve used so far is straightforward and recognisable, but it will take more experience before I really see what the software is capable of and how far students are likely to be able to take it.  There is also the issue of how different the language is from any of the standard languages, so again I’ll be looking at that as I proceed.  I’ve found nothing wildly different so far, however.

I hit a few technical problems with my system to start with, so I’ll be keeping an eye on that as I go on as well: one essential requirement for software for learning is that it is stable, but in my case it could well have been a browser add-on causing problems.

This is tougher to get going with than App Inventor, but it does look and feel a lot more like proper coding, and I suspect the learning would be more intensive (which is both good and bad, depending on circumstances!).  The selling point for me is being able to see your own work on your mobile phone, so I’ll be revisiting at some point soon to move on a little further.

 

Virtual pet – BYOB and App Inventor

It’s time to try out my project idea in different software.  I’m working on the virtual pet idea, and first creating in BYOB, and then in MIT App Inventor.

The starting point for the code is the project found at interactiveclassroom.net, but I have developed this a little and will be continuing to develop further as the project goes on.

BYOB virtual pet code

The starting point for the pet code

Scratch/BYOB

This is what the pet sprite code looks like in BYOB (more or less just Scratch, here; no extra features of BYOB used yet).  The timing is very short at the moment to allow for efficient testing.

BYOB feed me button code

The code to feed the pet

There is a button to click to provide food.  The variable hunger is set to apply to all sprites (global variable). Another option is to make it apply only to the pet, but in that case the button sprite would not be able to change the hunger value and would have to send a message to the pet instead, asking it to change its own code.

BYOB virtual pet stage

BYOB version game stage

This is what the game looks like so far: very simple.  The pet’s hunger is displayed onscreen and gradually goes up to 10.  If it gets to 10, he disappears. If the feed me button is clicked, this decreases the hunger by 1.  The next development will be to have a value for health, which will gradually decrease by a random amount and will require medicine to be given.

 

 

MIT App Inventor

The next task is to create the same project but in MIT App Inventor.  It says a lot for the usability of this system that I felt confident enough to try this project so early on in my learning.

virtual pet code in the app inventor

virtual pet code

The system itself was again straightforward: I designed the screen layout, and then used the blocks editor to build the code.  The only complication was that I could not find anything to reset the game, which in Scratch/BYOB I would do by clicking the green flag again, so I built in a reset button as well.  I defined my own variable, hunger, as a global variable as in Scratch, and defined a procedure block called showHunger, which would display the current hunger level in the label element.  This was then available to use whenever I needed it.  The clock element fires very frequently at the moment, again for testing purposes, and when it fires the hunger increases until it reaches 10, at which point the pet disappears, a message appears saying the pet is dead and the reset button becomes active.  Pressing it redisplays the pet and sets its hunger back to 0.

virtual pet running in the emulator

Virtual pet on the emulator

I had a few problems getting the blocks editor open this time, possibly because I was working on a different machine with slightly different security settings, but generally doing all the creation online makes it straightforward to work on my project wherever I want.

This shows the game in action so far.  The red button will reduce the hunger, which otherwise grows to 10.  Once it reaches 10 the pet disappears and the reset button becomes active.  Pressing that will bring the pet back and reset hunger.

So far so good: I have the raw bones of my project up and running in two different software platforms.  It’s playable, if rather simple and uninteresting, and I’m ready to start adding in new features.  Of course, it’s important to make sure that the new features don’t interfere with the original ones!

If anyone would like more details of the design side of the app, or any other information on my projects, or you just want to tell me if you’re finding it useful, feel free to comment on the post (link at top).

Introducing MIT App Inventor

The principles of MIT App Inventor will be familiar to anyone who has used Scratch: a series of blocks that fit together to build code.  More complicated than Scratch, with more options and different types of components, it’s still fairly easy to get the basic idea, even if it takes a while to become confident.

All that is needed is a google account, and it only took a few minutes to build my own app following the tutorial instructions, and then download it to an android phone.

designing the screen layout

Designing the screen layout

This is the third of the tutorials that are on the website, building a simple mole mash game.  First I added the elements I needed to the screen layout: here I have a canvas, sprite, text label, sound and clock elements and a button.  Each element was carefully labelled and its properties set according to instructions.

molemash code

All the code for the molemash game

Then came the coding.  The blocks editor is a separate program that runs using java, and uses a system of blocks that click together. They are colour coded to aid recognition of different types of blocks, although the colours are not as bright as with Scratch, giving it a more grown-up feel, and each block is designed to fit together only in certain ways, which helps with forming correct code.

This code uses two procedures that I defined, one that moves the mole to a random place on the canvas and one that updates and displays the score.  The movemole procedure is called by the clock element, which fires every 500 milliseconds, and the updatescore is called every time the mole sprite is touched.  The phone also vibrates when I score a point, thanks to the noise element.  The reset button sets the score back to zero.  The game needs a lot of development still to be really playable – I found it very hard to score points as it moves so fast, while there is no penalty such as a time limit to make it properly challenging.

molemash on the emulator

molemash on the emulator

You can have your app displayed and running on your phone as you build it, provided you have an android phone connected, but even if you don’t , the system provides an emulator that you can run in order to test the code.  I bought a really cheap android phone, £40, and could not find the right driver to work with this, but could still use the app on the phone once it was finished.

When you have finished with the app, you have three options to getting it onto your phone: first you click the Package for phone button, then choose either show barcode, download to connected phone or download to computer.  The barcode (QR code) purely provides the link for the phone to connect to the website to download, so you need to have the phone logged into the google account, while the other two options provide a file that then needs to be located in the file manager and installed.

In summary, I would say that this software provides an easy enough interface to use and understand, while looking as though it contains enough power to do some pretty clever things, and I’m looking forward to learning more about it.  I’m quite glad, though, that I know enough theory to recognise what I’m doing and understand the principles behind the software, and I’m not sure how long it would take someone less familiar with programming to really see how it works.