brand & completecommunitiesde.org engagement ... · creation of infographics are piktochart...

16
BRAND & ENGAGEMENT GUIDE COMPLETECOMMUNITIESDE.ORG /COMPLETECOMMUNITIESDE @COMPCOMMUNITYDE COMPLETECOMMUNITIES

Upload: others

Post on 19-Jul-2020

0 views

Category:

Documents


0 download

TRANSCRIPT

Page 1: BRAND & COMPLETECOMMUNITIESDE.ORG ENGAGEMENT ... · creation of infographics are PiktoChart (ideal for data visualization) and Canva (ideal for illustration of concepts). Samples

B R A N D & E N G AG E M E N T G U I D E

COMPLETECOMMUNITIESDE.ORG

/CO M P L E T E CO M M U N I T I E S D E

@ CO M P CO M M U N I T YD E

CO M P L E T E CO M M U N I T I E S

Page 2: BRAND & COMPLETECOMMUNITIESDE.ORG ENGAGEMENT ... · creation of infographics are PiktoChart (ideal for data visualization) and Canva (ideal for illustration of concepts). Samples

COMPLETE COMMUNITIES ARE:

ATTRACTIVE INCLUSIVE EFFICIENT HEALTHY RESILIENT

WHAT IS THE COMPLETE COMMUNITIES TOOLBOX?

WHAT IS THE BRAND AND ENGAGEMENT GUIDE?

WHO IS OUR AUDIENCE?

The Delaware Complete Communities Planning Toolbox aims to help build local government capacity to develop complete-communities planning approaches, community-design tools, and public engagement strategies. This online Toolbox is funded by the Delaware Department of Transportation (DelDOT) and is maintained by the Institute for Public Administration (IPA) at the University of Delaware.

This guide serves as a resource for any IPA staff member that contributes to the Complete Communities Toolbox content. It outlines and illustrates brand standards for consistency across all tools, social media platforms, and website/print content. This guide contains educational resources to familiarize users with software used in the creation of Complete Communities tools.

The audience for the Delaware Complete Communities Planning Toolbox is local government practitioners within the state of Delaware, particularly those working in community engagement, public health, urban planning, and transportation. Affiliate audiences can include citizen and community groups working in community development in Delaware. The role of the toolbox is to inspire and educate local government practitioners to implement projects and programs around community attractiveness, inclusivity, efficiency, health, and resiliency.

2

Page 3: BRAND & COMPLETECOMMUNITIESDE.ORG ENGAGEMENT ... · creation of infographics are PiktoChart (ideal for data visualization) and Canva (ideal for illustration of concepts). Samples

3

TABLE OF CONTENTS

V I S UA L G U I D E L I N E S 4

1 1S O C I A L M E D I A G U I D L I N E S

Brand Guidelines 5778991010

1212121213141415

Twitter IntroductionFacebook IntroductionWednesday Round UpMeasurementGeneral Planning Content ResourcesDelaware Content ResourcesDelaware Main Street Content ResourcesSocial Media Scheduling

PhotosSocial Media PostsAdobe Spark VideosAdobe Spark PagesInfographicsGIS Story MapsBanners

Page 4: BRAND & COMPLETECOMMUNITIESDE.ORG ENGAGEMENT ... · creation of infographics are PiktoChart (ideal for data visualization) and Canva (ideal for illustration of concepts). Samples

VISUAL GUIDELINES

4

This section includes guidelines for formatting and designing any visuals associated with the Complete Communities brand across media.

Photo Courtesy of the City of Lewes

Page 5: BRAND & COMPLETECOMMUNITIESDE.ORG ENGAGEMENT ... · creation of infographics are PiktoChart (ideal for data visualization) and Canva (ideal for illustration of concepts). Samples

BLUE (ACCENT COLOR)SPOT COLORCMYKRGBHEX CODES

BRAND GUIDELINES

MAIN BRAND MARK

COLORS

FONTS

VISUAL

COLOR

LOGO FONTS: COMPANION FONTS: CAPTION FONT:

GREENSPOT COLORCMYKRGBHEX CODES

PMS 329 C89 39 62 246 103 9405665e

GRAYSPOT COLORCMYKRGBHEX CODES

