Jestersix

DBTC UI question for anyone who can spare a minute

neuro

Webmaster
Can you guys tell me which one you would prefer?

Situation: You're going into the thread to add additional people who you donated a frag to. You see a tree that shows the relationship between everyone who's ever received or given a frag. How would you like to add to this tree?

Option 1:
- Under any person, you click on a button and it gives you an entry right there under that person. You can click on "add entry" button to give you another line, right under the current entry, to enter the next person.
- Sample picture is attached, the formatting is all goofy for now.

Option 2:
- You get a specific area under the entire tree to enter each person you've given a frag to.
- To get additional entries, you click on an "add entry" button to give you another line to enter the information.
- No image given. Just look at the image I attached, and assume none of the "+receiver" or "Text #" entries exist. Also imagine an area under all of that where you get to enter something.

I'm at the stage where either design choices involves a specific path to get things working. I'm asking this question to save me from doing any needless work.

Personally, I would prefer Option 2. It's much easier for someone to understand wtf is going on without screwing with the tree display. Stretching out the tree as seen in Option 1 may or may not confuse people.

If you have any other suggestions or questions, let me know. Now is the time to say something, since changing these entry formats is easier to do now, than it is to do later.
 

Attachments

  • screencap.jpg
    screencap.jpg
    113.1 KB · Views: 328
The tree with inline edits is not a bad idea...

In option 2, since there's no context, when you click "add entry" where in the tree does it add?
 
The tree with inline edits is not a bad idea...

In option 2, since there's no context, when you click "add entry" where in the tree does it add?

It doesn't add to the tree itself, but there would be additional spaces like this in a separate area at the bottom of a tree (if you can imagine with me):

[Add-to-the-chain button]
1. [donater (which would be you as default)] [receiver] [date] [current status]
2. [donater] [receiver] [date] [current status]
3 ... <add more by hitting the "Add-to-the-chain button">

You would then submit the new changes, and the tree would get updated.

You would still be able to update the tree you see. Like if there was a status change to the frag, or someone messed up on the date, or even if we needed to change the name of the people involved. You should eventually be able to delete a person also, provided I figure out a non-destructive way of doing this.

It's just that new people would be added in the new area I mentioned above.

After looking at how I wanted to represent the tree, it became apparent that it was going to be hard to fit new additions to the tree directly without compromising on design, ease of use, and having enough space for any new areas to input information. You can see already that regardless of where I put the new in-line areas, it's starting to really take up space.
 
Makes sense. I assume to make edits, you click on the node & form below populates the info to edit & save?

Permission-wise:
  • You should only be able to add child-nodes if someone else (donator) added you as a "receiver"?
  • For deleting I think you should be able to delete a node only if you added it and it doesn't have any child-nodes?
A nice-to-have wold be if other paid members could add themselves to a list/queue called "requests"

If you were to go really modern & future thinking, something like this Horizontal Tree jQuery plugin would be very cool. Check out the Live Demo :)

Also now that its being re-built, I'd put some thought on mobile/touch compatibility since thats going to be the future (the above plugin is very responsive).
 
Makes sense. I assume to make edits, you click on the node & form below populates the info to edit & save?

Permission-wise:
  • You should only be able to add child-nodes if someone else (donator) added you as a "receiver"?
  • For deleting I think you should be able to delete a node only if you added it and it doesn't have any child-nodes?
A nice-to-have wold be if other paid members could add themselves to a list/queue called "requests"

If you were to go really modern & future thinking, something like this Horizontal Tree jQuery plugin would be very cool. Check out the Live Demo :)

Also now that its being re-built, I'd put some thought on mobile/touch compatibility since thats going to be the future (the above plugin is very responsive).


I wish i found that tree earlier! I was doing a search and didn't find much. That's great, thanks for the link!!! Wondering if BAR BOD will compensate me $8 for the plugin ...

Thinking about it, I'm not sure how easy it is to incorporate the horizontal tree, in terms of space. The information needed at each node, would take up take up a lot of space to fit into the area at the top of a thread. I also don't know how easy it is to setup forms with this plugin. Like, if we enter in a new child node, where does that info go?

But I'm open to trying it out! Thanks @Navdeep I may pick this up.

For your questions:
- To make edits, you simply click on the node on the tree with the info you want to change.
- Anyone should be able to edit the tree, assuming they are a supporting member. There is a level of trust here... and hopefully I can build in a log to track changes incase someone decides to be an asshole.
- Yes, deleting a node is only allowed if it is a child node. Deleting a whole branch would really put things into a shitty pickle.
 
  • Like
Reactions: Nav
I wish i found that tree earlier! I was doing a search and didn't find much. That's great, thanks for the link!!! Wondering if BAR BOD will compensate me $8 for the plugin ...

Thinking about it, I'm not sure how easy it is to incorporate the horizontal tree, in terms of space. The information needed at each node, would take up take up a lot of space to fit into the area at the top of a thread. I also don't know how easy it is to setup forms with this plugin. Like, if we enter in a new child node, where does that info go?

But I'm open to trying it out! Thanks @Navdeep I may pick this up.

For your questions:
- To make edits, you simply click on the node on the tree with the info you want to change.
- Anyone should be able to edit the tree, assuming they are a supporting member. There is a level of trust here... and hopefully I can build in a log to track changes incase someone decides to be an asshole.
- Yes, deleting a node is only allowed if it is a child node. Deleting a whole branch would really put things into a shitty pickle.
Yeah, whatever costs are incurred for the site, it'll be covered by the club. Just have to shoot a PC to @mray2660.

Option #2 seems to make the most sense... the less there is, the better since not everyone is very tech savvy. :)

Any AJAX we can incorporate would be ideal but isn't necessarily a deal breaker IMO. However, I'd say we just need minimum viable product (MVP) and then we can iterate on additional features as necessary. Of course, that'll be dependent on how much free time you can donate; not all features can be fulfilled. :)
 
Yeah, whatever costs are incurred for the site, it'll be covered by the club. Just have to shoot a PC to @mray2660.

Option #2 seems to make the most sense... the less there is, the better since not everyone is very tech savvy. :)

Any AJAX we can incorporate would be ideal but isn't necessarily a deal breaker IMO. However, I'd say we just need minimum viable product (MVP) and then we can iterate on additional features as necessary. Of course, that'll be dependent on how much free time you can donate; not all features can be fulfilled. :)

yeah, it's just that if i can get opinions now about the major crux of the MVP, then it would go a long way to avoid me wasting needless time.

I looked into the plugin, and he did build some database/php/ajax/jquery into the mix. The tree he built can solve a lot of design and back end issues. I would hope that there is more documentation, but won't really know until I buy and download it.
 
Back
Top