This slideshow presents 31 examples of intranet homepage design concepts, with example screenshots. We've pulled the screenshots from the entries in the My Beautiful Intranet 2014 competition.

1. 31 intranet homepage
design examples, with
screenshots
Analysis of entries from
My Beautiful Intranet 2014

2. Twitter: @DWG
www.digitalworkplacegroup.com
6 ways to present quick links
on your intranet homepage

3. Twitter: @DWG
www.digitalworkplacegroup.com
Adobe – “Popular resources”

4. Twitter: @DWG
www.digitalworkplacegroup.com
Adobe –
“Popular Resources”
• Left-hand side of the page
• Called “Popular Resources”
• Some links are the same for all employees
• Some links are personalized based on
location and role

5. Twitter: @DWG
www.digitalworkplacegroup.com
ACCA – “Key Links” / “Popular Pages”

6. Twitter: @DWG
www.digitalworkplacegroup.com
ACCA –
Dynamic and static links
• Right-hand side of the page
• Two different sections
• “Popular pages” auto-generated
based on intranet page views
• “Key links” and “Admin links”
maintained by Intranet Manager

7. Twitter: @DWG
www.digitalworkplacegroup.com
AmBank – “Launch application”

8. Twitter: @DWG
www.digitalworkplacegroup.com
AmBank –
“Launch Application”
• Right-hand side of the page
• Drop-down list of common apps
• Title uses action-oriented language
• More specific than just “Links”

9. Twitter: @DWG
www.digitalworkplacegroup.com
ARI – “I would like to”

10. Twitter: @DWG
www.digitalworkplacegroup.com
ARI –
“I would like to”
• Right-hand side of the page
• Simple task-based language
• Users can relate to “I would like to:” title

11. Twitter: @DWG
www.digitalworkplacegroup.com
Suncor – Quicklinks dropdown menu

12. Twitter: @DWG
www.digitalworkplacegroup.com
Suncor –
“Quick Links” dropdown menu
• Right-hand side of the page
• Drop-down menu saves space
• Standard “Quick Links” heading

13. Twitter: @DWG
www.digitalworkplacegroup.com
UNUM – sorted links

14. Twitter: @DWG
www.digitalworkplacegroup.com
UNUM –
Sorted links
• Left-hand side of the page
• Links sorted into labelled groups

15. Twitter: @DWG
www.digitalworkplacegroup.com
5 examples of icons for listing
tasks on intranet homepages

16. Twitter: @DWG
www.digitalworkplacegroup.com
Vinarco –
Simple icons

17. Twitter: @DWG
www.digitalworkplacegroup.com
Vinarco –
Simple icons
• Top right of page
• Consistent, minimalist design
• Simple design lets icon text stand out
• Tab name contributes context to tasks
• Section title positions user as actor
• Multiple tabs allow for shorter lists,
greater use of available space

18. Twitter: @DWG
www.digitalworkplacegroup.com
Oddball – Icons

19. Twitter: @DWG
www.digitalworkplacegroup.com
Spectrum Association Management –
Branded, stylized icons for tasks & info
• Top middle of page
• Large simple iconography
• Consistent colors & design
• Mix of specific tasks and more general
information

20. Twitter: @DWG
www.digitalworkplacegroup.com
Wheatley Group – Big buttons

21. Twitter: @DWG
www.digitalworkplacegroup.com
Wheatley Group –
Big simple buttons in brand colors
• Top right of page
• Large, simple, easy-to-read “buttons”
• Short list makes selection easy
• Different colors support memorability
• Text stronger visually than icons
• Large size & placement suggest high
priority or very common tasks

22. Twitter: @DWG
www.digitalworkplacegroup.com
Business Environment – Big icons

23. Twitter: @DWG
www.digitalworkplacegroup.com
Business Environment –
3D icons for tasks & tools
• Top right of page, horizontal list
• Large, simple icons aid recognition
• Visuals much larger than text
• Visual variety helps with memorability

24. Twitter: @DWG
www.digitalworkplacegroup.com
Children’s Trust –
Keyboard buttons

