Jump to content
  • 46

Vectorworks User Interface Overhaul

Thomas Wagensommerer




brown - purple - yellow - blue REALLY?


Looking at screenshots from VW 2018 makes me extremely sad. Seemingly Vectorworks is the last application adhering to the kindergarten color scheme.


A design application must not use colors in the interface!


Look at any self respecting or professional design application and please get rid of those colors in the interface.








Edited by Thomas Wagensommerer
  • Like 3
Link to comment

Recommended Posts

  • 0
15 minutes ago, JimW said:

That we may just have to flat out ignore in most cases in favor of carving out our own rules. Tech UI already doesn't agree from app to app (see the Tab style discussion from awhile ago) so there's no way we would be able to adhere. I would say we should boil it back down to things like "Triple Dots indicate options for the active element, Double Arrows indicate expanding an element, X indicates closing an element, + indicates adding an element" and then try to build from there. These are just random examples of course but thats where I'm thinking.


We're sort of saying the same thing. What I'm pointing out is that VW has deviated from its standard for no particular reason - that's the confusing part. Deviating from the standard implies that the new UI element does something different. Changing everything implies the standard has changed. The UI could be anything (and should be anything, get someone crackerjack UI designer and give them strict control rather than by committee) but it needs to support itself by being clear with its intentions. That one screen shot you posted says it all....


3 hours ago, JimW said:

Screen Shot 2017-09-01 at 10.59.36 AM.png


The icons at the top of the Navigation palette are great. Clear, concise, all in the same family. Why doesn't the Home icon in the Resource browser adhere to the same design rules? The arrows and >> all say hunt around and figure out what we do.... instead of saying "look here for more commands".


I personally love the C4D interface because of how understated it is. Simple shapes, thematic colour groupings for icons.




  • Like 1
Link to comment
  • 0
2 hours ago, JimW said:

Right, those are some that (at least primarily) make their own UI rather than using included system elements.



Yes, all of these, or most of any Apps I owned use built their own UI.

Beside Microstation which (wasted a lot of space) relied on Windows.



I think C4D UI is ok to use and I like how easy and flexible it is to customize.

But that needs about the double amount of space for same information over

Modo. While Modo UI was perfect at the beginning, but did not age very well

with tripled complexity and users start complaining over standstill.


Link to comment
  • 0
16 hours ago, JimW said:

5) Mock up what kind of buttons, menus, controls you would like in your requests. You don't need to be a photoshop maestro, simply opening Paint or Preview and adding some text and lines on top of a screenshot of the current UI is perfectly fine. I find that requests that come along with images explaining the concept get picked up, voted on and implemented much more frequently than those without visual aids. I know this is more time consuming so I will attempt to help with this when I can, it is a powerful tool for persuasion and expression as most people who work in design fields are very familiar with.


Given the topic of conversation I'd humblely suggest using a little program called Vectorworks?

I mean sure iOS is for toys and games but it handles that well and produces Vector PDF's that convert very well to retina ready scalable icons that IDE's like xCode can then turn in to monocrome graphics as needed.

It's something all of us should have at our disposal. 


16 hours ago, JimW said:

1) Vectorworks is built to function almost identically for both Mac and Windows. This is nearly unheard of in most software development and that's mainly because it is INCREDIBLY hard to maintain. Most other software companies do one of the following:

  • Only cater to one OS, the easy way out.
  • Have different UIs for each supported OS. I hate this as I am a fan of both Mac and Windows.
  • Build their own UI system entirely and not rely on the built-in UI elements of the native OS at all. This is the method I prefer but is also incredibly resource heavy as far as engineering time goes.

As for this point about cross-platform. While i understand and place value in the goal. I think it's easy to go to far and reinventing wheels already provided by the system to the point of being detrimental to the program:-

a) it makes it stand out for the wrong reasons. Making parts of the apps that should blend off in to the system,  jarring and attension seeking. 

b) diverts engineers from valuable parts of the app to re-creating system function the collective providers put 1,000s of hours into providing and tuning. 

Link to comment
  • 0

On a personnal note and I'm assume this is a bias that comes from watching too much Sci-fi. I just don't like dark interface apps.


I get it for video and animation where people are working in darken spaces but even that is shifting but much of VW target market works in well lit space so the value of dark UI is less valuable. Still if you go dark then go black not some washy dirty grey like the example in the OP.

