Handful of Nothing

Hi, as promised I’m going to talk a little bit about the photo viewer on the new Canola. This was a little bit controversial design and got of course the normal suspicious overview by the dev team. I fully understand them, as most of the time I have an idea but it just don’t fit in all cases, and they are a great in setting “hei dude calm down” points and to of course keep my feet on the ground sometimes.

But this time, I was really after this. I had a problem with thumbnail pages that are a really solid and fixed grid. I always thought that you photo view should be the closer to the real thing, and real thing has a real human made arrangement, where you try to combine and use the empty space as much as you can. So the goal was: How to be more “real”? More “personal”, more “human” or more “organic”?

Of course a real simulation is not possible (yet) due to the same problem like always (hardware performance) but come on! We are on a mobile platform! And this is running today only on high end computers or videogames like the Playstation 3.

But one good thing can always comes out of a restriction. After analyzing the photos, even a very small difference between the photos can give this more realistic look and feel. So it is possible to do that only by having landscape and portrait oriented photos. Then you put some small png images to the corners to create the 3D illusion and we finally found a nice format. We defined that at least height was going to be equal to ease some calculations in the thumbnailer and also in the drawing engine. But this simple detailed gave a much more “organic” feel to the view.

The internal screen

So, we are on a touchscreen based device, and as an Interaction designer I’m aware that “second click” or click and open menu are not a good solution for this kind of device. And personally I think contextual menus on touchscreen devices that appears when you hold the stylus down just one of the worst decisions ever. It’s again an attempt of bring the same behavior from the desktop to the mobile without adapting it.

To solve this we decided to have a “almost” fullscreen preview of the chosen photo and taking advantage of the widescreen and also creating consistency with the album art browsing screen, we decided to go this way :

This screen allows us to create a area for image information and maybe buttons to connect it seamlessly with other mashup content in the future, but also gives us contextual menu on the corner. We are actually not going to use in the december release this menu, as most of the options will be available in the fullscreen view but this already enable plugin developers to expand the functionality creating for example : Twango uploader plugin, Flickr, Picasa Web album or any other kind of send to application.

And to end the sequence, there’s the fullscreen view. But some of you may already say : hey what if I don’t want to see this intermediary screen? Well, you can double touch the picture and go straight to the fullscreen (actually this will be hard on low sensitivity screen) but solves the problem adding the shortcut.

The fullscreen view brings you the commands like the player : play, previous, next and in the other side: zoom and rotation.

The screen appears to not have enough hit area if you think that the Internet Tablets has a high bevel as a border, but the hit area on these screen will be actually bigger than the buttons, to allow you to click always correctly.

What’s more in and really counts: We gave an special attention to the details to make the whole usage more “smooth” so even when you have slightly bigger load time (bigger pictures being rescaled) you will have nice fade in and out transitions to reduce the loading time sensation, as well some sequential loading transitions to give the illusion of flow.

What’s out: We are not able now to make a fully powerful zoom feature, or other transitions (mainly tearing and redrawing the wholescreen smoothly limitations) and features like renaming or tagging. But as I previous stated, we already have the place to do so (menu) and there’s also small things in my head that I want to put to work next year that will allow better management, even with my belief that Canola should be more a player than a manager of media.

The Drawbacks

We all know that not everything goes the way it’s planned. There’s of course bad things about this design but I really like the way it came out.

1. What I think is really going to commented by some people is the different aspect of organization (by rows) and that some of the photos in a sequence will be out of the screen. This will be the price to pay, but I think that in this particular case it will worth.

2. The other drawback is that if you don’t have at least pictures in both orientation you’re will end up not seeing the effect and worst: if you have only regular pictures the “tearing” appears a lot more.

3. The need for a really fast thumbnailer: EFL came to help again, but this is quite complicated when you think about leaving room to allow users to manage it, and control how it works.

4. Memory consumption when kinetic scrolling : we need to provide a great experience to do not be boring. so if the user “throws” the screen to the side, it should “answer” to that. This is for example what made the iPhone UI so “attractive”. But how to do this if you have 100 or 500 images in a device where you should be really careful with memory and mainly with reading data speed? This gave us a lot of headaches. (Leo knows it)

We also did a regular, static grid version (actually used in the album browser view) so if people doesn’t like the more organic one we can maybe provide a way to fall back to the regular way.

