Tag Archives: rant

Artificial boundaries

BlaBla

This is the 4th and last part of a single post (1, 2, 3)

For all the things in our life, we constructed boundaries that sometimes are completely artificial with not much actual sense in the reality of things, presenting more and more false dilemmas

This series of posts is of course about user interfaces, and this last post is about two common beliefs about applications and UIs that I think are false distinctions (and particularly care of)

Workspace? Application?

The boundary between the workspace and the applications is somewhat artificial, as is the boundary between one application or the other. Is there a common function that most applications share?

If so whether it appears in the application window, in the workspace or as part of another application is just a matter of what are usability findings for that action in particular (see Share Like Connect in Plasma Active).

How much two applications have to be considered separated if they share most of their components? or are just two tools of the same procedure? the knife and the spoon of the dish application?

In the end how much corresponds the separation I see in windows? is what i see as different tasks in the taskbar actually a different task? We should think more about different semantic task rather than different process/window that is an implementation detail.

Everything is just part of the same tool, the same system.

But is system == the machine? No!

Desktop/phone/tablet/TV…

Even distinction between devices and type of devices is artificial: my work spreads trough multiple machines, some more capable than others.

I won’t be able to do the most complex data creation operations on a phone, but I can view that work and create something, so on a mobile device I don’t want a completely alien set of tools, and i want to be able to access the very same resources.

  • I want everything as much synchronized as possible
  • I don’t want to set up the very same mail accounts on every device
  • If I have a movie on my desktop I want it to be available on my tablet
  • And if I press “play” on my tablet I want to see it on my TV
  • And i want zero effort to do that, not having to play around with settings and shared folders for hours.

I also want as much as possible of the very same visual language shared between all my devices. There are differences in input methods and screen sizes (in few years differences between pixel densities will be nullified), but most of the aestetics, a part of the behavior and most of the applications should be shared between all the devices, even if with more faces.

I don’t want to hear anymore KDE mobile effort versus the desktop: they are the same system. They are an unity, a spectrum that scales smoothly without really distinct interruptions.

Devices used to be very different from one to another, but in the next years differences will be less and less, in 1-2 years probably 100% of the sold computers, desktop or not will have a touch screen, we will see as big X86 tablets as very small ARM laptops. the input method and the mobile-ness won’t be a boolean anymore, they will be a real, from the big desktop(that is definitely not going away) to the small phone there will be a million of in-between thinghies.

And this is a false dichotomy dying right now, a distinction that existed for technical reasons (small mobile processors not having enough power) is fading away, we better adapt or die as well.

We are seeing different approaches in software to be ready to this paradigm shift in hardware; both Windows 8 and OSX are trying to “mix” desktop and mobile paradigms. Here the problem (especially visible in Windows 8) is that the transition from different devices is too abrupt, you end up with an ui designed for a different kind of input method from what you are using (thik about Metro start screen on a 24″ monitor).

So:

  • One size does not fit all.
  • There aren’t anymore well defined boundaries for different devices.
  • The UI should be like lego, every little piece should be interchangeable to do a million different combinations: small tablet, large one, laptop with touchscreen, small laptop with a mouse, tablet dockable to a mouse/keyboard station, whatever we don’t imagine yet…

To do a synopsis of this last post of the series, a phone and a desktop are the same system.

There are the Bob’s and the John’s systems, not the tablet system and the laptop system, the only difference between two systems is belonging to different people, being tailored around different lives.

To conclude, by the way here is the complete version of the mockup that srarted this long brain dump:

Fictional Desktop?

Overdesign

BlaBla

This is the part 3 of 4.

As the popular saying goes, there is always an easy solution to every human problem: neat, plausible, easy to understand and wrong.

It’s now widely accepted that the graphical and behavioral presentation of an interface should be have some conformity to what we evolved to expect (as i talked about in the previous post: transitions, rounded shapes possibly textured, direct manipulation of objects are just some aspects of it), however this brought a very easy answer that introduces a whole new range of problems: skeuomorphism.

A skeuomorph design tries to mimic as much as possible real objects that are an analog version of the tool implemented by the interface, a typical example is an address book application that looks like a leather address book or an ebook catalog application that looks like an actual library.

Address book

