Design proposals for future ML interface

Started by Arthur, July 03, 2012, 01:06:59 PM

Previous topic - Next topic

0 Members and 1 Guest are viewing this topic.

Arthur

12 items will make it too tight and scaling down the text will affect the visibility on some cameras.
I was able to squeeze 10 items in.

The image to the left is the same layout, just slightly resized, and has a larger text, the one to the right has smaller text, and is slightly more spacious.

I still have to check the readability for that one to the right.

I think that, alternatively we could keep 8 items per tab, but add scrolling to the menu.
We could put the most used, and most important first, and put the extras and less commonly used functions to the bottom.

Here's a preview of how it will look at my camera:

Still very readable.
I had to cut off the top bar on  this one so it would show in the correct size in the camera.

Quote from: b4rt on July 05, 2012, 11:58:57 AM
Finally I want to ask Arthur to make a menu design with current ML layout but with proportional condensed font. Like the size you use for item help. And maybe try to adapt the selection bar with the black inner bar inside the blue for even more contrast. But keep the icons left. I think that would make it look better.
You say the same blue as the current ML selection? I've tried using the same blue as the current ML highlight color around the black square, but that color makes it hard to see, it has to be a bright color that that is not white in order to be really visible.

About the icons, I'm planing on trying to put them somewhere, either the left or right side, also I'm thinking about redesigning them, so they would match the layout, instead of using colors to indicate the states, I'm thinking about using shapes and other symbols to make it easy to understand without breaking the design.

Also it might be possible to use a combination of colors and shapes too, but I think that its better to decide the basic layout first, this way its easier to design and fit the icons later.

I also think that the idea of wizards are really good.

And yeah, I'll be a problem where there are lots of entries...

But I guess we can either change the entries or maybe add scrolling to the menus.
EOS 1100D | EF-S 15-55mm f/3.5-5.6 IS II (Kit lens)

ilguercio

I like this style very much, Arthur.
The current layout isn't bad but this is a bit more catchy :)
Canon EOS 6D, 60D, 50D.
Sigma 70-200 EX OS HSM, Sigma 70-200 Apo EX HSM, Samyang 14 2.8, Samyang 35 1.4, Samyang 85 1.4.
Proud supporter of Magic Lantern.

bart

Hi Arthur,

I made a magiclantern.fm style variant. With dither gradient on top.



nanomad

The "magiclantern.fm" edition sure has less eyestrain if used at nighttime, and that's I thing that I'd like to see
EOS 1100D | EOS 650 (No, I didn't forget the D) | Ye Olde Canon EF Lenses ('87): 50 f/1.8 - 28 f/2.8 - 70-210 f/4 | EF-S 18-55 f/3.5-5.6 | Metz 36 AF-5

Malcolm Debono

Nice! Really like Bart's first design.

Would it be possible to have some sort of scroll indicator on the side to indicate that there are more menu items further down?
Wedding & event cinematographer
C100 & 6D shooter
New here?  Check out the FAQs here!

Arthur

Hey Bart,

I didn't think of using dithering! I had forgotten this could be done, nice!

I also think that the first one is better too, that grayish green is pretty close to white, I think that a more saturated color looks best there.

nanomad,
That's why it is a good reason to have a color scheme selector of sorts.

Malcom,
Yes, I think it is definitely possible. It might be just bar with a gray or some other color, and a square to indicate the current position.
Canon's firmware also got one, if you go to the Custom menu, My Function List, there will be a scrollbar to the right, we could do  something similar.
EOS 1100D | EF-S 15-55mm f/3.5-5.6 IS II (Kit lens)

a1ex

Scrollbars have a disadvantage though: you don't see everything that's available in that menu, at a glance.

Arthur

That's why we can push the less used functions to the bottom, and let the important ones to be seen at glance.
With this design we have 10 items, 2 less than the original, so we can leave the two less used of each category there.
EOS 1100D | EF-S 15-55mm f/3.5-5.6 IS II (Kit lens)

scrax

We can already hide items this could be used to have only used item
I'm using ML2.3 for photography with:
EOS 600DML | EOS 400Dplus | EOS 5D MLbeta5- EF 100mm f/2.8 USM Macro  - EF-S 17-85mm f4-5.6 IS USM - EF 70-200mm f/4 L USM - 580EXII - OsX, PS, LR, RawTherapee, LightZone -no video experience-

bart

Quote from: Arthur on July 06, 2012, 12:28:02 AM
Hey Bart,

I didn't think of using dithering! I had forgotten this could be done, nice!
I also think that the first one is better too, that grayish green is pretty close to white, I think that a more saturated color looks best there.

I did the dithering by making a gradient in photoshop from black to one of the blues in the palette. then switch to indexed color and select 10 colors there. Photoshop will take care of the dither pattern then.

I switched from bright yellow to this green to make the item draw less attention. The yellow is a real eye catcher (maybe because I like yellow). So if we put in yellow then I suggest to use it for the menu items. Maybe contrast is less but I can't keep my eye from yellow items.

EDIT There is something wrong with the font in the 10 item menu. With the 8 item menu both the menu items and help text are rendered very nice with symmetrical O's. While in the 10 item menu both the menu items and help text don't have symmetrical O's. So maybe the font renders better at certain sizes. With a little experimenting you can pick the ideal sizes for the font and build a menu out of those.

calypsob

I personally think the new GUI looks brilliant.  Magic lantern gets me so excited I could shake a baby.
Full spectrum T2i
T3i

scrax

Quote from: b4rt on July 05, 2012, 11:36:45 PM


