Loading Profile...
EMPLOYEE
Help us design the "UI Library Position" feature
Hi everyone. The request to move the UI Library somewhere else comes up again and again. I personally never show the UI Library, relying instead on the much faster Quick Add feature. We realize that Quick Add is an "advanced user" feature, and that everyone hates scrolling horizontally, so we started thinking of what the "UI Library Postion" preference would look like.
I have made a mockup of a possible implementation and would like your feedback on it:
The position would default to "Top", and obviously be remembered on your computer until you change it.
Although the mockup above has the P.I. docked, the "Dock Property Inspector" toggle would default to off (and be disabled if you choose to put the UI Library on top).
Also, the "Dock" option only has effect when the UI Library is visible: if you hide it, the P.I. will float again (of course).
In general I'm not a fan of giving the users these many options to think about, but I realize that we each work with different monitors and in different ways...plus all these options are hidden in a menu you'll likely only open once or twice. The most common operation (hiding or showing the UI Library) is still at the top level, unchanged, with its nice keyboard shortcut.
So what do you guys think?
This is not top priority, but it will also be likely fairly easy to implement, so I'd like to get it done sometimes soon.
I've put the BMML for the mockup above here if you'd like to play around with it: http://dl.getdropbox.com/u/41723/ui_l...
I have made a mockup of a possible implementation and would like your feedback on it:
The position would default to "Top", and obviously be remembered on your computer until you change it.
Although the mockup above has the P.I. docked, the "Dock Property Inspector" toggle would default to off (and be disabled if you choose to put the UI Library on top).
Also, the "Dock" option only has effect when the UI Library is visible: if you hide it, the P.I. will float again (of course).
In general I'm not a fan of giving the users these many options to think about, but I realize that we each work with different monitors and in different ways...plus all these options are hidden in a menu you'll likely only open once or twice. The most common operation (hiding or showing the UI Library) is still at the top level, unchanged, with its nice keyboard shortcut.
So what do you guys think?
This is not top priority, but it will also be likely fairly easy to implement, so I'd like to get it done sometimes soon.
I've put the BMML for the mockup above here if you'd like to play around with it: http://dl.getdropbox.com/u/41723/ui_l...
I’m so lucky I get to ask my customers for UX help!
15
people like this idea
I like this idea!
Tell me when this idea gets some attention.
The more people who like this idea, the more it gets noticed.
The more people who like this idea, the more it gets noticed.
-
Inappropriate?I suggest to think about mouse support in the first step and second about keyboard shortcuts. I myself hate to lean shortcuts to get things running.
Next, there are certain expectations that arise in the past because of successful applications. To select from a scrollable horizontal list is not part of it. Because of this your customers ask again and again. I suggest to follow this demands and your application will end with a better user experience.
Although, your product is still the best in its segment you still have to think about user experience. There are a lot of interesting ideas in it. But, you also violate a lot of user expectations.
The idea to let the horizontal selection be the default is not a good one. If you choose the left side vertical selection for this you follow the market. If you select right side vertical you may be still innovative. You guess it ;-).
Your screenshot is a good suggestion. You may rethink if it is a good idea to try hiding the Property Inspector. This another not fulfilled expectation to me from the early beginning. I still have problems how it behaves. It is easier to use in a fixed place and always seen.
Basically, I suggest to be as flexible as possible. Windows and Mac applications show what this means today.
Maybe this helps a bit.3 Comments
Add a comment
This is one of the best points
-
Hi rainwebs, thanks for your feedback, but I'm not sure I understand if you like the proposed solution or not. It sounds like selecting "Right" and "Dock" would provide you with what you're looking for?
Re: keeping "top" as default, it's for continuity. But who knows, if everyone seems to choose a different option we might make it the new default in the future. -
Right and docked is ok to me, but left docked I would prefer as default, because I think the most user wil do so, too.
-
Have you had a look at the interface of Enterprise Architect? Personally like their interface a lot. Basically, you can have multiple tool dialogs and you can choose where you lay them out. You can stack them on top of each other and control their visibility by a tab. I have seen this format used in a number of other software solutions (Eclipse, Notepad++, forgot others).
Have a look at http://www.sparxsystems.com/products/... for some more information. -
Inappropriate?What about "hiding" the UI library and letting it slide out when the mouse is moved to the right edge of the screen? Would leave more screen estate for the actual workspace, and display the library only when it's needed.
2 people think
this is one of the best points
3 Comments Add a comment
This is one of the best points
-
Hi Tobias, that's a good enhancement, which could be added later via a "pin" icon toggle somewhere on the library itself. In other words, I think it doesn't change the current proposed design...would you agree?
-
Yes, I agree, the feature I proposed would still be based on the layout you show above. However, you could take it even one step further and remove the library from the screen completely (when not needed), and bring up a nearly full-screen rapid-element-selection-pallette (love the sound of that.. ;) ) whilst holding e.g. the tab-key. Like in this mockup: http://img32.imageshack.us/img32/8635... . Hold Tab, use mouse wheel to select category, click desired item to select, done. Brings the number of necessary mouse clicks and the mouse travel down to minimum. I'm just letting my ideas fly now, but I think that'd add some usability comfort and efficiency to mockups.
-
Nice idea, but I wouldn't expect such a behavior. And that's indeed what I ment with my first reply. So I suggest to add the "pin" in any case to get it back to something a user knows or would expected.
We have to keep in mind that everything that can't be understood or recognized in a try-and-error manner will lower the acceptance. Acceptance is more important than the number of features you offer in the long run. -
Inappropriate?Yes, please, what you have there is fantastic. Anything to get away from that horizontal scroller. I don't use Mockups often enough to remember the names of everything I can type in Quick Add. The dock or pin feature would be great too, but just a vertical-scrolling palette would remove probably my greatest source of irritation in Mockups.2 Comments Add a comment
This is one of the best points
-
Hi Troy, glad you like the new design. Regarding Quick Add, I suggest taking a leap of faith and just trying it out! I hope you'll be surprised at how often it can guess what you're trying to add correctly! :)
-
I'm sorry Peldi, I'm experienced with it and I still don't think it is useful. I have to use it not to loose time to scroll through the list. But, that's no real solution. The categories that were added later help a bit. But, I still have to think about where the component can be find in which categories. The construct is not efficient, sorry. Maybe for you because you know the keywords to use and have an overview of the components set. I still search for a suitable component, because my context (ICEfaces) has no 1:1 connection to your set.
I suggest that you add some favorite management to your screenshot above so that I can build my own list of components I select from. This would really help. -
Inappropriate?I love it!
One thing: I'm not so sure about having the Quick Add in the same line as the main menu items. The hierarchy does not correspond; and users are not really used to be able to input text at the same level of the File menu item.
Also, I think that the default position of the UI Library and PI should be left (UI Lib. top, and PI bottom). That is because of the logical order in which the user (or myself, LOL) uses the elements:
1. Choose the UI element
2. Edit it
I've downloaded your mockup and adjusted it to my suggestion. I love everything on your mockup! Just re arranged the position of some elements.
I also added a Hide tab (or pin, as I can see you though of!); just because it would be nice to have more space to work on.
Also! I changed my font to Garfield. It is a little big (I'm still trying to find another comic type to use, since I'm just too proud to accept that Comic Sans looks actually good on this. You're a genious for that!) so my mockup looks a little cluttered.
Hope this helps! I'm following you in Twitter. I'm @lalomi
I’m excited!
-
2 Comments Add a comment
This is one of the best points
-
sometimes I like to not have the iphone controls showing can we hide those maybe?
-
Selection of categories to work with is also a good idea. Some checkboxes in the settings to manage this?
-
Inappropriate?Oh! I' ve also added a search box on the UI library. It took my a while discovering the fabulous Quick Add tool, mostly because it is labeled as search. However, I do think that it could be useful to have a search box in case one does not want to browse all the categories of the lib; BUT displaying the results on the UI lib. area
I'm shutting up now :P -
Inappropriate?I like the idea of a smaller toolbox done just the way you show in your original post. I generally prefer to have the main work area of whatever tool I'm using be on the upper left. The toolbox and properties panel docked on the right suits me just fine. If I had to choose one thing, it would be an option that lets me make the icons about the same size as the toolbar icons and stuff them all i n a single panel.1 Comment Add a comment
This is one of the best points
-
Good idea. More intuitive, less clutter. I still have problems to recognize where a component image starts or ends.
-
Inappropriate?I like the idea of a contextual Inspector that either magnetically docks to the side of the main area or can float free. I would suggest also providing at least two standard kinds of list views (thumbnail grid, text list); for those of us who like to keep things grouped, I'd love to see the ability to create and navigate elements by folders / subfolders etc -- if we import new items for instance -- so that would also require a column or tree view as well.
Quick Add is nice, but I also like the idea of an Adobe InDesign / Illustrator-like library-palette of favorite objects that I can just drag and drop from, too.
2 people think
this is one of the best points
-
Inappropriate?Thank you for addressing this issue. I can't wait to see a solution!
Couple things I find as problematic:
The bar takes up too much space
The 3 column layout is too difficult to scan
Maybe one thing that could help is to make the "thumbnails" of the components smaller. I just need to pick out the one that I need, it doesn't need to be real size.
Here is an mock-up. Is there any way it can be a floating window on top of the parent window. Like Photoshop?
1 Comment Add a comment
This is one of the best points
-
Thanks Sue, I think we'll only know if the library is too big once we implement it...3 columns are about the same width as the property inspector is today. Try moving it to the top-right to see.
-
Inappropriate?Peldi, the editing icons should not be part of the property editor (see your screenshot). The property editor (if you follow the first ideas from the IDE guys in the 1990ties) lists all attributes you can influence for the currently selected component. Improved implementations offer tabs that group according to importants to the current selected context (most important attributes or most changed are shown in the first tab).
-
Inappropriate?I feel that the way it is right now is good, but if the goal is to provide ease of use and speed, it could be added such menus and make them visible and enabled based on preference settings.
I vouch this idea, despite of the ins and outs, you are sure to provide more benefits for non expert users as well.
Cheers,
Ernani
I’m vouching for this.
-
Inappropriate?Here is my mockup, generally based on the functionality available in Enterprise Architect by Sparx Systems
UI design rules
1 A User may add multiple Pallete Collections, anything from 1 to, say 6
2 A User may choose to move individual Palletes between Pallete Collections by dragging the Tab
3 When User chooses to display another pallete (View Menu) add to the first Pallete. User can drag to the Collection they want it
4 ALL Pallete has a Search dialog OR create a new Search Pallete (Add as an option in the View Menu)
5 If Properties is not docked then use current behaviour including floating over Palletes
6 Hide Pallete Collections if a User double clicks on the Vertical Splitter Bar, Double click to open again OR add a new button on the splitter bar to save on Double-Click
Note: Mockup is for 800x600 screen
I’m thankful
1 Comment Add a comment
This is one of the best points
-
Whoa gavin, on first look your mockup looks VERY complicated. Not just to implement, but to use as well. Mockups is not a "pro" tool like eclipse and other IDEs, its beauty is in its simplicity. :)
I'll take a deeper look at your bullet-points, thanks for taking the time to mock up your proposal! -
Inappropriate?Personnally I'm in the favor of letting user not many choices... however this is one of the things the user should be able to modify if he wants.
Your first proposal is a good one, Peldi. It'd definitely be an improvment.
What about also a new "tab" called "most commonly used?". I mean, in ALL projects we have to use:
- Dialog/window
- label
- images
- rectangles.3 Comments Add a comment
This is one of the best points
-
Yup, we're thinking of adding a "favorites" and a "most used" tabs to the UI Library.
-
That's be all I need, really, along with your first proposal above.
-
Thanks for the feedback Peldi. I have just gotten this software installed and am learning how to use it. Mocking up the Balsamiq interface was really good practice.
I know this is more complicated but I find it very simple to use. I like that I can have a number of Palletes visible at one time but I do take your point about complexity.
If you want something simpler you could look at how Visio has implemented Stencils. The User can stack a number of Stencils on top of each other, choose which ones are visible, search effectively becomes another Stencil. All nicely docked on the left or right, wherever the User chooses. -
Inappropriate?I think that a single panel is fine. There really aren't that many different types of items (yet!). I would just make them smaller so there is less scrolling. Actually, I think I'm just going to get more used to using the quick search box. I would stay away from lots and lots of user choices unless they are really easy to implement. I've seen too many good apps killed with lots of features added to satisfy smaller and smaller groups of users.
-
Inappropriate?I am neutral between the first proposal and the second (LaLomi's).
Re the third screen shot (Gavin Jolly's) I have used Enterprise Architect in the past, and the first thing I usually did was close a bunch of the windows in order to increase my working space. Likewise, with Eclipse and other IDEs, I like to customize the workspace to reduce the number of windows and just keep the few that remain all grouped on one side of the other. So I agree with the commentators who say you shouldn't give the users too much choice - just a bit more than we have at present!
Re the suggestion to have "fly-out" or "pop-out" panels, which appear when you move the mouse to the edge of the screen, if I get a vote, then it's against them! I find it distracting and annoying when things pop out at me as I move my mouse around my screen (which I'm generally doing for some other purpose than looking for a menu). Please, let the menus stay still and/or wait until I explicitly invoke them.