PMS 179-9 C0 0 0 70109 110 1136d6e70

PMS 297 C51.49 4.8 2.52 0110 196 2336fc4e8

BLACK WHITE

Some promotional items may have limited colors to choose from; choose colors that match closely to the approved colors or choose black and white.

To prevent a cluttered look, maintain a comfortable white space around the general logo — equal to approximately the white space (size of the X in Myriad Pro at 28pt font) surrounding the logo pictured to the left. No graphic element — type, rule, line, or art — should be allowed in this area.

X

X

X X

Myriad Pro CondensedMyriad ProBold, Italic, Bold Italic

• Do not distort the logo (vertically and horizontally — use proportionally).• Do not change the font in the logo.• Do not rearrange the logo elements.• Do not use unapproved color combinations.• Do not respace elements of the logo.• Additional art or logos must not be attached to the official logo.

UNACCEPTABLE VARIATIONS

IMPACT

5

Page 6: BRAND & COMPLETECOMMUNITIESDE.ORG ENGAGEMENT ... · creation of infographics are PiktoChart (ideal for data visualization) and Canva (ideal for illustration of concepts). Samples

BRAND GUIDELINESVISUAL

APPROVED VARIATIONS

LOCATING BRAND ELEMENTS ON SHARED DRIVEThese logo files can be found within the shared drive by following this path: sppa-ipa-shared > projects > Phase II Complete Communities > Toolbox Promotion > BrandingThe Toolbox Promotion folder should contain almost all necessary graphics and information required to locate visuals, with the exception of photos that are stored on Google Photos. As you create additional visual assets, please save these graphics into the appropriate folder within the Toolbox Promotion folder.

For brand consistency, there are approved variations of this logo to reflect the five key values of Complete Communities and a variation highlighting the Delaware affiliation. These variations can be used in place of the general logo as appropriate.

This “vertical” variation of the general logo includes the five key values of Complete Communities. When using this variation please take care to scale the logo large enough to ensure that the five values are legible.

This vertical, centered variation of the general logo includes the Delaware denotation. This is helpful to include on Delaware specific content and events. Delaware is in Impact font and in the blue accent color.

This “horizontal” variation of the general logo includes the five key values of Complete Communities. When using this variation please take care to scale the logo large enough to ensure that the five values are legible.

6

Page 7: BRAND & COMPLETECOMMUNITIESDE.ORG ENGAGEMENT ... · creation of infographics are PiktoChart (ideal for data visualization) and Canva (ideal for illustration of concepts). Samples

VISUAL ASSETSVISUAL

PHOTOS

SOCIAL MEDIA POSTS

Photos are used across website content, social media posts, and video features for the toolbox. A high standard of high-quality photos (no pixelization, no blurring or movement in image, and visually appealing) is maintained and expected.

Crediting Sources: All internal photos (from the Complete Communities Google Photos) should be credited to the person or organization that has provided them. These details are outlined in the information and notes attached to the photo file in Google Photos. For stock photos, when required by the source, the photographer or organization should be credited. Credits should be treated as “Photo by [PHOTOGRAPHER NAME], Courtesy of [ORGANIZATION NAME]” in a small but legible font in a corner of the image or design containing image.

Complete Communities PhotosPartner and Delaware-specific photos are available on the Complete Communities Google Photos Drive (log into [email protected] to access). Ensure that photos used are high quality.

Complete Communities Google Photos

Stock PhotosIf looking for supplementary images, there are many high-quality, open-source image databases that have related images that can be used as background images for social media, additional visual content, or placeholders while waiting for images from partners. Possible sources are:

In order to create impactful social media posts, branded visual content should be developed (this content can include online articles, partner highlights, and toolbox material). These examples show how themed hashtags and quotes from articles can be used to create branded content with the Complete Communities logo. The logo should be used on any visual content for brand identification if the post is shared. These visual posts are created in Adobe Spark using photographic assets outlined above. Branded templates are available in Adobe Spark by logging in to the [email protected] Adobe Creative Cloud account.

Lost? Click on the lightbulb to watch a tutorial on making posts in Adobe Spark.

Unsplash Photos

Makerbook: Open Source Visual Assets

7

