I design User Interfaces & Websites.

There are basically two different approaches Mac apps use when it comes to updating. The apps available on the Mac App Store are updated through the Store only – which obviously means that you aren’t really notified of new updates unless you open the App Store. Then, there are apps that aren’t yet available on the App Store for various reasons. Most of these use Sparkle, a free software update framework. It does notify you when you start the app and an update is available – but I believe it’s far to obtrusive. I can at least say for myself that I’m annoyed pretty often when I just want to do something quick with an app and this update window pops up.

So, I set out to do a redesign of the updating UI on the Mac. I believe this would be a very useful change both as an addition to updating through the App Store as well as a replacement for Sparkle. To illustrate my idea, I’ve used a screenshot of the great app Kickoff designed by Benjamin De Cock.

When you open up an app that has an update available, you just get a tiny notification at the top right corner instead of a big window you need to dismiss. You can act on this notification whenever you want – and it doesn’t get in the way when you are in a hurry.

When you click on this notification, a popover appears with additional information like the changes that were made in the update or the version number.

From here, you can either choose to learn more about the new features or go straight ahead and install the update. Of course, you can also dismiss the update by clicking anywhere outside of it.

When you do choose to install the update, the popover changes to the next view.

This dialog shows you the progress of the installation as well as the time remaining. I did play around with a lot of other stuff like the MB’s downloaded and the download speed but I concluded that this if far to technical to be relevant to people.

What I think would be really cool is if you could now dismiss this popover and continue using the app while the update is being downloaded and installed in the background. After all, I started the app to actually use it and I don’t want an update to prevent me from doing that. Yet, I’m still interested in how the update goes.

Moreover, I want to know when the update has been installed so that I can try out the new features. I’d imagine the notification lighting up or blinking for a second to notify me that the update is done.

When I click this notification, I get a another message telling me about the flawless update and prompting me to restart the app (of course, you could also dismiss the popover again and just continue using the app until you decide to quit it).

This is the UI I would envision for a better updating process. One thing I especially thought about was the human aspect. For example, I wrote “update the app” and “restart the app” at first. Yet, it occurred to me that this could be described a lot more easily by just placing the app’s name there. Using static descriptions instead of variables is something that I see many developers do, but I think it’s something really easy to improve. Furthermore, I decided to leave away many of the technical details. I thought it was important not to write “Downloading files…” but instead just use “Downloading…” – files is something developers think about when it comes to updating an app but users don’t. Yet, I guess you could even go one step further and avoid the “installing” and “downloading” phrases altogether and use buttons with “Update Kickoff” instead of “Install Update”.

This might seem like a small change at first, but I believe it could be an important step away from the metaphor of the file system on the Mac (similar to how iOS handles this). Yet, I settled with what you see above as I believe most people are used to these phrases by now and it’s a lot more transparent to those who know a bit more about computers.

You might want to have a look at the full screenshots or the animated version at dribbble.

If you would like to talk to me about this concept or are interested in realizing this, please contact me at me@ziburski.com.