Edited by Matt Overton
Link to comment
  • 0

I've been placated somewhat by the ability to dock palettes. This was a godsend for workspace organisation in our office. Before palette docking, each time I sat down at a colleagues computer I would be, "oh my god, you work like this?!" I still have this problem a little with my boss because he needs to switch between an office workspace (multiple displays) and a home workspace (one display), so it can get a bit messed up sometimes.


After that, number of clicks, inconsistencies and hidden information are my biggest annoyances. The paint job doesn't worry me as much as it used too. 


Here's one little inconsistency that should be addressed:


Link to comment
  • 0
24 minutes ago, mjm said:

These older eyes tire after a while with all the white ground and screaming color clashes.



Thought that would get less harmfull when getting older, by cataract ;)

Currently purple still hurts.


 I think the world would be a better place if certain colors and saturations of the spectrum

would be prohibited for public usage :)

Link to comment
  • 0
On 9/1/2017 at 11:05 AM, JimW said:

I'd call that a phase or two after some of the other global changes, since that introduces a whole plethora of new questions which we wouldn't want to do without first answering some of the more basic ones.



Streamlined Style Selection.


When you want to change the style of a wall - you select the wall then go to the style dropdown menu, then half to select replace, then you have to select the style, and then you have to select the replacement control line.  This should be streamlined.


At VERY least, that dropdown list should contain the active styles in the document.  If properly named, a text list should be fine. That would cut out 2 steps right there - select the style from the list - and go right into the control line dialog.



  • Like 1
Link to comment
  • 0
On 9/1/2017 at 10:10 AM, cberg said:

However, there is no ability to adjust the default font or font size.  Dialogue box font sizes appear on screen to be below 8 point type.  I find this lack of attention to the fundamentals of universal design, somewhat astonishing.


Does anybody else have this problem?  While computer programmers and work-forces in the early 20's may have no problems, an older generation of tech users, is certainly struggling. A UI interface that improves these fundamentals would almost certainly help people learn the program better.


my biggest gripe is the font size in the resource browser or navigation pallet.  SO small its painful to read in some instances.  Ive used all the above listed programs.  I find VW UI actually far better than PS Auto CAD or any of the dark interfaces.  Ive been using all these programs for years, Ive never heard that color icons takes away from it, if anything they make stuff easier to find. While I do know where just about everything is, often its easier to see a color than it is to read the very fine print.  I really like the VW UI, no matter how archaic it may seem  be to others.





Edited by HEengineering
  • Like 1
Link to comment
  • 0
8 hours ago, zoomer said:


I don't get it.

I think this is SO embarrassing.


I want exactly the App as promised in the Videos.

Not that graphical mess I have on my screen.


What's the meaning of Dacia including teaser images

from Mercedes into their Flyers.


Let that guy at least control the hex values and gray contrasts of the VW App,

desaturate the Icons and control the fonts.

I would pay him.



Yes, these videos create a whole lot of disappointing with the product. Sure I understand the first release will be buggy but teasing us with a fluid, stylish and no nonsense interface that isn't part of the package is getting close to misleading. 


I mean how much of this screen grab is real, how much is "aspirational"?


Screen Shot 2017-09-13 at 9.24.14 am.png

Edited by Matt Overton
  • Like 1
Link to comment
  • 0
14 minutes ago, zoomer said:

I meant the stylized toolboxes opposed to what we have to look at in reality.


Looks a bit like the Video wants to sell Archicad 20.


You mean the ones that popup contextually at just the right size for the information so we don't need to clutter the screen with palettes and have a pleasing presentation that is not out of place nor lost to the background?


It's a seriously good mock up of how it should work. 


Link to comment
  • 0
10 hours ago, Matt Overton said:


You mean the ones that popup contextually at just the right size for the information so we don't need to clutter the screen with palettes and have a pleasing presentation that is not out of place nor lost to the background?


It's a seriously good mock up of how it should work. 



Which App do you want to buy ?







For me it feels like the number of colors used in Icons alone by far exceeds the RGB Color Space.

Nothing against coloring to group things or separate in importance.

But just because there are lots of colors doesn't necessary mean you need to use ALL of them.


Ha !

Much better :





I am not very far away from running an Automator Action over all *.png I find in the App Content ;)


  • Like 3
Link to comment
  • 0

