There are many potential threads to this question I want to ask, but I will just limit it to two aspects from this example:
Firstly, in the Insert Picture Dialog there are five different types of dropdown selection controls on the screen. I understand that each has a slightly different functionality and therefore look and feel. However, this is quite different from my understanding of a flat/metro style of design where the interaction reveals the behaviour of the controls. So is it an incorrect application of the UX design guidelines to make the controls look the same but have different focus/hover interactions?
Secondly, I am trying to understand the hierarchy or structure to the interface layout. There are navigation elements on the left and at the top, and the filter/sort options are scattered at the top and bottom. Are the UI elements aligned individually within each section/group, and then aligned at a higher level? I would have expected to see some basic alignment of the right edges of the "Search Pictures" box with the "Cancel" button and the scroll bar, or perhaps the "File name:" dropdown aligned with the Organize dropdown, or maybe the "Tools" and "Insert" dropdown in the same grouping. Is there some rule being applied or have I missed them?
In the new Office 2013 applications, the layout and alignment also seems to be difficult to gauge. There is top alignment of the buttons, but the input field is not quite center-aligned with the buttons. The spacing is different between the input field and the text area, and the "Subject" label seems slightly out of place as well. The padding around the entire section is thicker at the top compared to the bottom as well. Any hints on what the rule applied would be appreciated.