November « 2009 « Simon Kenyon Shepard

Synthetic Biology: The convergence of modern software and DNA

Sunday, November 29th, 2009

I’ve been ranting about this in drunken pub conversations for a few years now. But finally someone with an ounce of academic credibility to back me up.

My 2030 prediction for my company is:

Instead of creating iPhone Apps will be creating bespoke organisms for clients:
IA’s will be architecting their functionality
GD’s will be designing how they look
Tech arch’s will be designing how they are built
Developers will be using a synthetic Biology language to write/model/build/print them
Testers will be testing them to make sure they meet the requirements
Project managers will manage these new bio-tech projects
And Account directors will continue to mainly play golf

A further interesting discussion of this was posted up by a fellow member of the London Futurists group.

Tags: Andrew Hessel, future, industry trends, software, synthetic biology
Posted in developement, futurism | No Comments »

Cleaning up production code with JSLint. Once and for all.

Tuesday, November 24th, 2009

Sit back. Close your eyes. Imagine the scene.

Your client is sat round a big 3 inch thick mahogany table, in a tastefully decorated 1930’s art deco hotel conference room. They lean back in their reclining leather chairs whilst sipping chilled Harrods mineral water served in crystal wine glasses. The leather creaks. The sun pierces the cloud glinting through the gaps in the blinds filling the room with a coruscating light, a dazzlingly you are praying to match in the events that follow. Formalities are exchanged and weather is discussed. A thin veil of cultural formality gives you a brief respite from the reason you all know you are there.

You tap the mouse connected to the macbook. The projector flickers into life. The first page of your masterpiece is lit up. Each pixel a glorious testament to your craftsmanship and the pain, sweat and blood you’ve slaved over for the past iteration. Each click though the journey provides the perfect accompaniment to your commentary, going deep and deeper into your world, building a crescendo around it that signifies your masterful control of your media. Click follows click. Ouuu follows ahhh. And then…

Bang!

Has this or something along similar lines ever happened to you before?

Your heart sinks. Your face burns as the blood rushes like a stampede of elephants into your cheeks. You blush. You stutter a laugh. Make a self deprecating witticism about the realities of live demos. You click ok. You proceed with the demo. Inside you are crying tears of shame and remorse. “Why didn’t I catch that before?” you think.

Which, by the way, is wrong.

If you had more time to think about the question you should have actually asked is “why did that happen at all?”. To which the answer would have been, it shouldn’t.

Debug code, should never make it into the production environment. It’s just bad practice. Plain and simple. So the question becomes, “how do we stop it?”.

On my latest project I’ve been working with CI or Continuous Integration. I won’t go into the details of how CI works, you can find that out yourself.

As part of this, I’ve been using 3 very important tools: Maven, JSLint4Java and JSLint itself.

Maven is a build tool that allows me to add the marvellous JSLint4Java ant plugin to it. This means when Maven is triggered by the CI system, JSLint gets run on all the Javascript and CSS files in my project. If they fail the validation: the build fails. Simple as that.

Now, this gives us a lot power, to help both enforce code consistency, valid code and good code.

But up until recently, JSLint has not had the functionality to check for the javascript global alerts, consoles, debug or opera statements. But as of 19th of November 2009, after suggesting a console check, on the JSLint working group forum. The ability to be able to check for the globals: console, alert, Opera, prompt and debug have been added to JSLint by programming/Javascript legend Douglas Crockford himself.

AWESOME.

The new functionality comes under the ASSUME keyword, that when you switch off using the following code:

/*devel : false, debug : false */

will fail the file if any of those statements are present in the code…

This brings us one step closer to the holy grail of front end code RELIABILITY and eradicates the scenario I wrote about at the beginning of the post. But still doesn’t completely protect you from looking like an idiot in front of the client, so take care!

Tags: alert, bugs, CI, console, debug, Java, javascript, jslint, jslint4java, Maven
Posted in agile, developement, javascript/css | No Comments »

Coders block

Wednesday, November 18th, 2009

Sometimes trying to code can be like standing on the edge of an abyss.

abyss_ver3

You desperately want to take that leap off the firm, solid edge of reason and safety into the infinitely consuming unknown world of possibility that awaits you. But for all your heart, passion and fire, your brain is resolutely locked, frozen in place, destined to stare longingly out of your cold dead eyes at the wonders that could have been.

Your fingers tense as you try to force line after painful line of code from them. With each line you see another 3 lines that you should delete from earlier in the forcing process.

Each decisions you make is an excruciating process of taking a thousand different possibilities whittling them down and then taking a random guess that it’s the correct course of action. With each character you type your struck by the heinous unreusability of what your creating and that your never going to be able to get back to the pure zen state of a blank page that your soiling at this very moment.

You close your eyes and everyone who has ever condemned you as a failure, mocked your ability, or questioned any sense of validity as a human being is stood in a large circle pointing and riotously laughing at you.

This, this my friends is the hell of coders block.

A crippling affliction akin to the crushing sensation you get as a man when you fail to perform sexually, or the soul crushing moment at school where you are picked last for a sports team due to uncoordinated inability. One of those moments in life where you literally question the entire worth of your existence and pose the question “should I go on?”.

Well, maybe not quite that bad. But pretty damn close.

Today, I have failed to be at all productive. Infected by this disease of the mind, I have sat trying to code for 8 hours but achieving nothing more than responding to emails, reading blogs, writing blogs feeding my lethargic, flu infested body, festering in the social underbelly of mankind.