This is the design direction Apple taken since a while, and now from mobile is starting to percolate in the desktop as well (and being Apple is influencing a whole lot of developers now).

This approach has several problems:

  • It kills consistency: the boundary between different applications becomes extremely evident, too evident, condemning to remain forever in the application based paradigm, while “application” is a technical detail, is not much really something that should be very evident in the user facing semantics. Every application has a completely different graphical language, even tough it was designed to ease the transfer of learning from the “real” world it ultimately hinders the transfer between learned part of the system.
  • Imposes artificial limits: by copying a real object you copy also its limitations. To stay in the example of the book browser that looks like a library, the mapping to the real object suddenly drops (and thus it starts to look unfamiliar, magical) when you perform functions like sorting or searching books. You can’t certainly make magically disappear from the library all books that aren’t from a certain author, with a snap of the fingers. This makes quite hard to create innovations, like in this case a more powerful intuitive way to browse books that leverages indexing and metadata extraction.
  • It’s uncanny: the application will mimic the real object, but not perfectly: it will always feel fake, there always will be something out of place (even if just because of the features it offers that are impossible in the real world just as a simple search), creating a cognitive dissonance: yes I am looking to something that looks like a leather address book, but I can’t use exactly like that, i have to use a completely different set of skills.
  • It’s expensive: last but not least, it’s extremely expensive and labor intensive to redo from scratch every single pixel of every application: not everybody that are not Apple can afford to deliver a complex product with quality good enough to be presentable. If the cost of this enormous amount of work was justified by a big benefit could be worth it, but as we seen causes more problems than what it solves.

Finding the balance

The debate between an hyper-realistic, application based design, and a more classical UI approach is very polarizing lately, with good arguments from both sides.

Problem is the detractors of skeuomorph UIs, as gets natural in every polarizing debate, advocate from stuff that looks like it comes out from some 80’s science fiction movie, with Windows 8 Metro or Android 4 Holo as examples (especially in the Android case, the similarity with Tron is quite again, uncanny)

As I said, I think Skeuomorphism is the easy and wrong answer to the need of interfaces that feels more natural (where natural doesn’t mean there isn’t need to learn it), easily learnable to make the machine being a desktop or a phone an extension of your arm rather than a weird machine that you have to dialog in a strange arcane dead language with.

There should be a natural looking language, natural looking (or even reality copying) materials to build the UI elements, with a correct lighting, but yet not trying to copy real objects in the end, what you have to construct is a new machine that looks realistic but yet doesn’t copy a library or an address book.

You want something that looks and behaves more “analog” than “digital” (even if is something quite hard to quantify) for the same reason the piano replaced the harpsichord very quickly.

The UI must “flow”: as square edges and shapes with spikes should be avoided, the movement of everything should be as smooth as well, nothing that just appears or disappears, everything that is obvious where it comes from.

Remote controls should be avoided, everytime you have to use a UI to configure another UI, rather than directly manipulating it, you are doing something wrong.

In one sentence, design a visual language that is new, consistent, rigurous, looks natural and stick to it.
A button that looks like a button, with the correct lighting, drop shadows to tell the brain what is the most important and secondary things are ok, replicating a fully functional rotary phone is not.
Also, small breaks from the visual grammar can sometimes enhance the value of a particular feature, but only if used extremely rarely.

Next and last, boundaries between applications and workspace, boundaries between devices (or, why they don’t exists)

Design and psychology of user interfaces

BlaBla

This is the part 2 of 4.

