You all know the new Office 365 icons, right? But have you seen an animated version of those icons yet? I haven’t, so I decided to create a few concepts on my own. My source for the designs are from the official Microsoft article which you can find here. So let’s give you an overview of the designs I created:

But first, the following animated designs are only a concept from me and I am not a designer by any means. As you might know, I’m a tech guy but I love design, I like to bring a smile to your faces and maybe, just maybe help you to learn a thing or two about Microsoft technology. If you want to retweet or share them, do that! I would love to see them floating around in that internet 🙂 I would also appreciate if you follow me on my social media channels (Twitter, Facebook &YouTube) and let me know what you think about the concepts! Now, let’s check them out…

Word

The original not animated version or Microsoft Word looks like this:

Microsoft Word Icon – Source Microsoft

My animated concept of Microsoft Word is looking like this:

Concept of an animated Word icon

Intention: I know, not everybody is writing from left to write, but most do. As Microsoft Word is mainly a tool to write, the animation shows a writing action from left to write and from top to bottom.

Outlook

The original not animated version of Outlook looks like this:

Outlook Icon – Source Microsoft

My animated concept of Outlook is looking like this:

Concept of an animated Outlook icon

Intention: I think this animation doesn’t need much explanation, right? The animation shows simply a new email arriving in your inbox in Microsoft Outlook.

SharePoint

The original not animated version of SharePoint looks like this:

SharePoint Icon – Source Microsoft

My animated concept of SharePoint is looking like this:

Concept of an animated SharePoint icon

Intention: As SharePoint often starts with only a “small” bubble, the animation shows how a small idea can grow into something bigger and start different “bubbles” in your SharePoint-World.

Yammer

The original not animated version of Yammer looks like this:

Yammer Icon – Source Microsoft

My animated concept of Yammer is looking like this:

Concept of an animated Yammer icon

Intention: Also quite similar to SharePoint, Yammer often starts with only a few people using it. The animation shows how a small group of “Yamming” people can help pushing it into something used by many different groups in your company and how the conversations become more and more.

Excel

The original not animated version of Excel looks like this:

Excel Icon – Source Microsoft

My animated concept of Excel is looking like this:

Concept of an animated Excel icon

Intention: What would we do without Excel, right? As Excel has many tables, rows, columns and cells (No, it has nothing to do with Dragonball) 🙂 the animation shows working on different cells inside a spreadsheet.

OneDrive

The original not animated version of OneDrive looks like this:

OneDrive Icon – Source Microsoft

My animated concept of OneDrive is looking like this:

Concept of an animated OneDrive icon

Intention: 3, 2, OneDrive. Kind of the intention, I had in mind. You know, it is almost impossible to upload or download something without a little time you have to wait. This is the animation, the blinking OneDrive icon 🙂 I is representing the uploading / downloading time of your data.

PowerPoint

The original not animated version of PowerPoint looks like this:

PowerPoint Icon – Source Microsoft

My animated concept of PowerPoint is looking like this:

Concept of an animated PowerPoint icon

Intention: For me, PowerPoint is one of my favorite tools. I know, I am a tech-guy, but I hope you also see that design and ideas etc. is important to me. Therefore, this animation simply shows you what is key to a PowerPoint presentation. Different animations and ideas of presenting the content.

OneNote

The original not animated version of OneNote looks like this:

My animated concept of OneNote is looking like this:

Concept of an animated OneNote icon

Intention: OneNote is one of my most used applications in the entire Office family, simply because I can build such an easy structure and especially now with the great integration of Office 365 is becomes even more useful to me. The animation shows the creation of new sections in OneNote and builds you perfectly structured notebook.

Skype

The original not animated version of Skype looks like this:

Skype Icon – Source Microsoft

My animated concept of Skype is looking like this:

Concept of an animated Skype icon

Intention: To be honest, I didn’t even think about how to animate the Skype icon. It was that clear to me. The animation shows the “going online” process of Skype, first loading Skype (360°), then the going online (blinking). To me, the right one looks really like an official icon from Microsoft 🙂

Microsoft Teams

The original not animated version of Microsoft Teams looks like this:

Microsoft Teams Icon – Source Microsoft

My animated concept of Microsoft Teams is looking like this:

Concept of an animated Microsoft Teams icon

Intention: Most likely, Microsoft Teams is started by just one person, but it can grow pretty fast and the single person invites one or more into the newly created team. That’s what the animation shows, pretty simply, but also pretty accurate from my opinion

Thank you all for you kind words on my social media channels such as Twitter, Facebook or via mail. I’m super happy that most of you enjoyed the animated design concepts. For all the others who disliked or commented that they don’t like them, sorry, but maybe you guys can share your design concepts so I can learn from you.

Until the next time, don’t be afraIT

LEAVE A REPLY

Please enter your comment!
Please enter your name here