Monday, 11 October 2010

MomoLondon: Demo Night

I’m catching up on blog posts slowly. This one’s the Mobile Monday London Demo Night from 13th September… Together with Ewan and Sergio (manfully representing FuturePlatforms), I was presenting my Over The Air hack from the weekend (see previous post) and I was consequently suffering from a lack of sleep. Here’s a quick run down of the other presentations:

psonar

http://www.psonar.com/

  • upload music to psonar
  • get at music on any HTML5 connected device by streaming or downloading

roulette cricket

http://www.roulettecricket.com/

  • great idea
  • impressive implementation by FuturePlatforms, as usual…
  • £2.50/month to play for prizes, or a revenue share from bets

HipSnip

http://hipsnip.com/

  • mobile notepad for the things you want
  • enhanced with smart searches & geolocation:
    • wine.com, cnet, imdb, yelp
  • mobile design a little too small for hands… need to follow Apple HIG on Android too :-)
  • user research: found that people take photos, or save a draft SMS but then forget
    • wanted to have a way to remind people

The logo is an aleph. Is that for infinity or for hebrew? The letter carved into the head of the golem…?

Toshl

http://toshl.com/

  • personal expense record
  • quite secure
  • have apps for android, iphone & maemo
  • sync to web
  • on web, can analyze, export
  • currently 45,000 users, 1/3 active
  • iPhone downloads in 3 weeks almost surpassed Android’s 6 months
  • are in negotiation with banks for auto-download
  • currently have a freemium model, looking for investment from banks for rebranding
  • some great observations:
    • RIM apps generally look ugly
    • front end and usability on mobile apps takes 50% of development time
    • cross platform development is nose bleeding expensive!

Collinson Group

http://twitter.com/mtjmelody

  • Columbus Insurance is one of their brands
  • a mobile trip planner
    • but with a surprisingly comprehensive offline database of airports, flight plans, hotels and car hire
  • had a desktop version for quite a few years, just brought across to Apple platform

Appmarks

Adrian Cuthbert

http://www.myappmarks.com

  • bookmarks in that point to specific places within apps
  • want to add Android version too
  • if app not available, offers to download it from store
  • would like apps to supply relevant info

Milestone Planner

Benjamin Ellis

http://milestoneplanner.com/

  • need a plan, but things change very fast
  • wanted a plan on a page that everyone could update
  • webapp written with HTML5 and javascript
  • server keeps a full history of all changes
    • can view as list in webapp, RSS, export to twitter
  • facilitating a discussion around the plan
  • automatically generate weekly reports in PDF
  • most planners are based on TODOs, this is based on outcomes and people instead, larger scale

Qootia

tomaz@qootia.com

  • big screens that people can interact with by making voice phone calls
  • good demo, with great timing from the presenter

Liquid Air Lab

http://twitter.com/spodtronic

  • 480 apps developed on most popular smartphone platforms
  • 7.8 million users
  • 33,000 downloads per day
  • Android users are little more techie
  • BlackBerry users especially in the US
  • Nokia user… is catching up fast… !?!?
  • Ovi store has overtaken iPhone share
    • (since they have a special category for Radio apps…)
  • iPhone is going down in share compared to the others
  • started on Symbian and moved on to iPhone, etc
  • now have 7 platforms…

Sunday, 10 October 2010

Over The Air Hack - a LEGO robot with an iPhone brain

IMG_6032

As promised, here are the details of my Over The Air hack — The Eyes Have It — which won prizes for “Best Hardware Hack” and “Best Use of Other Features” in the overnight hack-a-thon competition. I also took it along to Mobile Monday London’s Demo Night on the following Monday.

The hack was a LEGO Mindstorms robot with an iPhone brain that followed faces in front of it and steered towards them. It performed well on stage, following me as I gestured towards it, just like a small pet.

The hack was composed of two parts: an iPhone app that detected faces in the video feed from the front-facing camera; and the LEGO robot that took instructions from the iPhone and steered accordingly.

Communication

