Switches in Unity menus

Plans for the next iteration of the network status menu in Unity include the use of switch widgets.

As has been brought up on the unity-design list, their placement on the right is likely to make the issue of diagonal movement often opening adjacent menus worse. Independent of improving the menu mechanics, enabling/disabling could be handled differently in style and placement of the widgets.

I think the adoption of light-switch style widgets in point-and-click interfaces is a mistake. Their look implies a sliding movement, not just a click. They are unclear about whether the labels refer to the current state, or the state to change to (only the use of bright coloration for the On state helps here, but does nothing, if all you see is an Off).

If all you have to communicate is On/Off, what is wrong with checkboxes? They do have unclear target areas (in proper implementations, the label is clickable, too), but are well established and do not suffer from the problems switches have, as listed above.

In the middle: a different take on the switch widget, trying to do without separate label and state-labels. The state that can be switched to is represented by a button, while the current state is flat, as it is not clickable.

Finally an experiment, to see whether a strike-through approach could work for a very compact solution. It is hard to find a balance between legibility of the label and making the stroke clear.

Dash

Scaled Screenshot of Ubuntu 11.10 Unity’s Dash on a neutral background:

Full size

The 8 items in the home screen of Ubuntu Unity’s Dash have been found to be confusing in user testing and will be replaced for the next release.

I think the initial content should be similar to the search results that will be listed once there is text input. Basically the first n matches for a search for everything.

The search should be sub-string based, maybe even fuzzy and even support the categories that can be used in the filter section, to make the most of the user’s input. Especially when searching for files, one might remember a part of a name, not necessarily the beginning. Fuzziness should help with typos or variations in either input or searched content.

Turning the top panel transparent on activating the Dash suggests a connection to the right-side indicator menus, where there is none. It necessitates a variation of the window Close, Minimize and Maximize buttons.

The lense-switching buttons at the bottom seem odd. This placement almost maximizes the distance from the Dash trigger button. It gets ridiculous, if you maximize the Dash, especially on a large display. These buttons determine the entire content, which suggests they should be at the top or maybe on the left side. But what if the layout can be simplified by using the lense buttons both as section headers and pathways to their sections?

Rough, explorative mockups:

Full size

Full size

A second click on the Dash button closes the Dash, making it have the same function as the window Close button in this state. Could this be visualized? An admittedly brutal attempt, just to illustrate the idea:

I wonder if avoiding the potentially disruptive impression of the entire screen being taken over is worth having a Maximize button for the Dash and a layout that increases the need for scrolling (or paging as alternative). The button is yet another detail on the screen and costs the user a decision, not necessarily only once. Without it, the always disabled Minimize button could go, too.

Intuitive

You should avoid the term intuitive when discussing user interfaces.

In a general sense, intuition is defined as knowledge or belief obtained neither by reason nor by perception, instinctive knowledge or belief or similar.

There’s hardly anything in user interfaces that you don’t have to learn. You just might have learned it long ago in a different context. Humans even have to learn to walk and talk. Some say the nipple would be the only “intuitive” interface. I’ve been told that not even breast feeding just works on first try …

If you call something that has to be learned intuitive, you render that word useless, as it now also refers to what it used to exclude. Should you just want to express easy to learn or works as expected, just do so directly. Don’t be needlessly ambiguous.

To be precise: Lacking a mind, software cannot intuit, not be intuitive, it could be intuitable (support the user’s intuition) at best.

What makes an interface seem “intuitive” is actually familiarity. It might be useful to think of familiarity coming from 3 sources:

• Physical, real world experience that can be leveraged with metaphors and pseudo-physical interface elements (or perhaps custom interface hardware).
• Experience with existing software.
• Concepts/thought-models from specific fields.

Jef Raskin wrote a great Article: Intuitive Equals Familiar. Bruce Tognazzini says similar things. Also very enlightening: What Makes a Design Seem ‘Intuitive’?.

