Action Center and System Tray, a battle for the Taskbar

Samuel Ojeda
7 min readAug 8, 2018

--

Nice drawing

This is a very ambitious part of my project. It involves a lot of changes in how windows is made but I’ve tried to unify and simplify all we have now to make it more usable and powerful.

The main feature of Windows is the Taskbar and it has received new features since the first release of Windows 10 but they are inconsistent and unintuitive for new users.

Let’s go part by part

Right now we have six different elements in the taskbar:

  • The Start, Cortana and Task View buttons
  • Pinned and opened apps
  • My people
  • The system tray
  • The system toolbars: the language toolbar, Windows Ink, Keyboard, time…
  • The action center button

This is a very complex design and it’s very difficult to adapt to different form factors (just unlock the taskbar and make it taller, you might wanna cry), and let’s not event talk about tablet mode where the system tray just vanishes.

The system tray is a feature that survives to time because there are apps that still use it, but it’s just a messed up drawer that holds everything and nothing at the same time: you can’t rely on it to show you all background processes and it doesn’t really fit the OS, each app does what it wants. So this is my solution, let’s chop its head of! (but slowly).

One to save them all

The idea is to find something that can hold the capabilities of all the actions you can execute through the current taskbar, but we don’t have to be too imaginative as the solution is already in Windows: the Action Center.

But the one we know is not enough to hold everything together, so I’m introducing…

The Action Center Pins

Now every action previously made as a toolbar is included in Action Center. This way you can pin whatever you want to the taskbar like classic default system actions such as time, Windows Ink, the sound flyout… but also any toggle or action from the Action Center like the new progress panel (ups spoiler), a slider for the brightness, the Gamebar, the Connect panel…

This also works the other way around. Do you want to pin the clock in the Action Center? Well why not!

But this bad boy needs some new actions to hold everything I’ve just slayed. Presenting:

The progress panel

This baby hosts every process that manages files or any kind of background processes like OneDrive, Dropbox, Microsoft Edge downloads, print progress…

Image of the progress panel pinned to the taskbar

It provides a unified experience to check your processes and should be independent to the foreground app so if you close the main process the download won’t get interrupted unless you kill that particular process.

Light and dark modes

The device panel

It hosts the status of any device connected, like your printer status, USB drives, SD cards, phones, your headphones, keyboard and mouse, wireless screens, smart home devices… and provides the basic actions you’ll need to manage your devices.

Device panel

Its purpose is to have a place where the user can manage all its external drives, pin them to its taskbar… and where to manage wireless devices, view their status…

Device panel pinned

These two will be always available in the Action Center, and by default they will be also pinned to the taskbar. The user can choose how many icons are shown before overflowing to keep their taskbars clean and can pin all the items they want so they are always visible on the taskbar.

Custom actions

Any developer can add actions to the action center to replace their current one in the system tray. Depending on the kind of app, maybe an action is not suitable, maybe they have to make a process for the Process Panel or a regular background task… (for instance, I never understood why there is an icon for the antivirus. If you want to use it, you’ll search for it in Start; if there is a warning, it’ll pop up as a notification).

The system tray (say what?)

Until every developer generates an action for the Action Center or the user doesn’t need any app that uses the system tray, there will be a remaining panel that lets the user interact with these apps and will be hidden once the device is not running any apps that require this feature. The user can pin apps to the taskbar or hide them into the System tray as it’s now. By default it will be pinned to the taskbar in desktop mode but not in tablet mode, but now you can add a toggle to the Action Center to access it easily.

System tray in light and dark mode

This way the user will have by default the same taskbar as they had in previous versions of Windows but with some personalization they can build their own taskbar.

But why bother?

Why do we have to change everything if it’s going to look the same? Is it just change by the sake of change?

Remember that the desktop is not the only form factor shipped now a days. This is very beneficial for every user because it provides generalization, which is needed for adapting the OS, making it more powerful. You’ll see this in action in my article about Tablet Mode.

Customizing the taskbar

To give your personal touch to the taskbar, in settings you will find a list of every action installed and the option to:

  • Pin the action to the taskbar in desktop mode
  • Pin the action to the taskbar in tablet mode
  • Pin the action to the action center

The list of actions I’ve thought of is the following:

Table of actions and default settings

With all this options (and more if you count any action added through the store) you can make the Taskbar the ultimate control center of your device or the perfect most clean tool you have, all at your fingertips.

For instance you can add toggles to the taskbar, sliders, a button to open the game bar, you can reorder all your actions wherever you want…

Example of weird layout

For narrow taskbars

What happens when you pin too many items to the taskbar? In this case, the Action Center Pins overflow to a dialog similar to the system tray one. This is useful when you use your Surface in horizontal orientation more often than in vertical orientation, so when you change your items don’t fit the screen.

To avoid overflow you can customize how many Actions you have pinned and how many items My People, the Progress Panel, the System Tray and the Devices Panel show before overflowing.

Narrow taskbar showing small Cortana icon, less contacts, processes and Action Center pins

For powerusers

The taskbar is really bad at handling non default formats like two rows, vertical orientation and using labels. This is a basic concept showing the new layout of the taskbar in this situations. It’s not perfect but it’s a start, focus on the concept.

The taskbar in two rows

In this horizontal layout we get more room than in the current one.

From left to right: vertical in one row, vertical in two rows and vertical in one row showing labels

Currently, labels are only shown if the app is open. Why, Glob, why? I like it more this way but it wouldn’t hurt to add an option in Settings just in case.

Check out the screenshots in your device

If you want to see how this would feel on your device you can download the renders in this OneDrive folder. They are designed for the Surface Pro.

Taskbar renders

Complete project renders

There is a lot more coming

This concept is the base for the rest of this project and will evolve with it as I continue developing this ideas. There are a lot of things I haven’t showed you yet. There are more spoilers coming soon. Follow me to discover more and don’t be shy and comment, discuss and criticize all you want.

If you liked it remember to share and if you use this content remember to mention the author.

--

--

Samuel Ojeda

Computer Science student by day, self taught designer by night