Everything you need to know to create a modern Intranet/Digital Employee Experience with out of the box capabilities of SharePoint Online Masterclass SharePoint modern vs classic

1. 1
Masterclass SharePoint modern vs classic
Everything you need to know
to create a modern Intranet/Digital Employee Experience
with out of the box capabilities of SharePoint Online
Advatera Masterclass
18.11.2021, online
Thomas Maeder

2. Hello ;-)
2
Thomas Maeder
Self-employed, independant Consultant & Project Manager
for Intranets, Employee Apps, Social Collaboration, Digital Workplace
and Digital Employee Experience
http://www.linkedin.com/in/maeder/
http://www.xing.com/profile/Thomas_Maeder
@ThomasMaeder
thomas.maeder@rethinkdigital.ch
www.rethinkdigital.ch

3. What about you?
3
• Your job/role?
• Your most urgent question/challenge for today’s
masterclass?

4. Goals
4
1. Understand the key concepts of
SharePoint modern to build an
modern Intranet/Digital Employee
Experience.
2. Learn about what’s possible out of
the box and what’s not.
3. Get insipired and learn from others.

5. 5
Introduction
Main differences between SP modern vs classic
How to get started
The role of SP in M365
Everything you need to know to create
a modern Intranet/Digital Employee Experience

6. 1. Introduction
6

7. 20 years of SharePoint history
7

8. Is SharePoint dead?
8

9. 2. The role of SharePoint in M365
9

10. The role of SharePoint in M365
10
SharePoint powers document access
and creation on office.com.

11. The role of SharePoint in M365
11
OneDrive is built on SharePoint.

12. The role of SharePoint in M365
12
SharePoint powers file management behind
every MS Team.

13. The role of SharePoint in M365
13
SharePoint powers
file management behind
every Yammer community.

14. The role of SharePoint in M365
14
SharePoint powers Microsoft Lists.

15. The role of SharePoint in M365
15
SharePoint integrates with the Power Platform (Power Apps, Power Automate, Power BI).

16. The role of SharePoint in M365
16
Stream videos are stored
in SharePoint.

17. The role of SharePoint in M365
17
Whiteboards are stored in OneDrive,
which is built on SharePoint.

18. The role of SharePoint in M365
18
SharePoint powers your modern Intranet.

19. The role of SharePoint in M365
19
SharePoint powers Microsoft Viva
Connections.

20. Quick poll
20
Is SharePoint dead?

21. 3. Main differences between modern vs classic
21
The modern experience in Microsoft SharePoint
is designed to be compelling, flexible, and more performant.
The modern experience makes it easier for anyone to create
beautiful, dynamic sites and pages that are mobile-ready.

22. Main differences between modern vs classic
22
SharePoint
SharePoint Online
= latest modern experience
(some features also available in classic experience)
SharePoint Server 2013
= classic experience
SharePoint Server 2016/2019
= some modern experience
(but not the latest modern experience and some
features only available in classic experience!)

23. Main differences between modern vs classic
23
Topic classic Modern (out of the box)
Information
Architecture &
Navigation
Site Collections, Sub Sites Site (Hub Sites, Home Site)
Team Sites, Document Center,
Wiki, Blog etc
Communication Sites, Team Sites
Site Navigation Global Navigation, Hub Navigation, Site Navigation

24. Main differences between modern vs classic
24
Topic classic Modern (out of the box)
Information
Architecture &
Navigation
Site Collections, Sub Sites Site (Hub Sites, Home Site)
Team Sites, Document Center,
Wiki, Blog etc
Communication Sites, Team Sites
Site Navigation Global Navigation, Hub Navigation, Site Navigation
Content
Management
Custom Page Layouts Home Page Layout, Article Page Layout, Single Web Part App Page
Layout
Page Templates
Classic Web Parts, Web Part Zones Modern Web Parts, Sections and Columns

25. Main differences between modern vs classic
25
Topic classic Modern (out of the box)
Information
Architecture &
Navigation
Site Collections, Sub Sites Site (Hub Sites, Home Site)
Team Sites, Document Center,
Wiki, Blog etc
Communication Sites, Team Sites
Site Navigation Global Navigation, Hub Navigation, Site Navigation
Content
Management
Custom Page Layouts Home Page Layout, Article Page Layout, Single Web Part App Page
Layout
Page Templates
Classic Web Parts, Web Part Zones Modern Web Parts, Sections and Columns
Multilingual
Content
Publishing Pages & Variations Multilingual Communications Sites

26. Main differences between modern vs classic
26
Topic classic Modern (out of the box)
Information
Architecture &
Navigation
Site Collections, Sub Sites Site (Hub Sites, Home Site)
Team Sites, Document Center,
Wiki, Blog etc
Communication Sites, Team Sites
Site Navigation Global Navigation, Hub Navigation, Site Navigation
Content
Management
Custom Page Layouts Home Page Layout, Article Page Layout, Single Web Part App Page
Layout
Page Templates
Classic Web Parts, Web Part Zones Modern Web Parts, Sections and Columns
Multilingual
Content
Publishing Pages & Variations Multilingual Communications Sites
Branding Custom Master Pages Responsive Themes

