Tag Archives: User interface

I’ve been fascinated with Facebook relationship decisions for a while now. One of the more interesting challenges with this complex term is that it’s not fully transitional. You don’t just go single -> complicated -> dating -> engaged -> married and the same way back. Sometimes you also want to step out from the whole dating thing and say, I’m not even single (as it implies that you’re available for persuasion) but that you’re just not playing the game.

So how do you express this with the user interface? Simple, you make an empty box that anyone can assign meaning to it, but its mostly there to have the most private option and to dissolve any implications of labeling yourself.

Facebook remove relationship status drop-down

With drop-downs, it’s often the case that we want to undo our option but the form won’t allow us. It takes extra attention to detail to allow such option.

Getting a chance to work in industry that you’ve heard so much in school is a really great experience. Today I’m hyped up about designing user interfaces and writing specifications for how things should work.

Image by snowcrash via Flickr

Personally, I’m a big fan of paper prototypes. A technique where you create low-fidelity prototypes that allow you to iterate quickly and without need to invest a lot of time in creating ideas. Trying this for a while now, I’ve learned that just paper prototypes are not enough. People just doesn’t take them too seriously.

This time around, I’m experimenting with upgrading my paper prototypes with computerized version. Nothing too high-fidelity, just printed wireframes in nice boxes and with a rough copy in place.

What about tools? I decided to experiment with OmniGraffle Pro (being a Mac Head) and some excellent stencils from Graffletopia.

To make the whole process easier, I followed a great video from Michael Angeles, Creating prototypes with OmniGraffle, it shows you how to use Actions->Jump tool to create interactive PDF’s that you can use to simulate actual user interaction. It also quickly presents good layout technique, how you’re supposed to have a Master layer with overall grid and then just create different canvases for new layers. Best spent 5 minutes of last week, watching that.

Summary: Go watch the video, and give a bit more hi-fi prototypes a chance, after being happy with your paper ones.

This are the slides from my talk at Widgets Web Expo, earlier this month. While the original title was a bit more conservative, the main purpose of the talk was to inform the interested public about the issues regarding AJAX, cross-domain post request and how it affects your application.

What I tried to do here, is to discuss the User Interface decisions that you have to make, when you’re talking to remote servers. Namely:

Thanks to a nudge from TomaÅ¾ Å tolfa (via his blog post), I decided to dive deeper into Mobile Attentive Interface, next generation of smart User Interface for your mobile device. The idea here is simple, we have lots of image and video processing power that we can then pair together with different geo-positioning techniques and online data storage to provide rich, contextual data, while walking around the city.

The reference project in this case is MobVis.org, developed at my home university. What they’ve done is that you can take a picture of pre-processed building with your camera-phone and they’ll give you extra information about it, directly on the photo. This is perfect for a device like iPhone, where you can take pictures, has a big touch interface, where you can then manipulate further provided information.

Example image they came up with is:

Mobile Attentive object Awareness

So, why it’s a potential killer app? Because it allows you to use your knowledge of physical space to influence behavior of your friends. Be it collaborative rating of cafe’s or tagging different clothing for your friends.

The idea here is to take this visual processing software and mash it up with your (social) network of friends in first step and then expend it in a crowdsourcing way. Instead of having to (boringly) rate geo-locations, you can take pictures and visually annotate them with information that’s important to your peer-group.

Only question that remains is if the group developing this in university environment, will have an ability and guts to spin it off into a proper startup.

– IntelliMenu; the menus are too long, we can shorten them. But instead of shorting them we can just hide the things in the menu. But to make it extra tricky to the user, weâ€™re intertwine the showed and hidden. On top of that, the computer learns how to arrange the visible/invisible menu.

Â – Rafting; all the menu items that wouldnâ€™t fit, fell of the screen

– It proved out to not work really well

Word 2002 – 1024×768 (2001) – Toolbars: 30

– Created the Task pane (the right column). Since anyone couldnâ€™t find anything in the menu, they added the things into right column.

Word 2003 – 1024×768 (2003) – Toolbars: 31

Â

Word 1 – 50 menu items to 300 in the end.

Â

Menus and toolbars we designed for less full-featured programs. The feature set of Office had grown and stretched the existing UI to full limits.