I can live with the purple or the outdated icons or the arrows inconsistency, but it would be great to see the option to be able to change the interface to a dark "skin".

When switching between Vectorworks (which I spend the majority of my time in) and Adobe packages (which I use occasionally), I find it much easier and less of a strain to work in the dark interface. I feel like the focus is on the design rather than the whole screen. Personally, I think it looks more professional and up to date. Although, I realise this isn't for everyone, so would be nice to see it as an option (maybe similar to the "Enable Black Background" button)

  • Like 2
Link to comment
  • 0
On 9/1/2017 at 1:04 PM, JimW said:

Right, those are some that (at least primarily) make their own UI rather than using included system elements. C4D for instance has its own version of the menu bar contained within the application window which gives them greater control that I am jealous of.


For me, Cinema4D's UI is the best UI out there. Infinitely customizable and easy on the eyes.  You can arrange your windows however you want, group them, tab them, adjust the font and color or every item. Just great. 

And FAST. 

  • Like 1
Link to comment
  • 0
On 9/2/2017 at 2:39 AM, JimW said:

We're pretty weird in the software world for a lot of reasons. Jack-Of-All-Trades is kind of Vectorworks' thing. 



@JimWOff the top of my head here is a few examples of how you can from 37 to 4


Framing tool: 4 to 1; Structural Member, Framing Member, Rafter, Joist.

2D steel Tool: 20 to 1; (there is a tool for metric and one for imperial) Take the interface of the framing member in regards to selecting steel shape and size and make that into a tool for 2D steel shapes, and then get rid of Angle, Bulb flat, Channel, I beam, Rectangular Tubing, Round tubing, Square tubing, Tee, Wide Flange, Z section

Fixing tool 13 to 2; (one for 2D & one for 3D maybe?). Combine bolt and nut (Imp. + Met.), wood screw, sheet screw, lag screw, carriage bolt, hole, screw thread.

That's just tools that I can see on the "Detailing" tab I have open.

Happy to consult to VW and I can keep going, ha :)

  • Like 1
Link to comment
  • 0
  • Vectorworks, Inc Employee
On 1.9.2017 at 4:15 PM, JimW said:

1) Vectorworks is built to function almost identically for both Mac and Windows.

2) It isn't possible to assign more than a few engineers to work on the overall UI concurrently.
3) No one can quickly agree on what would be better and what would be worse, just that change is needed. 


As the guy who designs most of Vectorworks' icons, I would like to add my 2c to the discussion. First of all: I agree, those icons are too colourful and not up to date. Bear in mind they were developed ten years ago and even with new icons, I must stick to the overall design. We did explore some toned down and flat versions during development of the Resource Browser but decided that consistency trumps design in this case.




As to Jim's comments I would like to add the following:



