1

I am trying to design a date picker for booking an appointment, and I think that, the most natural way of choosing a date is not by a calendar (showing full month) but by showing by week. Currently my design looks like this:

enter image description here

Which shows, weeks starting by monday to sunday, and a bar on top that says either this week, next week, past week, two weeks away from today, ...

Problem is, should the user know the month he is in or is knowing the week enough? I understand that if the user is trying to book an appointment next week or the other, showing the month won't be necessary, but what if he is trying to book an appointment eight weeks from today?

I thought of adding the month/months to the 'week' bar, like the picture below shows, or of giving the option of showing a calendar, but I think none of this would be the most intuitive user experience design. What should I do?

enter image description here

Thanks

EDIT:

Next week: enter image description here

Two weeks away: enter image description here

More details:

  • Arrows move a whole week

  • White date -> available, Gray date -> unavailable, Gold date -> currently selected

  • How does next week or 2 weeks away look like? Does using the arrow slide in an entire week or another day? – Ren Aug 1 at 10:16
  • @Ren The arrow slides an entire week. I edited to add how next week and 2 weeks away would look like. – Levon Aug 1 at 15:12
4

Your concerns are valid, I'll highly recommend including the month. Some reasons:

  • Users need just a brief moment of distraction to forget what they are thinking and as a industry rule it's better to avoid making them think and recheck unnecessarily.
  • There's not an easy way to deduce in what month we are based just on a day or its number.
  • To avoid the previous situations, I'd prefer makin it as explicit as possible

enter image description here

Others notes:

  • Maybe the calendar is not always an optimal solution but it's the most familiar one, if you are considering a new approach try to test it with several people and measure how much time they take to complete a task to see how it works in real life. I'd consider the week model only if most users make appointments in present week, otherwise I see no added real benefit.
  • It's better to arrange the hours in a vertical fashion to improve visual scanning and cohesive grouping.
  • I don't know your specific use-case but the selected services structure seems too repetitive, I think it'll be better to have 1 list of services and each service listed in there.

enter image description here

  • Thanks for answering! Your points make a lot of sense. One question: Since arrows slide weeks instead of days, should the arrows be located near the days or on the week bar? – Levon Aug 1 at 15:18
  • Switching weeks functionality, includes "switching to next day" functionality so I think the most important think is to make that functionality clear and visible. Also consider changing the arrows to an explicit "next week/ previous week" buttons. – Alejandro Veltri Aug 1 at 16:05
1

I like the clarity you show in the bottom picture, but that’s only my opinion...

All to easy for some users to make an error with months... lots of checks are written with the wrong month as it changes...

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Not the answer you're looking for? Browse other questions tagged or ask your own question.