Contest: Image Asset Checklist (Canvas App, Microsite & Iframe)
Upcoming SlideShare
Loading in...5
×
 

Contest: Image Asset Checklist (Canvas App, Microsite & Iframe)

on

  • 423 views

 

Statistics

Views

Total Views
423
Views on SlideShare
346
Embed Views
77

Actions

Likes
0
Downloads
4
Comments
0

2 Embeds 77

http://support.strutta.com 55
https://strutta.desk.com 22

Accessibility

Upload Details

Uploaded via as Adobe PDF

Usage Rights

© All Rights Reserved

Report content

Flagged as inappropriate Flag as inappropriate
Flag as inappropriate

Select your reason for flagging this presentation as inappropriate.

Cancel
  • Full Name Full Name Comment goes here.
    Are you sure you want to
    Your message goes here
    Processing…
Post Comment
Edit your comment

    Contest: Image Asset Checklist (Canvas App, Microsite & Iframe) Contest: Image Asset Checklist (Canvas App, Microsite & Iframe) Presentation Transcript

    • ! ! ! Contest! ! ! ! Image Asset Checklist
    • Specs:! • Facebook Canvas App is 720 pixels wide which fills Facebook's Canvas Page frame (Facebook ads line the right column).! • Users must click through a promotional image on your Facebook Page to access the app. • Set a custom app URL (PRO package feature)! • Optimized for viewing and interaction on mobile devices! ! User flow:! From your Facebook Page, users must click through a tab graphic to access the contest. You can bypass the promotional graphic by sending users directly to the promotion site through Facebook ads or other online posts and advertisements using the direct URL.! 1. User arrives on Facebook Page and clicks on the contest icon from the list of apps.! 2. In contests which are fan-gated, non-fans see a 'Like us to proceed' image.! 3. Once they Like your Page, if they are an existing fan, or if you have chosen not to fan-gate, then they are presented with the tab image.! 4. After clicking on this tab image the user will then land on the promotion site! Facebook Canvas App | Image Asset Checklist| Contact us | @strutta | Strutta on Facebook | 2
    • Launch a free-standing branded promotion site. This option is perfect if you’re looking to design a unique user experience outside of Facebook, set a custom URL (PRO Package feature) and allow users to access your promotion on a mobile device. ! User flow:! Users visit the contest through the direct URL, through a tab on your Facebook Page (by clicking the contest icon from the list of apps), through Facebook ads or other online posts and advertisements.! Specs:! • Standalone Microsite is 720 pixels wide with unlimited background width (depending on your device screen size).! • Facebook and other social integrations available! • Set a custom URL (PRO package feature)! • Optimized for viewing and interaction on mobile devices! !   Standalone Microsite Direct URL | Image Asset Checklist| Contact us | @strutta | Strutta on Facebook | 3
    • Launch an HTML iframe that can be embedded directly within a page of your website. This option is ideal if you’re looking to drive traffic to your website, keep full website navigation, and maintain ad space.! ! User Flow:! Users visit the contest through the direct URL, through a promotional graphic on your Facebook Page (by clicking the contest icon from the list of apps), through Facebook ads or other online posts and advertisements.! Specs:! • Website Embed is 720 pixels wide. The size can be changed within the iframe embed code.! • Facebook and other social integrations available! • Utilize your own website URL! • Accessible* on mobile devices (provided your site is mobile-friendly)! ! ! Note: Iframe sites are not responsive on mobile. Website Embed (iframe)
    • Views & Apps Image | 111x 74 pixels! ! Include a call to action in the photo or tab name.! ! Users will click on this tab image on your Facebook page to access the promotion.! ! Note: You may not want your promotion site on your Facebook page. If not, your users can access the promotion site through the direct URL (Microsite & Iframe only). ! ! Fan - Gate Image | 810 x 1200 pixels (optional)! • image for non-fans (optional)! ! If you choose to Fan-Gate your promotion, those who do not already like your page already will land on this image. ! ! This image should communicate that the user must like the Facebook page to access the promotion.! ! Add this image in the Integration > Facebook > Facebook Tab > Fan-Gate section of your Stuttta builder. 1. 2. | Image Asset Checklist| Contact us | @strutta | Strutta on Facebook | 5
    • * Tab Image | 810 x 1200 pixels! • image for fans (required)! ! The Tab image is the initial image users will see when they access the promotion. Users who already like your page will land on this image and bypass the Fan-Gate image.! ! This image should include a call to action for those who already like your page. Clicking this image will take the user to the promotion site.! ! Add this image in the Integration > Facebook > Facebook Tab section of your Strutta builder.! ! Note: ! If you Fan-Gate your promotion, non-fans will click through two images to reach the promotion.! 1. Fan-Gate image! 2. Tab image! ! If you do not Fan-Gate your promotion, users will click through one image.! 1. Tab image! Banner Image | 720 x 100 pixels! ! This image will remain visible throughout all pages of your promotion site so consider including the title of your promotion.! ! Add this image in the General > Look & Feel > Customize Assets > Banner Image section of your Strutta builder. 3. 4. | Image Asset Checklist| Contact us | @strutta | Strutta on Facebook | 6
    • Intro Image or Video | 720 x 405 pixels or 16:9 aspect ratio for videos ! ! The intro image or video should include key details of the promotion.! ! ! Add this image in the General > Look & Feel > Customize assets > Intro Image section of your Strutta builder.! ! Note: All images are converted to JPEG including transparent PNG’s. Prize Image | 100 pixels x any height! ! 5. 6. | Image Asset Checklist| Contact us | @strutta | Strutta on Facebook | 7
    • Prize Image | 100 pixels x any height! ! Adding a prize will populate a new tab on your site ‘Prizes’. This is optional.! ! This image will also display as a thumbnail on the main ‘Details’ page.! ! Add this image in the Content > Prizes section of your Strutta builder.! ! Judge Image | 100 pixels x any height! ! Adding a judge will populate a new tab on your site ‘Judges’. This is optional.! ! Add this image in the Content > Judges section of your Strutta builder. Sponsor Image or Logo | 100 pixels x any height! ! Adding a sponsor will populate a new tab on your site ‘Sponsors’. This is optional.! ! Add this image in the Content > Sponsors section of your Strutta builder. 7. 8. | Image Asset Checklist| Contact us | @strutta | Strutta on Facebook | 8
    • Background Image | Any size! ! Canvas App, Microsite and iframe: ! ! The width of the contest site is 720 pixels wide. The size of the background image will change depending on what device the user is on or if their browser is fully enlarged or not. If a user is viewing the site on a smaller screen, the contest site will scale down and fit the screen, however, the background image may be cut off on a smaller screen.! ! If you do not want to add a background image, choose a background color in your builder to fill the white space.! ! Add this image in the General > Look & Feel > Customize Assets > Background Image section of your Strutta builder.! ! 11. Width of contest site | 720 pixels Fluid background width Example: Browser full screen enabled Example: Browser size scaled down | Image Asset Checklist| Contact us | @strutta | Strutta on Facebook | 9
    • Custom App Image | 74 x 74 pixels! ! Before a user can vote or enter in a Facebook promotion, they need to authorize the app!! ! You only need this image if you are creating a Custom App. Ask your project or account manager if this is necessary for you.! ! The permissions asked in the Facebook pop- up box will depend on the settings implemented in your promotion. Learn more about why Facebook asks for permissions here.! ! Facebook Share Image | Any size! ! The share Facebook link on the main ‘Details’ page of the promotion site opens a pop-up window with default share tools. ! ! Note: The thumbnail image in the pop-up is pulled from the main Intro image of your promotion and scaled to fit. If you are using a video instead of an image, send us an image and we will upload it for you! 9. 10. | Image Asset Checklist| Contact us | @strutta | Strutta on Facebook | 10