Articles tagged with: UX

The ultimate clean desktop, Windows 7 edition

While I'm not an expert, I'm neither an amateur in using Windows. I try to learn useful shorcuts, I combine mouse + keyboard for faster actions, try to have as few running programs as possible (both to improve performance and to avoid unlegible taskbar items) and in general keep my OS as clean and tidy as possible.

Since Windows 7, both the taskbar and start menu have improvements, like pinning programs and shorcuts. Thanks to that, I've been able to fully sort my start menu in the fastest way possible for me to use it.

First, the "quick access" Start Menu items list (instead of most recent ones, I manually pin and unpin them):
ordered Start Menu items

Second, the All Programs "root" level, with my custom categories (folders):
ordered Start Menu items

And finally, each category contains those shorcuts related to it, and nothing else:
ordered Start Menu items

I even have a 4th category under "Utils" called "Configuration": Inside it I store all non commonly accessed apps like CCleaner or the antivirus scan on demand shorcut. the parent folder contains software used more frequently, the subfolder software of the same category but less frequent.

In the beggining takes a bit to get used to it, and requires discipline to order everything as soon as you install any new software, but pays a lot in productivity, as you always know where to click in less than a second (because you always have few items).

This Windows 7 improvements allow me now to have my "ultimate clean desktop": 0 icons :)

I can do everything with the start menu and two start menu icons: One for the browser, and other for folder shorcuts (if you add multiple folder shorcuts to the task bar, they group under a single icon ;)


Review: FlairBuilder

After getting some feedback and visits from my review of a GUI prototyping tool, here we come with another review, this time of FlairBuilder.

FlairBuilder is a Adobe AIR made GUI prototypes editor, in some aspects similar to others in the market, but in others quite interesting. To test it, I've played a bit with my current mobile version of Kartones.Net:

Final Kartones.net mobile appearance

The editor is clean and focused on the design. almost no labels, all commands available, and stuff like content editing is done via double-clicking or by modifying the properties and events (more on this later).

FlairBuilder Screenshot

To create our windows/pages, we just drag & drop elements and modify their content, images, font and such. No big deal, just what we're suppossed to do.

FlairBuilder Screenshot

Common stuff like alignment, grouping, and z-level management is done really easy. It reminded me a lot to how Powerpoint works, and in fact I haven't even looked at the help (which I try to avoid in order to be like almost all of us are, non-manual readers).

FlairBuilder Screenshot

Apart from the basic features, I've liked from this application various small features:

First, it includes the concept of "masters", much like ASP.NET master pages, or powerpoint templates: A basic layout to avoid redesigning the same once and again in every page. Much appreciated ;)

Second, the concept of project and its interaction: Not only as a group of different pages, FlairBuilder allows to create events to add interactivity to our prototypes. From button or hyperlink clicks (to go to another page, for example), to having a Video player control that actually renders youtube videos in the preview mode.

Third, the annotations: Very useful if you want to add notes of how something should behave (or if multiple people are editing a prototype).

And finally, the fact that for viewing the prototypes you don't need anything but an internet connection. The viewer is only and you only need to supply a URL, like this one:
http://www.flairbuilder.com/viewer/?url=http%3A//www.flairbuilder.com/samples/Google.fbp

It works on Windows, Linux and Mac and the author is adding new features and controls.

As a conclussion, it implements some stuff commonly seen in this kind of software applications, but improves on another things like the no requisite for viewing our designs or the direct interaction with the elements.


Review: Balsamic Mockups

After writing about prototyping GUIs with Powerpoint, I was contacted by Peldi, owner of Balsamiq.com, giving me a free license of his product Balsamic Mockups, to try and if I liked, write a review about it.

I've downloaded the application (made with Adobe AIR), and made a mockup of the (now retired) Downloads section of the community.

Here is a screenshot of the interface took while I was finishing the mockup:

The app is quite intuitive to use, with toolbars and markers appearing when you select elements. Everything is drag&drop, then customize. All elements come with sample data that explains special tags or characters (for example, using "f " for closed folders and "F " for open ones in a folderview element).

Here it is the final result, and a real screenshot for quick comparison:


As you can see, it is quite similar, and I assure you didn't took more than 5 minutes to build it. Surely I could have played with sizes a bit more, but I wanted a "fast and dirt" prototype.

Prototyping with this tool is really fast and I'm surely going to use it for home projects.


Prototyping GUIs with Powerpoint

In my new job I've started designing a new web module for an existing application. My first task (apart from reading documentation) is to design all the web interface of the module management.

As I became tired of Visio (is useful but only if you have the proper templates, and offers no interaction), I've used the "Paper Powerpoint Prototyping Toolkit", a PPT template I found some time ago in my RSS feeds. It provides black&white Vista-like controls and some sample windows to prototype GUIs, and "hot zones" (shapes with 90% transparency) to simulate interactions with the placed controls.

The results are quite good and the design is quite fast. I made some changes to speed up Powerpoint's rendering speed (big opaque shapes take long to repaint, so beaing all in black and white I made the windows backgroundless and now repaints quite fast ;)

Here is a small sample of the web page prototypes I've built today, complete with interactive buttons and tabs:


Book Review: The Design of Everyday Things

I've added another recently readed book to my Book Reviews section. This one about usability and design... but not with computer examples but real life ones.

I'm finishing another book, this time more focused on development. The review, very soon ;)