Affects me, too!

Launchpad has a feature where you can specify whether a bug affects you. Different from me too comments, this is useful in producing a number and not clogging up the comment thread.

But it’s at the top, between lots of stuff, while the comment box is all the way down. Me too style comments do happen. Maybe their number could be reduced by having the affects me feature close to the comment box. A label that emphasizes that comments should add information, instead of the current Add comment, could also help:

Design-Boost

I want to assist in the creation of better software user experiences. On a slightly different take, I want to foster the quality and quantity of design efforts and outcomes for and with Open Source / Free Software.

The question of the most effective way to do so, led me to the idea of applying design thinking to how Free Software is being conceived and implemented.

There’s knowledge that many projects could benefit from, that has to be researched and documented. Methods to be developed and shared. Infrastructure to be build. That’s what I will do, and you are invited to join my efforts. Especially if you know a thing or 2 about design, user experience, Erlang, git’s inner workings and web stuff. Extra points for polyglot programmers.

Now, what this is really all about doesn’t fit into a few paragraphs, so bear with me while I elaborate.

Making a difference with Free Software

The current choice of Free Software has much to offer and is the result of much work and dedication by many generous, knowledgeable and skilled people.

But Free Software can and must offer more, and more complete and refined solutions, to fully succeed and fulfill its role in enhancing human lives. Users all around the world should become empowered and enjoy states of flow with minimal interruptions. Lots of little frustrations add up; so do the little victories of successful use. Now think about that being multiplied by millions of users for better known software.

The 4 Software Freedoms are important and can be seen as basis for the best possible user experience, where they do become relevant. But the entire developer, contributor and user experience has to be taken care of. Particularly the freedom to change software has to be be amplified by lowering the barriers to actually doing so, to make a real difference.

Why should you care?

Why should you care about the user experience of others? Because, just like in any social setting and with any kind of common good, we will all be better off, the more people do care. You might feel the altruistic reward of doing something for others, not just yourself. Furthermore, this can be a huge challenge, a test of your intellect, endurance and all the skill you got. What are these good for, if not exercised to their fullest?

User Experience

It might sound like some marketing buzzword, but it stands for the insight, that it’s not a product or service as such, that really matters. What really matters is the experience that is being created. It depends on the specific user and the entire context. We are looking at a system, and some of the components happen to be human.

Because of individual differences and the wide range of possibilities regarding set and setting, generalisations are problematic. They are also necessary due to limited resources and many unknowns. Luckily, quite a bit can be said about a well defined group of people and their environment. Design for more than one individual has to be concerned with ranges, not single data-points, regarding characteristics and abilities.

Humans are emotional and often, on some level, irrational beings. Besides goals and results, there is also the process, the experience of using software, that counts. Destination vs journey. You may speak of the pragmatic and hedonistic qualities of software.

There’s a continuum with result-driven, usually work-related usage on one end, and playing games on the other. For the former, it’s all about effectiveness (being able to do something at all) and then efficiency (low resource use, usually time is most critical). Use of the software is not a goal in itself, in this case. For the latter, it’s all about the how, where the most efficient way may not be the most enjoyable (how this works out is a pretty big subject by itself). What may be loosely described as creativity software, will be somewhere in between. Tools and toys; the categorisation is fluid. Thus satisfaction depends on a different weighting of factors, depending on where a piece of software is seen on this continuum, by individual and case, but likely with clear general tendencies.

The role of design

I don’t want to just highlight the design aspect of creating software, fighting the misconception that design would be limited to making things pretty. I want to make clear that design and software development belong together. That one flows into the other. That no good designer in this realm can stay entirely ignorant of implementation issues, and that no competent programmer can stay out of design.

In the end, it’s all just more or less methodical problem solving. Doing your best to reach specific goals, creating artifacts that have a purpose. It’s just that the most visible aspect of design is concerned with aesthetics. But if done right, surface and guts are closely interrelated.

