All posts by Kerika

UI tweaks: avoiding errors in the right-click menu

Agile & Scrum, Usability, , ,

Building a great user experience is rarely the result of big, bold actions: more often it is the cumulative gain of a large number of very small tweaks we make to our user interface design.

Here’s an example: the right-click menu, when you click on a card on a Task Board or Scrum Board, used to look like this…

Old right click menu
Old right click menu

This menu is a little crowded, and one irritating source of errors was that people would sometimes click on one of the Move choices (Move to Done, Move to Trash or Move to Backlog) when they intended to do click on one of the others choices instead.

The irritation came from the fact that these Move operations had a much bigger impact than the others: for example, if you accidentally cut a card, you can reverse that operation by selecting the cut cards once more, which would effectively “undo” the cut.

But, if you move a card to Trash or Backlog, it was a lot more hassle to get it back: you had to make sure the Trash or Backlog was currently being displayed — and in many large boards these columns are routinely hidden from view by the user — and then find and drag that card back to where it was.

So, here’s our small UI tweak to reduce the chances of this error:

Right-click menu has new styling
Right-click menu has new styling

A simple visual cue, in the form of grey horizontal separator lines, helps remind the user that some of these right-click mouse operations are “more significant” than others, by creating a visual segregation of these options from others.

A simple UI tweak that helps reduce errors by our users, and one that adds up to a great user experience!

 

Making sure all Project Leaders are equally empowered

Usability,

On any Kerika Task Board, Scrum Board or Whiteboard, you can have as many Project Leaders as you like.

(Normally, teams prefer to have just a single Project Leader, but sometimes it is helpful and appropriate to designate more than one person as Project Leader; among other things it provides redundancy, so that the single Project Leader doesn’t become a bottleneck for handling requests.)

Just how active a Project Leader is depends upon the dynamics of the team: in some teams the Project Leader is just an administrative role, filled by someone who is like a Team Member in every other respect in terms of how much work she takes on, while in other teams the role may be more formal.

It turned out there was a bug in how Kerika handled notifications and requests when there were several Project Leaders on a single board: these notifications and requests were getting routed to just one Project Leader instead of all of them, so there was still a potential for having a bottleneck.

With our latest release we have fixed that problem: now, all notifications and requests get routed to all Project Leaders, so any of them could act upon it. This should remove the bottleneck!

Redesigning the Whiteboard Toolbar

Usability,

We did an update to the toolbar shown on Whiteboards (and canvases attached to cards on Task Boards and Scrum Boards), and while that modernized the look of the toolbar — and removed some usability problems with the old design — in retrospect it didn’t do a good enough job of simplifying the interface :-(

Current Canvas Toolbar
Current Canvas Toolbar

The problem with this design was that it mixed together two different functions:

  • Providing drawing function, e.g. drawing a rectangle on the canvas.
  • Providing context-specific functions, e.g. linking an image to an external URL.

To improve this design, we are reverting to a very old style: having the drawing buttons appear on the left side of the Kerika canvas:

New Canvas Toolbar
New Canvas Toolbar

Now, all the functions that put content on the canvas: shapes, lines, files, Web content, etc. are shown on the left edge of the canvas, and the context-specific items — e.g. changing the color of a selected shape on the canvas — are shown on the top.

Using a left-edge toolbar goes back to the very first version of Kerika, although back then we had rather embarrassing styling :-)

Box restores our Box Notes hack :-)

Technology

Our last blog post noted that a very useful Box Notes hack had gone away, following an unexpected update to the Box platform a couple of weeks ago.

We asked Box if they could consider adding something to their API that would allow us to restore this functionality, and their response has been very helpful and very fast!

Here’s how fast they responded:

  • July 15, we enter a support request at 6PM.
  • The next morning, Box Support put us in touch with Jon Berger, the Product Manager for Box Notes.
  • The same day, Jon talks to his dev team and commits to providing us with a fix.
  • Less than a week later, the fix is in production!

Very nice.

Deleting canvases attached to cards

Agile & Scrum, Technology, Usability, , , ,

You can attach as many canvases as you like to cards on Task Boards or Scrum Boards, and if you don’t need them anymore, you can delete the canvases.

Here’s how you add a canvas to a card:

Adding a canvas to a card
Adding a canvas to a card

By default, the new canvas is simply called “Canvas”, but like with any other attachments on a card, you can easily rename it by clicking on the pencil icon that appears to the right when you hover your mouse over it:

Renaming a canvas
Renaming a canvas

Clicking on the “x” button at the far end will let you delete a canvas that you no longer need:

Deleting a canvas
Deleting a canvas

If the canvas is empty — which means that there is nothing visible on the canvas, and nothing in the canvas’ Trash either — you see a simple confirmation message asking if you are sure you want to delete it:

Deleting an empty canvas (confirmation)
Deleting an empty canvas (confirmation)

But, if the canvas is not empty, you see a Restore option instead:

Restoring a deleted canvas
Restoring a deleted canvas

If it seems puzzling why a canvas that appears empty isn’t really empty, make sure you open the canvas and take a look at the Trash: there may be items there that you had previously removed from the canvas:

A canvas that looks empty but isn't
A canvas that looks empty but isn’t

In this example, above, the canvas looks empty but isn’t really: there are items in the Trash.

In situations like this, Kerika is careful to avoid losing all your work: until you empty the Trash on a canvas, the canvas isn’t considered to be truly empty, and until a canvas is truly empty, it cannot be removed from a card.

So, in this example, you see the Restore option rather than the Delete option:

Restoring a deleted canvas
Restoring a deleted canvas

How “Sort by Status” works

Agile & Scrum, Kanban & Lean, ,

When working with Task Boards and Scrum Boards, you get a variety of options for quickly sorting a column of cards:

Sort options
Sort options

Sort by Date is easy enough to understand, but what about sort by status?

Sort by Status organizes the cards in a column as follow:

  • Critical
  • Is blocked
  • Needs rework
  • Needs review
  • In progress
  • Normal
  • On hold

This sort order reflects the normal priorities of most projects: the most important stuff would ideally show up at the top of the column to get dealt with first.