Case Study: Custom Date Picker
Problem: Existing date picker is limited and doesn't allow the ability to quickly select relative dates or enter an absolute date.
Solution: Create a custom date picker that allows users to select or enter an absolute date or select a relative date from a list of pre-selected date ranges.
Concepts
I went through a few different concepts and after running the concepts by some SME's and internal stakeholders I landed on a design that we could do some user testing with.
After finalizing a promising design, I created a specific prototype to gather feedback from end-users.
I quickly learned to adjust my designs after the first session. Initially, I showed the full UI, but participants were distracted by other elements. For subsequent sessions, I cropped the designs to focus solely on the calendar picker as shown in the screens below.
User Testing
I conducted user testing to validate the new custom date picker's design and gather user feedback.
Below is the script I used for conducting the interviews. Using a script ensures that you ask each participant the same questions which in return helps to see patterns in your participants feedback.
Key Takeaways
Overall the custom calendar picker was well received by the users. A few highlights of the feedback I received were:
They liked the ability to change the day forward or back using the buttons to the left and right hand side of the date picker.
They felt like this feature would probably be used quite a bit.
One user said it would be great if the picker automatically selected the current day when you first log-in to Bastion.
Users liked the preset relative date ranges they could select from on the right hand side.
One user suggested adding the Julian date next to the preset relative ranges i.e. 1 day ago - tomorrow (134 - 136)
They would still like to be able to input their own date range like you currently have the ability to do.
Some quotes pulled from the user testing:
"It looks pretty self-explanatory, I think the team will be happy with this"
"Very intuitive"
"Looks great"
"Straight forward"
"I like it more than what we currently have"