What are the plans regarding Next's user interface? Will it be significantly revamped from its current state? Depending on your plans, I think that there are many suggestions to be made about use of space, location of controls, highlighting and shading of elements, design of icons, typography, use of color, grading of areas, etc.
Comments (10)
I agree that the user interface is a low-priority cosmetic consideration. And of course things (meaning functionality) "will work" as they are. My three points are 1) Users will potentially spend many hours looking at this interface, so it makes sense to make it as pleasing and clean as possible. 2) Users will repeat some simple actions many times during their work, so it makes sense that the design and position of elements are as optimal as possible. 3) The app's interface will be its presentation card in promotional materials or magazine articles, so it makes sense that it is as sophisticated and attention grabbing as possible. As it stands, the interface looks too crude and undeveloped. The biggest problems I see are wasted space with long panels that have just a few icons in them (desktop tools, regions zoom) buttons that act on elements located far away from them (the three desktop/timeline/combined buttons, which I find awkward) use of colour, gradients and contrast to bring important elements forward and avoid everything looking flat, choice of typography and presentation of text, to make all of it consistent and more readable, etc.
One aspect that I think has to be adressed is interface consistency, because it impacts usability. For example, the device icons. As it is, the actions relevant to devices are triggered by icons, text labels and pop up menus. The same action is sometimes triggered by an icon, a labels or a menu, depending on the device. Sometimes an action like opening the MIDI set up dialogue is triggered by a pop up menu that must be itself triggered by an icon, which seems like an unnecessary middle step. It's very inconsistent and contrived, hard to remember and use when you just want to perform a task quickly and focus on creativity. What about cleaning the edges of all devices and grouping all actions except renaming the device (text label) on a single pop up menu, opened by clicking a single icon on a device corner?
About your question, I think that consistency trumps any other consideration. The point of an interface is to not draw attention to itself, to become transparent and let the user accomplish tasks as quickly and efficiently as possible, until he/she doesn't think anymore about where things are. Therefore, if it was up to me, I'd implement the same interaction model in all devices regardless of size. And I'll add keyboard shortcuts for all of them, which would work once the relevant device would be selected. That's just my idea.
If it is of any help and inspiration, there are many images available on the web with examples of clean interface elements design, which are doable with HTML5 and CSS. Here's one: http://download.4-designer.com/files/20130905/Player-interface-elements-psd-layered-material-49432.jpg There are many more. I like this one because it uses cyan color as highlight. I always thought that the AT cyan on top of the dark grey was a very recognizable trademark of your app and website, and am surprised about how little use of it Next does, almost none.
Another example with grey and cyan. Not very sophisticated, but clean and easy to read: https://image.shutterstock.com/z/stock-vector-vector-modern-user-interface-elements-115052860.jpg
@andremichelle I agree that those two expamples are perhaps too garish. And I understan your motivation for the feel of the interface. But I still think that, as it is, it could be improved and made a bit clearer and stronger without changing your phylosophy. For example, the top bar and the transport box inside: I think that if you made the bar a bit taller and added a subtle grey vertical gradient to it, it wouldn't hurt. You could use cyan for the icons that are active instead of light grey (for example, the loop playback funcion), make the text bigger (the text labels feel a bit microscopic now), change the typography to Verdana or Tahoma and make the numbers below the labels (bars, bpm, etc) white. I think it would be more interesting to look at and more legible, because with one glance you can see what is active or not and what the values are. You could extend this system to the rest of the interface. Another example is the level meter at the bottom. It's just too small. It needs to be way bigger to be useful and I think that perhaps it would be better to have the option to also put it in a floating window.
About colours, the problem is that there are none. Apart from the device panel on the right, which is actually an explosion of colours, and the devices on the desktop, everything else is just shades of grey. There isn't even black or white, as far as I can tell. In my opinion it lacks contrast. I know that a graphic designer on the team is a luxury that you don't have now. But I think that you could decide on a colour palette like: dark grey, light grey, white, black and cyan, decide on the function for each colour, for eample: cyan is for active icons, light grey for inactive ones, white is for informational text and values, dark grey for background and so on, and then apply it to the whole interface. At the very least, I think that the issues of size of things (expecially text and icons), typography and cyan highlights for active items should be addressed.
One final thought, and I'm sorry if I'm extending myself too much with this: Actually, it's ironic to see the contrast between the app interface and the devices interface. They are totally different. I know that the devices are supposed to be the stars of the show and the app interface has more of a supportive role. But I think that the app interface could benefit from some principles that the devices use. The Machiniste is a very good example: It has gradients, shadows and 3D, which suggest a space and help the design to "breath", it has highlights in cyan and orange, so that even your periphery vision tells you clearly which sample, step, pattern, range and scale are active, etc. If you hide the desktop and the panels, so that you just have the app interface, it's the opposite: no colours at all, no way to easily tell what is active or not or what is the status of the app, big panels of solid grey with tiny grey icons in them that make you feel a bit claustrophic or like you're staring at a concrete wall. When you expose the desktop again and see the Machiniste, you feel like you can breathe again, that your eyes have something to hold on to. Maybe this is just my feeling and it might be exaggerated and I'd love to know what others think about this.
Maybe a custom skin feature?
Yeah i also thought this