I even googled, coders block to avoid actually having to write any code! This is not a good day. The sooner it ends, the better…

Tags: coders block, programming
Posted in developement, javascript/css | No Comments »

Cool ad by HP.

Monday, November 9th, 2009

HP “Create Amazing” - Director’s Cut from Keith Loutit on Vimeo.

And those of you who would like to know how it is done tilt-shift perspective manipulation

Tags: advertising, animation, effects
Posted in advertising, animation, art#, marketing | No Comments »

All hands : abandon scrollbars!

Wednesday, November 4th, 2009

I’ve had to do a lot of things in my career as an interaction developer that I’ve despised.

A favourite bug bear of mine is having to reimplement standard browser controls in JavaScript. The familiar tale of the powers that be deciding they want to create custom designs for every tiny part of the web interface. Inevitably as the code monkey it’s your job to take it up the rear and produce these gems no matter how hard, annoying or pointless they are until someone, somewhere, can climax into a design ejaculation, probably whilst flicking through the centrefolds of a Taschen Philippe Starck product book. No wonder when you pick them up in Waterstones they are always sticky…

One of the repeat offenders of this list is the poor old scroll bar. Admittedly a tad ugly looking in some OS’s but never the less a stalwart of interaction design. The number of times I have been asked to re-implement this, using a variety of different colours, shapes, sizes has grown too long to count. I’ve spent a lot of time agonizing/swearing over scrollbar engineering principles and now it’s my turn to implement the scrollbars I want.

Now the scrollbars I want.

Are invisible.

I can’t remember when I watched it, but many moons ago, I came across Edward Tufte’s excellent dissection of the iPhone’s interface. The idea that really resonated with me on this, was the concept of eradicating “administrative debris”, controls that were just there to control, things that could be re-implemented to be intuitive behaviors, without the need for a reserved space of visual feedback that clutters and constricts the screen real estate. A beautiful example of this is how the iPhone, does away with scrollbars, in favour of a tactile drag/swipe scroll mechanism.

So, I thought, why not put the inane knowledge I have of JavaScript and the browser scrolling api to use, and implement a version of the iphone scroller, in a jQuery Plugin.

Six months later, someone else has beaten me to the punch.

There is already an jQuery iPhone scroller plugin, which is annoying as I produced the POC over six months ago, but only recently got around to tidying it up and refactoring it. BALLS. Oh well such is life. Anyway, mine needs some work, but is generally better.

Some examples are below:

Vertical Scroller

The iPhone platform elegantly solves the design problem of small screens by greatly intensifying the information resolution of each displayed page. Small screens, as on traditional cell phones, show very little information per screen, which in turn leads to deep hierarchies of stacked-up thin information–too often leaving users with “Where am I?” puzzles. Better to have users looking over material adjacent in space rather than stacked in time.

To do so requires increasing the information resolution of the screen by the hardware (higher resolution screens) and by screen design (eliminating screen-hogging computer administrative debris, and distributing information adjacent in space).

This video shows some of the resolution-enhancing methods of the iPhone, along with a few places for improvements in resolution.

In 1994-1995 I designed (while consulting for IBM) screen mock-ups for navigating through the National Gallery via information kiosks. (The National Gallery had the good sense not to adopt the proposal.) For several years these screen designs were handouts in the one-day course in my discussion of interface design, and were then published in my book Visual Explanations (1997).

The design ideas here include high-resolution touch-screens; minimizing computer admin debris; spatial distribution of information rather than temporal stacking; complete integration of text, images, and live video; a flat non-hierarchical interface; and replacing spacious icons with tight words. The metaphor for the interface is the information. Thus the iPhone got it mostly right.

Another critique of the current weather application (one that I believe can be rectified once the SDK comes out in February): more detail is difficult to obtain. For instance, most standard weather displays (TV, newspaper, etc.) give the chance of precipitation and the humidity level. This information could easily fit on the weather screen, but it isn’t there. If I click on the Y! logo at the bottom left, it takes me to a Yahoo mobile page that shows ads and no additional details about the weather (plenty of other random info about my area though…).

Quisque sem diam, ullamcorper et, volutpat et, dignissim sit amet, ligula. Praesent accumsan justo vitae metus. Nunc pretium aliquet libero. Nulla ut pede et lectus iaculis accumsan. Nulla aliquet arcu at quam. Pellentesque cursus adipiscing dolor. Suspendisse volutpat magna id nisi. Ut pretium nisi in elit. Curabitur id arcu. Maecenas eu quam. Curabitur ultricies, lectus quis commodo dignissim, felis turpis vehicula arcu, ac faucibus risus metus vitae turpis. Maecenas et lacus ut enim vulputate interdum. Mauris ut diam ut urna laoreet tristique. Aenean malesuada consectetur erat.

Phasellus eleifend, velit at semper fringilla, metus dolor hendrerit dui, id consequat enim purus vitae est. Sed tristique. Quisque hendrerit ullamcorper tortor. Vivamus pretium fringilla lacus. Maecenas in mi quis lorem auctor egestas. Vivamus quis urna dapibus sem euismod congue. In hac habitasse platea dictumst. Mauris metus sem, molestie in, tristique non, pellentesque a, enim. Aenean eleifend urna sit amet libero. Cras in diam. Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Nulla porttitor pharetra quam. Cras ac massa in nisi semper rutrum. Aliquam at tellus. Morbi tincidunt.

Horizontal Scroller