7/31/2019 SharePoint UI Advancements

1/39

7/31/2019 SharePoint UI Advancements

2/39

Introducing the new User ExperienceThe SharePoint Fluent User Interface

Sites as Collections of Pages

Managing Data with SharePoint 2010

7/31/2019 SharePoint UI Advancements

3/39

7/31/2019 SharePoint UI Advancements

4/39

Microsoft Confidential

7/31/2019 SharePoint UI Advancements

5/39

Microsoft Confidential

7/31/2019 SharePoint UI Advancements

6/39

7/31/2019 SharePoint UI Advancements

7/39

SharePoint design is not intuitive and it is

difficult to learn and use.

Lack of customization is due to difficulty, not lack

of desire.

End users are not adequately trained on

SharePoint. Many obtain little to no training.

7/31/2019 SharePoint UI Advancements

8/39

7/31/2019 SharePoint UI Advancements

9/39

Introducing the new User ExperienceThe SharePoint Fluent User Interface

Sites as Collections of Pages

Managing Data with SharePoint 2010

7/31/2019 SharePoint UI Advancements

10/39

Consistent Streamlined Familiar

7/31/2019 SharePoint UI Advancements

11/39

INButtonSplit button menu

StaticStated

Drop down & Flyout menusCustomizableHierarchical

CheckboxToggle ButtonLabelTextboxCombo boxSpinnerTable control

Color picker

Out In-ribbon gallery control

Drop down grids are our answer

7/31/2019 SharePoint UI Advancements

12/39

Status Bar

Notification

7/31/2019 SharePoint UI Advancements

13/39

7/31/2019 SharePoint UI Advancements

14/39

Popup dialog

AJAX refresh

7/31/2019 SharePoint UI Advancements

15/39

No context switching. Edit content whereyou see it.

7/31/2019 SharePoint UI Advancements

16/39

Custom

?

7/31/2019 SharePoint UI Advancements

17/39

7/31/2019 SharePoint UI Advancements

18/39

Introducing the new User ExperienceThe SharePoint Fluent User Interface

Sites as Collections of Pages

Managing Data with SharePoint 2010

7/31/2019 SharePoint UI Advancements

19/39

sites are collectionsof pages

7/31/2019 SharePoint UI Advancements

20/39

Every team site has a pageslibrary

Create a new page with asingle click

Just enter a nameReady to go

[[Wiki Linking]] toPages

ListsItems

Documents

7/31/2019 SharePoint UI Advancements

21/39

Single click editing experienceTransition to edit is quick and seamless

Type into page and format text like in WordFull set of rich text controls for formatting and layout

Streamlined insert experience for images, linksAsset library

Edit Pick Content Insert

7/31/2019 SharePoint UI Advancements

22/39

Auto-save everyminute, no data-loss

Only save if user madechanges

Edit\Stop Editing noprompts

Whoops ProtectionRich Text Editor has

undo stackVersioning turning on,in case you want torevert

7/31/2019 SharePoint UI Advancements

23/39

Team site masterpage User content pages (lists\content pages\etc)

_layouts pages (site settings, etc)v4.master

For app experiences, like Search or Office Web Applications

If you do not need site navigation

If you do not have a ribbon If your app needs the spaceminimal.master

For error pages or login pages Not customizable, but pages can be replacedsimple.master

Show site using legacy interface

No Ribbon, no fluencydefault.master

7/31/2019 SharePoint UI Advancements

24/39

7/31/2019 SharePoint UI Advancements

25/39

Display one site inmultiple languages

Language Pack based

End-user translations

Primary language setduring provisioning

Secondary languageset by end-user

OM Support

7/31/2019 SharePoint UI Advancements

26/39

Well-Formed XHTML 1.0

Cross-Browser

Tier 1 support: IE, FirefoxTier 2 support: Safari

WCAG 2.0 AA

New Rich Text Editor supporting XHTML.

7/31/2019 SharePoint UI Advancements

27/39

Add commands to common locationsECB

Ribbon

Form Toolbars

View Toolbars

Settings pages

Scoped to list / site / site-collection

SharePoint Designer / Object Model support

Declarative, no User / Custom Controls

7/31/2019 SharePoint UI Advancements

28/39

7/31/2019 SharePoint UI Advancements

29/39

Introducing the new User ExperienceThe SharePoint Fluent User Interface

Sites as Collections of Pages

Managing Data with SharePoint 2010

7/31/2019 SharePoint UI Advancements

30/39

I want to be able tocreate richer forms

more easily.

I want more typesthan just new, editand view forms.

I want to changethe Web Part in

my forms.

7/31/2019 SharePoint UI Advancements

31/39

Multiple forms per typeUser Actions for navigation

New Web 2.0 view technology

Replace default view / edit Web PartInfoPath integration

7/31/2019 SharePoint UI Advancements

32/39

Create an arbitrary number of forms forDisplay

New

Edit

Set default forms to show

7/31/2019 SharePoint UI Advancements

33/39

WebPart

BaseXsltDataWebPart

DataViewWebPart (V2)

DataFormWebPart (V3)

BaseXsltListWebPart (v4)

XsltListFormWebPart (V4)

XsltListViewWebPart (V4)

ListFormWebPart

ListViewWebPart

Replaces ListViewWebPartWeb 2.0 View Framework

Schema agnostic

Better UXIn-Place Editing

7/31/2019 SharePoint UI Advancements

34/39

List View List Form Data Form XSLT List View

Rendering Technology CAML ASP.NET XSLT XSLTRender Lists X X X

Render Items X X X

Aggregate Data X X

Render External Data X X

Browser Editing X X X

SPD Editing X X

Parameterizable X X

Conditional Formatting,High customizability

X X

Performance X X X

7/31/2019 SharePoint UI Advancements

35/39

XmlDefinition

ListName

XSL

SPDataSource

HTML

XsltListViewWebPart

XslCompiledTransform

CAML Query

List Schema

View Transform

XML Data

7/31/2019 SharePoint UI Advancements

36/39

ImprovedField Picker

List DataConnection

LibraryData

ConnectionList Forms

7/31/2019 SharePoint UI Advancements

37/39

7/31/2019 SharePoint UI Advancements

38/39

7/31/2019 SharePoint UI Advancements

39/39

Introducing the new User ExperienceThe SharePoint Fluent User Interface

Sites as Collections of Pages

Managing Data with SharePoint 2010