intranet design examples

Branding an Intranet: Guidelines for Logo, Name, and Style

Use  SharePointNA Registration Discount Code : YARO

Intranet branding is often confused with the user interface design. Although user interface is part of the brand there are more elements to it such as: intranet logo, intranet name, tone of writing, and design.

In this post we’ll take a look at some of the best practices when it comes to branding your intranet to make it relatable to your organization.


Style Guide & Theme

When building a brand new or redesigned intranet, many organizations reuse their public-facing website style guide.

Style guides typically contain:

  • Logo usage guidelines

  • Colors

  • Fonts and typography

  • Image usage best practices etc

There is nothing wrong with using your public-facing style guide for an intranet, but it’s important not to copy the public website’s look and feel completely.

Here is why:

Avoid Source Confusion

Often times intranet contains links to your public site. We’ve seen users confused when they click on the link in the intranet and end up on the public site thinking they’re still on the intranet. This is more typical for intranets which have near-identical design as the public site. Try to avoid that.

Remember Intranet Use Cases

Another element to consider are the types of devices people will be using when working with the intranet. This will dictate:

  • Supported screen resolutions. Intranets typically support wider screens to utilize screen real estate for document management

  • How you present content on the site. Intranet users come to your intranet much more often and content needs to be optimized for quick access.

  • How do you handle mobile devices. Mobile is less prominent for the intranet and you may save budget with only branding key areas where mobile access is important, as opposed to entire site.

Remember Intranet Audience

How and what you target as your intranet audience will drive what content should be on it.

Content targeted to employees and staff is different from content you write on the web. The table below illustrates how the audience and technology is quite different between platforms.

Public sites usually have a dedicated team authoring and maintaining the content. Intranet in turn is usually a part-time team of contributors.

 

Audience

Technology

Capabilities

Public-facing website

Millennials

Opensource that’s highly flexible

Full-time large team, fair budget, fair timeline

Intranet

Millennials, Gen-X, Baby Boomers

Intranet solution (ex.: Office 365) that does the heavy lifting, but dictates much of the UI design

Part-time small team, small budget, short timeline

Source: Nielsen Norman Group

Style Guide Best Practices

With that, here are the best practices on what to use from your public facing website style guide, and things to consider:

  • Don’t overbrand it or make it into an art showcase

    • Remember who your users are and what they need from an intranet

    • Don’t deviate from corporate branding to the point of being unrecognizable

  • Don’t replicate the public site look

    • It will set unnecessary expectations and confuse others

  • Keep fonts and colors

  • Keep page header simple

    • Majority of real estate will be used for document management; avoid taking up space

Intranet Name

The intranet name is another important aspect of branding. In fact, there are many strategies to help you come up with a creative name for your intranet including crowdsourcing with your staff.

Organizations are often afraid that crowdsourcing will produce really bad results and the company will have to either stick with it or come up with a better name. There are strategies you can use to avoid a negative outcome.

Define Intranet Purpose

It all starts with why you’re rolling out the intranet. Your staff (even if it’s just a handful of decision makers) needs to agree on that. It can’t just serve or be understood by one or two people.

Is your intranet there to:

  • Help people connect

  • To help find information

  • Document management

  • Employee engagement

  • All of the above?

Define key goals behind the intranet and come up with the name that suites that goal.

For example, the name “watercooler” sounds like it’s geared towards employee news, events and other employee related topics and not much of a place for corporate information or document management. If that’s your goal for the intranet - then it’s great; if not, you might want to reconsider.

Some Bad Examples

Avoid naming your intranet with generic terms such as:

  • “SharePoint”

  • “Intranet”

  • “Portal”

  • “[company name] Portal”

  • Abbreviations

  • Lengthy names

  • Hard to pronounce names

NOTE: Intranet URL and intranet name are not one and the same

Your intranet URL can be sharemuch.sharepoint.com due to naming restrictions but have a meaningful name for the site itself which can be used for as an intranet logo.

Logo

Intranet logo is best when it’s clear and simple, and includes your intranet name.