Getting the two parts to communicate was one of the trickiest areas to get right, and caused extra headaches before each presentation. Both LEGO Mindstorms and the iPhone can communicate over Bluetooth, but Apple has restricted Bluetooth communication to companies that will pay the Apple “Made For iPhone” license fee or that use particular hardware. Bluetooth comms is not available through the standard SDK and apparently needs some kind of “secret handshake” to work.

Unfortunately, Mindstorms came out a while before the iPhone and uses a different Bluetooth chip; and LEGO and Apple haven’t managed to do a deal to provide Mindstorms access from the iPhone (perhaps because LEGO has open sourced much of their software?). LEGO has now released an Android app to showcase mobile phone integration, so let's hope Apple can work with them to get some iPhone apps too.

So no Bluetooth, and Apple won’t let you talk over the dock connector either… That left feeding information to the robot through one of its five senses — a touch-sensitive button, an ultrasound distance sensor, a microphone, a light sensor or the motors themselves (which can detect rotation).

A quick search on LEGO Mindstorms iPhone brought up the iPhoneRobot which used the light sensor to pick up different greys on the screen. This was a great start, but it wasn’t quite what I was looking for. For a start, it required the LeJOS firmware on the Mindstorms brick — this is a cut-down Java VM that replaces the built-in LEGO firmware. I’ve left my Mindstorms with the default LEGO firmware as I use it with my 7 year-old son. He’s not quite ready for Java, but can easily understand the Labview-based visual programming that comes with the Mindstorms kit. Secondly, the robot itself wasn’t quite suitable — I wanted a robot that would recognise faces, so I needed the iPhone to be pointing upwards towards people’s heads rather than along the ground.

Motor skills — building the robot

Designing a new robot from scratch takes quite a while and I only had overnight. Unlike normal LEGO with bumps and holes, the Mindstorms kit uses the new-style LEGO Technic, which is mostly holes and connectors. Also, LEGO’s own sample models are pretty complex, as they are built to look like animals or people as well as interact.

Fortunately, I found a great site with designs for quick Mindstorms models that are easier to hack to do what you want. Some of the ideas are amazing — especially a Segway that actually balances! I started with the 3-Motor Chassis and added the distance sensor on the front to prevent crashes. I also added the button sensor on the side to help with starting and stopping the program, as the iPhone was in the way of the program buttons on the Mindstorms block.

Here’s some pictures of the final result, holding the iPhone pointing upwards. I’ll try and generate some build instructions later.

Computer vision — the iPhone app

Humans are exceptionally good at seeing faces. Our brains have been trained from birth to detect and analyse faces very quickly. We can tell which way people are looking from far away and even see faces in random patterns.

Computers have a harder time of it, although recent developments have massively improved what is possible. Companies such as Polar Rose have shown demonstrations of both face detection (finding out where any faces are in an image or video) and facial recognition (matching the detected faces against a database of known images) running in real-time on mobile phones. Unfortunately, their code is not available to an overnight hacker, though they’ve recently been bought by Apple so we may see interesting capabilities in future iPhones.

However, Intel launched an open source project back in 1999 called OpenCV (for Computer Vision) and not only is it still going strong, but the library is easily compatible with the iPhone and has a git repository of a ready-built library. OpenCV is all about providing well-optimised functions for real-time computer vision, so that developers do not have to reinvent the wheel. It includes face detection algorithms and a guy called Roy has posted some examples of how to get face detection working on an iPhone video feed.

Roy’s sample code was written for iOS 3, and iOS 4 provides much easier methods for accessing the video feed from the device. I updated Roy’s code to use the new AVCaptureVideoDataOutput class that provides direct access to uncompressed video frames from any iPhone camera. This bit took a little while longer than it should have done, as the video feed is provided as landscape (you’re recording a video, right?) whereas its preview feed is oriented the same way as the camera. This was not obvious, and made worse by the fact that face detection algorithms do not work when the image is rotated by 90°… There was a point in the early hours of Saturday morning when I thought there would be no face detection at all!

