Working on UI and UX design is fun. It’s challenging and rewarding work, especially when you achieve success, and it adds fuel to the problem-solving fire within when you miss the mark.
The New Relic Design Team is constantly working hard to improve our user experience by finding simple, usable solutions for complex display issues. I’d like to describe our experiences with a project we shipped today – our newly designed time picker.
The Power of Feedback
Below you’ll see a couple of shots from our old time picker:
After it shipped, we started collecting and documenting usability issues. We found a few things that kept coming up:
“It’s too hard to switch from one timeframe to another. I have to click the time span I want and then click the ‘Make it so!’ button at the bottom.”
“Ending now looks too much like Ending in the past.”
“The layout is awkward.”
We implemented double-click functionality on the time spans, but found that it wasn’t enough because it wasn’t very discoverable. And since we aren’t satisfied with that kind of feedback, we knew we needed to go back to the drawing board and find a better solution.
These screenshots show the time picker we released today:
We fixed the layout issues by using a vertical arrangement of parts instead of using a horizontal split. The time span labels are clickable, and dragging the slider immediately triggers a time window change. For the Star Trek fans in the audience, we kept the ‘Make it so’ button for when you make your historical selection ‘just so.’
There’s also a new ‘Performance since the last deployment’ link. If you’re configured to record deployments, you’ll see this link at the very bottom. To get set up with this feature (which we rely on heavily ourselves), go to Your app > Events > Deployments.
We hope this new time picker is an improvement for you. But change is no guarantee of success. Tell us what you think of the new time picker in the comments below.