Thursday 16 February 2012

Don't Try This Design at Home

Facebook
Five months ago Facebook ruined their very useable Facebook chat application in order to try to change people's messaging habits. This change included the introduction of what I dub as the stalker view, which showed your friends activity in real time.


Today I'm happy to officially welcome the first step towards the dissolution of this awful design decision and the death of the stalker window.

 

Google
Three months ago Google ruined their very usable Google bar application navigation system, with a drop down menu requiring a mouse hover action to open an use.


Today I'm happy to officially welcome the dissolution of this awful design decision and the return of the old Google bar.


The War is Over
Ladies and Gentlemen.. UX has won! The War is Over!

 
UPDATE 16/02/12: Unfortunately, Facebook was just teasing us. The activity window is back.

Wednesday 15 February 2012

Wiki Based Documentation

Documenting your architecture is one of the holy grails of software development. While programmers tend to put effort into practicing commenting source code. Providing good system architecture design documents and sample code tends to be the challenging next step. This is because it's time consuming. While lot's of different hands in the pie, it becomes a valiant effort to get contributors to update the documents.

Wikis have provided a great step towards solving this problem. No longer would you have to navigate a 500 page Microsoft Word document looking for obsolete documentation. With Wikis you can collaboratively write and link different articles and samples together. The only problem remaining is that damn frustrating markup language Wikis use. The premier Wiki engine MediaWiki doesn't support WYSIWYG editing by default, which means creating documentation becomes more of a chore.

Here I will document my search for an easy WYSIWYG (what you see if what you get) editable Wiki engine and compare my findings.


