I have a object that may have different state on certain time.

I need to create representation to edit this object, so user should be able to add event(new state), edit previous states, or change current state without adding new events.

Hope to find better representation than I came for now...

So what I have now is dialog with 4 collapsable panels :

  1. History, with list of past events (without last occured)
  2. Current State is a state with max date less then now
  3. Future events
  4. Add New (with some hot-actions)

History and Future events blocks have list with short representation of object (some icon, date and remove button).

This list items are collapsable, on click user will see edit form for each state

enter image description here

Disclaimer: Sorry for bad mockups, and for the bad way to use bootstrap ). but it's all I have so far.

Any help really appreciated.

  • Why do you think this representation isn't good enough? Dec 30 '16 at 13:52
  • 1
    @locationunknown, it's pretty big and not fairly obvious (as it seems to me), for example if I user want to add new event as a historical, the most bottom part is seems to be only for the future events, but even then if user adds future event it should appear for example between two already existed but again position of the "Add new event" block makes feel that this block is only for the "latest event". that's one of things that makes me feel not comfortable wiht "collapsable" approach
    – 2oppin
    Dec 30 '16 at 15:36

An idea, move the "Add New Event" button into each the History and Future boxes:


All items closed:

all closed

Open history, now have access to "Add New Historical Event" button:

open history

Click button to open Add panel:

add historical event

Same for Future panel:

add future event

  • that's a good idea, thank you, currently I thinking about adding something like checkbox "post as a new event" into the "current" section
    – 2oppin
    Dec 30 '16 at 18:47

I have two options for this case:

  1. Add + icon into each collapse panel header. User in here will exactly know which state they are likely to create a new event.

  2. hat's a good idea, thank you, currently I thinking about adding something like checkbox "post as a new event" into the "current" section

I think you should make a dropdown instead of using checkbox, when user click on the "Add New Event" they will see 3 states which are history, current and future, When they pick one of them then the "New Event" will appear at the state they have choosen.

  • I think there is no need in dropdown, since I have date-time input, but I can add a hint that will clarify that event will be added in future or in history. I think checkbox require less "clicks" than dropdown, and didn't require to analyze each value to perform action, so it's more efficient IMO
    – 2oppin
    Dec 31 '16 at 10:56

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.