Master Visual Storytelling Workshop
Agenda• Why Visuals are Compelling• What Constitutes a Visual• How to Master Visual Storytelling• Extending the Life of Yo...
3Which of your 5 sensesdo you fear losing the most?Vision is everything
4Visuals are priceless
Visuals are timeless
6Visuals have depth and complexity
7Visuals promote feeling and emotional reaction
8Visuals stimulate our senses
9Visuals allow for personal interpretation
10Visuals speak for themselves
And when you put them together…Visuals tell a story
What are Visuals?
13Photos
14Graphics
Infographics
The Work in Progress: BeforeIssues to address:1. Text only2. No visuals3. No text treatments4. Mundane to theeye/flow
Your Visual Storytelling…TREGY
Step 1. Visual Optimization
Optimize: File Namesearch1.pngMaster-Visual-Storytelling.png
Optimize: File SizeHigh resolution:width of ~500pixelsLow resolution
Optimize: TitleReads like anarticle headlineVague, illegible
Optimize: Alternate Text (Alt Text)Use of title orfile nameMaster Visual Storytelling2013 Content MarketingStrategies Conf...
Optimize: Caption/DescriptionLeave blankInclude price forPinterest;statement that tiesimage back tocontent of the page
Optimization SummaryUse keywords; hyphens separate wordsImage headline; keywords & company name; human readableConcise exp...
Step 2. Maximize Social
Power of pictures on Facebook
Facebook is Designed for VisualsCover Photo: 851x315Profile Picture: 180x180Timeline Photo:552 pixels wide
Optimize File Size for Facebook552pixelsImage Optimization for FacebookFile Name: Auto assigned when uploaded intoFacebook...
Images Belong on TwitterImage Optimization for TwitterFile Name: New filename assigned whenuploaded on Twitter; good pract...
The Twitter Cards SolutionApply for the program(https://dev.twitter.com/docs/cards)Add code to your siteIncrease user enga...
Pinterest Isn’t Optional
Hey Flitter, NEWS FLASH.is just for chicks & retailers!
33Pinterest Does B2B
Bad-Ass Machines Use PinterestInfographics, whitepapers, eBooks, guidesPromotions, campaigns, user-generatedcontentShow co...
Make for Easy PinningImage Optimization for PinterestFile Name: New filename assigned when uploadedonto Pinterest. Best pr...
36The Pinterest 500Keyword rich 500 characters,use them all – in the ALT text
Optimize File Size for Pinterest5000pixels 554 pixels
More Pinterest Optimization• Search engines crawl Pinterest(publicly)• Title of a board in URLhttp://pinterest.com/tcmarke...
Layout OptimizationBefore After
Extend the Life of Your Visuals
Visual Life Extensions• Repurpose in blog posts, press releases,whitepapers• Create a Slideshare of the content• Cross-pro...
Optimization SummaryMeta Data Facebook Twitter PinterestFile Name N/A, new file name assignedN/A new file name assigned; r...
43Q & A
44Bill FlitterCEO/Founderbill@dlvr.ithttp://dlvr.itMaria VanWambekeVP, Product Development &IntegrationMaria.VanWambeke@bu...
45Notable Sources• http://www.marketingprofs.com/articles/2013/10563/three-steps-to-using-instagram-for-e-commerce-without...
Upcoming SlideShare
Loading in...5
×

Maria and Bill - How to Master Visual Storytelling

920

Published on

Visual Web: Maria Van Wambeke,Vice President, Product Development & Integration, Business Wire & Bill Flitter, Founder & CEO, dlvr.it. How to master visual storytelling to drive traffic & sales.

Published in: Technology, Design
0 Comments
1 Like
Statistics
Notes
  • Be the first to comment

No Downloads
Views
Total Views
920
On Slideshare
0
From Embeds
0
Number of Embeds
4
Actions
Shares
0
Downloads
9
Comments
0
Likes
1
Embeds 0
No embeds

No notes for slide

Maria and Bill - How to Master Visual Storytelling

  1. 1. Master Visual Storytelling Workshop
  2. 2. Agenda• Why Visuals are Compelling• What Constitutes a Visual• How to Master Visual Storytelling• Extending the Life of Your Visuals
  3. 3. 3Which of your 5 sensesdo you fear losing the most?Vision is everything
  4. 4. 4Visuals are priceless
  5. 5. Visuals are timeless
  6. 6. 6Visuals have depth and complexity
  7. 7. 7Visuals promote feeling and emotional reaction
  8. 8. 8Visuals stimulate our senses
  9. 9. 9Visuals allow for personal interpretation
  10. 10. 10Visuals speak for themselves
  11. 11. And when you put them together…Visuals tell a story
  12. 12. What are Visuals?
  13. 13. 13Photos
  14. 14. 14Graphics
  15. 15. Infographics
  16. 16. The Work in Progress: BeforeIssues to address:1. Text only2. No visuals3. No text treatments4. Mundane to theeye/flow
  17. 17. Your Visual Storytelling…TREGY
  18. 18. Step 1. Visual Optimization
  19. 19. Optimize: File Namesearch1.pngMaster-Visual-Storytelling.png
  20. 20. Optimize: File SizeHigh resolution:width of ~500pixelsLow resolution
  21. 21. Optimize: TitleReads like anarticle headlineVague, illegible
  22. 22. Optimize: Alternate Text (Alt Text)Use of title orfile nameMaster Visual Storytelling2013 Content MarketingStrategies Conference
  23. 23. Optimize: Caption/DescriptionLeave blankInclude price forPinterest;statement that tiesimage back tocontent of the page
  24. 24. Optimization SummaryUse keywords; hyphens separate wordsImage headline; keywords & company name; human readableConcise explanation of image; textual substitute for the imageLonger explanation of image in words; include pricing detailsand location, when applicable. High reading value thatimmediately captures attention. This is a statement that ties theimage back to the content of the page.500 pixels wide
  25. 25. Step 2. Maximize Social
  26. 26. Power of pictures on Facebook
  27. 27. Facebook is Designed for VisualsCover Photo: 851x315Profile Picture: 180x180Timeline Photo:552 pixels wide
  28. 28. Optimize File Size for Facebook552pixelsImage Optimization for FacebookFile Name: Auto assigned when uploaded intoFacebook. Good practice to rename it with relevantkeywords.File Size: Timeline: 552 pixels wideCover: 851x315Profile: 180x180Image Title: N/AAlt Text:Timelines: Uses photo description/caption. If leftblank, Alt text is set to “photo”.Profile: Uses your profile nameCover: N/ADescription: Used on timeline photos, added to AltAttributes. Can utilize keyword rich text and links indescription.
  29. 29. Images Belong on TwitterImage Optimization for TwitterFile Name: New filename assigned whenuploaded on Twitter; good practice to createkeyword rich filename when saving, rather thanusing default.File Size: Profile: 81x81, max 2MBHeader: up to 1252x626(displays 520x260), max 5MBTweet: image preview 60x60, max3MBImage Title: N/AAlt Text: Profile pic uploaded will have AltAttribute set to your profile name. Not found onother photos.Description: Tweet posts are searchable bycaption/ content on Twitter and search engines.Useful to describe the photo in the tweet herewith keywords.
  30. 30. The Twitter Cards SolutionApply for the program(https://dev.twitter.com/docs/cards)Add code to your siteIncrease user engagement on Twitter
  31. 31. Pinterest Isn’t Optional
  32. 32. Hey Flitter, NEWS FLASH.is just for chicks & retailers!
  33. 33. 33Pinterest Does B2B
  34. 34. Bad-Ass Machines Use PinterestInfographics, whitepapers, eBooks, guidesPromotions, campaigns, user-generatedcontentShow community service & work cultureProduct display
  35. 35. Make for Easy PinningImage Optimization for PinterestFile Name: New filename assigned when uploadedonto Pinterest. Best practice to save photo withkeywords.File Size: Pins: 554 pixels wide. Max of 5000pixels long (infographics)Cover: 222x207Profile: 165x165Image Title: Uses page title or Pinterest –specifictitle if provided in the source code. Whatever youtitle your board will be used as part of yourPinterest URL.Alt Text: N/A; Alt text not found attached tophotos. Description used as Alt text.Description: Can describe the photo with up to500 characters in description. These terms can beused for search in Google and Pinterest.
  36. 36. 36The Pinterest 500Keyword rich 500 characters,use them all – in the ALT text
  37. 37. Optimize File Size for Pinterest5000pixels 554 pixels
  38. 38. More Pinterest Optimization• Search engines crawl Pinterest(publicly)• Title of a board in URLhttp://pinterest.com/tcmarketeer/content-marketing-news/• Repins = referral traffic
  39. 39. Layout OptimizationBefore After
  40. 40. Extend the Life of Your Visuals
  41. 41. Visual Life Extensions• Repurpose in blog posts, press releases,whitepapers• Create a Slideshare of the content• Cross-promote on Facebook, Twitter, Flickr,Tumblr, Posterous and Foursquare…all socialnetworks• Create brand-specific albums in Facebook• Use images in ad campaigns (PPC)• Don’t forget mobile photo sharing networksfor promotions & campaigns (Instagram)
  42. 42. Optimization SummaryMeta Data Facebook Twitter PinterestFile Name N/A, new file name assignedN/A new file name assigned; reportedto be useful to have keywords infilename.N/A; new filename assigned; Alsoreported to be useful to have keywordsin filename.File SizeCover: 851x315 Profile: 81x81, Max 2MBPins: 554 pixels wide, no longer than5000 pixelsProfile: 180x180Header: up to 1252x626 (displays520x260), Max 5MBCover: 222x207Timeline: 552 pixels wide Tweet: image preview 60x60, Max 3MB Profile: 165x165TitleN/A; EXIF (data added in photothrough photo programs)removedN/A; EXIF also removed.Uses page title or Pinterest-specific titleif provided in source code. Whateveryou title your board will be used as partof your Pinterest URL, so use keywords.Alt TextTimeline: Uses photodescription/caption. If left blank,it is set to "photo"Profile pic uploaded will have alttext="profile name". Not found on otherphotos posted.N/A; Alt text not found attached tophotos. Description used as Alt text.Profile: Uses profile nameCover: N/A(Alt shows on timeline only.Doesnt show on maximizedphoto for FB)Caption/DescriptionUsed on timeline photos, addedto Alt Attributes. Utilize keywordrich text here.Tweet posts are searchable by caption/content on Twitter and search engines.Useful to describe the photo in thetweet here with keywords.Can describe the photo with up 500characters in the Description. Theseterms can be used for search in Googleand Pinterest.
  43. 43. 43Q & A
  44. 44. 44Bill FlitterCEO/Founderbill@dlvr.ithttp://dlvr.itMaria VanWambekeVP, Product Development &IntegrationMaria.VanWambeke@businesswire.comhttp://businesswire.com@mariavwLinkedIn:
  45. 45. 45Notable Sources• http://www.marketingprofs.com/articles/2013/10563/three-steps-to-using-instagram-for-e-commerce-without-sharing-a-single-photo#ixzz2QqlOG6WR?utm_source=buffer&utm_medium=twitter&utm_campaign=Buffer%253A%2520%2540Curalate%2520on%2520twitter&buffer_share=d8f5e• http://blog.hubspot.com/blog/tabid/6307/bid/33423/19-Reasons-You-Should-Include-Visual-Content-in-Your-Marketing-Data.aspx• http://blog.hubspot.com/blog/tabid/6307/bid/33800/Photos-on-Facebook-Generate-53-More-Likes-Than-the-Average-Post-NEW-DATA.aspx• http://blog.hubspot.com/blog/tabid/6307/bid/32255/Why-Marketers-Should-Invest-in-Visual-Content-Creation.aspx• http://blog.hubspot.com/blog/tabid/6307/bid/33222/How-to-Breathe-New-Life-Into-Your-Marketing-With-Visual-Content.aspx• http://blog.hubspot.com/blog/tabid/6307/bid/33222/How-to-Breathe-New-Life-Into-Your-Marketing-With-Visual-Content.aspx• http://blog.hubspot.com/blog/tabid/6307/bid/29987/The-Marketer-s-Scoop-on-Instagram-and-How-to-Use-It.aspx• http://blog.hubspot.com/blog/tabid/6307/bid/34223/5-Infographics-to-Teach-You-How-to-Easily-Create-Infographics-in-PowerPoint-TEMPLATES.aspx:• http://blog.hubspot.com/blog/tabid/6307/bid/34262/The-Ultimate-Guide-to-Measuring-Your-Pinterest-Marketing-Success.aspx• http://econsultancy.com/us/blog/62189-stats-who-uses-pinterest-and-why-is-it-important-for-marketers• http://www.bitrebels.com/social/get-repinned-pinterest-image-optimization-guide-infographic/attachment/pinterest-image-optimization-guide-1/
  1. A particular slide catching your eye?

    Clipping is a handy way to collect important slides you want to go back to later.

×