The current state of affairs

While some progress has been made thanks to tireless advocacy of Usability and Accessibility, there are still widespread misconceptions and questionable practices.

Design by software developers

It seems safe to assume that most Free Software is designed by developers. Not many people are both competent software developers and designers, especially at the same time. Not having the implementation in mind helps to get the UX perspective right. In this sense, it’s not about fixed identification with a vocation, but rather about roles people play in specific projects.

Even just a little insight into UX and design methods should allow developers to make better decisions and to see the value in working with specialists.

There should be a place that presents the most important and effective design knowledge and methods, tailored to developers. It might also work as a general point of entry into the field.

Loud users

User feedback can be great, but some are more loud than representative and paint their needs and assessments as those of a supposed majority. Clear project briefings and defined audiences can help users to choose based on there needs and preferences, allows them to ascertain in how far their feedback may matter to the project and helps project members to decide who and what to listen to.

Half-truths and misconceptions get thrown around. The truth (best current knowledge) should be presented loud and clear. People should feel a cultural expectation of better, more informed conduct.

Noisy discussions

There’s a tendency for every highly visible channel, list or forum to become very noisy, with discussion for the sake of discussion, non sequiturs and even outright flaming. A too high percentage of newcomers, and those persistently ignorant, not just leads to a waste of time, but can also drive away the very people with the desired skills who do or might get stuff done.

It’s no fun having to explain the basics of the field again and again. Especially it’s no fun to argue about what should be given. Everything can and sometimes should be challenged, but only if done in an informed fashion. A well defined and documented set of definitions and required knowledge as basis of discourse should help.

Situational barriers to entry should be as low as possible, but consciously erected barriers to entry can be necessary for certain results. I would consider to apply moderated membership using invitations or applications and questionnaires, reputation systems and comment moderation.

Requests don’t match resources

Inviting users to submit ideas and feature requests can lead to sensible concepts, especially if you encourage differentiation between problems and solutions like Ubuntu Brainstorm does. But in the end, it’s all just noise, if not met with attention, agreement, willingness, competency, time and effort leading to implementation. A better approach would have to include being conscious of these resources.

It should be avoided to fix symptoms, if root causes can be tackled. Building up the courage and ability to change parts of the stack, to work on the architecture should allow to fix issues on the lowest possible level, avoiding duplication and complications. Necessary cross-project cooperation should become more likely and involve less friction with shared planning, research and conception.

Investing work on best practices and infrastructure for the entire life cycle of software could increase the number of people who can and will fix issues.

Path of entry for designers

Designers who want to get involved, have to determine if the ambitions, insight and capabilities of the core developers match the scope of what they deem appropriate or necessary in changes. For fruitful cooperation, it may be necessary to first gain trust in small steps. Opportunities should be more obvious, not require that much research, up-front.

Designers have to rely on developers for implementation. Learning to program to the necessary level of skill may not be feasible. After all, time spent learning to code is time not spent designing and not spent making a living. However, strong frontend/backend separation, GUIs that are dynamic at runtime and authoring environments (perhaps inspired by Smalltalk and Flash) could lower that barrier significantly.

Assessment of competency

From the point of view of developers, it might be difficult to tell in how far (self proclaimed) designers know what they are doing. Some level of scepticism and verification can lead to improvements, as nobody is perfect. But questioning every single decision and detail causes too much friction, at least if done in an unstructured and isolated way.

What if there was a reputation system, designers vouching for the competency of colleagues? Developers recommending designers and designers recommending developers, teams and projects?
Be there or be square

Many design decisions are made on IRC channels, an arcane and scary place for those not initiated. Roadmaps are sometimes drawn on conferences or private meetings. This means you have to be there to make a difference. Further down the road, you get outcomes, but the reasoning stays invisible, as chat sessions will rarely be distilled into concise notes. This removes opportunities for corrections or learning from others.