Some times an application, or its user interface, seem to exist more for themselves rather than around the purpose of being a tool to accomplish a task: it’s very important that always stays the first goal of the existence of any functionality the software offers, being an application, a particular screen of that application, or a piece of the shell.

  • The star of the user interface is the content, this has to always remain the center, what distracts from the content is something that is often not necessary and can be avoided.
  • You interact with objects represented on the screen with a particular input system, may be a mouse, a trackpad or the touch screen. Interaction should be direct: in the real world you interact with an object not with a remote control that remote controls the object. Objects represented on the screen are often quite abstract, from objects to “pure information”, so is not always easy avoiding levels of indirection, but they should be limited (one of the reasons you will see handles in Plasma and not things like text boxes that ask how many pixels you want your panel high).
  • Our mind is trained to recognize patterns, that’s why consistency in UI is extremely important: this is something that comes from our evolution: for our survival we have to memorize and then recognize anything new that we encounter, may be a menace or an opportunity. Once you learn what a snake is, when you see a very different type of snake you just run;). Same thing as learning to use a tool, and transferring this knowledge to the use of different and perhaps more advanced tools, and this is what interest us here. (see transfer of learning)
  • Organic user interfaces: same reason as the above point, our mind expect things that we have seen the past some million years: some things are hardwired in our brains: we expect that when something appears it comes moving from somewhere. Something appearing out of the blue without having being noticed it was coming it’s seen as a potential menace, if you just find yourself with a big spider in front of you all the sudden without having it seen coning from somewhere, is possibly even more terrifying.
    As important as UI element coming in from somewhere is “natural” shapes: even just using rounded corners when possible instead of perfect edges may do quite a lot of difference. There are two probable reasons here: a shape with sharp edges focuses the attention on the outside of the shape, where the edges are pointing, while a shape with rounded corners focuses the attention inside the shape. Moreover, in nature things with sharp edges again are a menace.
  • Finally, a good interface should be invisible. What? Again, the sole purpose of the interface is being a tool designed to do a particular task. Everything that is “more” that the strict use case of the particular UI hinders its learnability and efficience. Often most of an application UI can be seen as “Content”, “Document” that still is a UI artefact, but is a quite direct representation of what you are viewing or working on, with chrome as everything else, that is often necessary, maybe a necessary evil, but evil still.

Those are all concepts that gained quite a lot of traction over the last few years, and UI quality all around, from Windows to KDE to web apps improved a lot, most applications and environments we see around followed a very clear design procedure, but… there is a but ๐Ÿ˜‰

There is also an ugly side about it.. in the next post.

A UX manifesto, universe and everything

Graphics

The next 4 posts were intended to be just one, then it evolved to be quite huge, so it got splitted in 4 posts that will be posted over the next days.

All started when i was working on a mockup for a theme. I am still unsure what do do about it, making a plasma theme (probable), a qstyle, or just a prototype in QML about what would be my ideal(tm) desktop UI.

This is a small glimpse of it, due the mandatory Back to the future quote: “You’ll have to forgive the crudeness of this model, I didn’t have time to paint it or build it to scale”

possible Plasma theme preview

Then this thinghie made me think about the current state of aestetics on all current platforms being KDE or GNOME, OSX, iOS, Android, Windows8, Unity… where they are going, what they try to achieve, if they are achieving it.

Quite a lot for a quick Inkscape mockup about a theme that is admittedly not that original, but maybe that’s actually the point.

It has some important characteristics, that will be quite important in the next posts.

  • It looks quite realistic, I paid attention to the lighting effects of the buttons.
  • It tries to have the least possible visual noise, borders between things are as few as possible, and big empty areas are used to make the various items “breath”.
  • Directions of the drop shadows, while looking as correct as possible, always try to represent a visual hierarchy: the thing that has an higher z-order is always more important. This not only between windows but also in the same window.
  • A theme like that is intended as an unified visual language for everything: consistency is more important than how realistic a particular application looks (hint: an address book application does not have to look like a real address book)

Since some years in KDE there are some projects that share a common goal, such as the Plasma Workspace and related projects, like KWin and Oxygen and Plasma Active; as I’ll talk about, distinctions between those, what they should be their goals and boundaries, are mostly an artificial limit that doesn’t actually exist.

This end goal is to make our software more useful, more easy, more pleasant to use. Computers (any kind of, from a desktop to your watch) should be an helpful tool that help the user to achieve a particular goal, for which the computer has facilities designed to accomplish.

In the next post I’ll talk about some of the central points in the UI design, both as in behavior and cosmetics of the Plasma desktop over the past years and Plasma Active over the last one.

Netbook: what are you?

BlaBla

Some time ago Michael Dell said that netbooks delivers a really poor user experience. Now it’s pretty easy to infer that this is because netbooks sales are starting to erode the higher margins desktop and notebook markets, putting the manifacturers in a really difficult situation: one of the most successful type of device of all timesis killing the most expensive ones.

In the end Michael Dell is even right: as a general purpose pc they deliver a pretty poor user experience for both performance and screen real-estate, but this infortunate situation is in a great extent fault of hardware manifactures.

