SharePoint Saturday Chicago 2013 - Designing for SharePoint 2013

1 | SharePoint Saturday Chicago 2013Twitter: @SPSChicago Hashtag #SPSChicago

Marc D AndersonSharePoint MVP

Designing for SharePoint 2013

YammerHow to Join the Conversation1. Download the Yammer phone app from the iTunes, Windows Phone, or

Android App Store.2. Join your company network, if you haven't already, at

http://www.yammer.com.3. Go to https://www.yammer.com/microsoftmidwestcustomers and click

"request an invitation". When you receive the invitation click "accept."4. Go to

https://www.yammer.com/microsoftmidwestcustomers/groups/spschicago and click "join." You will receive a welcome message in 24-72 hrs.

5. Once you have access you will be able to download posted presentations, ask questions of any of the subject matter experts and participate in any conversations going on in the group

Who Is Marc? Co-Founder and President of Sympraxis

Consulting LLC, located in the Boston suburb of Newton, MA, USA. Sympraxis focuses on enabling collaboration throughout the enterprise using the SharePoint application platform.

More than 30 years of experience in technology professional services and software development. Over a wide-ranging career in consulting as well as line manager positions, Marc has proven himself as a problem solver and leader who can solve difficult technology problems for organizations across a wide variety of industries and organization sizes.

Three-time awardee of the Microsoft MVP award for SharePoint Server (2011, 2012, 2013).

Outline & Agenda SharePoint MVP Marc Anderson will introduce you to the

possibilities of design and customization in SharePoint 2013. Tour the newest interface features, learn best practices, and discover exciting new ways to interact with your SharePoint 2013 environment.

While we can still implement designs in SharePoint 2013 the “old way” we’re used to, there are new capabilities that can make the process easier for both designers who are very familiar with SharePoint and those designers who have never worked with SharePoint.

We’ll look at the new Design Manager capabilities and learn how to create and integrate Master pages, Display Templates, and Page Layouts. Not only does the Design Manager make it easier to create new designs for SharePoint from scratch, it can also help you manage your existing designs after an upgrade. The Design Manager even allows designers to use the tools they know and love like Dreamweaver, Photoshop, or any other HTML editor.

What Is Design?de·sign /dɪˈzaɪn/ [dih-zahyn]verb (used with object)1. to prepare the preliminary sketch or the plans for (a work to be executed), especially to plan the form and structure of: to design a new bridge. 2. to plan and fashion artistically or skillfully. 3. to intend for a definite purpose: a scholarship designed for foreign students. 4. to form or conceive in the mind; contrive; plan: The prisoner designed an intricate escape. 5. to assign in thought or intention; purpose: He designed to be a doctor. 6. Obsolete. to mark out, as by a sign; indicate. verb (used without object) 7. to make drawings, preliminary sketches, or plans. 8. to plan and fashion the form and structure of an object, work of art, decorative scheme, etc.

Definition from Dictionary.com http://dictionary.reference.com/browse/design

But wait…Noun9. an outline, sketch, or plan, as of the form and structure of a work of art, an edifice, or a machine to be executed or constructed. 10. organization or structure of formal elements in a work of art; composition. 11. the combination of details or features of a picture, building, etc.; the pattern or motif of artistic work: the design on a bracelet. 12. the art of designing: a school of design. 13. a plan or project: a design for a new process. 14. a plot or intrigue, especially an underhand, deceitful, or treacherous one: His political rivals formulated a design to unseat him. 15. designs, a hostile or aggressive project or scheme having evil or selfish motives: He had designs on his partner's stock. 16. intention; purpose; end. 17. adaptation of means to a preconceived end.

Form vs. Function

Form FunctionTypically the domain of

Designers, Marketing folks

Typically the domain of Developers, IT folks

RealityIt has to be both:“function requires

form”

The Form v Function Ratio by Dan Antion http://www.aiim.org/community/blogs/expert/The-Form-v-Function-Ratio

What’s the Solution? Use SharePoint as an out-of-box

application whenever possible - We designed the new SharePoint UI to be clean, simple and fast and work great out-of-box. We encourage you not to modify it which could add complexity, performance and upgradeability and to focus your energy on working with users and groups to understand how to use SharePoint to improve productivity and collaboration and identifying and promoting best practices in your organization.

SharePoint