Things to consider:

  • Ensure you maintain square proportions as much as possible

    • Office 365, for example, uses the logo everywhere on the site and in some places, you can’t control how the system resizes it.

  • Avoid all white color logo

    • Again, office 365 out-of-the-box components use this logo everywhere. In some places you may end up with “blank” square if your logo is completely white.

  • Avoid intranet name + company logo together

    • The issue is here is that users may be confused which logo they should click on to get “back to home,“ as the logo is often link to the home page.

    • Another issue is that it increases the length of the logo and Office 365 may squeeze or resize the image, making it look disproportionate or cut off.


Footer

The purpose of the footer is to help the user find other important pages on the site and contact information for the intranet team.

It’s become common to have a large footer on the intranet and mimic site top navigation in it. It’s not a bad strategy but there are few things to consider:

  • Ensure links and information in the footer are up to date

    • Top navigation usually changes with the site structure automatically, the footer often gets forgotten and links become broken or obsolete.

  • Avoid social media icons in the footer especially if you have social media feeds on the site - this becomes duplicate information.

  • Keep number of sections less than 7 (see below; 4 sections already look busy)

  • Avoid making it flashy, it’s just a footer

SharePoint Intranet Article Page.png

Conclusion

Intranet branding goes beyond the colors of the site. It’s about the purpose and serving the content to the right audience. Make it relatable and unique enough from your company public site but not an art project on its own. Remember the resources typically available for maintaining the intranet are less than that for public site and those need to be considered.

Have a comment? Drop us a note!

Pre-built intranet. Branded, and tailored to your organization

ypentsarskyy_2016_small.jpg

Yaroslav Pentsarskyy is the Director of Product at Origami, a rapidly growing service and product offering which enables organizations to get an intranet designed for them without starting from a blank page. He's also 8 time Microsoft MVP, speaker at many local and worldwide tech events, and a published author of several SharePoint related books.

@spentsarsky

6 SharePoint Intranet Examples and Templates

Use  SharePointNA Registration Discount Code : YARO

Having an essential set of templates for your intranet pages radically cuts down on time required to build new and maintain existing content. If those templates are well designed, modern and user friendly, and your content hierarchy is well designed, the adoption rates and user satisfaction increase exponentially.

We've put together several of our favorite design configurations all built using Origami to help you come up with some amazing ideas. With a just little bit of content, you have a shiny new intranet design waiting for you.

Intranet Home Page

Intranet Home page is essential and yet is often over-branded or under-branded.

Here are few important considerations for the intranet home page:

  • Ensure your intranet has a clear name and logo

  • Use corporate colors

  • Easily accessible search

  • No need to brand quick links, just make them prominent

  • Clear and well designed navigation

  • Access to [view more] details in tools and apps

Intranet Information Landing Page - clear headings and sections describe groups of content on the page. Set of links [Popular Content] helps users identify forms, templates, and other articles they may want to read.

Intranet Landing Page

Landing pages for some of the key areas of the site are a must for several reasons:

  • They provide a place for users to land as they navigate the breadcrumb

  • They group similar content and help new users not yet familiar with the hierarchy

  • They are the perfect area for KPI’s, apps and widgets which display summary of information on lower levels of the site

    • For example: systems availability widget can sit on a landing page for “Business Resources“ with a link to more details. Without this design pattern the intranet would be just full of links.

Below is an example of simple yet functional landing page for departments and projects where users can navigate to the department workspace or find the project they’re working on.

SharePoint Intranet Landing Pages.png

Intranet Resource Hub

One level below each landing page is in most cases an Intranet Resource Hub.

Here are some examples of how this template is used on a typical intranet:

  • Who We Are page

  • Delivery Processes

  • Employee Benefits Information

  • KnowledgeBase hub

  • Training Site

  • New Employee Site

These are sub landing areas with content produced by one more departments serving a particular business function.

This simple yet common design makes up for the majority of intranet information pages. The main strength of this page design is the simplicity. Users expect to quickly scan the content for what they're looking for, and this design delivers just that very well.

SharePoint Intranet Resource Hubs.png

This page uses the 2 column layout available in SharePoint out-of-the-box. It takes just few min to manually put together content on this page with combination of Origami and SharePoint tools.

Intranet Hub Content Page

Below each hub, of course are article pages delivering simple access to content whether it’s a set of document libraries or just a page with relevant information. Here is an example of this design.

SharePoint Intranet Article Page.png

Few things to note here: Contacts, and breadcrumb.

Contacts app will help with governance and allow the reader to contact relevant SME for this area instead of IT or Communications. Breadcrumb helps with context of this page.