I really believe the gorgeous touchscreen with have to work with, and it’s unique widescreen nature provides the perfect background to do something like this. So the photo view is truly an exploration of how to create exclusively for the horizontal use in a high definition widescreen. If we have this, let’s use it to it’s maximum.

Real demonstration of this screens : you can take a look in the video posted previously here (sorry for the low resolution)

Conclusion: The drawbacks are there off course, but I’m really please to push the boundaries of the platform again, and now on both fronts: design and development.

Next topic will be player screens and how Car users will really have a reason to do not worry about the smaller buttons on this version.

N810 image view, but you can also see the new task navigator, and a much better theme

This morning I saw the pictures of the brand new Nokia Internet Tablet on engadget. I was quite happy with the industrial design. It looks so much better than the N800 and it’s delightful to see the series evolution. Also the theme looks a lot sweeter than the previous “glowing” one. Of course not everything is heaven and looking from the pictures I can start talking about things that could be messed again in this released :

1) Camera looks again facing straight there on the left. This put the user in a not so comfortable position for video calling. You either tilt the device a little bit to the side or you try not bothering and do the call a little bit to the side your self. (can be a charm, come on)

2) Looks like the bevel framing the screen still high enough to bother a full finger usage BUT looks like wider.. so can be easier to you! Yeah!

3) The fullscreen keyboard with that HUGE backspace button still there. :/

4) The keyboard is really to close of the upper part that slides up. It’s not so easy to type on that :/ [4]

5) Still no centralized synchronization / media optimization software.

But of course good things:

1) Looks like at least some basic 4-way + 2 or more buttons gaming will be possible (while demanding a little bit of dexterity)

2) The whole body looks just a lot more compact and a little bit thinner than the n800 without that quasimodo hunchback. Cool.

3) if there’s really a built in GPS I’m on it (read my iphone review to understand more. Actually I will change to a link once I publish it)

4) The docking position appears to go even lower. That’s great for watching movies on today’s very very reduced user space on planes

5) The arrows (so criticized) were replaced by a small list (drop down menu) icon, and it’s not only on the application title, showing you that the menu is there, but also the same picture in the full qwerty keyboard.

6) That’s also nice to see: simplified (tray) and more lively(task navigator) not Tango-styled icons, in menu and also for the system tray. Thank you! and sorry but TANGO SUCKS (not the project, but the icon look and feel. 100% dull)

So let’s keep also an eye on this, and while this doesn’t come out check out some real life pictures from gizmodo :
1 2 3 4

And for sure the comment that was more then expected:

“An internet and media tablet with 2GB memory and 4 hour battery life for $479? Yeah, I know you should be able to get that a little cheaper, but whats the advantage over an unlocked 16GB iPod Touch for $399? Yeah the keyboard is nice, but the iPod is much sleeker, better battery life, MUCH better storage, I imagine better UI for media stuff…”
Click here to compare size with the iphone

He’s right in the better media UI, a lot more storage, a better browsing experience(only if we exclude flash) more battery. But he should also consider that :
exclude flash what is not possible nowdays in the web, so the N8xx series gives you real web.
You get a real GPS, not some “mockup”
You get a more flexible platform in sense of each kind of media and a good number of supported third party application
**you’ll get Canola 2.0 that will for sure be enough to satisfity the ipod UI need =) ***I wish***

So, I would advise the following : if you like tweaking, and is a power user, Nokia may suite you better. If you praise good UI experience and a descomplicated but “locking to certain applications” desktop to device experience you should go the apple way.

About Canola, we cannot say if the tearing problem is going to happen until we have a device, but if nothing was changed on the hardware side will be really sad :/. Apart from that it will be quite good to use the slide keyboard, maybe the smaller frame on screen, clean design, brighter screen, and of course an updated, optimized version of the Maemo platform.

Things go wrong. It’s funny to see how a company can evolve, and gradually give more and more importance to one area and while they believe the philosophy is the best option, they end up losing identity and entering a hall of those “hey, we care for the user, so much that we decided to have no sauce at all”.

I keep looking at Globo.com for the past 5 years, and I need to say: the improved, but also it looks that they are always trying to reinvent themselves (what’s good) they gave importance for IA and usability before the others (what’s also quite good) but then they committed the mistake: no sauce. No professional visual design or not that much but less and less value for professional visual design.

