UX case study. Five lives of one single list

I'll tell you the story how I've been changing the design of one single page for 3 years. I've added problems to the users, found out some interesting facts about the audience and managed to get a smart solution.

The case is about a mailings overview interface in Convead marketing service – the project I'm working on.

Clients create different types of campaigns: automated, regular, scheduled. They launch, cancel, copy and organize them. The challenge was to make it easy, clear, minimize a number of errors and help desk calls.

At first there was a mailing list sorted by create date. When they grew in number it became difficult to navigate. Users asked for folders to sort out the mess.

I created folders. Honestly I stole design from MailChimp (the coolest email-service) and it turned out it was impossible to use the folders as they were. Unclear, bulky, complicated. We hadn't even released it to production.

I changed it to a classical design, like an oldy wordly Norton Commander. Now the folders were at the top of a mailing list. One could create them out of a pull down menu. Group operations were now available. For eg. a customer could select several folders and delete them at once.

Click on the folder– you enter it and see campaigns. To get back you should click on the icon at the top of the list.

After consulting with the team we came to conclusion that single level hierarchy is enough.

Issue 1. The chaos in folders was added to the chaos in mailings :) The clients didn't give them proper names. Most of the folders were named like "new folder 1", "new folder 2". They contained identical mailings "COPY COPY COPY New mailing 1".

Issue 2. It became more complicated to look for running campaigns. One had to enter folders each after each.

The clients asked for a switch control, we resisted. I myself forgot to turn off campaigns for a couple of times because I'd failed to see them. Hail Odin we'd made only one level.

The depth of the problem fell in place when I opened one of our large client's account and discovered dozens of folders and hundreds mailings. The problem didn't seem so deep in small accounts.

Issue 3. And my favourite failure – clients wrote to helpdesk and asked how to go back to the root folder. Our technical support team showed them the iсon. I wonder why it was so complicated.

And they poor things didn't get it because there were young. They had never laid eyes on Norton Commander. For them a folder with two dots - something like a punched card or a floppy disk – is a weird thing with an unknown purpose.

I replaced folder icon with an arrow and a visible title. Calls to our technical support stopped. However two other issues remained unsolved.

We came near to making a switch control, the clients had asked for – turn it on and see active mailings only, turn it off – and see folders.

It would have carried out the task "look through all the sent mailings", but wouldn't have been semantically consistent. The switch control is to switch one particular attribute back and forth, for eg. folder view / list view or all / active. In this case it's easy to read.

The idea to make two switch controls was brushed away at once. This would make the interface needlessly confusing.

And then we found the solution – to add virtual folders to the users' ones: "all mailings", "active", "drafts", "archive". And to move a folders list to the sidebar.

And everything clicked into place. A customer can create folders and organize them manually. And the main classification is carried out automatically – you can see all active, and also sort them by status.

And you don't need to go to a level up to move from a folder to a folder. The sidebar is always available.

A cherry on top – search and sorting. Now you can find a mailing without digging across 100500 folders. Moreover it's given a positive side effect – the clients started to give more reasonable titles to mailings :)

Finally it looks as it should be. Looking at it and wondering why we haven't made it all from the first attempt – it's as plain as the day. Ha-ha. It's the sign it's well done at last. One more sign – the clients stopped asking to make a switcher :)

By the way have you noticed an octopus in the folder title in the screenshot? I noticed it in a client's account. It's an emoji – you paste it in the folder or a tag title. It works in many web-interfaces. Useful to mark important things and just fun.

In reality not everything is ideal. Our sidebar scroll animation is not sexy enough, you can move a folder only one step up or down at a time. And the head of table should be freezed. The users don't complain, so we won't change it for now.

Probably we'll find a better solution but for now I'm satisfied with this piece of interface. There are no questions here and no calls to technical support. So I'll go and find something more tricky :)