Something wrong with the waffle Mrs. Doodle?

You have the app launcher, right? The waffle that some people like to call it. It is a nice feature in an attempt to actually solve the problem of confused Office 365 users. By confused users I mean users that feel disoriented. They do not know where they are and they can't find where they are going.


But the app launcher is stupid. It only has one purpose: It launches apps. Ok, a user is able to "pin" apps in that launcher to make it a bit more flexible but that is somewhat all there is to it. And what happens if the user tend to pin more apps than he/she actually needs (thinking about the issue that you tend to get when adding too many bookmarks in your browser for instance), then the whole dropdown, flyout or whatever, will be unreadable with too many pinned apps. You won't be able to click on that super-duper shortcut that you need because you can not find it. So it is just a limited bookmark function, it won't fetch any dynamic data that is directed to you. It won't get any functionality that you can take advantage of in you everyday work. Just squares that takes you somewhere out of the current context to another one.

This might the best thing Microsoft can offer the Office 365 users as all different apps has different ways of navigating and the look and feel may also be different but do really SharePoint need to suffer? The intranet users? The waffle may be the only bridge between SharePoint online and the rest of the Office 365 but it should not be a bridge between the island within SharePoint itself. These islands are our islands.

So what if you could have a better way to give the sense unity to the user? What components do we need to solve the issue to bind this whole confusing world together? What do we need to make a very jumpy, insecure place to a place where you find calmness and serenity?

Well, not so much actually...

This concept stands by itself. No need for Viagra here. We need to have a way to navigate where the user feels "at home" and do not get lost while he/she is clicking the way through the paths of information. No matter if we are on our start page of the intranet or on my site or in search or whatever page of information I am visiting, the navigation up at the top should always be the same. And the structure should make sense to me and my organization. We need a way to get and administrate a navigation structure that not necessary is the physical structure in SharePoint. And we need a way to show that information in a way is the same everywhere where SharePoint exists for me as a user.

How do we do this? How can we make this possible without using external tools or something else, raping SharePoint and destroying the ideas of how we should use every piece of information?

Managed Metadata

Store and administrate the information in the MMS. It will be accessible everywhere, can easily be edited and have a global impact. Use Custom Properties to set things like URL, CSS and other properties that can be useful for the navigation component. The out of the box Navigation functionality in the MMS is not good enough to reach out to all web apps and site collections. Therefore we need to create our own information section in the managed metadata to get the functionality we need. Your company Navigation.

SharePoint App Launcher

What if I could read information and use functionality in SharePoint without leaving the context where I am right now? I just want to quick look up something through search but not navigate from the page where I am or maybe look into the newsfeed to discuss something about the latest project I am working on with my colleagues but still I do not want to navigate away from the information I am reading RIGHT NOW. How can we make this possible for users? To take advantage of all of the functionalities?

Ok. We now have our global navigation on top. In place everywhere attached to our custom master page. One area that are not used, where people with large screen always feel is white is on the right hand side. Let's put a bar on that side with a set of icons on it. It is our internal SharePoint App Launcher.

So we have a set of icons and a bar on the side. For example you could have a search icon and when you click on it search slides open as a layer on top. We could have a picture of the current user. Click on it and the news feed slides over the main page, we could even have a notification number next to the photo telling him/her the number of unread news feed items he/she has. We could have internal company links. We could have a number of apps that you have bought or developed always available just as a single page app works.

You can read, interact with other apps and parts of SharePoint without leaving the current context where you are at right now.

Managed Metadata

So how do we want to administrate this? The answer is again MMS. Accessible everywhere and with the flexibility for adding custom properties makes the terms ideal for these type of data. Set the URL to your app, type of rendering (Iframe, HTMLTemplate, JSLink, you get the picture), set icon (URL or person), set if preloading should happen, set a custom CSS class, set if there should be any notification service. You can make it as simple or advanced as you can imagine. You dream it, you build it.

How to implement

I will not give you all the code needed for you to make this concept real but I can give you a few hints and pointers on the way. Some best practices if you may(hate the term though).

Custom master page

You don't need a custom master page if you just want to implement a branding/design but if you have custom components which you need to have available everywhere the far easiest way to do it is through a custom master page. There are ways to make sure that your custom master page is available everywhere, see OfficeDev PnP . One advantage with a custom master page, as Chris O'Brien stated in this excellent post, is that we can actually somewhat control what to release to the customer. Users don't like continuously changing interfaces and layouts. They want to have functions where they used to be and if things is going to change then they want to be informed about it in advance, not have the new stuff thrown in their faces.

JavaScript API

Use JSOM to get the Managed metadata through the API:s that SharePoint gives us. Use KnockoutJS, AngularJS or some other framework to help you with the data binding of the data. It is not rocket science and as you get up to speed you will really improve the way you work with these techs. Also think about caching the data through local storage or some other caching tech in order to speed up the rendering. It will be rendered on every request and we don't want to fetch unnecessary data to slow down the user experience. One thing that can be very disturbing is when the UI jumps or flickers on every page load. By caching and parsing BEFORE page load you can avoid that. Load all necessary SP scripts files and then go in and do your magic as soon as you can after that.

Finally...

There is a lot of things that can be said around this subject and if I would continue to go on I could fill up an entire book. I might have some code coming up in the future so keep an eye out if you are interested in making Office 365 a nicer place.