As for point 1, I know it is hard to get this right. We develop an ERP system based on ACI 4D and it is cross-platform and we had to redesign some UI-Elements (like tabs) to get a similar UX for both platforms.We started 3 years ago to rebuild the application and we changed over 500 dialogs, thousands of controls and hundreds of icons. And we had to endure some flame-wars both internally and with change-loathing customers. We have not finished this task (about 80% are done, now we're into the second 80%) but I would not ever go back.

In Vectorworks, the disparities between its Mac and Windows versions could perhaps be mitigated by 

  • using the same palette docking system
  • using the same type of tabs (especially document tabs)
  • using the same modifier keys (using <alt> on Mac and <ctrl> on Windows makes switching platforms a nightmare. Muscle memory is a powerful thing...)

But, obviously, I agree that a unified, custom-built interface for both platforms would be the grand solution (here's looking at you, Adobe).


As for point 2. I know. We only had 3 engineers for our task. We developed a design scheme and everyone involved had to adhere to it. Once we had everything up and running, things started to fall into place. It was I who brought it up. And I faced the same reservations and preconceptions as the ones you mention. Trust me:

You will never have enough people to redesign UI. It is either in your DNA to do this right from the start or you never will. It is not a finished task either. You need to stay on top of things. Re-evaluate, question current solutions, redesign and re-implement.


It is in Vectorworks' DNA to develop and maintain functions. To make the program stable and reliable. There is even some really good screen feedback (smart cursor, overlays for Working Planes, rotation tool, some Parasolid on-screen stuff, that's really, really good).

However, It is not in Vectorworks' DNA to develop consistent and beautiful dialogs (including the OIP, the Mode Bar and the View Bar), heck, there is not even a framework in place to design pixel-perfect dialogs via the SDK.

Look at this dialog, how many UI-Disasters do you see?



  • The dialog has sliders for Angle and Opacity but not for Blur and Offset.
  • Elements in the dialog are not spaced or aligned in any recognizable fashion. 
  • The labels "Angle" and "Offset" are not aligned with their input control.
  • For Angle, the input control is before the slider, for Opacity, it is after.


That's just plain and simple bread-and-butter design standards. That's not UX, that's UI (read: self respect).

In terms of UX, you would look at this in a different way, that is:

What do you have to do in order to add a drop shadow to an element?

  1. Find the tiny icon in the Attribute palette.
  2. Find the even tinier ellipsis next to it and understand that this is where you can change the drop shadow. Once you have succeeded, 
  3. Change Values for Offset, Angle and Blur.
  4. Press "Preview" repeatedly to see the result. (Even the OpenGL and Ambient Lighting dialogs are now responsive...)

And then, you may still fail because the Drop Shadow Quick Pref has been disabled for the document.


Let's disregard that for the moment and look at the UI thing again: You state that redesigning VWX's UI is a daunting task to accomplish. You are right. But what I am trying to say is: It's not getting any easier by waiting. New interfaces are introduced with each new version. Without a designer to develop and execute some design guidelines, new disasters are bound to happen.


Lastly, your third point. Let me paraphrase it. What you are saying is  "We'll never agree on a design". Ha, I know. That's the hard part. It is incredibly difficult to agree on a design but there are methods to still get it right. In the end, someone has to develop it and stand by it. Look at Adobe. Their interfaces aren't cutting edge or mega-trendy but they are functional and, frankly, a joy to use. Because they care. It's in their DNA. I know what you are about to say (or think).


"Yes, but Adobe have so many engineers for the task".


This is the standard excuse for not caring about UI. You will never do anything about it if you believe that. (excuse my candidness, I know that you personally care a lot, @JimW). I'm just saying: That's the same excuse I was faced with at my company and I had started to believe it myself until I decided I could not bear looking at this can of worms any more.


So, please 

Get a Designer!

Edited by Stephan Moenninghoff
  • Like 2
Link to comment
  • 0

Aren't there any ready to use UI Frameworks one could buy ?

Like CSS templates for you website.

Similar like Redway in Paris sells a graphic framework so that App Developers

don't need to care that much about nasty OpenGL stuff and in house rendering

solutions anymore.


The potential for improvement seems so enormous for me that I think even 1 single

capable part time 2D graphic artist could improve so much,

in appearance and readability,

even without doing real changes to existing UI framework or UX.

By just playing with Colors, Contrasts, Fonts and Sizes, moving some things a bit

where possible and such little things.

So even most change-loathing customers have no changes to blame.



Link to comment
  • 0
On 1/9/2017 at 8:50 AM, Thomas Wagensommerer said:

A design application must not use colors in the interface!


Look at any self respecting or professional design application and please get rid of those colors in the interface.





No law dictates, that the interface of a design applications must be dreary slabs of gray, black, grey and some more gray. It may be fashionable at the moment, but I prefer to be productive in a light and bright environment rather than hip and depressed in a fashionable bore.


Do not listen to Thomas.


I am not against change as such, but let it be dictated by rationality rather than fashion, and let it come seamlessly, so that I do not have to learn my most important tool all over again.


Edited by Kaare Baekgaard
Link to comment
  • 0
17 hours ago, Kaare Baekgaard said:

I prefer to be productive in a light and bright environment

I'm in the light and bright mode, too.  So User skin settings should be way to go for the different prefs.  I'm also for legibility.


Here's some horsing around to show that the itty bitty text could be improved.  It's not a proposal, just a proof of concept for a VP OIP.  Rearranged things so similar functions are near each other.








OIP VP.png


Edited by Benson Shaw
  • Like 2
Link to comment

Join the conversation

You can post now and register later. If you have an account, sign in now to post with your account.
Note: Your post will require moderator approval before it will be visible.

Answer this question...

×   Pasted as rich text.   Restore formatting

  Only 75 emoji are allowed.

×   Your link has been automatically embedded.   Display as a link instead

×   Your previous content has been restored.   Clear editor

×   You cannot paste images directly. Upload or insert images from URL.

  • Create New...