Page 8: BRAND & COMPLETECOMMUNITIESDE.ORG ENGAGEMENT ... · creation of infographics are PiktoChart (ideal for data visualization) and Canva (ideal for illustration of concepts). Samples

VISUAL ASSETSVISUAL

ADOBE SPARK VIDEOSThe Adobe Spark platform allows users to create short, animated videos. These videos have been employed across the Complete Communities Toolbox to explain concepts or illustrate examples across the state. This section outlines previous examples and branding considerations for video creation. Videos should be created by logging into [email protected] on Adobe Creative Cloud.

SamplesClick on the images below in order to see examples of Adobe Spark videos that have been developed for the Complete Communities Toolbox. There are additional examples in the Complete Communities YouTube archives. Please take note of image and video quality and selection, music selection, and theme and color selection.

Adobe Spark Video RecommendationsMaintain consistency across the many Adobe Spark videos by using:

• The branded themes that are presented as the first three available themes (Light, Medium, Dark).These themes contain the appropriate fonts and colors and have the Complete Community logo.

• Recommended music options, including Across the Bride, Traveling Buddies, or Highway. • Photos from the Complete Communities photo gallery are appropriately credited to the source on

the credits page. • Minimal text content on video slides. • A slide speed of at least 3-4 seconds. • Optimized photo viewing by experimenting with text layout on slides via Powerpoint, Canva, or

Adobe Spark Posts.

Credit Slides Credit slides should appear at the end of all Adobe Spark videos. There are two credit slides to be included. The first is the logo credit slide with includes the Complete Communities logo and partner logos. The second is the content credit slide, this includes individual contributors and content sources for the video. These are shown in the above examples. These credits slides are created in Microsoft PowerPoint and Adobe Illustrator. These are exported as .png (web-friendly file type) to be inserted in the video. These files can be located on the shared drive by following this path: sppa-ipa-shared > projects > Phase II Complete Communities > Toolbox Promotion > Visual Assets > Videos > Credit Slides

Lost? Click on the lightbulb to watch a tutorial on making videos in Adobe Spark.

8

Page 9: BRAND & COMPLETECOMMUNITIESDE.ORG ENGAGEMENT ... · creation of infographics are PiktoChart (ideal for data visualization) and Canva (ideal for illustration of concepts). Samples

VISUAL ASSETSVISUAL

9

SamplesClick on the images below in order to see examples of Adobe Spark pages that have been developed for the Complete Communities Toolbox. Please take note of image quality, formatting, and language used throughout the pages.

Adobe Spark Pages RecommendationsMaintain consistency across the Adobe Spark pages, by using:

Lost? Click on the lightbulb to watch a tutorial on making pages in Adobe Spark.

Lost? Click on the lightbulb to watch a tutorial on making infographics in PiktoChart.

Lost? Click on the lightbulb to watch a tutorial on making infographics in Canva.

ADOBE SPARK PAGES

INFOGRAPHICS

The Adobe Spark platform allows users to create simple, easy-to-create webpages that can be linked or embedded within the toolbox. These pages have been employed across the Complete Communities Toolbox to explain concepts or illustrate examples of related projects. This section outlines previous examples and branding considerations for page creation. Pages should be created by logging into the [email protected] Adobe Creative Cloud account.

Infographics are charts or diagrams that are intended to simplify concepts or data in order to be more easily understood by the viewer. As with any graphic element designed under the Complete Communities brand, it should use the Complete Communities logo, colors, and fonts and remain consistent with other materials and graphics designed. Two platforms that allow for user-friendly creation of infographics are PiktoChart (ideal for data visualization) and Canva (ideal for illustration of concepts).

SamplesClick on the images to the right in order to see examples of infographics that have been developed for the Complete Communities Toolbox. Please take note of formatting, treatment of data, and language in these examples.

• The branded themes that are presented as the first three available themes (Light, Medium, Dark). These themes contain the appropriate fonts and colors and have the Complete Communities logo.

• Appropriate credit photos from the Complete Communities photo gallery.

Page 10: BRAND & COMPLETECOMMUNITIESDE.ORG ENGAGEMENT ... · creation of infographics are PiktoChart (ideal for data visualization) and Canva (ideal for illustration of concepts). Samples

