Claris, the blog

Claris main page is the Dashboard. Here you will see a list of all the project stories, in two panels: on the left, the stories expected to finish in the current sprint, and on the right, the stories that are planned for future sprints (or, in other words, stories in the Product Backlog).

The catch is that you will be able to organize your stories by dragging and dropping from the Product Backlog panel to the Current Sprint panel and vice versa. No page refreshes, no new pages, no filling complicated forms, no nothing.

So, how can we improve the display of each story? How can we “hint” the user that they can be dragged and sorted? Here’s an early mockup of each story:

At first, we thought that the icon in the right could indicate that the story can be dragged. But it’s so tiny… and it doesn’t actually look like a button… that it doesn’t seem very promising. Fortunately we have two well known concepts in Interface Design that we could get our hands on: first is Affordance and the second is the Fitt’s law.

Affordance is the quality of an object that suggests how it should be used. In the real world we have hints everywhere, for example, a door grip that suggests that it can be pushed or pulled. In software, affordance is used prominently. Have a look at the screenshot below: there’s no doubt that these icons are meant to be pressed, because they look as real world buttons.

The Fitt’s law theory is more complex. It basically says that the time required to move to an area is a function of the distance and the size of that area. In other words: If your button is too tiny, users will have trouble to click it. Applied in our application: users will need a big icon/area so they can drag each story naturally and without problems.

Here’s a screenshot of a new story, taken directly from the web application:

By adding a block in the top of each story, i.e. a story header, we add dimension and affordance. And by removing the tiny grip icon, and letting users sort stories by dragging from the story header, we implement the Fitt’s law in a simple, elegant way. Can you spot it? You are also accustomed to move your windows by clicking and dragging from the window title… and that’s what we call a pattern in User Interface.

But we will talk about patterns in a next entry. What do you think about this iteration?

At Claris we think that sharing some of the development process can help you see who’s behind the code you’ll be trusting your app development and management.

Today I’m sharing a screenshot of my development machine.

We have come a long long way since our first public appearance with Claris in 2009.

Even if time was scarce and never enough to implement the ideas we had, we iterated our original concept many many times during the last year trying to bring the easiest possible solution to this huge problem that is managing development teams.  As we are approaching our first open beta I have the feeling we’ve nailed some very big issues here.

Today I’m going to talk you about “Stories creation”, the Claris way.

In Claris stories are assigned to one person and can have as many tags as needed. Where is the magic? You don’t need to create people or tags beforehand, you just write “The magic function must be rewritten @pablius #important #interface #beta” And there you go, Magic!, if the user or any of the tags are not available, Claris will create them for you.

After that you can browse stories by tag, by user, by sprint…  you name it.

If you are interested on being first-on-list to try out Claris, remember to register at www.clarisapp.com.

And in the meantime I’ll be back with some more “Magic – the Claris way” really soon.

Cheers!

Welcome to the blog of Claris! Yes, finally we’ve got a blog!

We can name an endless list of reasons of why we didn’t blog before. Cutting the chase and being honest: because we stopped the project for a couple of months till our work flow could be manageable enough. Claris is a side project, and because of that we can’t dedicate 100% of our time yet.

In this blog you will find insights on programming, server architecture, interaction design, typography, and well, all things related. I believe a lot of you will be interested in the backend of how this thing is built as it takes shape.

So here’s for a fresh reboot. Hope you like this blog. Don’t forget to stay updated by subscribing to the RSS Feed, or by following us on Twitter.