Forms and Templates Center

If there is one area each intranet should have, it's some place where staff can access samples and templates. Samples are essential to knowledge management and retaining organizational knowledge. If more of your staff can find relevant samples, the less work they need to do from the scratch.

Here is an example of how a typical Forms and Templates site looks like:

Forms and Templates Center - helps staff find relevant samples and forms. On the left hand side - [Tags], allows to filter forms by relevant category. Search box and preview panel in a center allows to quickly read more about the form before opening or downloading it. Contact   person allows to quickly reach out in case relevant form doesn't exist. Finally, if there are any recently updated forms, they will automatically show up under [Latest Updates]

Here are the other types sites which can be served using Forms & Templates Center type layout:

  • Resources

  • Glossary Database

  • Policies and Procedures

  • Knowledgebase

Another variation of this design is employee directory tool.

Project Sites

Project sites are often an afterthought and put together as a rudimentary team site with few libraries. Often time for the team member to find a file they have to navigate through folder of arbitrary chosen structure dependent on the project manager who ran that project.

We recommend using a template for your project sites just as you’d use a template for everything else. Typical project site template contains a timeline and key project phases with pre-created repositories to drop off relevant documents. Our template also includes planner tasks and notes which are useful for projects with more than 5 team members.

Here is an example of how the project site looks like in Origami.

SharePoint Intranet Project Site.png

Thanks for making it this far. If you have an existing intranet needing an upgrade, be sure to get in touch with us to see how easy it is to apply these beautiful templates to your existing site.

Pre-built intranet. Branded, and tailored to your organization

ypentsarskyy_2016_small.jpg

Yaroslav Pentsarskyy is the founder of OrigamiConnect, a rapidly growing service and product offering which enables organizations to get an intranet designed for them without starting from a blank page. He's also 8 time Microsoft MVP, speaker at many local and worldwide tech events, and a published author of several SharePoint related books.

@spentsarsky

Essential intranet design examples and templates

Use  SharePointNA Registration Discount Code : YARO

NOTE: More recent intranet templates and examples

Origami's mid-year update brings a new array of configurations for your intranet design to make every page stand out. You can do this if you already have an intranet and want to take advantage of a fresh new look on your pages. If you're starting with a brand new intranet, even more options are available to you.

We've put together a few of our favorite design configurations to help you come up with some amazing ideas.

Everything you see here has been put together with tools available in Origami and SharePoint. With a just little bit of content, you have a shiny new intranet design waiting for you.

Information Article Page

This simple yet common design makes up for the majority of intranet information pages. The main strength of this page design is the simplicity. Users expect to quickly scan the content for what they're looking for, and this design delivers just that very well.

Here are some common user cases for an information article page:

  • Who We Are

  • Delivery Processes

  • Guidelines & Procedures

  • Employee Benefits Information

  • Process Stages

  • Knowledge Base Article

Here are two examples of what an information page can look like:

Intranet Information Landing Page - clear headings and sections describe groups of content on the page. Set of links [Popular Content] helps users identify forms, templates, and other articles they may want to read.

Intranet Information Landing Page - clear headings and sections describe groups of content on the page. Set of links [Popular Content] helps users identify forms, templates, and other articles they may want to read.

Intranet Information Article Page - features content broken down into key sections helping users find areas they're looking for. Contacts allow users to ping relevant contributor if information is inaccurate or missing. FAQ allows authors to answer popular questions. Relevant Documents are handy for templates or forms relevant to the article.

Intranet Information Article Page - features content broken down into key sections helping users find areas they're looking for. Contacts allow users to ping relevant contributor if information is inaccurate or missing. FAQ allows authors to answer popular questions. Relevant Documents are handy for templates or forms relevant to the article.

Both pages are using 2 and 3 column layout. When we read text, our horizontal attention leans towards the left, that's why we recommend stacking key content in the left column while any supporting content (forms, templates, etc), to the right.

Resources or Department Site

The Resource site is there to provide references built by a specific team or a department for the rest of the organization.

Typical use cases for the [Resource] or [Outward Facing Department Site] include:

  • Marketing Resources Site

  • HR Information Site

  • New Employee (or Onboarding Information) Site

  • Department Initiatives Site

Here is how a landing page for this site could look like:

Intranet Department or Resource Site Landing Page - a place for staff to find resources produced by a specific team or purpose. [Featured] content at the top helps draw attention to latest or most popular articles (see Information Page); followed by [In This Site] helping users to key content on the site. Contacts helps finding relevant site contributors; FAQ is also an easy way to answer popular questions.

Intranet Department or Resource Site Landing Page - a place for staff to find resources produced by a specific team or purpose. [Featured] content at the top helps draw attention to latest or most popular articles (see Information Page); followed by [In This Site] helping users to key content on the site. Contacts helps finding relevant site contributors; FAQ is also an easy way to answer popular questions.

This page uses the 2 column layout available in SharePoint out-of-the-box. It takes about 20 min to manually put together content on this page with combination of Origami and SharePoint tools.

Forms and Templates Center

If there is one area each intranet should have, it's some place where staff can access samples and templates. Samples are essential to knowledge management and retaining organizational knowledge. If more of your staff can find relevant samples, the less work they need to do from the scratch.

Here is an example of how a typical Forms and Templates site looks like:

Forms and Templates Center - helps staff find relevant samples and forms. On the left hand side - [Tags], allows to filter forms by relevant category. Search box and preview panel in a center allows to quickly read more about the form before opening or downloading it. Contact   person allows to quickly reach out in case relevant form doesn't exist. Finally, if there are any recently updated forms, they will automatically show up under [Latest Updates]

Forms and Templates Center - helps staff find relevant samples and forms. On the left hand side - [Tags], allows to filter forms by relevant category. Search box and preview panel in a center allows to quickly read more about the form before opening or downloading it. Contact person allows to quickly reach out in case relevant form doesn't exist. Finally, if there are any recently updated forms, they will automatically show up under [Latest Updates]

Here are the other types sites which can be served using Forms & Templates Center type layout:

  • Resources

  • Glossary Database

  • Policies and Procedures

  • Knowledgebase

Above template uses [Blogs] landing site in SharePoint online with Origami enhancements to show tags, search, and accordion-like list. The interface is connected to a document library allowing for approval of each template before it's published for everyone to see.

Projects & Workspaces

One of the primary objectives for any intranet is the ability to store documents and be able to find them easily. Documents are often grouped by a client, project, initiative, and other workspace sites. It's important to help your team find the relevant groups.

Project and Workspace template shown below allows staff to immediately search by their project and add them to individual favorites for quick access in a future.

Project and Workspace Site Directory - allows to quickly search and access your staff cares about. Personal favorites are displayed at the top. Project managers and authorized staff can create new sites.

Project and Workspace Site Directory - allows to quickly search and access your staff cares about. Personal favorites are displayed at the top. Project managers and authorized staff can create new sites.

Here are few other use cases for the Project & Workspace site:

  • Document and Record Center

  • Team Site Landing

Employee Engagement and Communication

Having a place on your intranet for employees truly helps build the culture and connect, especially for new staff members. You can increase employee engagement by adding a few interactive tools where staff can comment and post ideas.

Here is an example of our employee landing page:

Employee Engagement and Communication features distinct banner followed by the list of key links promoted by the company. [Ideas & Feedback] let's employees post ideas and others to comment or [like] them. [Quick Poll] will capture opinions on the latest hot topic and allow others to suggest a poll. [Classifieds] serve as an internal marketplace and fundraiser. [Recognitions] allow employees and management nominate others for the job well done.

Employee Engagement and Communication features distinct banner followed by the list of key links promoted by the company. [Ideas & Feedback] let's employees post ideas and others to comment or [like] them. [Quick Poll] will capture opinions on the latest hot topic and allow others to suggest a poll. [Classifieds] serve as an internal marketplace and fundraiser. [Recognitions] allow employees and management nominate others for the job well done.

All components on this page are built on a top of SharePoint existing framework, so you can always enable approval or alerts to manage content before it's published. Whether it's a new idea suggestion or shout out, managers can turn on auto approval or moderation depending on company policies.

Thanks for making it this far. If you have an existing intranet needing an upgrade, be sure to get in touch with us to see how easy it is to apply these beautiful templates to your existing site.

Turnkey, no-hassle intranet for your organization

ypentsarskyy_2016_small.jpg