VISUAL ASSETSVISUAL

10

Lost? Click on the lightbulb to watch a tutorial on making ArcGIS Story Maps.

GIS STORY MAPS

WEBSITE AND SOCIAL MEDIA BANNERS

Data can be visualized geographically with GIS (Geographic Information Systems) Story Maps. Created through ArcGIS, these story maps allow content (text, images, and multimedia content) to be curated around a map or set of maps to illustrate concepts. Once you have designed your maps in ArcGIS, by clicking “Share”, you can select “Create a Web App” and view Story Map formats and styles. In order to access features available with an Enterprise account, please log-in using the [email protected] account on ArcGIS. IPA’s GIS Story Map Gallery is viewable at: goo.gl/vki6EySamples: Click on the images on the right to see examples of GIS Story Maps created in ArcGIS for the Complete Communities Toolbox. Please take note of the formatting, language style, and map treatments.

To refresh social media and the website periodically, the banners on these sites should be updated. • Social Media Banners: There is a set of four seasonal banners available on the Shared Drive (sppa-

ipa-shared > projects > Phase II Complete Communities > Toolbox Promotion > Social Media-Website > Social Media Banners). These should be updated at least quarterly.

• Website Banners: These banners are available on the Shared Drive (sppa-ipa-shared > projects > Phase II Complete Communities > Toolbox Promotion > Social Media-Website > Website Banners). The “parabola-slide1” Photoshop File contains the editable banner with correct dimensions. The wordpress theme for the Complete Communities website is Parabola and the dimensions for the banner are 1050 x 350px. The first, of the five banners, on the website is updated on the second and fourth Wednesdays of each month when the “Wednesday Round Up” is posted. There is a template for this banner available on Adobe Spark (via the [email protected] Creative Cloud account).

Samples: The below images are examples of how past banners have been formatted in line with Complete Communities brand guidelines.

GIS Story Map RecommendationsMaintain consistency across the GIS Story Maps by using:

• The Complete Communities logo as the feature logo and the brand colors for the map layers and elements (use HEX codes provided in the Brand Guidelines section).

• Lucida Sans Unicode, the closest brand font, is recommend for both the section title and the section content.

• All GIS Story Maps drafts should be edited internally and approved by IPA’s Nicole Minni, GISP, at [email protected].

Page 11: BRAND & COMPLETECOMMUNITIESDE.ORG ENGAGEMENT ... · creation of infographics are PiktoChart (ideal for data visualization) and Canva (ideal for illustration of concepts). Samples

SOCIAL MEDIAGUIDELINES

11

This section includes guidelines, partner resources, and schedules to assist in managing the Complete Communities social media platforms.

Page 12: BRAND & COMPLETECOMMUNITIESDE.ORG ENGAGEMENT ... · creation of infographics are PiktoChart (ideal for data visualization) and Canva (ideal for illustration of concepts). Samples

SOCIAL MEDIA GUIDELINESENGAGEMENT

T WIT TER FACEBOOKBy carefully considering our audience and planning rich content, our audience on Twitter can grow and become more engaged.

Best practices include:

The goal of our social media accounts is to drive more individuals to the Complete Communitites Toolbox and ultimately educate more citizens about Complete Communities. The primary social media accounts are Twitter and Facebook.

While posting similar content to Twitter, we present these posts on Facebook differently for platform abilities and audiences.

Best practices include: • Tweet twice per day: one general planning

resource/article and one Delaware specific resource/event.

• Make your posts as visual as possible. Refer to above Visual>Social Media Posts section for resources and guidelines.

• Use hashtags and tag key partners to encourage them to share the post as well. Use hashtags for related events and topics.

• As to not have identical newsfeeds, do not make your posts identical to the Facebook post. You may choose to structure it differently or schedule it for a different day.

• Use interactive approaches to posts. Ask questions and encourage retweeting.

• Schedule tweets at least a few hours apart (i.e., post in the morning and post in the evening). Aim for peak traffic times on social media.

• Post twice per day: one general planning resource/article and one Delaware specific resource/event.

• Make your posts as visual as possible. Refer to above Visual>Social Media Posts section for resources and guidelines.

