5

I'm developing a system where users can set up a reminder to send to their contacts. They can have a number of custom defined date fields for the contacts. They need to enter an Operator (On/Before/After) a particular field (Anniversary/Birthday/etc) and optionally a quantity and unit of time if before or after are selected (4 Days/Weeks/Months).

It has been suggested that we do this by using a kind of sentence structure so that the user starts by seeing this:

mockup

download bmml source – Wireframes created with Balsamiq Mockups

If they then select Before or After in the first box it changes to this:

mockup

download bmml source

This feels wrong to me as it would involve the On/Before/After drop down shifting left or right when the users selects a particular option. I'd like to suggest a better solution but am struggling to think of one. Any ideas?

|improve this question
  • 1
    Have you tried adding the detailed settings beneath the on/before/after? This would mean that they can appear of disappear without moving the existing controls – Andrew Martin Nov 6 '15 at 17:11
  • Would be curious to know the rest of the layout/functionality associated with where this would be entered before suggesting better solutions. However I would share the opinion of not making your user backtrack in their contextual flow of left to right like that where you're presenting new inputs appearing before their active focus after they've chosen their conditional input. – Chris W. Nov 6 '15 at 17:16
  • It is part of a wizard type input of something quite complex about 8 steps, but aside from this there is a Start Date and End Date on the same step of the wizard. – Martin Brown Nov 6 '15 at 17:59
  • What is the default state? – Martyn Nov 9 '15 at 4:03
  • The default is currently: Send the reminder on the contact's Birthday. However I could change that, I could even add a 'Please select' option as well if needed. – Martin Brown Nov 9 '15 at 9:20
3

enter image description here

I would move it to below the original statement and paramaterize it.

Question 1 is on before or after. question 2 adds another form for the frequency. Do that below Then they can publish it or complete the item.

This also might be better for a responsive design vs making it horizontally bigger. I prefer to use more space down the page vs across it to help me aide transitions to mobile.

|improve this answer
1

The "on" vs the "before/after" does make it a bit tougher and even made me think about things like is the "after" really even an option? But, I messed with the idea of letting the user pick from between "sending on" vs "sending before/after" and once selected, the additional fields show up that would help fill out "the sentence."

If the user chose "send on"... enter image description here

And if the user clicked on the second option... enter image description here

I agree with others that we would probably want to see more of the screen too but something "like this" seems like it would work. I would think though you could default to one or the other to make it easier for them too.

In addition, here was a link to the prototype that works when clicked

|improve this answer
  • 'is the "after" really even an option?': The example I have given of a Reminder is not actually what we are doing, but I wanted to change the term to keep the question simple. In our case after is valid but still perhaps less likely than before or on. – Martin Brown Nov 12 '15 at 10:58
  • Ah I see. Yeah, was just trying to gain a better feel for prioritizing some of those options. If it was something seldom used, you could tuck it away into a "..." (more options link) or something and only surface on and before for now too. – Charles Nov 12 '15 at 16:04
0

The problem seems to be the difference in 'effect' from the words Before/After and On. If you remove 'On' from the dropdown it makes a bit more sense.

mockup

download bmml source – Wireframes created with Balsamiq Mockups

In this example checking the 'On' box will disable the '4' 'Days' and 'Before' selectors.

I'm aware this isn't ideal but it might help you in the right direction.

|improve this answer
0

How about something like this? (pardon my drawing skills):

enter image description here

Wouldn't it be more logical/ intuitive for the user to have one handle to select the offset, rather than some structure of three handles?

Could be a slider too, with a text at the right to indicate how many days/ weeks/ months before or after.

|improve this answer
  • 1
    In my experience, users will want more flexibility out of this kind of tool, as the OP suggests. – plainclothes Nov 10 '15 at 16:59
0

I'm currently considering making sending before/after a kind of advanced feature that would be in a expandable box (see below). Initially the values in the box would be hidden and set to 0 days before. Then if the user clicks on the Offset button the box would expand down to allow the user to see the offset option.

mockup

download bmml source – Wireframes created with Balsamiq Mockups

|improve this answer

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.