The first netbook attempt, the old EeePC 701 was pretty much a device on its own: it had an ad hoc user interface and it was clear that it served just a limited set of use cases, casual web browsing, audio/video consumption and things like that. Not entirely different from smartphones use case, but for situations when you can carry around a slightly bigger and more convenient to use device.

Then, seeing the fantastic amount of sales of those thinghies the hardware manifacturers figured out that if they put Windows XP and bigger hard drives on them they would have sold even better and this was totally true, to the point that people only want to buy netbooks instead of regular machines, rather than using them as a secondary companion device (bad economy, the easiest way to still get XP rather the much hated Vista, pick the reason you want).

This has taken away every bit of innovation those devices had, like a different operating syste, solid state drives and software specifically designed for those screen constraints: let’s just throw office on it, it will work perfectly no?

This situation is bad for users that are buying an hammer when they need a screwdriver and bad for vendors that are seeing their profits taken away.

I hope this will be taken as a lesson and manifacturers will learn to fear less to be innovative, rather than taking the path of least resilience. I’m hopeful that devices like the arm based ones, maybe with extensive use of the touch screen will make netbooks that really distincht and innovative class of devices that they deserve to be, rather than just slightly dumber laptops.

Micro blog needed Macro love

Software

The Twitter Microblogging widget is a really useful tiny little utility, unfortunately until now it had severe appearance problems, especially when resizing the thing it did happen that contents could overflow from the applet boundaries.

This was partly due to some problems Qt 4.4 had with QGraphicsLayouts partly to our workarounds to those problems.

In Plasma we’re the childs with the slingshot that terribly enjoy to break stuff, the Qt components that Plasma uses, the QGraphicsView related stuff is a part significantly younger than the other parts of Qt, and we are putting it on a really tough stress test and this, even tough painful at start, it makes the framework mature at a really fast pace.

Now, i’m really impressed with the quantity of bugfixes present in Qt 4.5, so i decided to give the microblogging plasmoid another little quantity of love, and this is the result:

OGG version

So now the height of individual posts grows and shrinks depending on the text layout inside them and when the size of contents is bigger than the size of the widget it shows (or hides) scrollbars as needed (it’s also kinda touchscreen friendly since it can scroll by dragging the contents themselves). So now works more as it is expected to from day one, that wouldn’t be breaking news per-se, but it demonstrates that the stuff we were uber-early adopters it’s really coming together and show what its real potential was.

What’s more important is that not only the microblogging widget works better now, but it’s also easy to write a new widget like that, since the process produced two new widgets in libplasma (widgets not in the sense of plasmoids, yeah i know it’s confusing:): TextBrowser to be used every time you have to display formatted text simple enough to not require Webkit. The other one is ScrollWidget, where you simply slap another widget in it ant it will automatically decide when cut away a part of the contents and when to show the scrollbars or not.

PHP, cms, wikis and Web 2.0, and ONE to rule ’em all

BlaBla

As I promised here it is a long and grammatically wrong rant about what I think about the status of PHP and of the web application in general, starting from the tools I used for my thesis (PHP5, PostgreSQL), through a brief description of some today php cms and wikis and ending considering what i think it’s still missing.

PHP5 rocks

Since that beastie will run on a dedicated server there was no need to support the crappy hosting services with only PHP4/MySql4 service. With PHP5 it is possible to use true object oriented probramming without being deadly slow and using all that must-have things like public/private, inheritance and polymorphism, so you can shut up all that annoying Java programmers when they laugh at you :-P. Unfortunately, I’m absolutely sure that web hosting services won’t offer PHP5 service until 2050 or so, partly because a big slice of PHP programs are written so badly that they pitifully fails to run under PHP5.

PostgreSQL rocks too

The system had to support complex hierarchies (simple restrictions-free ontologies, like RDF, I leave owl-like restrictions to my heirs :)); Implementing hierarchies whit that crappy db engine that begins with “M” that does not support triggers and the default engine doesn’t even have foreign keys, Au contraire PostgreSQL it’s almost perfect, so as the other best things nobody cares of it and everybody goes with the cool and trendy MySql, being forced to move all of the integrity checks into the PHP code. Maybe I will give to Mysql a second opportunity with the promising version 5, but I still haven’t tried it.