So you end up with something you have to day, that someone could call “clean” design but I call food with no sauce. You just need to visit Globo.com and realize that. It just misses something. Clearly, because it’s visual, and it’s more and more looking like a web2.0 site for web geeks, than a content site for the masses in Brazil.

Ok, I’m using globo as a scape goat, mainly because I was there when this kind of “thought” was growing and it’s the best example to show what happens when things go over priced inside a company. A lot of people will say “I like it”, that’s predictable but the point here is more inside the organization and how you should be careful when giving power to specific skills, when you should give power to the bigger one, the one that really makes great products : the interaction design or the newest one in terms of fame: user experience. So, if you go back to my post with the circles, you going to realize what it is all about.

All of this babbling is to say one thing: nothing should have more important than they are supposed to have or they were meant to have. I get really pissed when people tries to sell more than they are really doing, and to minimize other’s work. In a creative team everything is important and everyone should think about the project not promoting their area more than the others. When attending UX week I could see it pretty well, a lot of people trying to give more importance to skills / subjects instead of focusing on do really great stuff. Some of the worst presentations where from IA people not talking about IA and trying to make it sound like it was IA. What a pity. Even more when you think that some of the talkers were pretty famous “professionals”.

So, if you are part of a team, and of course have the power to influencing it, please do in a way that great products are the goal not promoting or advocating individual skills. Everyone on in a UX team should be able to jump from task to task and understand the whole as a beautiful thing that’s is above an acronym, a skill set, a professional group and of course the individual ego.

enough of this =)

Update some IA AI typos fixed. Thanks Marco. =)
Not a surprise that my self taught English sucks hard.

So, I’m posting this because it shows more or less what I believe to be the relation between the knowledge areas / disciplines. I was searching for more direction on this because I received some feedback (understandable) from IA that tried to say that IA was a lot more than dealing with the information, taxonomy etc. I understand that everyone is trying to always improve their skills, but IA has a name, a function and it’s pretty clear. If you go broader on the subjects, you start to change your position and role in a project and start assuming the others.

Being very honest, job titles are more and more just a requirement for HR department. You can have a focus (eg: usability) but you will be for sure involved on the task gathering and analysis and even on the UI designing itself if need. At least this is what I believe to my team, and what I try to always push to them “you don’t need to be specialist, but also not generalist”. We have a broad knowledge area and we need to not only know how the sub areas relate and work but also have a minimum practice in most of them.

Just closing this quick post : I think more and more in nowday UX teams, that no subject is more or less important to the others, and that is clear that most of the professionals must have a lot of practice and skills from different areas. This is crucial to be able to focus on project, and sometimes to take it forward when only you is the part of the design team.

Please, take a (long) time to watch the guided tour to the iPhone to realize 3 things (2 were already pretty clear):

1. Multitouch is a great technology, but not special in small device. Why? there’s simple not much that you can do on such small screens. You gonna realize that in the video

2. The UI has a long, long list of very very nice screens and well solved interaction issues. As an interaction designer it’s a delight to see it.

this picture shows the very nice “edit” mode for the bottom screen menu. Simple and effective. I will write a full review on how iPhone solved some of the most annoying things on the iPod.

3. It’s Apple, so of course they won’t give you a toe to step on, so while demonstrating the browser they show ” how to open a new browser window” but they don’t show how to move between windows. My tip on that : It works just like the Webkit based browser on s60 devices. =)

New Features? Not really. Most of things shown there are already present in products like the N95, and in a feature comparison side-by-side the N95 wins with 3G and GPS capabilities.

The real new thing in the new IPhone is the Multi point touch screen, what leads me to believe that is going to be the first mass product to have it. Also, if the screen can really keep itself clean after usage it would be great. So apple again did some really good things in the product design and the UI design, really showing the other manufactures that beautiful and usable not only usable UI does matter and does attract new users to your products.

Also, I’m pretty happy to see Apple pushing up the bar to the Touchscreen, and showing that there’s a way to make a complete device without a stylus. Stylus sux. (that’s why we did Canola) and now I’m even more happy to see that things that I defended in the last couple of years were not craziness.

Now it’s time to wait and see the ” no accidental clicks” and the ” works like magic” things that for mere are more related with the underling touchscreen technology that apple patented last year (I linked here somewhere)