• Tag partners to encourage them to share the post.

• As to not have identical newsfeeds, do not make your posts identical to the Twitter post. You may choose to structure it differently schedule or it for a different day.

• Use interactive approaches to posts. Ask questions and encourage sharing.

• Post 1–2 minute informational videos about the Toolbox. Videos automatically begin playing and therefore engage the viewer quickly.

• Schedule posts at least a few hours apart (i.e. post in the morning and post in the evening). Aim for peak traffic times on social media.

12

WEDNESDAY ROUND UP POST

MEASUREMENT

On the second and fourth Wednesday of each month, key topics and articles from the Complete Communities social media accounts are shared in a brief digest that can been seen by clicking the image to the right. This digest has four sections, “New this Week”, “From the Archives”, “Spotlight on Delaware”, and “Trending on the web”. When this post is made, the banner/slider should be updated to feature this content (banner template available in Adobe Spark) and related tags should be added to the post. This post can be made by going to the sites.udel dashboard and following this path: Posts>Add New>Categories>Select News>Publish.

With social media being such a key piece of the Complete Communities Toolbox outreach it is important to measure reach through Twitter, Facebook, YouTube, and website engagements. Examining what types of posts and content garner the best responses and engagements will inform future posts. Buffer has features where you can download the number of engagement and views per post on each social media account, this can be tabulated on a monthly or quarterly basis. Using Google Analytics you can examine data pertaining to site activity. These data can be provided to DelDOT when reporting on outcomes. Research assistants should retain these data for their performance review.

Page 13: BRAND & COMPLETECOMMUNITIESDE.ORG ENGAGEMENT ... · creation of infographics are PiktoChart (ideal for data visualization) and Canva (ideal for illustration of concepts). Samples

SOCIAL MEDIA RESOURCESENGAGEMENT

GENERAL PLANNING RESOURCES

There are many scheduling and content development tools for social media posting. Two that have been used by the Complete Communities planning team:

Through reporting, analysis, and visual storytelling, CityLab informs and inspires the people who are creating the cities of the future and those who want to live there.

The hub of the placemaking movement, connecting people to ideas, expertise, and partners with a passion for creating vital places.

An advocate for a model of development that allows our cities, towns, and neighborhoods to grow financially strong and resilient.

Public engagement and civic tech news from around the web.

Smart Growth is a way to build cities, towns, and neighborhoods that are economically prosperous, socially equitable, and environmentally sustainable.

A nonprofit organization with a mission to inspire social, economic, and environmental change in cities through journalism and events around the world.

Provides leadership in development of vital communities by advocating excellence in planning, education and empowerment.

A nonprofit resource that promotes architecture and urban design solutions to create healthy and engaged communities.

Helping city leaders build better communities. NLC serves as a resource and advocate for the nation’s cities and their leaders.

Buffer: A scheduling tool for the Complete Communities Facebook and Twitter account. You can make posts and schedule them throughout the week. This tool is available as a browser plug-in.

Pocket: A “view-later” app where you can save articles, websites, and resources within your browser. This is helpful in creating a repository of shareable content for when you schedule social media posts.

City Lab

Project for Public Spaces

Strong Towns

Engaging Cities

Smart Growth USA

Next City

American Planning Association

Center for Active Design

National League of Cities

13

Page 14: BRAND & COMPLETECOMMUNITIESDE.ORG ENGAGEMENT ... · creation of infographics are PiktoChart (ideal for data visualization) and Canva (ideal for illustration of concepts). Samples

SOCIAL MEDIA RESOURCESENGAGEMENT

DELAWARE MAIN STREET COMMUNITIES/AFFLIATES

DELAWARE RESOURCES

Other Main Street Communities and affiliates without a web presence include: the Town of Bridgeville, Town of Delmar, City of Harrington, Millsboro Downtown Partnership, Town of Milton, and New Castle Community Partnership.

Delaware City (Delaware City Main Street)

Milford(Downtown Milford)

Wilmington(Downtown Wilmington)

Smyrna (Smyrna Downtown Renaissance)

Middletown(Middletown Main Street)

Rehoboth(Rehoboth Main Street)

Seaford(Seaford Tomorrow)

Dover(Downtown Dover)