Any mechanism that would shorten the distance between free-form discussion and concise documentation would be a boon.

Units of design

Textual content, say wiki entries or code, allows fine grained edits as contributions. While there can be small and highly local design issues of similar granularity, design tends to be so much about consistency and an overall strategy, that there seems to be not much room for small and isolated contributions.
Breaking up problems into sub-problems and tasks into sub-tasks can ease collaboration and allow more people to contribute at a lower cost per individual.
If the whole building of reasoning and decisions rooted in a central goal could be brought into a form that might resemble program code, even more opportunities for granular contributions might arise.

Broken chain

Specifications, if used at all, are turned into code manually, risking mistakes in the process. The act of implementing increases insight, but it’s unlikely a separate specification will be kept in sync with changes made at this stage. Runnable specifications would help.

You have to ask what’s wrong with GUI-builders like Glade, if there seems to be a need for separate tools for mockups? The wireframe look should be achievable by using a theme. If a widget layout can be created more efficiently elsewhere, something is wrong. Different expectations regarding precision should be answered by iterative addition of constraints, not by starting from scratch again.

The needs for creating fluid layouts and handling interaction are so similar between creating prototypes, demonstrations, interactive presentations and full-fledged applications, that it should be beneficial to handle all of them within a single approach.

Platform diversity

Increased interest in running applications in the browser and more device form factors and means of interaction in parallel all call for better abstraction between user interfaces and functionality, as far as possible. Software should be more modular and composable. Choice of a ribbon over a classic menu or a commandline should not require a new application from scratch. For every application where it makes sense at all, running it in a browser or locally should require minimal extra effort from developers.

Tackling these challenges will require cooperation between many people and projects. A shared vision, or even a related set of visions should help. Where approaches differ, underlying assumptions, weighting of various aspects, choices between benefits and drawbacks, should be articulated.

Strategy: design design and the software life-cycle

The state of affairs calls for designing the way design shall happen. Optimal results follow from optimal processes. Should you get there otherwise, it’s pure luck.

There should be a clear path from need or idea over design and implementation to distribution, maintenance and continuous improvement.

Much of current software is dominated by a bottom-up approach, with roots in times where hardware offered only a little fraction of today’s capabilities. Doing the best possible job of designing for user needs requires to take a top-down approach, to give proper weigh to human capabilities and limitations. But one also has to be wary of leaky abstractions and take care to stay well within the realm of the technically feasible. Where top-down and bottom-up don’t meet, you need to iterate.

We have code editors and development environments, bugs/feature trackers, Q+A sites … where are the design environments and trackers?

Design thinking and methods turned into infrastructure, with its use evangelised and made highly visible, can change minds and then culture. A few people can only do so much, but an evolved culture will move mountains.

Formal Methods

Just having a clear briefing for every noteworthy software project would be a big step forward. Formal design methods can lead to the following benefits:

• Avoid oversights and typical errors by working step-by-step and using checklists.
• Increase width and depth of ideation and conception by working methodically, including the use of patterns.
• Organize thought, (inter)action and assets to avoid extraneous effort.
• Have a basis for evaluation, rise above the unsubstantiated thumb up or down level.

The Underlying Goal

Improved software user experiences on a global scale. To get there, do:
Foster quality and quantity of open design efforts and outcomes.

Open design efforts: Design efforts that exhibit openness to the public, collaboration, meritocracy, sharing and permissive licensing.

Permissive Licenses: Licenses applicable to otherwise copyrighted works that at least allow free redistribution and may also allow use for any purpose, creating and distributing derivatives. Examples of permissive license are the GPL and the Creative Commons family (Non-Commercial and No-Derivatives variants are edge cases).

Not just executable Software

Several aspects of such infrastructure won’t have to be specific to designing executable software. Or, from another angle: handling visual and aural design will have to be part of it, anyway. Thus it can be useful for other cultural artifacts, as well. Promoting this should lead to a larger, more diverse and more creative community.