25. Twitter: @DWG
www.digitalworkplacegroup.com
Children’s Trust –
Keyboard styled icons/buttons
• Top left of page
• Color variety aids in memorability
• Use of color ties in with mission
• Mix of specific and general info

26. Twitter: @DWG
www.digitalworkplacegroup.com
10 ways to bring social onto
your intranet homepage

27. Twitter: @DWG
www.digitalworkplacegroup.com

28. Twitter: @DWG
www.digitalworkplacegroup.com
Dorel Juvenile –
Persistent right-hand social column
• Action-oriented right-hand column
• Persistent throughout intranet
• Lets users keep up with conversations
without returning to a dashboard page
over and over

29. Twitter: @DWG
www.digitalworkplacegroup.com
Suncor –
Show number of comments for news stories

30. Twitter: @DWG
www.digitalworkplacegroup.com
Suncor –
Shows number of comments for news stories
• Shows popularity of articles
• As big a draw as articles themselves
• Compels users to read the story
• Invites more participation

31. Twitter: @DWG
www.digitalworkplacegroup.com
Mediterranean Shipping Company –
Sort news by most commented and liked

32. Twitter: @DWG
www.digitalworkplacegroup.com
Mediterranean Shipping Company –
Sorts news by most commented and liked
• Sorts by most popular news/discussions
• Sorts by comments or “Likes”
• Surfaces what people are interested in
• Invites participation
• A good compliment to chronological and
more official news

33. Twitter: @DWG
www.digitalworkplacegroup.com
ACCA –
Show popular pages

34. Twitter: @DWG
www.digitalworkplacegroup.com
ACCA –
Shows popular pages
• Simple way to surface popular news
• Includes news from all locations
• Popularity based on “Likes” and age of pages
• “Social” because generated by user behavior

35. Twitter: @DWG
www.digitalworkplacegroup.com
Roland Berger –
List “My Communities”

36. Twitter: @DWG
www.digitalworkplacegroup.com
Roland Berger –
List and link to “My communities”
• Drop-down list to select a community
• Offers alternate route to site navigation
• Personalized list makes homepage relevant
• Recommendations invite further involvement

37. Twitter: @DWG
www.digitalworkplacegroup.com
Roland Berger –
List “My Communities”

38. Twitter: @DWG
www.digitalworkplacegroup.com
Roland Berger –
Well formatted social feed
• Simple, well spaced format
• Easy to scan and read
• Actions and actors stand out
• “Follow up” filter elevates utility of
social to be an active task list

39. Twitter: @DWG
www.digitalworkplacegroup.com
Adobe –
Status update box

40. Twitter: @DWG
www.digitalworkplacegroup.com
Adobe –
Provide status update box
• Simple option to participate
• Invites status updates at start of day
• High up on homepage for easy
access

41. Twitter: @DWG
www.digitalworkplacegroup.com
Quality Practice –
Social activity feed

42. Twitter: @DWG
www.digitalworkplacegroup.com
Quality Practice –
Shows social activity feed
• Personalized social activity feed
• Shows only posts from a user’s network
• Relevant, work-related social updates

43. Twitter: @DWG
www.digitalworkplacegroup.com
Children’s Trust –
Blogs with authors’ images

44. Twitter: @DWG
www.digitalworkplacegroup.com
Children’s Trust –
Lists blogs with authors’ images
• Highlights user-generated posts
• Richer content than just discussions
• Author images bring the posts to life
• Clean and simple design
• Links to author profile pages enable
connections with thought leaders

45. Twitter: @DWG
www.digitalworkplacegroup.com
ACCA –
Link to edit profile

46. Twitter: @DWG
www.digitalworkplacegroup.com
ACCA –
Includes a link to edit profile
• Makes homepage feel personal
• Allows quick access to own profile
• Update profile with one click

47. Twitter: @DWG
www.digitalworkplacegroup.com
10 examples of reinforcing company
culture on the intranet homepage

48. Twitter: @DWG
www.digitalworkplacegroup.com
PUB –
Playful background