27. Main differences between modern vs classic
27
Topic classic Modern (out of the box)
Information
Architecture &
Navigation
Site Collections, Sub Sites Site (Hub Sites, Home Site)
Team Sites, Document Center,
Wiki, Blog etc
Communication Sites, Team Sites
Site Navigation Global Navigation, Hub Navigation, Site Navigation
Content
Management
Custom Page Layouts Home Page Layout, Article Page Layout, Single Web Part App Page
Layout
Page Templates
Classic Web Parts, Web Part Zones Modern Web Parts, Sections and Columns
Multilingual
Content
Publishing Pages & Variations Multilingual Communications Sites
Branding Custom Master Pages Responsive Themes
Profile My Site Delve, M365 Profile Card
OneDrive

28. Main differences between modern vs classic
28
Topic classic Modern (out of the box)
Information
Architecture &
Navigation
Site Collections, Sub Sites Site (Hub Sites, Home Site)
Team Sites, Document Center,
Wiki, Blog etc
Communication Sites, Team Sites
Site Navigation Global Navigation, Hub Navigation, Site Navigation
Content
Management
Custom Page Layouts Home Page Layout, Article Page Layout, Single Web Part App Page
Layout
Page Templates
Classic Web Parts, Web Part Zones Modern Web Parts, Sections and Columns
Multilingual
Content
Publishing Pages & Variations Multilingual Communications Sites
Branding Custom Master Pages Responsive Themes
Profile My Site Delve, M365 Profile Card
OneDrive
Search SharePoint Search M365 Search

29. Main differences between modern vs classic
29
Topic classic Modern (out of the box)
Information
Architecture &
Navigation
Site Collections, Sub Sites Site (Hub Sites, Home Site)
Team Sites, Document Center,
Wiki, Blog etc
Communication Sites, Team Sites
Site Navigation Global Navigation, Hub Navigation, Site Navigation
Content
Management
Custom Page Layouts Home Page Layout, Article Page Layout, Single Web Part App Page
Layout
Page Templates
Classic Web Parts, Web Part Zones Modern Web Parts, Sections and Columns
Multilingual
Content
Publishing Pages & Variations Multilingual Communications Sites
Branding Custom Master Pages Responsive Themes
Profile My Site Delve, M365 Profile Card
OneDrive
Search SharePoint Search M365 Search
Mobile - Responsive Design, SharePoint mobile App, MS Teams/Viva Connections

30. Main differences between modern vs classic
30
Topic classic Modern (out of the box)
Information
Architecture &
Navigation
Site Collections, Sub Sites Site (Hub Sites, Home Site)
Team Sites, Document Center,
Wiki, Blog etc
Communication Sites, Team Sites
Site Navigation Global Navigation, Hub Navigation, Site Navigation
Content
Management
Custom Page Layouts Home Page Layout, Article Page Layout, Single Web Part App Page
Layout
Page Templates
Classic Web Parts, Web Part Zones Modern Web Parts, Sections and Columns
Multilingual
Content
Publishing Pages & Variations Multilingual Communications Sites
Branding Custom Master Pages Responsive Themes
Profile My Site Delve, M365 Profile Card
OneDrive
Search SharePoint Search M365 Search
Mobile - Responsive Design, SharePoint mobile App, MS Teams/Viva Connections
Social Intranet Newsfeed Yammer

31. Main differences between modern vs classic
31
Topic classic Modern (out of the box)
Information
Architecture &
Navigation
Site Collections, Sub Sites Site (Hub Sites, Home Site)
Team Sites, Document Center,
Wiki, Blog etc
Communication Sites, Team Sites
Site Navigation Global Navigation, Hub Navigation, Site Navigation
Content
Management
Custom Page Layouts Home Page Layout, Article Page Layout, Single Web Part App Page
Layout
Page Templates
Classic Web Parts, Web Part Zones Modern Web Parts, Sections and Columns
Multilingual
Content
Publishing Pages & Variations Multilingual Communications Sites
Branding Custom Master Pages Responsive Themes
Profile My Site Delve, M365 Profile Card
OneDrive
Search SharePoint Search M365 Search
Mobile - Responsive Design, SharePoint mobile App, MS Teams/Viva Connections
Social Intranet Newsfeed Yammer
Collaboration Team Sites Microsoft Teams

32. Main differences between modern vs classic
32
Topic classic Modern (out of the box)
Information
Architecture &
Navigation
Site Collections, Sub Sites Site (Hub Sites, Home Site)
Team Sites, Document Center,
Wiki, Blog etc
Communication Sites, Team Sites
Site Navigation Global Navigation, Hub Navigation, Site Navigation
Content
Management
Custom Page Layouts Home Page Layout, Article Page Layout, Single Web Part App Page
Layout
Page Templates
Classic Web Parts, Web Part Zones Modern Web Parts, Sections and Columns
Multilingual
Content
Publishing Pages & Variations Multilingual Communications Sites
Branding Custom Master Pages Responsive Themes
Profile My Site Delve, M365 Profile Card
OneDrive
Search SharePoint Search M365 Search
Mobile - Responsive Design, SharePoint mobile App, MS Teams/Viva Connections
Social Intranet Newsfeed Yammer
Collaboration Team Sites Microsoft Teams
Forms/Workflows InfoPath Power Automate, Power Apps, Forms

