The Action Center redesign, focused on desktop users

I’ve talked about the Taskbar and how the changes in the action center affects it, but I haven’t showed you yet the Action Center I’ve designed.

In this design I’m focusing desktop users. From my own experience in my office and with my family I’ve noticed that they are reluctant to use any feature using the UI of Windows 8 for being to “weird” compared to the classic desktop one. This is why I’ve made a hybrid between the full screen panel designed for the good old Windows 8 and the panel design used in the calendar flyout in Windows 10.

Project panel (left) vs Calendar (right)

The new design

In desktop mode, the action center pops up as a flyout but as you scroll down, the panel grows to fit the height of the screen. I’ve also added the possibility to pin the action center to the right side of the screen for that crazy wide screens you kids like now a days. This is an early version, I’ll post updates on this in the future.

Expanding the action center using scroll

This way every action on the taskbar behaves similarly. No more distinction between features from Windows 10 (time and calendar) and features from Windows 8 (the connect panel or the project panel).

Keep in mind this design is for desktop. I’ll get to tablet mode in another article.

Quick Settings

This new design of the Action Center and Taskbar lets anything be an action and be pinned to any of them. But regardless of your settings, Quick Settings will always show the progress and devices panel and media controls for apps like Spotify or Groove.

The new Quick Settings expanded

I really miss the old Windows 10 Mobile distinction between the Ringer and the Media volumes, so I’ve added them. Everybody is allowed to dream.

A first concept of the sound panel

I’m bringing back the sliders for the volume and brightness so you can use both the mouse wheel and touch/mouse drag to quickly change its value. At the top of the sliders I’ve put some toggles, at the bottom there are some shortcuts to settings.

The good old Windows 8 sliders, now Fluent style

You can pin them directly to the taskbar as mentioned in my last article.

The brightness slider pinned to the taskbar

Now the quick actions section can hold as many rows as you want when collapsed so when you expand it you can access all other quick settings and the media controls (one banner for each app in the background), the devices panel and the progress panel.

Quick settings now holds multiple rows

In desktop mode, the Action Center will close when opening a panel like the Devices panel or Progress panel. When opened from the Action Center, they will show a back arrow in the title bar so you can go back to the Action Center as it was previously. This way your screen will be always clean information won’t overlap.

Progress and Devices panels opened from the Action center

Developers can design their panels to fit the Action Center design, but they aren’t forced to do it. This way they can port their app slowly to the new system or develop actions that launch more powerful panels.

The possibilities

Now you can have a clean taskbar without loosing any core features.

A clean Taskbar and Action Center
Everything you need can be opened from Quick Settings

What’s next

I’m saving some concepts for the release of the Tablet Mode article. These ones apply only to desktop mode. In these concepts I’m more focused on the experience than on the design. I know they are not visually perfect, I’m trying to get the behavior right first.

Share your opinions and your thoughts, they really help me see things I’ve missed.