I like this color scheme, I think the blue border of selected item could be the same of what it is now (if already isn't). the gradient is great but icons are a little too grayish (maybe just on my screen).

Also if you want, can you try to invert the gradient in the icon only (but keeping selected menu like now) to see how it looks?


WOW I've made a crop mark of it and it's great! In PLAY mode you can see it in full screen.
I'm using ML2.3 for photography with:
EOS 600DML | EOS 400Dplus | EOS 5D MLbeta5- EF 100mm f/2.8 USM Macro  - EF-S 17-85mm f4-5.6 IS USM - EF 70-200mm f/4 L USM - 580EXII - OsX, PS, LR, RawTherapee, LightZone -no video experience-

druckgott

Are there any news?

Whith new disign ML will be much more perfekt as it is already

scrax

I like bart suggestion, just added a scrollbar and MLlogo:
I'm using ML2.3 for photography with:
EOS 600DML | EOS 400Dplus | EOS 5D MLbeta5- EF 100mm f/2.8 USM Macro  - EF-S 17-85mm f4-5.6 IS USM - EF 70-200mm f/4 L USM - 580EXII - OsX, PS, LR, RawTherapee, LightZone -no video experience-

ilguercio

The scrollbar is a bit odd, i would rather have an arrow pointing down if we are at the very top of the list, pointing up if at the very bottom and both if in the middle of it.
Canon EOS 6D, 60D, 50D.
Sigma 70-200 EX OS HSM, Sigma 70-200 Apo EX HSM, Samyang 14 2.8, Samyang 35 1.4, Samyang 85 1.4.
Proud supporter of Magic Lantern.

Michael Zöller

Thanks guys. Great ideas in this thread! A few things on my mind.

I think a scrollbar is better, because it really helps one to know where in the list one is (as opposed to just arrows). I don't think the hovering one is the best option, though.
One thing I'd love to see is that when one changes values (in either main or sub-menus) and there are several values to choose from (like mic source setting) that a list is displayed so that one can instantly see the options instead of toggling through the list.
I too think that color schemes are the one way to make everyone happy.
neoluxx.de
EOS 5D Mark II | EOS 600D | EF 24-70mm f/2.8 | Tascam DR-40

a1ex

Agree with value list, but not sure what's the best way to show them.

I don't like scrollbars - you don't see what's on the other half of the screen. An important element of current menu design was to be able to see at a glance what's enabled and what not.

KarateBrot

Yeah I agree with Alex about the visibility.
If you donate a RED EPIC to me you officially are very cool ;)

Michael Zöller

About scrollbars. I totally agree with a1ex that getting all items on one screen would be perfect. I just have a feeling that the functionality of ml will only increase with every release. Fitting all options into menus and submenus might prove to get difficult.

And a rather heretic question: Why have two menus (canon and ml) anyway? I have not made up my mind yet, but sometimes I think "why do I even have to use the canon menu besides the ml one?". This would obviously increase the item count even more. So to put it in a more friendly way: Wouldn't users prefer to set all relevant settings from only one place?
neoluxx.de
EOS 5D Mark II | EOS 600D | EF 24-70mm f/2.8 | Tascam DR-40

a1ex


Michael Zöller

Good question... :) Just trying the get all relevant aspects into the discussion. I'm sure we will find a way.

But the more I think about it... having to switch between both menus during a shoot can be a bit challenging during the heat of the battle. It just does not feel very intuitive. I can see that from where ML came from it made sense to see it as an addon, but now that I use it on my professional shoots I feel that one place where I control everything from makes more sense.
neoluxx.de
EOS 5D Mark II | EOS 600D | EF 24-70mm f/2.8 | Tascam DR-40

alfatreze

It's really nice to see this topic being brought up again. Also I had never seen that thread about my screens A1ex  :P.

With all the development ML has been through, and only broadening it's possible scope with all the possibilities still ahead (ahem DIGIC Registers), this effort really should be about first and foremost making the UI flexible, robust and easily expandable, and only second about color, contrast, gradients and icons.

I made my first versions bases on an idea of making the functions more visible, which did result in some extra clutter. Can't really say it was a very involved effort or that there was much feedback :). Although it did please me to see my integrated help suggestion making it in and improved upon.

I believe the best way to go would be to create a core UI development group with a few people. This way we can work faster, more focused, and without posting every little detail (but keep info flowing and gathering feedback from the community).
With this setup the best way would be to work with wireframes of the UI, exploring well the menu mechanics and flexibility of the system. This should include the menus, different camera res, even help system (moving away from the IMG based one).
After this the focus could then be on color, technical issues with fonts, themes (low/high contrast at least) and polishing.

Let me know what you think of this, I will contribute to the effort no matter what the outcome of the development may be - Now let me just find and dust of those old files...

Furthermore I have to thank all the ML developers, testers and contributors for the amazing tool we now have.
Although I really have used it little in the past 8 months (proud father of a very energetic 4 month old girl) I'm eager to see it developing further and improving in every step of the way. As much as I am to exploring it further and producing some amazing images with it.

PS: I really see no issue with the menu being different from the standard Canon menus, for me it's all about function and we don't need any kind of artificial limitation in trying to look similar or even having that as a start point.
I would also make the case that the menu changes a bit in every camera ML supports, particularly the older ones (can we get a few screens from each as reference!).
Furthermore, I don't really think that the fact of it being different distracts in any way, you just know you are in ML :) (where the good stuff happens).

jplxpto

Might be a good idea to have a dynamic menu which would be presented the last user-selected options.
This way we could have a menu that is automatically adjusted to each of us, without additional configuration.

It seems you an idea of implementing feasible and useful?

a1ex

It was discussed roughly one year ago, but the main argument against it was that users prefer to get used to some fixed order of menu items, rather than having it changed all the time.

jplxpto

I understand your argument. Probably I would be the first to feel it.

I really enjoyed this thread, do not think it a priority to improve the graphical interface, but can make its use more attractive to many users.

I appreciate your answers.