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 😉

Migration

Northern hemisphere summer 2017:

Ada walks into an electronics store to buy a new, larger pad, as she earned more than enough credits with her free-software contributions, recently. Instead of giving the old pad into a reuse-or-recycle program, she just handed it down to her little brother. Of course only after cleaning it of all her data and customizations with a single command (and a confirmation). The system automatically made sure there was a complete backup on her personal virtual server, first.

All the available devices, be it pads, laptops or wearables, have one thing in common: they come with a pre-installed system, but one that supports a common standard for installing an operating system environment of your choice. Or several in parallel. Ada chooses a pad to her liking and pays electronically, using a scheme that involves a one-time proxy account. This minimizes the information that the shop and her bank gain.

The new pad is ready for action on the push of a button. Plugging in here little key card—she tends to wear like jewelry—allows Ada to establish a secure connection to her server, despite using wireless.

2 touches later, her preferred system gets installed by pulling the base from the next public server and applying a patch-set that represents the changes she made while using the old pad. Differences in hardware are accounted for automatically, by use of a number of profiles and device-categories. She tests the configuration with an obscene gesture bound to a custom command … alright!

Both the software modules and her documents she accesses on the go are kept on the server and cached on the pad, though she can manage what is kept where and synced when in as much detail as she wants to. Downloading and installing has become just using it (almost) immediately. Ada recalls vague memories of how laborious migrating data and settings and keeping things in sync used to be and smiles 🙂

Towards a LibreOffice Briefing

This has to be discussed inside the project of course, but perhaps my audience can help with some input 🙂

Ideally all design and development activities should be based on a briefing, a mission statement with the overarching goal of the project. It’s important to know what you are actually trying to do. Especially in a collaborative project.

While I think I have a reasonable clear picture of the desirable characteristics of a font already (more work to follow), the larger visual design effort needs a strategy, a message, based on the mission.

So what is the most minimal core of a missions statement, what is the essence, the high level goal just a bit more specific than make the world a better place? 😉

A first, rough proposal for a Mission Statement

Develop an office productivity solution and make it and the project itself available to and accessible by a majority of humans.

It follows:

• Internationalization
• Given our modern world, there needs to be software
• Free Software
• All major platforms
• Interoperability
  • Open, documented interfaces
  • Open, documented file formats
  • Compatibility with other solutions
• Collaboration
  • Meritocracy (there needs to be some hurdle for contributing and based on ability*effort is best, if you care about the result)

Notes

I would usually encourage defining an audience as narrow as possible, but it seems the widest possible scope is actually defining for this project. If not, please step forward with definitions of a narrower audience.

The statement is phrased in a way that opens the door for education and non-software bound approaches.

The word develop shall imply optimizing the process and outcome. Best
possible or optimal would just bloat the statement, as it’s clear that you don’t want an just-acceptable solution. However, it’s not clear what optimal or best possible really means in the end.

But what is an office productivity solution or an office (software)
suite, actually? How do you define the scope here, short of enumerating the current components? How do you include enough, but not too much?

You could say: the solution must cover:

• text documents with embedded graphics, from letters to books
• presentations, including animations, embedded sound and video
• doing Calculations, including in a tabular fashion (spreadsheet)
• managing interlinked data and doing queries (relational database)

Long term, both spreadsheets and relational database might be too specific, as they don’t define the actual needs and goals being
addressed. Seeing spreadsheets and relational database as solutions, can you define the problems they solve succinctly?

How to rule out (given we really have/want to):

• (full-featured) audio and video editing?
• advanced animation features (think Flash, Synfig)?
• advanced scientific and engineering needs regarding calculations, including simulations?

Audience

Not many people who can or could use a computer at all can be excluded from the wider audience. The strategy and visual design doesn’t have to try to address everyone, but should rather focus on where it can make a difference.

It is important to note that what LibreOffice has to offer is or should be  interesting to all kinds of organisations, including companies of any size and government agencies. Reliability, continuity and support solutions  are important, here. Think of the impression you want to make and translate it into visual design.

Design Center

Or should it be Design Centr to be both hip and US/UK neutral?

There has been talk on the ubuntu-art mailing list about creating a replacement to our wiki section for submitting artwork. To lower the barrier and for making it more manageable. Tracking request for artwork has also been brought up.

There’s the DesignHub project, thought up by Máirín Duffy of Fedora.

SpreadUbuntu could be suitable, though it’s positioned a bit different.

There should be good reasons, if you start yet another project, instead of joining or building on existing ones. But before you join or build on existing projects, you should think hard about whether they are or can become what you really want or need.

I have been thinking about what the underlying goal should be:
Foster quality and quantity of design efforts and outcomes in the Free Software and Open-Source realm.
or perhaps:
Foster quality and quantity of open design efforts and outcomes. Open design efforts shall mean ones that favor collaboration, meritocracy, sharing and permissive licensing.

If there’s going to be a project to build not-that-trivial infrastructure, I think it shouldn’t be tied to Ubuntu.