PhpWet sucks

My poor cms that runs this site sucks badly. I realized that when I had to migrate the site from www.fosk.it to www.notmart.org. Changing some pathnames and adding some sections was very painfully, and anyway: what I was smoking when I decided to write my own broken themplate engine when so cool template engines exists already?.

But anyway it is still the only cms I can use without going mad because 1) every system has his very own idiosyncrasies an I know the mines, but 2) more objectively is the only one that supports all of some things that I consider irrenunciable. In particular:

  • all articles must go in a well ordered hierarchy (sorry, but I think everything too much in hierarchies :), I will explain why)
  • multilingual support (translate also the articles, non only the interface)
  • and last it must be easy to add more complex objects as article types, for example not only articles with title and content, but things with more fields that are required for other applications (for example photo, description, price and quantity available for an item in an e-shop site).

And what about other cms, wiki and journals?

Every cms I’ve tried fails something and excels some other things (or wikis, or journals, it doesn’t matter: that distinction should be made for the final website, not for the engine, otherwise it only justifies a lack of flexibility), in particular:

WordPress
Only a journal, the world is not a blog and even if it can run some other kinds of websites and it is getting better it is still not ready, but probably it will be able to handle more generic content in the near future.
Mambo
After trying it for a job that it has not been done, I realized I hate it, because it’s complex, it produces crappy HTML, supports translations only with a third-party add-on, his administration panel uses an ugly javascript menubar and it is difficult to exit from the “list of latest news” scheme and doing a more ordered hierarchy (oh no! again with that obsession :))
Drupal
This big beast is rather interesting and definitely I will learn more about it. Reassuming roughly the things I like about it, here it is:

  • The HTML it produces is fairly better than the Mambo one.
  • It supports a nice taxonomy, but I think the nodes should have been forced to be always comprehensible names instead of numerical ids that can be renamed later as strings (i.e. nobody will ever do it:).
  • It uses clean URIS with a good use of Apache mod-rewrite: www.mysite.org/category/subcategory is fairly nice than www.mysite.org/index.php?id=261765&action=edit&foo=bar&bah=antani :-). The first one is easier to read to both humans and search engines

There surely are also something I don’t like, in particular translations support as Mambo is done only with a third party add-on that I truly would like having it included in the official version. Moreover, I believe that the database structure could have been fairly simpler, I still haven’t studied the internals well, but that 55 tables madness sounds me strange.

CMS made simple
This, as his name suggests, is fairly more simpler and young than the previous two, but I think it’s one of the more promising. It’s a no-nonsense cms that supports articles ordered into a simple hierarchy (yeah :)), news (with rss, as all the others) and a simple search function. There are some things I would see in a future version and I would absolutely love it:

  • Maybe the news should be also articles in the hierarchy.
  • Translation of the content of course.
  • Ability to add more richer content (like the example of the e-commerce before, but it could be some other thing)
Mediawiki
And now His Majesty Mediawiki, that runs Wikipedia, my daily drug :). This being a wiki is a very differend kind of beast respect the previous ones. Even if I don’t know it very well (and I will surely remedy that) Let’s see some of the peculiarities that made me reflect a lot:

  • Track changes: Due to its open (in the sense everybody can modify the content) nature every change made can be easily rolled back and an history of all changes is always accessible.
  • Heavily based on search: this is mandatory if you have millions of entries like Wikipedia, but the latest version has a comfortable way to edit the sidebar with the pseudopage MediaWiki:Sidebar
  • The articles are stored and edited in an own simple language rather than HTML. In this way they are easily edited in a faster way than HTML and it’s theoretically simpler to translate in other languages than HTML or future newer versions of HTML (the day it will be possible to download auto generated pdfs from wikipedia articles I will be the happier child in the world:)
  • the relations/hierarchies between articles (think about the taxonomy of the plants or animals in Wikipedia) are computed from the article content rather from esplicitly specified table fields. This leads to a more flexible and fast way to categorize the articles. In order to avoid performance problems the article structure must be parsed at publishing time and the relations must be put in the database anyway.

Web 2.0? Does a Web 1.0 ever existed?