Anyway, following Roy’s recommendations, I scaled down the input image and adjusted the parameters of the OpenCV face detection call. At the moment I transpose the image before sending it to the detection algorithm, but I suspect it would be faster to use a rotated Haar feature set (the bits that the algorithm picks out in each image to match faces). I also didn’t use Roy’s changes to use integer arithmetic rather than floating point — it turns out that the iPhone 4G has enough grunt to cope with the standard OpenCV code.

You can get the iPhone code from my github repository and try it for yourself. Note that it’s hardwired to use the front-facing camera at the moment. If you don’t have an iPhone 4 just change the AVCaptureDevice to point to the ID of the other camera and the rest of the code should still work (though possibly a little more slowly…).

Light and dark — the LEGO program

So now I had a robot base and an iPhone app that could see faces. The next step was to connect the two together using the light sensor.

LEGO provide a drag and drop programming interface for Mindstorms that lets you build up programs using blocks such as “move motor”, “wait for sensor input” and control logic of loops and if/else switches. It’s quite capable and makes simple programs relatively easy, but using variables and arithmetic can be a little cumbersome.

The main issue in getting the robot to drive was calibrating the light sensor, especially when each demo was under different lighting. After a fair amount of tweaking (some just minutes before presenting at Mobile Monday London’s demo night), the best results turned out to be when I crammed a small piece of cardboard into the hinge that held the light sensor onto the iPhone…

You can download the “.rbtx” file from my github repository, but for those who don’t have the LEGO software, the algorithm is essentially:

  1. Calibrate the sensor when pointing at the black and white squares to either side of the control square on the iPhone screen
    • The robot prompts for each reading with its display and waits for you to press the button between each sensor reading
    • The program reads the raw values from the sensor and calculates its own scaling values, as the built-in calibration routines turn on the light on the sensor — this works for reading black lines on a white sheet of paper but isn’t so good at reading the backlit screen of the iPhone…
  2. Wait for another button press to start the robot moving — so you can step back and make sure your face is in frame
  3. Read the raw value of the light sensor, convert it into a value between -90 and +90, and then steer that amount, then repeat
    • The program checks that the light sensor value is within a reasonable range before steering, otherwise the robot tends to go round in tight circles and you have to run round it like a lunatic trying to get your face in the camera frame!
  4. When the distance sensor picks up something closer than 6 inches, stop, play a sound and show a beating heart on the display (“I’ve found you!”)
  5. Start moving again when the button is pressed

To give you an idea of what this looks like in the Mindstorms NXT software, here’s a picture of the program!

Prizes

Thanks to Monotype for the beautiful poster of Gill Sans Bold Extra Condensed. They were going to give me two, but were happy to swap one for a copy of FontExplorer Pro instead, so I can see my digital fonts presented almost as prettily. Apparently, it’s now available for Windows as well as Mac OS X.

Wednesday, 29 September 2010

Over The Air 2010

This was my third Over The Air and it more than lived up to the expectations set by the previous two. Billed as “a grass-roots mobile developer event”, Over The Air is an unmissable event on the mobile developer’s calendar — a weekend of fresh presentations from people who are at the cutting edge, mixed with an overnight hack-a-thon competition with prizes awarded in the final presentation.

This year the organisers went for a couple of keynotes (including the major coup of Tim Berners-Lee on the Sunday morning) as well as over 40 seminars on topics ranging from business oriented pitch and product workshops and DIY PR; through introductions to design & prototyping tools such as Flowella and iProcessing; all the way to detailed technical explanations and tutorials such as using Paypal’s mobile SDKs and Bryan Rieger’s excellent presentation on building mobile and desktop compatible web sites (of which more later).

I’ve put my rough notes on the presentations below, but it’s worth checking out the other presentations that were spotlighted on Slideshare and the other blog entries featured in the overtheair twitter stream.

I also entered the hack-a-thon competition and won Best Hardware Hack as well as Best use of “other features”?! for my LEGO Mindstorms robot with an iPhone brain that followed faces. I’ll be posting the code for my hack shortly…

