User Experience Stack Exchange is a question and answer site for user experience researchers and experts. It only takes a minute to sign up.
Sign up to join this community
This is a very simple example, but say I have a page where the user can add pets and edit or remove existing pets. At the moment I can't decide if I should use one page from creating and managing the pets (example 1) or split the pages up so I have one for creating a new one and one for managing the existing pets (example 2).
Which is better for user usability?
Edit: There are also list of values, and date pickers in the form that are not on the simple example
If you have only 3 textfield for each pet, it is not necessary to create a brand new page; An editable list will do the job, but keep it simple :)
download bmml source – Wireframes created with Balsamiq Mockups
It's better to manage the data on a single page: add, edit, remove.
Also inplace editing and adding pet could be better option. For adding one just create new table row and autofocus the input field.
I think you should consider a third option.
Option 1, will be a problem for some user because they are presented with two options, New and Save. At least Save should not be available unless Edit is clicked first.
Option 2, will the data table first be visible when you click Edit in the menu? I have seen some users having problem understanding how to edit/save data when data table and form is placed on the same page. This is often because it's hard to see what you are editing, and also many people are not used to this kind of editing.
My advise would be to have the menu and the data table one the first page. When the user choose New from the menu or edit from the data table, then a new page or popup with the form is displayed. User can then fill in the fields and save the form, page/popup is closed and table is closed.
