How to: Social Media Image Templates

Social Media image sizes change all the time, and company pages don’t always use the same size as personal pages. How do you keep up with changing social media image sizes? We’ve got a handy Illustrator template for you to download and it’s totally free. You’re welcome!

The template type is current Illustrator version, but there’s nothing that should get lost if you’ve got an earlier version of Illustrator. Safe areas and areas that are likely to be hidden are included, plus artboards for your profile image or company logo. Note: the template includes Facebook, Twitter, and LinkedIn only, simply because these 3 social media channels are the main ones our client’s need. For LinkedIn, we are including image sizes for company pages. Personal pages use slightly different sizes and you can find image sizes info here.

Typefaces used are:

  • Proxima Nova (not free, but Adobe subscribers can download some weights included in the CC plan).
  • Acumin, also an Adobe font.

Each of the typefaces used is a sans serif but replace these with fonts of your choice, or replace with typeface(s) that fits your client’s brand.

Download the 2019 social media image template here

Need help with setting up a PowerPoint template? Click here for a How To.

Or, contact us to inquire about a creative project for your organization.

Illustrating Sustainable Energy Systems

  • Residential Energy System

    Sustainable Energy System for Residential Application
  • Industrial/Manufacturing Facility

    Industrial/Manufacturing Property Energy System
  • Large Commercial Property

    Large-scale Sustainable Energy System

How does a sustainable energy system work anyway?

As we make the transition to sustainable energy, illustrating sustainable energy systems can help to inform the public about how they work. Anyone in a developed country uses energy on a daily basis, even if it is only to flip a light switch. But most of us have only a limited understanding of how that energy gets to our home or place of work. Many of us know even less about what makes energy “sustainable” or not.

More directly, energy companies need to provide information to city managers and/or property owners with which they can make decisions about energy projects.

Recently a client in the renewable energy industry asked us to help them tell their story with illustrations that would show the various components of a self-sustaining energy system and how they work together.

Our Process:

  • First, we interviewed the client and gathered information about the various parts of a sustainable energy system.
  • Rough sketches of the systems were created to make sure we had the details correctly represented.
  • We then developed illustrations that show how a self-sustaining energy system works for different types of properties, from a residential scale to an industrial scale.

For the client, these illustrations will serve as an overview for more detailed information about project development and the energy system products they sell.

How to: Create a Custom PowerPoint Template

How do you create a custom PowerPoint template that looks good, and helps your client create effective presentations? Keep reading for tips and best practices for constructing templates that work as expected, and avoid PowerPoint pitfalls.

Most designers dislike PowerPoint because of its irritating design limitations. But, most companies use tools such as Word and PowerPoint on a daily basis for reports, presentations, white papers, and other documents meant to be emailed to their prospects and/or customers. So for your client companies, it’s important to develop Office templates that extend their branding into the tools used for creating everyday communication.

Therefore, you have to embrace the design limitations of PowerPoint, and plan accordingly. Below are some considerations for designing PowerPoint slide layouts:

  1. You will need to design to a landscape (horizontal) orientation; find out whether the client needs a widescreen (16:9) and/or a 4:3 version before getting started with design. Depending on the world region(s) in which they will give presentations, they may need both.
  2. Find out what types of information will routinely be needed and develop slide master layouts accordingly. This will help your client keep presentations looking consistent.
    • Example: does your client need a “Team” slide with placeholders for staff photos, with department and title below?
    • Does your client use the pre-built SmartArt diagrams and charts already available in PowerPoint? Consider creating slide layouts that will better showcase these elements to tell the story.
  3. When developing the color scheme, consider whether there will be sufficient contrast for elements to be legible viewed from a distance. This leads directly to the next point…
  4. Keep it simple: less is more when it comes to presentations. Effective presentations showcase one primary point per slide. Simple layouts will also be easier for non-designers to maintain.
  5. When developing layouts for client approval, it’s fine to use a tool such as InDesign.Tip: To ensure that all content on the slides is visible when presented, set up your InDesign document with a page size of 10″ width and 5.63″ height for 16:9 presentations. For 4:3 presentations the page size should be 10″ width by 7.5″ height. Note: for clients that will use only very large screens for presentations, a document size of 13.33″ width and 7.5″ inches in height is ideal for 16:9 presentations. Margins should be .5 inch; top and bottom margins can vary but .25 inch is a minimum, and only footer text such as disclosure/copyright, date and slide number should be outside of a .5 inch margin at bottom.
    • Keep in mind that most clients will need to stick with typefaces that are system fonts. Use a system font that makes visual sense with your client’s brand from the start.
    • For layouts, think in terms of one-column, two-column, and a maximum of three-columns. Three-column grids are also ideal for layouts with a one-third width column of text left or right and an image or chart that fits the remaining two-thirds of the slide width.
    • Object positioning in PowerPoint is not as precise as in design software. In other words, an object placed at 1.125″ from an edge in InDesign is going to be at 1.13″ in PowerPoint. Design accordingly!
  6. Use high quality images: we strongly recommend to clients that they license quality stock images and/or schedule a photoshoot. Low quality images look worse when projected onto a large screen.