Newark(Downtown Newark)

Wilmington(Downtown Visions)

Wilmington(West Side Wilmington)

DelDOT(Dept. of Transportation)

Bike Delaware(Community Organization)

Network Delaware(Community Organization)

Delaware State Housing Authority (DDD Program)

Delaware Department of Agriculture

Visit Delaware(Delaware Tourism Office)

Delaware State Parks(Parks & Recreation)

DART First State(Del. Area Regional Transit)

Delaware Libraries(Del. Division of Libraries)

14

Page 15: BRAND & COMPLETECOMMUNITIESDE.ORG ENGAGEMENT ... · creation of infographics are PiktoChart (ideal for data visualization) and Canva (ideal for illustration of concepts). Samples

SOCIAL MEDIA SCHEDULINGENGAGEMENT

Follow this basic checklist when scheduling content on both Twitter and Facebook. This will help you keep track of the different types of content you may look for throughout the week and assist you with developing of themes for different days or highlighting different events.

MONDAYFacebook Post (Delaware Event/Activity Highlight) Twitter Post (Delaware Event/Activity Highlight)

Facebook Post (Planning Article/Resource Highlight) Twitter Post (Planning Article/Resource Highlight)Possible Themes: #MobilityMonday, #MovementMonday

TUESDAYFacebook Post (Delaware Event/Activity Highlight) Twitter Post (Delaware Event/Activity Highlight)

Facebook Post (Planning Article/Resource Highlight) Twitter Post (Planning Article/Resource Highlight)Possible Themes: #TransportationTuesday, #TransitTuesday, #TravelTuesday, #TownTuesday, #TechTuesday, #TuesdayTrivia

WEDNESDAYFacebook Post (Delaware Event/Activity Highlight) Twitter Post (Delaware Event/Activity Highlight)

Facebook Post (Planning Article/Resource Highlight) Twitter Post (Planning Article/Resource Highlight)Possible Themes: #WellnessWednesday, #WisdomWednesday

THURSDAYFacebook Post (Delaware Event/Activity Highlight) Twitter Post (Delaware Event/Activity Highlight)

Facebook Post (Planning Article/Resource Highlight) Twitter Post (Planning Article/Resource Highlight)Possible Themes: #TransportationThursday, #TransitThursday, #TownThursday, #TechThursday, #ThursdayTrivia

FRIDAYFacebook Post (Delaware Event/Activity Highlight) Twitter Post (Delaware Event/Activity Highlight)

Facebook Post (Planning Article/Resource Highlight) Twitter Post (Planning Article/Resource Highlight)Possible Themes: #FestivalFriday, #FitnessFriday, #FoodFriday, #FollowFriday (for highlighting partners)

SATURDAYFacebook Post (Delaware Event/Activity Highlight) Twitter Post (Delaware Event/Activity Highlight)

Facebook Post (Planning Article/Resource Highlight) Twitter Post (Planning Article/Resource Highlight)Possible Themes: #SmallBusinessSaturday, #StreetSaturday, #StreetscapingSaturday, #SolutionSaturday

SUNDAYFacebook Post (Delaware Event/Activity Highlight) Twitter Post (Delaware Event/Activity Highlight)

Facebook Post (Planning Article/Resource Highlight) Twitter Post (Planning Article/Resource Highlight)Possible Themes: #SmallBusinessSunday, #StreetSunday, #StreetscapingSunday, #SolutionSunday

Tips: Two to three times a week highlight resources within the Complete Communities Toolbox, particularly as relevant to current events or seasons. Once a week highlight a resource related to DelDOT (app, blog, event, etc.) and tie that back to the Complete Communities website. Refer to and update the Annual Calender of Events in the Shared Drive (Phase II Complete Communities>Social Media Posts 2017>MajorEventsinDE_NationalHolidays_2017.docx) for a list of events and themes to highlight.

15

Post Bi-Weekly Round Up Digest of Social Media Posts on Website (2nd & 4th Wednesdays)

Page 16: BRAND & COMPLETECOMMUNITIESDE.ORG ENGAGEMENT ... · creation of infographics are PiktoChart (ideal for data visualization) and Canva (ideal for illustration of concepts). Samples