“The New SharePoint” by Jeff Teper on the Microsoft SharePoint Team Blog http://sharepoint.microsoft.com/blog/Pages/BlogPost.aspx?pID=1012

Design Lite

10 | SharePoint Saturday Chicago 2013

Twitter: @SPSChicago Hashtag #SPSChicago

Change the Look

Publishing Portal

Information Architecture

Site Columns

Content Types

Design Manager

Design Manager Requirements

Design Manager is only available with Publishing Features activated, thus SharePoint Server only

Site Collectio

Design Manager Trick Create a new Site Collection for design work Activate the Site Collection Feature:

SharePoint Server Publishing Infrastructure Activate the site feature: SharePoint Server

Publishing Do your design work in that Site Collection

with Design Manager Copy design artifacts into your core Site

Collection or deploy per your governance model

Caveat: Some adaptation is required

Design Manager Capabilities

Device Channels

Upload Design Files

Map a Network Drive How to: Map a network

drive to the SharePoint 2013 Master Page Gallery (http://msdn.microsoft.com/en-us/library/jj733519.aspx)

Edit Master Pages

Snippets

Master Page Snippets

Edit Display Templates

Edit Page Layouts

Create a Page Layout

Page Layout Snippets

Publish and Apply Design

Create Design Package

Image Renditions

Image Renditions Requirement

The Blob Cache must be enabled in IIS Configure cache settings for a web

application in SharePoint Server 2013 (http://technet.microsoft.com/en-us/library/cc770229.aspx)

Image Renditions

Working with Image Renditions

Housekeeping Please remember to submit your session

evaluation using our mobile application Follow SharePoint Saturday Chicago on

Twitter @spschicago & use hashtag #spschicago

Thanks to Our Sponsors!

Contact InformationEmail marc.anderson@sympraxisconsulting.com

Blog http://sympmarc.com

SPServices http://spservices.codeplex.com

SPXSLT http://spxslt.codeplex.com

eBook http://bit.ly/UnlockingDVWP

The Middle Tier Manifesto http://bit.ly/middletier

SharePoint Saturday Chicago 2013 - Designing for SharePoint 2013

Technology

SharePoint 2013 Workflow - San Antonio SharePoint User Group - October 2013

SharePoint Fest Chicago 2015 - Anatomy of configuring provider hosted add-in infrastructure for sharepoint 2013 on-premises, real-world end-to-end configuration blueprint

Yammer & SharePoint: SharePointFest Chicago Fall 2013

Sharepoint 2013

SharePoint 2013 Extranets: How will SharePoint 2013 connect

SharePoint 2013 Logical Architecture - …networkologist.com/Repository/SharePoint 2013 Architecture Planning... · SharePoint 2013 Logical Architecture This document is provided

Business Intelligence & SharePoint - SharePoint Day 2013

CopyMove for SharePoint 2013 Administrators Guide...CopyMove for SharePoint 2013 is a commercial add-on for Microsoft SharePoint Foundation 2013 and Microsoft SharePoint Server 2013

Microsoft SharePoint 2013 SharePoint 2013 App Model · PDF fileMicrosoft SharePoint 2013 SharePoint 2013 App Model ... Configure SharePoint 2013 for server-to-server app use and

SharePoint Saturday Chicago 2013 SharePoint 2013 Hybrid Scenarios

Chicago 2016 - SharePoint · 2018-04-15 · SharePoint Fest 5994 S Holly St, #243, Greenwood Village, CO 80111 303 -862 david@techconferences.com SharePoint Fest Chicago 2016 Sponsor

SharePoint and Project Management · • MS Project 2013/SharePoint 2013 ... • Content Types/Site Columns (SharePoint 2007-2013) Document Templates

Upgrading SharePoint 2010 to SharePoint 2013

Introduction to PowerShell for SharePoint Admins and Developers - SharePoint Fest Chicago 2013 SIA101

SharePoint 2013 - Best Tools (v3) Automatisierte SharePoint 2013 Installation

SharePoint User Group Chicago: 1/24/2013 SharePoint 2013 Search Overview

SharePoint Fest Chicago - From SharePoint to Office 365 Development

WRK505 Electronic Forms and Alternative SharePoint App ... Chicago 2… · SharePoint 2013 portal for current and retired staff ... Creating a new Web API project Leveraging Azure

SharePoint Saturday Chicago - Future Proofing SharePoint Success

Driving SharePoint Adoption - Fest Chicago 2014