Take the 2-minute tour ×
User Experience Stack Exchange is a question and answer site for user experience researchers and experts. It's 100% free, no registration required.

ON the UI that I’m designing, I have a page and there could be multiple rectangles on the page like shown below: enter image description here A page can be selected by clicking on its boundary. Similarly, a rectangle can be selected by clicking on its boundary. But if a rectangle is of same size as page, how will user select between page and rectangle since both will have the same boundary at that time.

Also currently I can drag objects to page or rectangle. How will this be done if both have same boundaries?

share|improve this question
1  
You should make sure that page and rectangle never have the same boundaries. Shouldn't this be possible? Can't you enforce a padding for the page? w3schools.com/css/css_padding.asp –  Anna Prenzel Apr 25 at 10:48

2 Answers 2

Provide some feedback on which is selected. The IDE I use frequently obviously does this with an object inspector that allows setting properties for the controls on the form. It changes its data when you click a control on the form, but you can also change the selection in that list to change the selected control on the form.

You could have a dropdown or list box that changes its selection when a different rectangle is selected.

Apart from mouse selection on the boundary of controls and the use of the dropdown or list box, you could also consider using the tab and esc keys to switch between controls. For example [tab] to select the next control in the tab order, and [esc] to select the parent (container) of the current control.

share|improve this answer

For drag drop operations you need to make it very clear to the user what the effect of the drop action will be. You could provide the user with labeled areas to drag to. For example, you could provide an "add to page" area where users can drop items. I can't really comment on the selections part of your question without more information on your use case (unless I copy paste Marjan's answer).

share|improve this answer

Your Answer

 
discard

By posting your answer, you agree to the privacy policy and terms of service.

Not the answer you're looking for? Browse other questions tagged or ask your own question.