Twitter Facebook Dribbble

Archive for July, 2018

Brand x Product

Right now I’m working on a couple of design challenges for Tiller that sit right in the center of Brand and Product. I want to share some of the work-in-progress stuff because I think it’s an important and difficult part of any good product.

I’m exploring some solutions to the user onboarding flow and also some empty states, but I’m just going to focus on one specific empty state.


Quick Background

Tiller is a product that uses a combination of dedicated hardware and a macOS and Windows app to help people record what they do with their time. The main interface is a scrollable list of things you want to record time for (clients, projects etc.) that appears on your screen when you touch our device. It currently looks like this:


The Problem

The list is designed so that the item that is in the center of the screen is the thing you can ‘select’ to record time against. When a customer opens their list for the first time, there is this blank empty white area at the top because we put the top  item in the center.

In a couple of recent user interviews, some people asked if this area was meant to be blank and suggested we could use that space to communicate something to the customer or add some more valuable info.

This isn’t technically an empty or loading state, but I do find myself agreeing with these people that it does seem like an opporunity to add something to the product. It at least feels like something worth exploring.

Trying to understand what could go in that space and how it would be styled and presented is also thought experiemnt.


Brand x Product

Over the last few years working on Tiller and various client products, we regularly run into questions like, which colours should we use, what style of photos, which typefaces and what should the tone of the copy be?

These are not really product or architectual or structual questions, they are about how a product will feel and less about how a product will actually work.

The best product teams nwo days pay very close attention to both.

I would say that our teams DNA is certinaly more in the ‘how something works’ camp than it is in the ‘how something feels’, but I also think we have a huge amount of respeect for that part of the product creation process.


Tiller – Works vs. Feels

At it’s core, Tiller is very much about improving how something works. A lot of the value in the product comes from reducing the number of interactions it takes to complete a specific task (recording your time). By design, it’s as fast and frictionless as possible.

But, we also have a vision for how we think Tiller should feel. What Tiller’s point of view is about the role it plays in a customers life. This is still something that is growing, evolving and being refined, but the pulse is well and truly there.


Product Feels

I’m by no means a branding expert, but I do believe that a companies brand should be routed in what it does and does not beleive in.

When I started tackling the problem earlier tonight I wrote down the following bits about what I think we (and Tiller) believe:

  • Doing one thing well is good and important
  • Time passes and that is okay
  • People want to measure time for various reasons
  • Good work takes time
  • We don’t want you to feel pressured or stressed about recording your time
  • We exisit to make something that is difficult easy and maybe even fun
  • You should set your own pace
  • Always on is a turn off
  • Some information is better than none
  • Slower is sometimes faster
  • Notifications are distractions disguised as work
  • Switching is expensive
  • New things can be beautiful, but they wont be by default

I’ve just ended up adding a bunch to my origional list. It’s not perfect, but I think there is a tone in there that can be used to help set up the thinking for what could go in that space in the timer list (assuming we do end up putting anything in there).


Technical Considerations

Below I’m going to share some visual exploration that I went through while trying to define what we would put in the empty space in the list.

It’s important to note though that while I was exploring different options I was also considering a couple of implementation and usage considerations that did have an impact on what I ended up inclduing.

  1. Frequency of use – We know that some people switch between many timers through out a day. Therefore, this particular screen is something that people could be seeing 10+ times per day. So whatever we put in there probably needs to not be too static. It might need to be updated each day so that it doesn’t become boring and loose it’s impact.
  2. Source of Content – While this could be an important part of the product, it is by no means our key differentiator. If we want to use an illustration there, we can’t justify paying someone to draw a new image every day. Whatever the outcome, it needs to be scalabe and viable.
  3. Speed and Load Times – Some of the ideas I explored involved using images which I do think ended up looking pretty interesting. One concern though is how using them would impact the time it would take to bring the UI up compared to if we went with a typographic option.


Visual Exploration

[insert context on this]

Tiller Onboarding Video Script: V1

We’re working on the design for the on-boarding of Tiller.

It’s difficult becasue Tiller is a new interface for time entry and our app works differently to how people understand apps to work.

We’re tried somewhat unsucseffuly to addresse this using a guided onboarding and we’re now going to try and make a short video to explain how to use Tiller and also how the app works and where it lives.

This is my first (messy) pass at a the script which we will film later today.

Update: The scribble above turned into the script below which we are going to turn into cards/video tomorrow morning for user interviews in the afternoon.


Friday Update: We didn’t end up filming and editing a video, but we did use the script above as the basis for a series of slides we made in Google Slides a few hours before we interviewed people today.

Below are those slides. They certinaly helped people understand ‘where’ TillerĀ  lives on your computer (the tray), but there are still issues understanding the interaction model we have created and confusion about using Tiller vesus using a mouse.

There are going to have to be more refinements over the next two weeks.