Brainstorm new UI: opinions?

[nand]

Hey,

I'm working on a whole new set of stuff for Ubuntu Brainstorm, including a new UI. Mind to give your opinion?

=> Popular ideas area link
=> Idea in development area link

You should notice the "Idea in gestation", and "Idea in quarantaine" tab.
This will be more or less like explained in idea 10848: when submitted, ideas will go in this area where moderators and authors can discuss and update the idea. When the idea is deemed appropriate by the admins, it goes to the main "popular ideas" area.
Question that raise debate: what name should we give to this area so that it is clear for a newcomer: "Ideas in gestation"? "Ideas in quarantaine"? Or simply "Ideas in preparation"?

=> Rationale/solution separation link

Often ideas are trying to resolve the same problem, but in a different manner: as such, it's not easy to track the proposed solutions for a same rationale. They will now be united: an idea will have a rationale, and different possible solutions.
What do you think?

Thanks for your input!

[olskar]

+1 Looks good

[jay019]

++;

[Tree MendUs]

Hi Nand,

Thanks for going to the effort to make some improvements.
And wow, Thanks for inviting comment during the prototyping stage.
That's the way!
Ok.

several points;
First -
I note you were viewing one of my ideas shown in your example screen grab at;
http://img241.imageshack.us/img241/1...ntpage2lx9.png

Thank you for considering the thought for "New Technology Hardware support - e.g. huge touch screen.". It is only a moderate scorer, and has attracted No comments. So clearly you are checking for content, and not just voter or topical interest status.

Now for the Critiquing.

1) Do I see a small rectangle in the voting panel? and could it represent the "null" vote?
If so - great news!
but maybe put an explanation in a caption so other viewers will understand the prototype.

2) The vote number - is that the total number of votes or the net difference? - why not show both (say net above, and total in smaller fonts below the voting marks)(could even have a small bar like on Dashboard, to show the votes. - null votes size bar goes in between negatives and positives)

3) Menu on right hand side.
Not many do this, but it is (IMHO) quite good because it helps show "the business" that the viewer has come "to" the page to see. Only when the viewer wants to leave the page, do they have to horizontally scroll.

Menu on the left forces a horizontal scroll at the start, which they have to do again to see the menu to leave. Plus it shows them departure options before they've even read the page - what a great opportunity to invite people to leave (soon)?

Menu on the right is not "conventional" but it Is an "innovation", and not un-"sensible".

I like it.

4) Tabbed options at the top of page.
re;
http://img241.imageshack.us/img241/7...ontpageve2.png
These are helpful options.
But they take up quite a bit of vertical page space with this layout.

If placed as menu options (on the right - in this case), then
- no additional vertical space is taken up
- these choices appear with the other choices (in the menu)


5) Menu Options - more

a) The menu option for "Submit Your Idea" is good and clear.
There may be situations where somebody would like to submit "an" idea, but acknowledge that they have been given the idea by somebody else.
They somebody else may be a friend, who isn't using Ubuntu yet, or doesn't feel skilled enough, or isn't capable (physically or otherwise), to make the idea suggestion.
This menu option could read;
"Submit an idea"
The submission could them have an entry that says;
"If you would like to attribute this idea to somebody other than(or including yourself) then please let us know the 'Others' ".
And then they can type in the names of "Others/Friends".

b) this is a prime opportunity to make the Brainstorm website far more efficient and helpful. Plus it may help clean up some of the submissions and submission process.
Please add some buttons to;
- "Submit a Bug Report" (sends them to a brief explanation page about how to submit bugs at launchpad, they can then click to go to launchpad, register for a launchpad account, save to favorites, or go back to Brainstorm.
- "submit a program for Ubuntu" (sends them to a brief explanation page about how to submit needs-packaging at launchpad, they can then click to go to launchpad, register for a launchpad account, save to favorites, or go back to Brainstorm.

Plus the following links - in the same style as on the main website.
- "Ubuntu Main Site"
- "Get Involved"
- "Get Help
- "Get Developing"

and the link to Ubuntu Wikip-ideas (to coin a phrase)


6) Top in "30 Days"
This is a good sort feature.
Does it have options for bottom in 30 days?
Does it have options for "balanced/null/middle-of-the-road" in X days?

7) Popular ideas in Intrepid.
re;
http://img124.imageshack.us/img124/9...aindev2ia2.png