WYSIWYG Wiki (http://www.wysiwygwiki.org/)

Allows you to modify pages using AJAX (try it), it's awesome. The only problem is that when you download it, you realize that you need to create your html pages manually, then include snippets of code in the header of the page you wish to modify.


Foswiki (http://foswiki.org/)

The website looks great, highlighting it's implementation of a World Class text editor.
But, I'll be honest and admit that I was scared off by the set up instructions.

Note this is only part 1

If anyone has used this Wiki, it'd be great to hear your thoughts.


MediaWiki (http://www.mediawiki.org/wiki/MediaWiki)

While MediaWiki just released a WYSIWYG editor, it only gives you an editing bar with the preview still showing wiki markup.

You can use Microsoft Word to export wiki marked up documents, although you'll probably need to do some editorial work when using images.


There' is an editor plugin for MediaWiki, however it only supports version 1.16-17 and of course may not work as desired out of the box.


Wikiwig (http://wikiwig.sourceforge.net/)

The best thing about using this Wiki engine is how each it is to set up. You simply, download the package, unzip it onto your webserver, setup a database for it. Then navigate to the page and it'll greet you with a configuration screen with a one click set up process.


On this screen you specify the name and credentials for the database. Note, if your web server doesn't support https, make sure you change the login/sign option to use http instead as no error will be reported until it's too late.

Another thing to note is that if you're using a newer version of php you'll get a couple of warnings when it's set up.

However, you can simply update the script in _wk/lib/Wiki_Db.php to remove the warning (or ignore it).
 
Feature wise, it's really simple to create and edit a new page. You can even directly insert HTML. While it may not be the best for security. It's great to actually get going with documentation.


Conclusion
Wikiwig was last updated in 2008, but I'm happy it exists. For my needs (software documentation), it's perfect. For a more comprehensive Wiki engine I'd suggest looking into the other options presented above with bias towards MediaWiki as it's the most recognized brand.

Monday 13 February 2012

Streaming JavaScript is still Great! Use It!

So back in January 2009 I was advocating splitting your codebase up into different functions, where you can stream in different logic bit by bit as required. This was due to support explosion of smart phones which didn't have the bandwidth or processing power desktop computers had.

It's been over 3 years since supporting this pattern, and I've honestly had very little to complain about, but I figured I'd highlight two of the negatives I've come across over the years.
  • Caching - Anything you stream will not be cached, so you'll have to cache the JavaScript yourself.
  • Bugs - As this isn't a practiced design pattern in the world of web programming, browser vendors don't always check for it before pushing out an update.

Caching
This one's a piece of cake. Simply use LocalStorage to store your cached JavaScript file.
LocalStorage gives you around 2mb no questions asked storage to store binary data, which is more than enough to store small javascript files.

Here we walkthrough the process of caching a JavaScript file.

 var jsScriptData = false;  
   
 // If we have localStorage  
 if( window.localStorage )  
 {  
   // See if we have the data  
      if( window.localStorage.getItem( "jsData" ) )  
      {  
           jsScriptData = window.localStorage.getItem( "jsData" );  
      }  
   else  
   {  
     // If not download the file normally  
     jsScriptData = DownloadFile( "http://urlto.com/streamingFile.js" );  
       
     // Then save to localStorage  
     window.localStorage["jsData"] = jsScriptData;  
   }  
 }  
 else  
 {  
   // If we don't have localStorage download the file normally  
   jsScriptData = DownloadFile( "http://urlto.com/streamingFile.js" );  
 }  
   
 // Create a new script element  
 var newScript = document.createElement( 'script' );  
   
 // Fill in the script element with more source code  
 newScript.text = jsScriptData;  
   
 // Add our script to the document  
 document.body.appendChild( newScript );  

Of course more smarter checks can be put in, for example, checking for an update every week, or having a flag in the main JavaScript file to flag when to stream in the update.


Bugs
Next issue to discuss is bugs. As of writing Mozilla recently updated Firefox to 10.0.1, which is great, updates are always good. However, for some reason iGrapher.com stopped working on the OSX skew.

On Windows it was fine, but the OSX just hung on streaming in more JavaScript files. Now on the iGrapher project we load 4 files.
  • startup - 21kb file which loads in the main view UI and downloading engine.
  • main - 98kb file which handles the graphing and stock market downloading logic.
  • extras - 150kb file which ads additional tools and menus to the graphing component.
  • news - 33kb file which handles the news stories.
What's shown in the screenshot above is the webapp hung getting the extras file. Now I didn't put in any time to debug the issue as I'm more focusing on the updated codebase. So unfortunately I can't deduce what exactly in the code causes it, but I found that by combining the startup and main files together into one file. The extras and news files stream in fine.

Mysterious, but I thought it'd be useful to highlight that yes, bugs occur, when they perhaps shouldn't.


Conclusion

I come across bloated websites all the time which rely on the browser to load in lots JavaScript files at the same time. This delivers a poor and very staggered start up experience. It's poor on desktop computers let alone the exploding smartphone/tablet market. We think about streaming in content all the time, why stop there? Let's start thinking about streaming in processing and fix this poor user experience we've accepted as the norm.

Thursday 9 February 2012

iGrapher 3D - Tiles Tech Preview

Here's a little sneak peak of the upcoming update for the iGrapher 3D project.


The main work behind the update involves updates to the rendering engine to support rendering out to custom frame buffers. This allows several different graphs to be drawn and interacted with on the screen at once.

Once this release goes gold, I'll pushing all the updates back into our open source engine codebase on GitHub for everyone to use and enjoy.

Tuesday 7 February 2012

Creative Writing

I am very easily distracted in today's world.

Sometimes I find it hard to stay focused on one project, as I have so many ideas and so many routes to distraction.

To combat this state of mind, I've started using 'typewriter apps' for my creative writings. I have to admit, it's a really beautiful feeling, removing the clutter from my computer screen and just seeing plain text waiting for my disruption.

WriteMonkey (Windows)
The first application I tried. I loved it, the only reason why I looked for an alternatives was because I wanted a version for Mac.

JDarkRoom (Windows/Mac/Linux)
Black screen, green text. Beautiful alternative to WriteMonkey for other platforms.

Ommwriter Dana (Windows/Mac/iOS)

Not quite a blank screen with simple text on, but this one ended up being my favorite. With soft touches such as typewriter inspired sound effects when typing keys and a softly presented beautiful background and ambiance. It's truly a pleasure to use. 

Conclusion
If you haven't used one of these applications I suggest you give one of them a whirl.
I really hope one day, they'll make an programming IDE with such beauty and simplicity that just makes you want to program, and if they don't make one. I will.

Saturday 4 February 2012

ERROR: Could not extract package's data directory. Are you sure that your installed application is debuggable?

Everytime I try to debug an Android NDK application, I'm greeted with a new random error message. It's driving me crazy!!!


If you ever get the titled error message, just keep renaming your package name until it works.

Seriously!

com.softpoetry.igrapher - refused to work
com.softpoetry.igrapher2 - refused to work
com.igrapher.is.awesome.app - refused to work
com.softpoetry.igrapher.app - refused to work
com.softpoetry.ig - works!


WTF?