Tip: Before developing layouts using a design application, take a look at some of the pre-built templates that come with the application to see how the developers of PowerPoint approach various design elements. This step will help you avoid design that cannot easily be replicated in PowerPoint.

Once you have client sign off on the layouts, you are ready to construct the PowerPoint template.

There is a best practice:
first create a Theme,
then apply that theme to a Master,
then build Master Slide Layouts.
Last, add Slides that use the layouts you just built.

What is a PowerPoint Theme?

A theme includes the color palette for text, slide background colors and the default colors of charts or diagrams. Themes also include the fonts to be used in the presentation. PowerPoint has built-in color themes that you can customize. You will find the Colors in Slide Master view. From the application menu, View > Master > Slide Master. Then click Colors to customize them for your client.

Tip: remember to save your custom colors with a name that is more specific than the default “Custom 1” name.

You can also save effects such as drop shadows or glossy effects. Once saved, these effects will become the default effect for all shapes that are inserted into a presentation that uses your theme, so use effects sparingly or not at all!

Tip: first create a custom color palette and select fonts for the theme before adding any shapes or text boxes, because added text placeholders and/or shapes will automatically use the colors and fonts you just specified.

You will want to save the changes you made to the default colors, fonts and effects as a theme (.thmx file) so that you can apply the same look to other presentations. Make sure you are in Slide Master view once you’re done making changes. Then, on the Slide Master tab, select Themes and click Save Current Theme.

The link to “Save Current Theme” is at the bottom of the pop-up window, indicated above with the cursor arrow.

In the file name dialog box, type a name that will help you find this theme easily, and click Save. The next time you open PowerPoint, this theme will be added to the list of custom themes on the Design tab of the ribbon.
Details here: https://support.office.com/en-us/article/use-or-create-themes-in-powerpoint-83e68627-2c17-454a-9fd8-62deb81951a6

Once you have created a theme, building the template is next.

What is a PowerPoint Template?

A PowerPoint template (.potx file) is a set of slide layouts; it serves as a pattern or blueprint for creating a presentation. PowerPoint has built-in templates that you could customize but for maximum flexibility, you will want to start with a blank presentation.

Open a blank presentation, select the View tab on the ribbon, then choose Slide Master in the Master Views group.

Select the “View” tab on the ribbon, then select “Slide Master”

The slide master is the largest slide at the top of the thumbnail list at left of your window. Associated slide layouts are below the slide master.

In Slide Master View, the top-level master is the large slide thumbnail at the top of its associated slide layouts.

You will want to apply the theme you just saved. To find the theme, click the Themes button and scroll to find your new theme in the Custom section. Tip: if you hover your mouse over the thumbnails in this list, the theme name appears. Click the thumbnail for the theme you want to apply.

If you created a Custom theme, you may need to scroll down the pop up window to find the new theme (they are listed in alphabetical order)

Now it’s time to customize the basic layouts contained in the blank theme.

First modify items that will be present on all of the slides: set the appearance and position of elements such as the title, the main content area, body fonts and the appearance of lists on the top-level Master slide. Customizations made on this top-level Master will carry through all of the other associated Master Slide Layouts.

  • You may also want to modify the appearance of elements in the footer, such as the slide number, and date.
  • If you need to include a copyright statement or other disclaimer that can go in the text box labeled “Footer” in the screenshot above.
  • These footer area text boxes do not have to remain where they are; you can move them as wanted.

Remember to save your file regularly.

Once you are finished with modifications to the top-level Master, then make changes to the other associated layouts.

  • It’s a good idea to keep titles and a primary content/text box in the same position throughout the Master Layouts, except on the cover slide, the closing slide and section divider slide layouts. With this approach, the title and most prominent text content won’t seem to “jump around” as slides are presented.
  • If you do not want to have the footer information on a cover slide or any other Master Layout, simply uncheck the box beside “Footers” in the ribbon on the “Slide Master” tab.

Once you have finished modifying the slide layouts and/or adding new Master Slide Layouts and customizing them it’s time to save your template. Once you have saved the template, you can test how things are working by creating a new presentation based on that template.

PowerPoint Tips: Save As Template

After you are finished modifying all the layouts, remember to save your presentation as a template.

PowerPoint will save that template in the default location on your computer unless you specify another location. It’s best to allow PowerPoint to save the template in the default location so the template is available on the launch screen when you want to start a new presentation.

PowerPoint Launch Screen