How could one go about reaching that goal?

• Offer a place to go for open design projects
• Increase the visibility of design efforts, outcomes and participants
• Make design more enjoyable, make it happen easier and faster
  • remove technical hurdles
  • shape social interactions in a positive manner
  • encourage feedback. silence hurts
• encourage constructive criticism, discourage unspecific and unfounded criticism
• encourage participators to pay attention to constructive criticism
• avoid and protect against flaming, trolling and vandalism
• apply automation
• assist in managing various aspects of design projects
• Offer guidance and education to enable more, and more capable, participators
• take care of deployment/packaging/distribution

Proposal for the concrete part of the briefing:

Create, deploy and maintain a website for managing design processes and assets.
Where assets are any kind of content wrapped in files such as images, audio and video recordings or compound (text and images) documents.

Inkscape Tiled Clones

Inkscape has this dialog hidden in Edit -> Clone -> Create Tiled Clones…:

It has been brought up on the Inkscape-devel list and I decided to have a closer look.

Inkscape defaults to shifting the clones by 100% width of the selected object for columns and 100% height for rows. So the parameters on the Shift page are actually about the deviation from that, but the interface doesn’t make that clear at all.

Shift and Scale only take %, but should allow absolute values with a unit of the user’s choice.

Rows, columns wouldn’t make sense for radial arrangements that should also be possible.

Width, height: it could be made clearer that this option will fill the specified area and in what directions (original defines top left).

Use saved size and position of the tile checkbox: what is the use case for this option?
The tool-tip shows that this needs a lot of explanation: “Pretend that the size and position of the tile are the same as the last time you tiled it (if any), instead of using the current size”.

The Exponent parameter on the Shift and Scale pages depends on the tool-tip to explain that it defines whether rows will be spaced evenly (1), converge (1).

Trace page: Well, non of my tests produced anything sensible or useful.

The Symmetry page only contains a pop-up list (what GTK+ erroneously calls a combo box) full of mysterious items:

These are the 17 wallpaper groups, all possible tilings with translational symmetry. I don’t think knowledge of these should be expected. At the very least, the term wallpaper groups should be mentioned. Even once you know what this is about, the descriptions might not help you much with recalling the patterns or with predicting the outcome based on the selected object.

The Wikipedia article includes diagrams, but I didn’t find them to help much. A page of Inkscape: Guide to a Vector Drawing Program is much better. There are 11 groups based on rectangles (2 of them can be parallelograms), 1 on right-angled rectangles (rectangles cut apart diagonally) and 5 on hexagon subdivisions.

Here’s an attempt at creating the most simple schematics, leaving out points of rotation and mirror axes to just depict orientation. The place taken by the selected object is darkened:

These could be added to the descriptions given now.

Process/Infrastructure/Stack Dream

I think I have a reasonable understanding of how things got to where they are regarding software on local systems vs web applications. Same for the way FLOSS projects are run, what related online services do and don’t do and how GUIs are designed. But if you forget history and inertia for a moment and just look at what is there, what has been shown to be perfectly possible in principle, you might start to wonder how a better process, better infrastructure, a better software stack, could look like.

Design process online service

Imagine an online service for software projects. Where you can create a project, using one of a number of templates for various needs. The service might guide you through an iterative process, perhaps with briefing, research, requirements gathering, conception, implementation and evaluation stages. You start with a mission statement to capture the essence of the project. The service offers explanation on how to best go about this, just like it does for every piece of writing inside the template structure. You can also quickly compare with the mission statements of other projects right there.

You can create, edit and manage mind-maps, a hierarchy of goals, personas, use cases or the simpler user stories, requirements, flow-charts, and mockups.

As project owner, you can invite others and grant read and write permissions. There’s real-time collaborative editing similar to Etherpad. No blocking or edit conflicts, although you can branch and merge parts of your documentation if you want to.

Is there a FLOSS framework that would make it straightforward to implement such Etherpad-like functionality?

Flowcharts can be linked with mockups to deal with structure on 2 levels without break. Mockups can be made somewhat interactive, with working tabs and menus.

You do not have to rebuild the same layout in another tool or via code, because the step from mockup to actual layout is taken by simply switching away from the wireframe theme.

GUI-builder

Thinking a bit more about this mockup/GUI-creator, it should be a bit like the Flash authoring tool. Rich support for vector and bitmap graphics. Ability to define interactive areas as such. Animation. Scripting.

But different from Flash as I got to know it, there should be a layer between logic and rendering to realise theming. A separation between the What and How of drawing. All widgets should be reusable components created in the same way, to be rendered on a shared canvas. A canvas that might fill your screen, controlled by local software, or one in a browser window. A single toolkit for the desktop and the web, where a canvas is not a special widget, but the base.

Related:

• Separation of GUI and Application Status (theme-independent screenshots)
• Event to Action mapping (system-wide handling of shortcuts and other gestures)