Keynote: the art of emotional design

Aral Balkan — @aral

  • when computers made the impossible, possible, features mattered
    • …and it didn’t matter if the interface was hard
  • mobile phones are now a commodity, but we’re willing to pay extra for some things
    • “I think Apple is on to something”
  • you cannot compete on features any more:
    • when infrastructure is commoditized, the differentiating factor is User Experience
  • Le Petit Prince: “perfection is achieved … when there is nothing left to take away”
  • you need someone with the authority and responsibility to say “no” to extra features
  • “usable” = “edible”
  • we want to aim for “magical”
  • Aral tries to stay “naive” so that he can understand interfaces from the point of view of an everyday person (not a developer)
  • don’t trick the user
  • build in “delighters”
    • not required for interaction, but…
  • oslo bullet train ticket machine:
    • just a credit card slot
    • exit also has a credit card swipe
    • can get a receipt later online
    • made a difficult decision: knew that fraud rates would go up
    • but worth it for increased usage
  • dangers:
    • weakest link is what is not under your control
    • e.g. facebook pulled the plug on Feathers for Facebook (now Feathers Visage) without warning, just as the app was featured on the German and Austrian app store

DIY research workshop – informing the design process

Mark A.M. Kramer — @mamk

  • users have different issues to those in the mobile industry
  • Mark does “nomadic ethnography” — mainly based on trains :-)
  • often finds himself being a participatory observer
  • Mobile research methods
    • e.g. woman on circle line instinctively knew when network was available — put the paper down and switched to checking her mail
  • iPhone is a good ethnography tool — can take pictures secretly!
  • mobile also enables surveys in the field
  • culture is changing:
    • mobile is enabling “just in time” — e.g. “just google that”

Mark then showed us various interviews:

  • inventor of makerbot and thingiverse:
    • “share or die”
    • integrate game mechanics into whatever you’re doing
  • reactable music interface:
    • play along
    • make it fun
    • can really make instruments with accelerometer
  • feature phone user from Eastern Europe (no smart phone culture):
    • want something I can read my magazines on (comic books)
    • but want it portable
    • I’ve seen others using iPads etc.
    • social shaping of technology
  • 10 year old — what I like about my iPod touch:
    • app developers will become rich if they make something that people like
    • he likes games
    • doesn’t want to pay for things

things to think about:

  • eWaste — what about all those unused phones?
  • social isolation
  • generational differences
  • impact on children
  • designing for inclusion & accessibility

Orange Mobilise – the mobile volunteering initiative

David Simoes-Brown (Strategy Partner at 100%Open), Jogesh Limbani (Head of Open Innovation at Orange R&D UK)

  • Orange using open innovation to encourage ideas to come in to Orange
    • The Wisdom of Crowds, James Surowiecki
    • Cognitive Surplus, Clay Shirky — 100 million hours of adverts watched over one weekend in America, equivalent to the amount of time taken to create wikipedia
  • Orange want to help minutes matter
  • Tuangou (cloud clout buying) in China
    • gathering people together to negotiate a discount
  • Orange want to capture 5 minutes a day from the 3h 45m TV watching for volunteering
  • Have previously launched Orange Rock Corps — can earn a ticket to a gig by volunteering
  • 1 million people giving 5 minutes = a decade of real time
  • http://mobilevolunteering.co.uk:
    • Orange building an app (iPhone to begin with)
    • Gathering ideas
    • Promoting existing apps
  • Challenge:
    • can pick an app from suggested ideas
    • contact the author and go
    • OR submit an existing suitable app
  • Orange will launch the top three voted apps & actions in October
  • Will also launch 7 other apps & ideas as chosen by Orange rather than community
  • Voting criteria:
    • You’re on the bus with five minutes before the stop — what can you do?
    • Popular & used often
    • Has a clear social or environmental benefit
    • Practical & attractive to a sponsor charity — needs a backup
    • Looking for a balance of actions:
    • research | lookout | reach out | skill set
    • Also looking for a balance of purposes
  • suggest to look at latest & most active rather than top scoring