Mission

Create, deploy and maintain a website for managing open design processes and assets.

Where assets are any kind of content wrapped in files such as images, audio and video recordings or compound documents (text and images).

Vision

• A central hub that supports distributed development. Where design needs meet design competency and solutions.
• An open design agency, valuing cooperation over competition. Where few people can get much done. Avoiding redundancy.
• An open design university. A clear path into the field. Where everyone grows wiser.
• A design showcase. Get to see how it’s done. Learn from analysis and research of others, independent of implementations.
• A collection of career-furthering portfolios.

Risks and concerns

• As with most projects: failure to implement, to not reach critical mass …
• Creating bureaucracy.
• Duplicating functionality and ending up competing with VCS hosters like Github or aspects of Launchpad.

Early thoughts on architecture

I foresee a website where those with appropriate permissions can edit content immediately and collaboratively. Edits by anyone could be possible, but would only become public after approval (beware of workload and spam issues). All assets, including text, are versioned and can be branched.

I will investigate the use of git as a backend.

Design methods are baked into a set of pre-made project templates. Using a template might be equivalent to branching it, with the later option to stick to one version, or to follow updates.

Credits

Thanks for input, feedback and corrections to:
Kevin Godby
K. Vishnoo Charan Reddy
Troy James Sobotka
Sakari Bergen
Ivanka Majic
Mushon Zer-Aviv

The working title for this was Free Software Meta-Design, but then I thought I shouldn’t appear over-analytical right from start 😉

The Trouble with Explicit Loading and Saving

Much of today’s users experience with common software is still shaped by a bottom-up approach, starting from what has been possible within the constraints of hardware from long ago. It’s like most what we have resembles Assembler, C and C++, not Lisp, Smalltalk or Haskell.

Of course, some of the constraints are still there and won’t magically disappear because you take a bottom-down approach, starting from the user, not the hardware side.

Take the explicit loading and saving of Files. The reason for it is the lack of affordable memory that offers relatively high capacity, is fast enough to not be too much of a bottleneck, and that is persistent even without power. The usual workaround is using hard disc drives and RAM of rather limited capacity.

The need for loading and saving files, even when no removable media is involved, can’t be understood without this technical background. Actually, a naive user might not be aware or think of even the mere existence of a hard disc drive and RAM. It’s all just the computer. Without a sufficient mental model, no predictions can be made. Instead of confidence and flexibility, you will likely see clinging to rituals known to be safe, but that might contain unnecessary steps.

The split between a file on disc and a file in memory becomes interesting, if you open one file in several applications, or move or rename a file you have loaded somewhere. Instead of having one thing in one place with one current state, you get 2 or more things (or one thing with several states) in 2 or more places. If you want to rename a file you are currently working on (and exactly that work might be what leads to a better name), you either have to close, rename the file and load it again, or use Save As and later on remove the old version. Too complicated for a task that should be atomic.

Ideally files should just appear open. Progressive rendering, Caching and modularised applications where viewer components are loaded first, could help to approach the ideal.

Having to safe explicitly sucks. It’s not unreasonable, and I suspect common, for first-time computer users to expect changes to just persist, as that would be in line with real world experiences. If no revision control is involved, you might run into situations where you have to think about whether saving the current version might destroy a previous version you might want to keep. Saving shouldn’t be destructive.

Maybe one day we will have memory that combines all the desired characteristics, allowing real persistence and immediate access. Until then, it should be considered to mimic persistence without destroying data by automated commits to a revision system. Finding the right strategy regarding power consumption, noise and safety is tricky, of course. In the most simple case, such a system would permit you to just keep working, never interrupting your thought with repetitive management tasks like saving. More advanced use would include tagging states to return to them easily (resembling commits). Selected states could be collected in sets, resembling branches with a carefully crafted history, so they can be published. Thus instead of a hard break between simple use and the needs of software developers, there could be a progression.