PowerPoint has “Featured” (i.e. their pre-built templates), and “Personal” tabs. When you create a new template it will be listed under the personal tab.

If you do not see your new template listed in PowerPoint’s launch screen options, close PowerPoint and then reopen it. Your new template will be listed in alphabetical order, and may be under the “Personal” list rather than PowerPoint’s “Featured” list.

Infographics & Analytics

Analytics  seem to be in use for every area of life these days. Chances are your business is making use of data analysis everyday, but how do you communicate to your customers what matters about the data?

Maybe we’re biased, but we’ve observed that images, especially infographics that relate to your company’s business, is one way to explain “what it all means” once you have the data.

We recently had the chance to develop an infographic for Veros — a real estate analytics firm. The big story was that the top markets were all west of the Mississippi and the bottom markets seemed to be east. The client wanted quite a bit of data about specific markets, so our challenge was to organize that in a manner that still allowed a viewer to get the big picture at a glance.

Tips for creating infographics:

  • Pie charts are best to compare percentages to the whole, and for categories that are less than 5% of the total, it may be best to group as “Other”.
  • Line charts can effectively show fluctuations over time
  • Yes, you can combine more than one type of chart in an infographic; the rule is to keep thing visually simple so the most important facts can be understood in a glance.

Here’s an example infographic:

2014 Q3 VeroFORECAST Infographic

Got comments or questions? Click the button and get in touch!

Save

Split Types: Avoiding Painful Breakups

Sigh. . . it’s always unfortunate when partners break up. We were saddened to hear about the Hoeffler Frere-Jones split. At this point, it looks like the case will grind through State of New York courts for some time to come.

Read more Split Types: Avoiding Painful Breakups

Webfonts Banish Bland Typography

(updated for 2018) The era of bland website typography is disappearing with the wide use of webfonts — typefaces specifically designed (or redesigned) to be crisp and clear on screen. The use of webfonts allows a designer/web developer to use fonts that are not installed on the viewer’s computer.

How to use: most webfont repositories allow the web developer to use fonts from their library by including a link to the font inside the head tag of the web document. Then the font family will need to be named in a cascading stylesheet (CSS) linked to that web document. One example of a link included in the <head> of your document looks like this:

<head>
<link href=”http://fonts.googleapis.com/css?family=Open+Sans|Oswald:400,700″ rel=”stylesheet”>
</head>

Simply include the font name in your CSS just as you would with any system font. Here’s an example:

h1 { font-family: ‘Oswald’, Helvetica, Arial, sans-serif; font-weight: 700; }

The above style names the webfont inside single quote marks, followed by a list of alternates for viewers with really old browsers that do not support webfont use. A CSS style can be placed in the head of the document, or linked to the document. Find out more about using CSS here: w3.org

What’s the big deal?

There are important benefits to using webfonts:

Brand Consistency


Use the same typefaces on and offline so your brand looks the same everywhere; brochures, business stationary, website, or mobile apps

Search Optimization


Unlike a typographic image, a webfont uses “live” text that is searchable, and translatable

User Engagement


Webfonts enhance the your site’s visual appearance and the ability to translate text enhances its usability

Site Performance


The use of webfonts eliminates the need to an image for each instance of styled text, resulting in less bandwidth use

Sources for web fonts:

https://www.fonts.com/web-fonts
https://www.fontsquirrel.com/
https://www.fontspring.com/
https://www.google.com/fonts
https://www.myfonts.com/
https://www.theleagueofmoveabletype.com/
https://www.typekit.com/
https://www.typography.com/
https://www.webtype.com/

Please note that some of these resources require a subscription, however, a free account may be available for low-volume use.

And here are resources to preview how your site would look with various web fonts: http://typecast.com/fonts/google and choose a font for various text elements, such as headlines <h1>, paragraphs <p>, emphasized text <em>, and links <a>.

Infographics & Social Media

Social media use is going through explosive growth. While we can’t predict which channels will be the best ones for your company, we have observed that images, especially infographics that relate to your company’s business, is one way to enhance the ongoing conversation with your customers.

Detailed infographics can cost thousands to develop, but simpler ones can be a part of your social media on a regular basis. Wondering what goes into an infographic?

  • Start by researching trends or data related to your industry; in the above example, we gathered data from a government source to obtain accurate information.
  • Yes, accurate information is essential!
  • Once your data is organized, decide how best to present the data visually: would a bar graph be ideal? Or, what about a pie chart?
  • The best infographics convey the big picture at a glance!

Tips:

  • Pie charts are best to compare percentages to the whole, and for categories that are less than 5% of the total, it may be best to group as “Other”.
  • Line charts can effectively show fluctuations over time (see example below)
  • Yes, you can combine more than one type of chart in an infographic; the rule is to keep thing visually simple so the most important facts can be understood in a glance.

Got comments or questions? Click the button and get in touch!