In browser MIDI
So I created a simple node based MIDI bridge. There is no need for this.
WebMIDI is in the HTML5 specification, but no browsers yet support it.
For the time being there is a browser plugin and a polyfill
So I created a simple node based MIDI bridge. There is no need for this.
WebMIDI is in the HTML5 specification, but no browsers yet support it.
For the time being there is a browser plugin and a polyfill
I was having a chat with a friend about app marketing, and the app store. The reason why they are starting off with a native iPhone app is due to the massive call to action presented with the “Available on the app store” image.
Search for “ArtSpotter”
This image provides the user with a MASSIVE call to action. “Oh right, that is where I can find it”
That got me thinking. Personally the process of finding a website online is far easier, especially if I know the domain name. So that got me thinking, for purely marketing of web apps do we need to start using something like this:
Visit artspotter.com
Now although the fact that it says artspotter.com is pretty easy to me perhaps users actually need to search for something.
Search for “ArtSpotter”
Obviously I would rather the Available online would work better but I have a worrying feeling that “Google it” might work better.
Maybe this is the reason why HTML5 has a logo?
Mozilla are soon to be releasing their own app store. For the general mainstream, the ones who type into google “facebook”. These are the people we need to help get our warez into the hands of to go mainstream.
I think the web community needs a cause to get behind for the good of the web. Who’s with me?
My slides from Mr Mobble’s Magical Emporium, October 2011
My slides from Front Row Conference, October 2011
By now, I am sure you are aware that you can use web technologies (HTML, CSS, JS) to build ‘native’ mobile applications. Well you can also use these technologies on other platforms too.
I have compiled a list of resources for other platforms, (this is mainly for my own use, but I thought I would share it also :))
Mobile
Titanium Mobile (iOS & Android)
From the guys at Appcelerator. This compiles your application into native code.
PhoneGap (6 different platforms incl. iOS, Android, Blackberry, WP7)
This open source bit of kit is now also bundled in with Adobe Dreamweaver, for all the developers who use Dreamweaver as their IDE. Unlike Titanium, PhoneGap doesn’t compile your code. It simply sticks it inside a native app container and uses the onboard browser for rendering. Uses the native browser rendering engine.
I am yet to use this framework, but my first impression is that it pretty much does the same as PhoneGap, but it only supports iOS. Uses the native browser rendering engine.
Desktop
Titanium Desktop (Windows, Mac, Linux)
Another product from Appcelerator. Again, this compiles your app into native code.
Adobe Air (Windows, Mac, Linux)
The old man of the group. Adobe Air has been around for a while now. My issue with it, is it adds an extra layer of complexity for the end user, they require adobe air). Uses the the WebKit rendering engine.
Intel AppUp Encapsulator (Windows & MeeGo(?))
Made by Intel. This is a relatively new kid on the block. I am yet to use this, but from my understanding this works in a similar way to PhoneGap for mobile, in the way that it just renders the app in a browser frame. Uses WebKit.
This isn’t a framework, this is simply some sample code for a WebView, to create a Mac app in the same way as using Intel’s Encapsulator. Obviously uses WebKit.
I don’t have any information on this as yet. Only their announcements
Smart TVs
The new ‘modern’ ‘hi-tech’ ‘smart’ TVs by various manufacturers, Samsung, LG, Sony all feature apps
These apps are built as ‘native’ using HTML etc :)
Interestingly, these apps are built using flash. If you don’t know any actionscript but you know JavaScript, you should find it reasonably straight forward.
The new Sony TVs are powered by Google TV. Google TV in turn is powered by Android. Therefore to create an app for the Sony TV’s you need to create an Android app.
Other Gadgets
The Nook uses Android as it’s foundation.
To create games / apps for the Nintendo Wii you can create them using Flash. However, from my understanding the SDK is a couple of thousand dollars.
Well Amazon launched a beta program for the developer kit back in January 2010. I smell vaporware, but I thought I would list it just in case. By the look of things you can’t use web technologies (yet) but I thought I would include it anyway. It supposedly would use Java, so someone *should* be able to modify PhoneGap to work on the Kindle as it does have a browser.
I thought I would throw this in here as they are supposedly launching an SDK at some point in the future for their in car app store.
Next stop, fridges ;)
Samsung have relased a range of smart fridges, however I can’t fund any infomation on SDK and currently have no idea how the apps are built.
What other platforms would you like to develop for? PlayStation & XBox games can’t be developed using any web technologies (yet).
As you can see from above. We are almost there with a unified language to develop truly cross platform development. However we are extremely close!
So, we have all heard of PhoneGap and various other tools to turn HTML5 apps into mobile apps, but what about desktop apps? What if you want to turn an HTML5 app into a mac app and submit it onto the app store?
To do this, it is actually very simple. I have found this out recently from a recent article.
(Source: twitter.com)
It is approaching the end of the spring term for my students on the DMD11 course at Winchester University. Yeah, they get an easy life, they are soon to have 4 weeks off….
While they are on their ‘break’ they have a project to complete. As you may have guessed if you have seen any of my recent slides, is that they are making mobile web apps. As they will not have any direct contact with a tutor or mentor over the 4 week break. I have decided to try and give them some help by pointing them in the right direction for anything they may need while away.
I have therefore created 2 cheatsheets for them:
There are also various other excellent resources:
Starting a site from scratch
HTML
JavaScript
CSS
General Resources
My Heart & Sole talk :)
(Source: lanyrd.com)
So after Heart & Sole, I decided to start up a new blog. The focus of my new blog was all the new javascript toys that have been bundled with HTML in w3c’s HTML5 spec.
Each day, for 10 days I will be publishing a blog post, with an introduction to the new toy, a short guide to implementation and some sample code, often accompanied by a lovely demo :)
So far this week I have written about (and played about with)
The ones I still need to write / code up some demos are:
After the 10 days, I have a few other APIs I want to play with, so will write the blog posts as and when I get round to it.
Also, dont forget that all my code is available on github.
If you are sick and tired of me talking about this history api, sorry, this is my last post on the History API for at least a couple of days ;) I have just knocked up a demo, and I thought I would do a total recap and then provide the demo and src :)
As part of the HTML5 spec, they are introducing the new history API.
The history API has been around for quite a long time now. It has been used in the past to force the browser to go back to its previous state.
What we couldn’t do with it though was add anything on to the history state. There were workarounds using
location.hash
But location.hash was not built for that purpose. With the new History API there are only three new things you need to know
window.history.pushState(stateObj,title,url)
Add something new on to the history stack. You can pass it anything you want using the stateObj which will then get returned to you on the pop event
window.history.replaceState(stateObj,title,url)
Exactly the same as pushState, but this replaces the current state
window.onpopstate = function(event) { /** do something **/ }
This event is fired off when someone has pressed forward or backward
View my talk on the History API
Please make sure that any time you use AJAX, if you want the content accessible then make the ajax fired on a link and not on other elements!
On Friday night I was at the Heart & Sole conference… It’s inaugural event at Portsmouth’s Spinnaker Tower. It was an excellent event and I think everyone seemed to enjoy themselves, learn something, and meet their peers. Tom & Alex, the organisers kindly invited me to give a talk at the conference. Now, this venue was incredible… I was talking 100m above the ground in a room with a panoramic glass wall, and a portion of a glass floor.
My talk was about one of the new javascript APIs in the new ‘HTML5’ spec. The new history API.
Earlier this month I gave a talk for Basekit Live an event held in London. I would just like to thank Basekit for inviting me along, and putting on a great evening.
I gave a talk on an ongoing media battle at the time. The discussion is of what is best, HTML5 or Flash. Headlines such as “Is HTML5 the Flash killer?”. In my eyes this is a ridiculous debate. And this is why I decided to do a talk this topic. I tried to explain the real situation, so that attendees had more information on the matter.