Rethinking the Mobile Web – a pragmatic look at creating an accessible and inclusive mobile experience

Bryan Rieger @bryanrieger

Bryan gave a fantastic presentation about how to make workable web sites for mobile and desktop use. There’s also a whole load of discussion on slideshare below the presentation about different approaches. The how-to bits of the presentation start from about slide 104, but there’s a load of stats up front to convince you that having a mobile-friendly site is worth it, and that mobile-friendly does not just mean iPhone…

  • iPhone in US only covers about 6% of the population and only 4% of 5 major EU countries
  • Huge impact but not huge penetration (at least of people, but huge percentage of traffic…)
  • nice comparison of older (desktop) Macs vs recent mobile phones
  • feature phones of today are the smartphones of yesterday
  • the old devices don’t suck
  • gs.statcounter.com stats from 02/2010
    • lots of Opera Mini in Nigeria
    • lots of BlackBerry in Australia
    • in Feb. the UC proxy browser ate Nokia’s Chinese market share
    • Nokia bought Novarra in March 2010…
  • going forward, main browsers in use are WebKit and Opera Mini
    • coming up later are Mozilla Fennec (will be Firefox Mobile), Ovi & UC proxy browsers
  • why is it ok to say “this site works best on Safari 4”, when it wasn’t ok to say “this site works best with IE 4…”?
  • design “mobile first”
    • @media queries often fail — so taking a desktop site + media queries results in a desktop site on mobile
    • mobile site + @media queries => desktop site
    • not a new idea — just progressive enhancement!
  • use screen and handheld types for first stylesheet
  • book recommendation: DOM Scripting by @adactio (if jQuery not available…)
  • http://tinysrc.net will resize and compress image for you
  • infographics may need reinterpretation for smaller screens, rather than just resizing
  • a bit of a dream: Bryan would like to extend the <img> tag to have multiple images for different screen sizes
  • Q&A: Opera has device stats available from http://www.opera.com/smw/

Viral Survival Kit: Cloud Computing for Highly Scalable Apps

Matt Wood, Amazon Web Services — mawood@amazon.com

A quick overview of Amazon’s cloud services. Useful for working out what you might need. I was kind of hoping for something more technical, but this is good too. Especially useful is the link to the Amazon Simple Calculator, so you can work out how much your requirements might cost.

  • Amazon started with two servers (1 db, 1 app server)
  • They refactored so that:
    • dev teams could request resources on demand
    • wouldn’t have to worry about scaling & reliability
  • AWS is a datacentre abstraction
  • can provision a server in about 20-25 seconds (though Windows servers take a little longer due to security certificate isses)
  • guardian open platform is delivered using AWS

S3 & CloudFront

  • all data is replicated to three different centres
  • scaled automatically as demand rises
  • can have a reduced redundancy service at lower cost (only 5 9s rather than 11…)
  • CloudFront provides CDN

other services

  • RDS: relational datastore — MySQL as a service
  • EBS: elastic block store
  • EMR: elastic map reduce — hadoop on demand
  • VPC: virtual private cloud — elastic resources in the cloud appear in your own network through a VPN
  • CloudWatch: monitoring, autoscaling
  • ELB: elastic load balancer

some detail

  • m1.small available for about 8¢/hour
  • m1.large has more CPU etc
  • t1.micro is even smaller, only 2¢/hour
    • tight RAM constraints (600Mb), but has automatic CPU scaling
  • can plan over longer term and get reduced price (0.07¢/hour if you pay $50 upfront)

designing for failure

  • can attach an elastic IP address to an instance
  • if server fails, can just repoint to another instance in the same datacentre
  • also deal with datacentre failures
    • four regions (East Coast, West Coast, Dublin, Singapore)
    • each region has multiple availability regions
  • RDS can enable master/slave with an API call

