Alex

Alex

Alex's background in the technology industry goes back over 20 years, during which time he has worked for organisations such as the Metropolitan Police, Plessey Naval Systems, and Abbott Mead Vickers. Alex has been a fulltime instructor with Highlander for a number of years, having been involved in training for the last 15 years, and is a regular contributor to beta programmes for Adobe's core products. Alex is an Adobe Certified Expert (ACE) and Adobe Certified Instructor (ACI) for InDesign, Illustrator, Photoshop, Flash, ActionScript and DreamWeaver. In addition he also teaches courses on CSS, Fireworks, Quark, PHP and MySQL.

May 132013
 

Recently I blogged about exporting to html5 from InDesign using the in5 plugin. Looking through the various options that this plug-in gave me was an output option to something called the Baker framework.

The Baker framework logo

The Baker framework logo

This was not something I had come across before, so I thought I would look it up and see what it was all about. The Baker framework is an html5 ebook framework, specifically designed for publishing ebooks on iOS devices, using open web standards. Since these devices use the webkit rendering engine you can add audio, video, and animations within your ebook pages. Leveraging CSS3 you can change your layout in a responsive way, so that your ebook works in portrait or landscape modes. The framework itself is open source, using the BSD license.

May 132013
 

Running on from my last post on using the in5 plugin to export to HTML5, I noticed that when you chose as an output the iPad web app option, testing this in your browser on your iPad produced an interesting result. The pages were all in fullscreen mode, and they were locked that way. You could not see the normal browser buttons etc, you were fully immersed in the set of pages that you exported. This was interesting, and I guessed that it must be due some meta tags that were telling the browser what to do. Looking at the source code, here are the meta tags created when you export…

May 072013
 

Running on from my last post, where I was using the excellent in5 plugin for exporting to html5, I wanted to mention a couple of the options within the export panels. The first is the text rendering setting.This is in the Basic area of the export panel, and previously I had set this to Images (preserves exact appearance). This means that the titles that I used looked right, but were images…

 

text render 1

text render 1

But look what happens when I set this to HTML with local font embedding (where possible)…

 

text render 2

text render 2

May 072013
 

In a previous post I talked about a lovely new InDesign extension called in5. It exported to html5 beautifully. But I had only tried it with simple layout and colours. Now I am going to follow on from that example but I am going to export 5 pages instead, and I am going to add some content. First off here is my original sample from previously…

simple indesign layout

Simple InDesign layout

May 072013
 

I am currently in the process of creating a new course (which is always great fun). This time round it will be on HTML5 game development. HTML5 has come a long way since we started training it 3 years ago, so now I feel is the time to create a game development course using html5, css3, and JavaScript. In order to develop games, though, I will uses a few JavaScript libraries to make training easier. There are more and more JavaScript libraries out there, specifically for game development, that it makes sense to use a couple of them. Here I am going to introduce some of the libraries that I have come across. I have not finally decided on which ones to use yet, but I plan to make three types of games  in the html5 5 Games Development course.

May 072013
 

Having done a lot of HTML5 work in recent years, I was looking for a quick way to export my information from various applications that I use all the time. Today I am going to show you how to export from InDesign to HTML5. Exporting to html is easy, unfortunately the current export command is very poor. In order for me to export to HTML5 from InDesign properly I am going to use a lovely extensions called in5. This is not free, but if you need to get your content out to a web-based format quickly, especially into html5, then this is a very useful tool.

Jan 062012
 

In this post I am continuing my foray into Easel.js. Here I am now actually displaying and animating pictures. So this post is about JavaScript animation – using EaselJS pt 2. We will be making this…

EaselJS animation v1

EaselJS animation v1

 

…and it will be the car that is moving across the screen.

Again you need to make up a simple html5 page and link to the easljs library…

<script src=”easel.js”></script>

First you need to create a stage and link it to your canvas element…

var page = document.getElementById(“canvas”);
var stage = new Stage(page);

Dec 212011
 

Animating with JavaScript is relatively easy, however if you are used to ActionScript 3 it can be particularly painful to go back to learn how JavaScript does things, compared to how AS3 does things. Enter EaselJS. This is a new JavaScript library that aims to make animating and controlling objects within a web page easy – particularly if you are used to AS3.

It is built by Grant Skinner and can be found here…

http://easeljs.com/

 Posted by on December 21, 2011
Oct 152011
 

Just a quick post to show you some of the landscapes that I have been creating in Blender recently. I have been going through the Nature Academy series of courses (which you have to pay for, it is closed now but I believe it will re-open soon), created by Andrew Price (at blenderguru.com).

Andrew Price has created some fantastic tutorials, and I would heartily recommend that you check out his web site. His latest offering, the Nature Academy series, is all about creating natural landscapes – rocks, trees, grass, lakes, mountains, and so on. Each tutorial (and I am only half way through so far) is chock full of interesting techniques. I have found it invaluable going through the process several times in order to create landscapes in Blender – even though each landscape is different.

Oct 032011
 

In a flash class recently I was asked which technologies some one needs to be aware of and competent with when dealing with web design. In answer I quickly knocked a simple ideas chart to showcase which web technologies you need to know, and also some notes about where things are/were and where they are going…

Which web technologies

Which web technologies

The big thing of course is html5 and Flash. As you can see from the diagram, everything Flash can do (broadly speaking) can be done in HTML5, with the caveat that HTML5 covers CSS3/JavaScript/HTML5 and things like WebGL.