33. 4. Create a modern Intranet/Digital Employee
Experience with out of the box capabilities of
SharePoint Online
33
• Information Architecture & Navigation
• Roles & Permissions
• Content Management
• Multilingual Content
• Branding/Theming
• Personalization
• Profiles
• Search
• Microsoft Viva (Connections)

34. Information Architecture & Navigation
34

35. Information Architecture
35
• Sites
• Hubs
• Home Site
• Hub to Hub Associations

36. 36
Classic SharePoint architecture is
typically built using a hierarchical
system of site collections and sub-
sites, with inherited navigation,
permissions, and site designs.
Once built, this structure can be
inflexible and difficult to maintain.
Site
Collection
1
Site
Collection
2
Sub Site
1.1
Sub Site
3.1
Sub Site
3.2
Site 1
Site 2
Site
Collection
3
Site 3
Site 4
Hub Site
.../site-collection1/sub-site1-1/pages/page1
.../site1/pages/page1
Sub Site
3.2.1
In the modern SharePoint experience,
every site is a site collection and can be
associated to a hub, which is a flat
collection of sites that share
• navigation
• branding
• roll-up of content
• Search
This type of structure is far more
flexible and adaptive to the changing
needs of your organization.

37. 37
1
Home sites are unlike any other site in SharePoint.
When you set a SharePoint communication site as a
home site, you’ll automatically apply special
capabilities that make the home site an ideal
landing destination for your intelligent intranet.
• Search for content across the entire intranet
• Official source of organizational news
• Enable and customize global navigation in the
SharePoint app bar
• Use Viva Connections to integrate your intranet
into Microsoft Teams
Site 1
Site 2
Site 3
Site 4
Hub Site
Home Site

38. 38
Site 1
Site 2
Site 3
Site 4
Site 5
Site 6
Site 7
Site 8
Site 9
Hub Site 1 Hub Site 2
Hub Site 3
Associate a SharePoint hub to another hub to
expand search results across multiple hubs in your
organization. This enables users to discover
relevant content when searching on any sites
related to the associated hubs.

39. Navigation
39
• Global Navigation (SharePoint App Bar)
• Hub Navigation
• Site Navigation

40. 40
Global Navigation (SharePoint App Bar)
Hub Navigation
Site Navigation

41. 41
Mega Menu or Cascading Menu Style
on Hub Navigation and/or Site Navigation

42. Roles & Permissions
42

43. Content Management
43

44. Sections, Columns, Web Parts
44

45. Collapsible Sections
45

46. Organization Assets Library
46

47. Templates
47

48. Page Versioning
48

49. Privat Draft Versions
49

50. Multilingual Content
50

51. 51

52. Branding/Theming
52

53. 53
Microsoft 365 theme

54. 54
SharePoint site theme

55. SharePoint Header
55

56. SharePoint Look Book
56

57. Personalization (Audience Targeting)
57

58. Audience Targeting
58

59. Profiles
59

60. What happened to the My Site?
60
• My Site doesn’t exist in SharePoint Online anymore.
• My Site documents are now OneDrive.
• My Site profile has become Delve.
• In M365 you have currently 2 profiles – Delve and the M365 Profile Card
• It looks like M365 Profile Card ist the future, Delve hasn’t evolved anymore in the recent
years.

61. M365 Profile Card
61

62. Search
62

63. What happened to SharePoint Search?
63
• SharePoint Search doesn’t exist in SharePoint Online anymore.
• Search across M365 ist now Microsoft Search.

64. 64

65. 65

66. Microsoft Viva (Connections)
66

67. 67

68. 68
Microsoft Viva Connections

69. 69

70. 70

71. 71

72. Viva Connections Desktop
72

73. 73
Viva Connections Mobile

74. 5. How to get started
74

75. 5 steps and 3 options to get started
75
1. Know your most important business needs and governance requirements
2. Plan for Microsoft Viva (Connections)
3. Build a prototype on a M365 test environment
4. Validate prototype with end users and identify gaps
5. Analyze gaps in regards to Microsoft 365 roadmap
6a) Accept gaps and live with out of the box capabilities
6b) Fill gaps with SharePoint Framework SPFx development (buy or build)
6c) Fill gaps with a SharePoint add-on product

76. 76
Thank you!
Questions, Feedback?

77. Zielweg 27, 3014 Bern | Switzerland | www.rethinkdigital.ch | thomas.maeder@rethinkdigital.ch | +41 79 688 08 71
rethink your digital employee experience.