automation

  • can pull monitoring data into ganglia
  • monitoring can be connected to autoscaling
  • can set thresholds for setting up and killing servers
  • integrated with availability zones

security

  • can have multiple roles with fine grained access
  • provide mitigation against DDOS
  • default-deny firewall
  • see http://aws.amazon.com/security for details
  • data stays within regions

Q & A

What Would Picasso Do — a panel of art and technology

Another brilliant Bryan Rieger production: find six people with interesting ideas and ask them to inspire the audience by talking about what they liked. It worked…

Tom has been thinking about…

  • Joseph Beuys: “everyone is an artist”
  • Music industry history is minuscule compared to whole history of art
    • we focus on near-sighted things
  • Art doesn’t seem to scale
    • engineering efforts can take 100Ks of people
    • what would art equivalents look like
  • Constraints feed creativity

mills is enabling creativity…

  • granimator: enabling the public to create screen backgrounds
    • invite artists to contribute assets
  • making creativity accessible

matthias has been playing with plasticine…

  • dali from 1950s: gem-decorated heart with pumping action
  • we work on the surface with the gems at the moment
  • need to work deeper
  • plasticine interfaces — when they’re rough, people want to grab them and play
  • Sony has a big blue design book
    • explored wireless headsets in 80s
    • worked in the home, but in shared spaces you would get someone else’s music
    • dismissed at the time, but might now be treated as an interesting feature

Jason has been looking at apps…

  • UK is much more advanced than US in area of IPTV & set-top boxes

Filip has been thinking about art…

  • linear vs dynamic
  • goals vs accidents
  • framing / positioning
  • interactive vs reactive
  • sense of ownership

Q & A

  • Are creative apps on iPad/iPhone merely frivolous?
    • e.g. Brushes, Magic Piano
    • TH: 11-point multitouch is not frivolous
    • JF: a device to interact with while watching TV
    • TH: Jeff Minter: apps for Amiga
    • no intermediation — straight onto the screen
  • Are there any useful consequences of art-related apps? Can they be applied to productivity-related apps?
    • TH: epic win: a todo list manager that takes game mechanics and gives you experience points for completing todo items…

tweetalondoncab

This wasn’t a presentation on the main schedule, just the cabbie who started @tweetalondoncab talking about where he’s got to and where he wants to go.

  • gone from 2 drivers to 120!
  • however, can’t cope with more than 3-4 jobs at a time

process

  1. customer DMs to @tweetalondoncab
    • may have to come back to them and get further details (inc phone number)
  2. the chair account (protected account) advertises the job (removing specifics) with phone number of person in chair
  3. drivers get a text alert when tweet sent from chair account
  4. driver responds with a phone call and gets job allocated
    • receives phone number and address of pickup
  5. chair account sends out that job has been allocated
  6. chair account informs customer of their driver’s details
  7. driver contacts customer by phone when they’re ready

also have @cabup protected account that provides shared information updates on demand & traffic — added value for drivers who join in

future ideas

  • would like to include cab sharing
  • still want to advertise to all drivers as it’s their decision to take it
    • first come first served at the moment
    • but would like to add in how long the driver would take to get there
    • especially for higher value jobs (e.g. Victoria -> Gatwick)
  • want to attract people who would normally order a private minicab

constraints & ideas

  • dealing with 3-4 jobs coming in at once
    • if can see all cabs on map, would be able to tell customers that can’t help within 30 mins
    • driver claiming job is pinch point
    • have a link to a page with how many minutes to be there
    • claim the job automatically
    • could have a form to submit info, so jobs are better structured

Keynote: Sir Tim Berners-Lee

I didn’t get to take many notes during Sir Tim’s keynote as I was busy finishing my hack (of which more in the next post). He was an inspiring speaker in his own way — you could see the passion for his subject shining through.

His main points were about ensuring things are referable, and that the reference can (and should) be done with URLs.

  • if an app doesn’t have a URL then it can’t be linked
  • it doesn’t get the interestingness — people can’t use it for other things