Today there isn’t a buzzword so buzz how “Web 2.0” is. But it’s still a very vaporous concept. To me even a “web 1.0” still not exists, because we are still in a 0.someting era, an immediate post “this site is optimized for internet explorer at 800×600 resolution”. At the moment there isn’t yet a clear agreement how the web should look like in the future. Somebody has even tried to make a validator that checks if your site is web2.0 compliant, but IMO it has some serious problems. First, it binds himself too much with the concept of the blog “ex.Has a Blogline blogroll?”, but altough the blogs became an important part of the internet they are not and will not be the internet. It also attempts to bind on a specify language (“Appears to be built using Ruby on Rails?”), and the strength of the internet since its creation has always been its platform Independence (even with the various hijack attempts of Microsoft).

The leading group is the Semantic Web, part of the W3c that works on some things very interesting with the constant risk being too much academic (with academic <=> useless and complex). The work that started it all was RDF, that is a simple and very generic XML schema for representing subject predicate object constructs. It’s not meant to be used alone but with RDF dictionaries ad so it become rss, owl and many others. So rss has many incompatible variants because RDF is very generic.

So how is the perfect website?

After all why managing well hierarchies is so important?

Yeah, I know, hierarchies are an absolutely not intuitive thing and these will probably help only few user to navigate the site (have you ever used the sitemap to navigate a site? I hadn’t), because that is the search that is becoming more and more important, because it’s easier and more natural. But I think a clean hierarchy helps the one who creates the site to make a more organic work, but that’s not the most important thing. If a hierarchy (or better: an ontology, that is in veery poor words a collection of objects and relations between object) is exported in a clear and formal language like OWL or some other (hopefully simpler) RDF dictionary would help some cool automated tasks, like helping the search engines to understand what the page relations are (maybe there could be some kind of relation between two pages even if there aren’t hyperlinks between them) or syndicating not only the page of news (RSS) but also the other content.

A cms? a wiki?

I think one engine should be able to manage “content” in every ways the administrator wants to display it. So an engine should be every of these things together, the final aspect/behavior is details.

How the content should be edited/stored on the server

And most important: what format should be used? HTML would be the more obvious answer, but I think the ability of download a page/article in more rich formats like pdf or opendocument is very important, and is also important to remember that HTML is not a fixed entity and will change even radically in the next few years (when somebody will support it is another discourse ๐Ÿ™‚ ).

So in order to create a system a little more future-proof it is necessary to make the storing format on the server pluggable and some candidates pops into my mind:

  • Mediawiki format: very simple even to be written by hand and I think it contains enough information to be converted into a well printable format. Probably it would be also easy to write a WYSIWYG editor for it.
  • Docbook (that will be translated in HTML and other final formats by an XSLT stylesheet): very complex and expressive, but too ugly editors.
  • Open document: very complex and expressive, publishing a new article would be as easy as uploading an OpenOffice file. But producing decent HTML would probably be hard and computationally expensive (it would be necessary caching everything).

And off course since HTML is not the alpha and the omega of representing information it should be possible to download the page in as many different format as possible. You want an HTML page? www.notmart.org/foo/bar.html. You want a PDF file? www.notmart.org/foo/bar.pdf and so on.

How the user should publish content

This should be an easy procedure for everybody, even the most computer-illiterated and of course it should be totally platform independent.

It would be nice having both possibilities to edit the site content both with a normal web browser or a specified client: think about XML-RPC and the flock blogging interface, but something of course not only limited to blogging. Obviously the ad-hoc client won’t be the only way to edit content, in order to maintain total platform Independence a web based interface should be always available (and of course somebody will hate the graphical client and some others will hate the web interface too, so the choice must be always present)

If i would like AJAX or not for the web based interface i am not sure: some things like Google Maps are cool but try to use them with a 56k modem or with an old web browser :-). So if advanced javascript, AJAX, XFORMS (when in the year 2050 some browser will support it ๐Ÿ™‚ ) and other buzzword are being used there should be always a plain old HTML version like Gmail.

That’s it ๐Ÿ™‚

Here are my random thoughts about the web. Maybe if some days I will have some time I will try to implement some of these ideas, but probably I won’t have time and probably tomorrow I will totally have changed my mind on this argument. In the meantime I will continue to search the perfect system that I’m sure it is somewhere out there ๐Ÿ™‚