Forum Discussion
Discussion - Updating our interface with Fluent touches
- Jul 14, 2020
Thank you so much for all your feedback on the overall design of the new version of Edge, as it is invaluable to our getting the experience right. A common thread through this feedback has been a lot of discussion about the definition of “Fluent” design, and how it should apply to Microsoft products, so we wanted to share an update to provide some clarity. As opposed to a specific or static set of design rules, Fluent is intended to be an ever-evolving design system across Microsoft products. As the world around us continues to evolve, including devices, interaction models, user habits and expectations, the Microsoft design system must also evolve to meet the changing needs of our users. This means Fluent will not necessarily always represent everything that it did several years ago when the look and feel of the legacy version of Edge was first developed. You can learn more about the current direction of Fluent by visiting the Fluent Design System Page, which provides a summary of the design system as a whole, as well as how it applies to different platforms, applications and controls across Microsoft.
If you browse through the Fluent guidance at the link above, you’ll note that the new version of Edge is aligned with the current direction Fluent is going, and we will continue to evolve along with the design system and Microsoft as a whole. While Edge may be one of the first to put some of these new Fluent elements into practice, you will continue to see other products across the company update to reflect this direction as well. For example, you’ll notice that the latest Fluent designs are characterized by rounded corners across objects and controls, and the new version of Edge is consistent with that guidance. Another example is that there isn't a pivotal focus on transparency in the latest Fluent designs, and surfaces of the new version of Edge reflects this.
This is not to say we will never consider incorporating such aspects into our designs going forward, or perhaps offering options to customize the look and feel, but there are no plans to incorporate these elements into the default experience for all users at this time. However, there are other design investments on our roadmap to continue aligning with the broader Fluent direction, such as updating icons and illustrations across the product. Please continue to send your feedback on the overall Edge look and feel, including preferences and pain points, as we are always open to learning more and updating our direction based on the needs of our users.
- The Microsoft Edge Team
https://techcommunity.microsoft.com/t5/discussions/top-feedback-summary-for-january-12/m-p/2053932 As shown in the link, the introduction of transparency effects for Microsoft Edge dominates the rankings all the year round. Obviously, users are so looking forward to acrylic and fluent design!
With the continuous development of FDS, the transparency effect is no longer the focus. We know that using Navigation in XAML will no longer enable the transparency effect of the underlying window by default, and the default transparency effect will remain in the window of this layer. The difference is shown in the figure
In this picture, the window title bar and toolbar of "Screenshots and Sketches" are transparent to the desktop and windows below
In this screenshot of the Microsoft Store, the elements at the bottom of the window are transparent
At present, it seems that the design team intends to adopt "transparency to the elements in the window" as a trend, and will not develop more transparent title bars and side bars in the future.
Therefore, the focus is not on transparency, but on other areas.
Microsoft Edge now gives me the feeling, as if I changed the Chrome icon to Microsoft's, and then told me, look, this is Microsoft's browser. I think this is a huge irony and tragedy for the visual perception of the Microsoft brand, which means that users cannot really recognize the work that Microsoft is doing on this browser, and-let users understand that this is a different version of Chrome Browser. Microsoft must use practical actions to reshape Microsoft's brand image.
I think the core action is to use native controls, or reshape the appearance of non-native controls that look like native controls. This includes the following:
1. Forward and back buttons, refresh buttons, address bar and toolbar
2. Context menu
3. Edge's special pages, such as settings, downloads, favorites, etc.
For the address bar toolbar area, I think it’s not too difficult to build the appearance with XAML (or WinUI 3). If it is difficult, it is not too difficult to make these controls look like Windows. This area should look exactly like the old version of Edge.
The context menu is a place where it is easy to achieve a smooth design. I think it is nothing more than adding a transparency, adding a matte, adding a noise, adjusting the kerning and line height, and finally adjusting the edge and projection. I don't think how difficult it is, is it really difficult? Or, will you consider WinUI 3 release? Or use XAML island, just like the old version of Edge? Is this really so difficult? I can't understand why I can't do it after a year.
I think any user will notice the huge difference between the sidebar of the settings page and the sidebar of XAML Navigation in "Windows Settings". I don’t want to worry about whether the highlight bar is a rounded rectangle (capsule) or a right-angled rectangle-because Both are FDS, but there is no lighting effect (CompositionLight Class), completely different spacing, inexplicable margins, lack of transparency, all of which remind users that this is a web page, not a native one. UI-based application. It seems to have nothing to do with the Windows design language-although it seems that many applications have to do this, indeed, cross-platform, Web development also meets Microsoft's strategic goals, it is really difficult to resist the temptation. Skype, Microsoft Teams, and Outlook to come,-and the latest file explorer used on Windows 10X, the design looks increasingly unrelated, each team has its own ideas, compare , The unification of macOS is simply outrageous!
I implore the development team to read this article to help users build a harmonious and unified appearance, One Windows, One Microsoft
https://medium.com/microsoft-design/fluent-makeover-photolab-a583d25f362b
I said this before and I'm saying this now - i like nothing about chrome and everything about original edge based on EdgeHTML. New edge has precisely none of the advantages I liked in original edge. You can't mistake it for a UWP app that is built into OS. It is not great with touch response, the touch experience is not even tracked as a quality area.
Pretty sure if edge was forked, these things should have been on the horizon atleast, but now with chromium there are not even any exciting future plans. Nothing worth looking forward to has been announced.
Come on microsoft. Give us something.
- HotCakeXJan 16, 2021MVPWell, we can all appreciate Chromium's most powerful JavaScript engine (V8) and Blink engine, they are the best on the market, But, Edge legacy had the best UI and UX, the 2 need to be combined so have the best of both worlds.
I'm sure once WinUI 3 reaches stable status and gets more feature, Win32 programs such as the new Edge will be able to look more beautifully and more UWP elements will be available to them.- DeletedFeb 28, 2021Twój głos jest ważny - popieram !
Andrzej - cheeseleaderJan 17, 2021Iron Contributor~ 2 year old article.
https://www.windowscentral.com/new-microsoft-edge-wont-look-chrome
Posted today in r/MicrosoftEdge
https://www.reddit.com/r/MicrosoftEdge/comments/kz08bv/reality_looks_much_uglier_then_what_was_promised- HotCakeXJan 24, 2021MVPYeah, well now the fluent design elements, the icons are here in Edge, but the big thing is the UI that is missing those touches. and the fact that they denied the acrylic UI instead of just saying planned or not decided yet, is kinda worrying.