Yaroslav Pentsarskyy is the founder of OrigamiConnect, a rapidly growing service and product offering which enables organizations to get an intranet designed for them without starting from a blank page. He's also 8 time Microsoft MVP, speaker at many local and worldwide tech events, and a published author of several SharePoint related books.

@spentsarsky

Building Better Business Case for Employee Engagement and Communication

Use  SharePointNA Registration Discount Code : YARO

Employee engagement is not a nice-to-have, but how do you measure it?
--Source: 15five

Employee Engagement

Employee engagement is tightly connected with organizational culture and a key way of seeing what people think about the work climate.

Engaged employees result in increased organizational performance because they tend to care about how thing are running, resulting in process improvements, fresh ideas, better problem solving, and have more drive to succeed.

Measuring Employee Engagement

So what are the qualitative metrics involved?

According to Gallup, businesses with highly engaged teams experience a 20% lift in productivity. According to the Workforce Institute on Absenteeism, businesses saw a drop in absenteeism (unearned PTO) by 41% when teams were engaged in their work.  

On average, highly engaged teams will experience a 40% improvement in turnover. This improvement can vary from 24% in high-turnover organizations to 59% in low-turnover organizations. You can find more details about this in the Gallup Q12 Meta-Analysis Report.

Since engagement and communication go hand-in-hand, effective employee communication is a leading indicator of financial performance and a driver of employee engagement. Companies that are highly effective communicators had 47% higher total returns to shareholders over the last five years compared with firms that are the least effective communicators.

Being able to measure engagement in your organization is critical to building a convincing business case on how it's improving and in turn the impact brought to an organization. Measuring business metrics (unearned PTO, improvement in turnover etc) requires time since you need a good sample of data to be able to flag trends. Usually you need to wait 6 months to a year to be able to say how the organization is trending in terms of turnover etc.

There are far more immediate tools you can use today to capture measurable employee sentiment and engagement.

Tools

In many organizations, company intranet has become a main tool to share information and collaborate. It is also often used as a communication and engagement tool. By enabling some of these engagement features you can gain a relatively quick insight.

Here are some of the features we recommend to measure and improve your employee engagement through company intranet:

shout+outs.PNG

Staff recognition and new staff shout outs can serve as a broadcast to communicate new employees joining the team. You can also enable "likes" and  "comments" to see how many of the staff are actually reading new updates and actively "liking" the update. Higher likes in turn mean your staff is excited about new members joining the team and care about them being welcomed to the group.

Polls
Timely polls can gather valuable insight about what your staff thinks about various issues. It's an easy way to test ideas.

poll.PNG

Remember to keep things simple in terms of poll questions and answer options. We also recommend enabling the ability to suggest a new poll to give your staff an option to voice what is important to them. A time limit encourages interested parties to cast their votes. If they miss something they care about, they will check that area of the site more often. Naturally more votes mean better engagement, but make sure that questions are relevant and relatable.

Idea submissions
Just as polls, idea submission allows staff to describe an issue and their idea in detail. The key here is to collect the name with each idea and not making it anonymous. This promotes ownership of the content that's created. Additionally, we recommend enabling likes and comments so that others can vote up the idea or ask questions. Anyone who submitted an idea always wants to be recognized, we recommend including "resolution" or "outcome" section for each idea where management can comment on whether this idea is [In Works] or [More Detail Required]

ideas.PNG

Featured Staff News
Another great tool which is free in most intranets is the Featured Events tool. We recommend featuring spotlight articles on your employees to bring up interesting stories and spark a conversation. If available in your intranet, enable comments and likes to be able to see what kind of engagement you get on this content.

In summary

Measurement is critical. Companies that are less-effective communicators are much more likely than highly effective communicators to report having no formal measurements of communication effectiveness.
Build quick and concrete evidence of employee engagement by enabling social likes and comments features in your intranet. Take advantage of some of the built-in widgets such as polls, idea submissions, and shout outs.

Photo by rawpixel.com on Unsplash

Leave your comments on what are some of the things you're curious about and we'll try to get an expert insight on the topic

ypentsarskyy_2016_small.jpg

Yaroslav Pentsarskyy is the founder of OrigamiConnect, a rapidly growing service and product offering which enables organizations to get an intranet designed for them without starting from a blank page. He's also 8 time Microsoft MVP, speaker at many local and worldwide tech events, and a published author of several SharePoint related books.

@spentsarsky