I am not sure, so please let me/us know.
When an idea is suggested, does it only get implemented to the next version of Ubuntu, or does it get implemented into which ever (current or past supported) version(s) of Ubuntu , that it is possible to include it in?

I will use a separate comment for the Rationale topic.

[Vadi]

Why KDE and not desktop-neutral like Tango icons?

(or at least the oxygen ones...)

[nand]

Hey!

Thanks for your feedback!

To answer specific bits:
- Small rectangle in the voting panel: yep, that will be the +0 vote. Plus you will be able to change your vote, plus you will be able to see how you voted
- More data in the vote box: Don't forget that too much data kills data. If too much is asking for attention, you have a bad UI.
I will eventually add the number of +1/0/-1 votes, but in the idea page, and I'm not quite sure yet where.
- KDE Crystal icons: because I like them
- Menu on the right side: As this menu became less important (no more links to main pages), it is best to put it right, where the attention goes last.
- Generally ideas are implemented for the next version. Only security bugs and grave bugs are fixed on the already release versions
- Submit a bug report, a package request: I guess it will be best to clearly put that on the idea submission page
- Links to others Ubuntu website: there is at the moment discussions to put a real inter-website navigations between all the ubuntu websites
- Concerning the navigation experience, please see below to experience with it

For people interested to see what's going on on the development version, and even try it, you can use:
http://devel.ideatorrent.org
Note that the data is not linked to the real Brainstorm, so you are allowed to try sample.
But also note that, as it is a dev version, lots of things are broken

[Vadi]

We might as well make brainstorm blue to go with the KDE 3 icons, because it really doesn't fit.

[droetker]

Blue is good.

[Tree MendUs]

Nand - Good work!
Thank you.


1) Navigation

Very Ex-cell-ente' to hear there is discussion for the navigation - this will really "open" up the use of the ubuntu website - make it easier to be used effectively - and cut out the wasted time with information going to the wrong place and being lost.
Non- topic stuff can easily be (politely) handled by redirection to other areas, so nothing gets lost.

Please encourage this menu to be include - it is such little work compared to the benefits for all the many visitors to the Ubuntu group of web sites, And to all the admin teams behind the scene handling all the traffic responses.


1b) Navigation - Corporate Receptionist as a Metaphoric Example

Think of this menu as the "receptionist" to a major corporation.
Is she/he polite, helpful, informative, accurate with information, quick at letting you know where to go or who you need to speak to, is nice to the mail man when he says that there's a few mails that have been incorrectly addressed, and when the freight company truck driver comes in the front door in his boots to ask where the loading bay for delivery or dispatch is - he is given every assistance on where to go round the other side of the block, how many driveways down, and a few tips on how to reverse in.
When a corporate delegation comes in, seh/he already knew what flight they were going to be on, and has been watching if the plane was going to be late or early - the reception catering will be timed to be fresh and not too hot cold or dehydrated.
She/he won't complain about the repetition of the job tasks, because IT is a computer.


2) Menu Idea
An idea for the inter/intra-site navigation menu module, is to have it of uniform appearance in each site - or at least as uniform as possible allowing for web site styling and CMS system (I see this site is still displaying the Drupal favorites.ico icon in the address bar - so the webmaster may want to change that to the Ubuntu one).

This menu which would take up about 3 times the size of the current user menu (say about 6 lines), would be small enough to be on every single page display - ie a stanbdard drupal module on each page.

An idea for the inter-intra-site navigation menu, would be to have it as code that people can put on their own web site. Similar to ordinary graphic advertisements, but it just contains a few more links.


3) Voting Panel
a) The middle square for null votes is great - this is going to help get and idea of voting skew.
When the square is hovered over it says "demote this idea" which is what the negative vote arrow says. This might be better is it said "don't care/not sure".

