Thursday, May 9, 2019

forms - Inline editing vs Edit view


I've seen this question asked a few times, but none that relate to my particular scenario. I'm working on a large, complex UI that involves many user types. For this screen, there are 4 types of users:


1) Those wanting to just "view" the details of a Fund.


2) Those wanting to edit only 2-3 fields.


3) Those wanting to edit "sections" (in this case, "Static Data").


4) Those wanting to edit many elements, thus wants to have the entire page be "editable" at once.


enter image description here



The attached is just a rough wireframe, but my feeling is that having an "Edit Profile" (top right), "Edit Static Data" (right, inside the box), and "Edit Inline" function is overkill. Is there a better way to achieve this without adding too much complexity?


My gut tells me I should definitely keep the global "Edit Profile" function, plus either the "Edit Section" OR "Edit Inline"... what are your thoughts?


Most of these pages are very, very long, and they have many fields and sections. The current UI has this entire screen in "edit mode" all the time (they're not all "form fields" either - there are Tables, large text areas, etc...). I find the whole page very distracting, especially for users who are simply "looking" at the data.


Another little wrench in all this: some users can be making changes to the same field/section/page at the same time. So I need to somehow account for that fact - not that we want that element to be "non-editable", but that we'll need to save the most current instances somehow, or indicate that "This is currently being edited by xxx".


Any suggestions or best practices? And what about "Saving"? Where would that fit in the picture when editing an entire page vs a section? Placed at the bottom and lost, or kept with the top icons, as it is currently?



Answer



I would recommend going with an approach like Facebook has i.e. section level edits. If you look at Facebook's design, If I click on Edit for a specific section only that section becomes editable and a person can edit what ever fields he wants and ignore the rest.


enter image description here


I strongly recommend against going for a inline edit for each and every field as that would greatly increase the clutter on the screen and can cause accidental clicks


With regards to the save functionality, I would recommend providing the save feature at two levels i.e at a section level as shown in the image above and also at a global level so that an user can quickly click and save the entire page as opposed to saving section by section.



With regards to the a person editing the same section, you could go with an approach as done by stack exchange to inform an user about an new answer being posted as he is typing a response.


enter image description here


No comments:

Post a Comment

technique - How credible is wikipedia?

I understand that this question relates more to wikipedia than it does writing but... If I was going to use wikipedia for a source for a res...