49. Twitter: @DWG
www.digitalworkplacegroup.com
PUB –
Playful background
• Playful design sets relaxed tone
• Builds sense of friendliness
• Good use of otherwise blank page margins

50. Twitter: @DWG
www.digitalworkplacegroup.com
ARI –
The company’s charity events

51. Twitter: @DWG
www.digitalworkplacegroup.com
ARI –
Company’s charity events
• “Local events” feels relevant and
relatable for users
• Highlighting charity sponsorships
shows company values
• Homepage focus on charitable
activities highlights their importance
• Community involvement increases
sense of purpose for employees

52. Twitter: @DWG
www.digitalworkplacegroup.com
Arcor –
Links to community pictures/activities

53. Twitter: @DWG
www.digitalworkplacegroup.com
Arcor –
Community involvement activities
• Highlights employee involvement
• Ties company’s values to employee
recognition

54. Twitter: @DWG
www.digitalworkplacegroup.com
UNUM –
Corporate social responsibility (CSR) info

55. Twitter: @DWG
www.digitalworkplacegroup.com
UNUM –
Corporate social responsibility (CSR) info
• Daily reminder of company’s values
• Homepage spotlight shows importance
of CSR to the company
• Helps employees hold company and
executives accountable

56. Twitter: @DWG
www.digitalworkplacegroup.com
PUB –
“We can serve” spotlight

57. Twitter: @DWG
www.digitalworkplacegroup.com
PUB –
“We can serve” spotlight
• Employee recognition tied to CSR
• Conveys company values through
employee stories

58. Twitter: @DWG
www.digitalworkplacegroup.com
Business Environment –
“Congrats” and “Say goodbye” news

59. Twitter: @DWG
www.digitalworkplacegroup.com
Business Environment –
“Congrats” and “Say goodbye” news
• Welcoming and employee-focused
news
• Puts people in the spotlight
• Highlights service & tenure
• Helpful, needed information

60. Twitter: @DWG
www.digitalworkplacegroup.com
World Travel Holdings –
“Who’s being recognized” news

61. Twitter: @DWG
www.digitalworkplacegroup.com
World Travel Holdings –
“Who’s being recognized” news
• Non-monetary employee recognition
• Communicates company good
practices
• Lets employees’ actions do the talking
• Gives every employee a chance at the
spotlight

62. Twitter: @DWG
www.digitalworkplacegroup.com
Children’s Trust –
“Picture of the week” & social pictures

63. Twitter: @DWG
www.digitalworkplacegroup.com
Children’s Trust –
“Picture of the week” & event pictures
• Friendly, welcoming faces on the
intranet
• Puts people at the forefront
• Helps people recognize colleagues
• Demonstrates company values

64. Twitter: @DWG
www.digitalworkplacegroup.com
Charles Schwab –
Q&A with executives

65. Twitter: @DWG
www.digitalworkplacegroup.com
Charles Schwab –
Q&A with executives
• Humanizes executives
• Reframes communications as conversation
• Makes leaders seem approachable

66. Twitter: @DWG
www.digitalworkplacegroup.com
Suncor –
Company’s external social activity

67. Twitter: @DWG
www.digitalworkplacegroup.com
Suncor –
Company’s external social media activity
• Keeps employees informed
• Shows how company engages with public
• Says that proper social media use is good
• Lets people connect with company
through personal networks

68. Twitter: @DWG
www.digitalworkplacegroup.com
That’s 31!

69. Twitter: @DWG
www.digitalworkplacegroup.com
So…

70. Twitter: @DWG
www.digitalworkplacegroup.com
So… do you like intranets?

71. Twitter: @DWG
www.digitalworkplacegroup.com
So… do you like intranets? Are you working
on improving your own digital workplace?

72. Twitter: @DWG
www.digitalworkplacegroup.com
So… do you like intranets? Are you working
on improving your own digital workplace?
Visit the Digital Workplace Group website
for more resources and information:
My Beautiful Intranet 2014
Screenshots, live tours & more
Downloadable reports
http://www.digitalworkplacegroup.com

73. End