b) Please consider another positive and negative arrow, for a scale of very +, a bit +, don't care, a bit -, very -.
As this will give better idea of what % of people feel "how" strongly about something.


4a) The demo page at http://devel.ideatorrent.org/
Seems to repeat the following text in many of the examples;

"
Solution #1: Title of this solution
Written by (each respective idea person)
Many people are using the word processor they use, because "it's the best", or so they've been told. Did they ever do a comparison? Did they try another manufacturer?
Schools, Colleges, Polytechnics and Universities "teach" them to use these programs, and have never taught of any of the other alternatives.

Same goes with the OS. In fact so few ordinary people even seem to understand the difference between the OS and the Wordprocessor - because the names for both sound so much alike.
What's an OS, why do I need to know?
I just switch the PC on and it goes.

Same goes with the OS. In fact so few ordinary people even seem to understand the difference between the OS and the Wordprocessor - because the names for both sound so much alike.
What's an OS, why do I need to know?
I just switch the PC on and it goes.

[...]

Solution #2: Title of this other solution
Written by (each respective idea person)
Products have their users. Companies have their customers.
They always ask their current users and customer "What more do you want?".
Not so often do they ask (out on the street) "Have you heard of this?", "Would you use this?", "Why?/Why not?".
"

So there is something is up with the way the demo is assembling the content for the page.

b) I note that these are both extracts from a comment that I placed on an idea (at somebody else's submission - I think) - again - thank you for taking an interest.


5) I preferred it more when the voting module was on the left of the title.
It could have been insert from the margin, and push the title to the right some more.
Helps to visually identify the start of a new idea.

6) Note -
please allow a longer "stay live" time for reply to these submissions. It's a real problem trying not to losse stuff when ity has timed out.

Thanks.

[Tree MendUs]

1) Voting Panel;

I made some example images of the voting panel.

Screenshot-Ubuntu Brainstorm [Development version rev 384] - Vote Panel Option 1.jpg
Voting Panel plus ;
- bar display (including display of null votes)

Screenshot-Ubuntu Brainstorm [Development version rev 384] - Vote Panel Option 2.jpg
Voting Panel plus ;
- bar display (including display of null votes)
- Very Yes and Very No extra votes


2) How to Display User's Vote;

A possible method to show which way the user voted, might be to have a bold outline around the arrow (or square) that they voted on.
i.e. So it appears as if it was "selected".


3) Hover Display of Vote statistics;

It might also be possible to hover over (say) the bar display, to have a pop-up box that shows an improved display of the statistics, with fuller detail.
Of note , for web page speed, these could be not included in the page as initially downloaded. But like the pictures of a webpage can be made to download after the page has loaded, then the pictures (or text/script) of the pop-up boxes could be downloaded after the page has loaded.
That way the page initial load times will not be any longer, and the pop-up images should become available fairly soon after the page has loaded (each of them is not very big)


4) User could choose Vote panel in user settings. (and a general prototyping method)

If it was possible for the user to choose which vote panel style they wanted (say from three to 5 types), then there is a better chance that each user would have the degree of comprise between complexity of information, and simplicity of appearance that they wished.

Also in the case of prototyping, say in an area where users can try out new style sheets, templates, module styles, using real data on Brainstorm, then it becomes possible to take prototypes for test drives and get some "in-field-use" feedback.
note;
The admins could decide which, what, when ... any of the above features get "write" access to the data - but it can be read, and "dummy written/dumped"(ie. get a confirmation that a "write' would have correctly taken place if the "write-Prevention" was not ON) for the purposes of getting the feel of how well it works.

This user settings feature, would become handy in future when other features may be being implemented such as voting on comments (user identifies an idea in a comment - {may be} admin checks validity of claim that it is an idea - voting panel for idea gets inserted)(idea submisssion may contain idea of problem and several alternatives ideas for solutions)(pros and cons may be votable for importance). Users might want to test drive translation systems, check out 3 new alternative layouts (e.g. menu locations, and fonts).
The user could then "vote" on which alternatives they liked - great feedback - on "field-tested" "ideas".

Hope some of this is useful.

Thanks