19 September 2012

Inkscape for UX design

I know that suggesting an open source tool like Inkscape for a design where Illustrator is thoroughly embedded comes across somewhat like recommending a typewriter to a blogger for writing but having used it lately, I'm quite impressed.

This is a part of a series about UX design with open source tools but just a quick overview rather than a detailed review. There are many reviews out there so I'm just going to concentrate upon the things I found that might be of interest to other users.

Inkscape's interface is very different from Illustrator, and for many this is a failure. Despite us often suggesting new ways to do things, we UX designers can sometimes be stuck-in-the-mud when it comes to changing our own tools or workflows. Given that my first experience with vector graphics drawing programs was DrawPerfect (on DOS no less!), I can some experience with different interfaces so I'm not so phased by Inkscape.

What I did find useful was being able to export to SVG which could be made (with a little JQuery coding) quite interactive. I found that I was able to design a graphic, export it to SVG (Inkscape's native format) and show it directly in a web page. I could also add interactivity with hyperlinks, mouse overs and the like which made it not just a good tool for designing mockups, but also a good way to develop both interactive prototypes and even finished pages. One I did required maybe 20 lines of html code and a series of if... else if... statements to show something when a link was clicked.

Well, maybe not so much finished pages - layouts were distinctly un-fluid and un-responsive-designish; but they certainly worked well enough to display in the wild.

There are a few rough edges but it's still a surprisingly powerful little program. I'm sure that Illustrator priests will miss various features but I really like the idea of an open source alternative that uses an open web standard graphics format that can be shown directly in a browser and made as interactive as possible with little code.

08 September 2012

DuckDuckGo Sugar and Gold

Just in case you don't know, there's a search engine called Duck Duck Go (apologies to Gabriel and team if the spelling is incorrect!). I've been using it for a while now and even had a rap with the founder Gabriel Weinberg about this time last year (my Ph.D. thesis was on search engine usability).

One reason I liked it enormously was that it returned results with a very high precision. In search engine terms, this means that there were few non-relevant results. The other core measure is recall which is the number of sites returned and a third measure, accuracy, which is a function of recall and precision. This gave me quite a cheer.

The second reason I liked it is that my own personal sites do well in ranking: Searching for 'freelance user experience researcher' shows alansalmoni.com as number 1!

But something else happened that makes me want to spread the love. I was rushing up a design for a new resume (a cross between the traditional resume and an infographic - I have no idea if it will work well!) and I needed some filler text. As a part of my experience to rely upon open source software for design, I did the whole thing in Inkscape which worked out really well but the function that created random text wasn't working.

I went to duckduckgo and searched for lorem ipsum - and got a page of filler text in return!

This was a great time-saver for me and another reason to continue using Duck Duck Go.

02 September 2012

UI Interfaces

Land Rover Experience - User JourneyLand Rover Experience - WireframeLand Rover Experience - FinishedLand Rover Biosphere - User JourneyLand Rover Biosphere - WireframeLand Rover Biosphere - Finished page
Google Accounts_SucksSuggestions_00cSuggestions_01cSuggestions_02cSuggestions_03cSuggestions_04c
Suggestions_05cWorkflow 0,2ACW_ASEOTiD_comb4TiD_comb4Bcrowdsorters_header
CrowdSorters_maincrowdsorters_rippedass_01ass_02ass_03ass_04

UI Interfaces, a set on Flickr.

A regular update of my latest user interface designs. These come from various sources.