Video Hub Update Project v1.0(7)
Contents:
Project Purpose: Requirements: Create a new presentation platform for promotion of original and popular CR-1: Hub Redesign video content in a manner which results in click through and video views. Findability of video content for users looking within specific content a) The hub must be redesigned to promote original content, core genres or categories should also be supported. video channels, and popular or relevant content. b) Users must also be able to find video content by topic area. Business Goals:
Content Promotion: Present the depth and range of IGN's growing CR-2: Hub Slotting inventory of originally produced content to build brand awareness a) Editors must have the ability to slot direct links to the video player and audiences for these original shows and videos. and the new video or video playlist galleries. Audience Engagement: Promote expansion of our video ad inventory views along with overall unique views and video view metrics. b) The hub slotting tools must be updated to support this.
Video Findability: Help users find videos within content categories and CR-3: Dynamic Indices platforms with video content on IGN. a) Dynamic Indices must be locally created for popular video KPI: platforms or popular video content in order to keep users within the IGN
Click-through rate Video experience.
Unique visitors
Page views Tracking: ATA tracking, Google Analytics etc to determine how often video hub is viewed and links are accessed.
Exclusions: This project will not cover:
Creation of Video Mini-Hubs for promotion of Game Trailer, HD, Review, or Shows/Review content. These will each be new projects or a combined project.
Creation of Super Sized Indices or Video Mini-Hubs on a per channel basis. This would be a new project which is network wide or specific to Video Indices. Video Hub Update Project v1.0(7)
Overview
Description: Change Log
Entry Points: N/A
Change Log Notes for Developers Video Hub Update Project v1.0(7)
Overview
Description: Video Hub Project Summary Page 4, 5, 6 N/A Entry Points: IGN Video Hub Page
Section Nav Notes for Developers Video Channels Game Trailers Overview.
New Hub page. Movie Trailers Links to new indices for video objects. Reviews Links to video player. Previews More Categories
Slotted Content
Top Video Stories Featured Video Core Content Channels Featured Shows Page (TBD)
Featured Originals IGN Video Indices (to Player or to Index)
Automatic Content
Top Videos Latest Game Trailers Latest Movie Trailers Latest Video Reviews Latest Video Previews Latest Videos
View All (for those Automatic Content sections with View All, link to appropriate index.) IGN Video Player Video Hub Update Project v1.0(7)
Overview Notes for Developers (cont’d) 1 Network Imprint
Description: IGN Video Hub – Top of Page (1) 6 Top Video Stories – General Requirements 2 IGN Logo and Video Image DHTML unit that displays custom story images of top 5 Entry Points: IGN Home Page, global nav, search engines. videos (slotted by editorial.) Unit must be 16:9 aspect ration. Pixel dimension of image [Google 3 Welcome [user name] | My Account | Log Out 1 4 Search: Web logo] area will be fixed and will be in the range of 427 x 240 to 480 x 270 (TBD by visual design.) Previews More Categories 5 Video Channels Game Trailers Movie Trailers Reviews Images may transition via animation (TBD by technical limitations of DHTML.)
Top Videos Image order determined by editorial. 6 Video Ttile Notes for Developers The images will auto-refresh; users may also navigate 2 Lorem ipsum Object Name: Caption 7 Video Title Custom through images using UI elements described below. image dolor sit amet 1 Platform/Type Lorem ipsum dolor sit amet, Top Video Stories should be SEO friendly with headline for 1 Network Imprint. consectetuer adipiscing elit. each image included as an ALT tag. Standard network imprint. Object Name: Caption Aenean ultrices. 2 Platform/Type Top Video Stories – Video Title and Description. 8 8 Video Ttile 7 2 IGN Logo and Video Image. (To be designed.) Lorem ipsum Each image will be accompanied a header and Custom dolor sit amet Object Name: Caption summary/strapline as slotted by editorial. Customimage Top Video image 3 Platform/Type 3 Login/Logout. Size, font and placement TDB by visual design. Single line login box. Refer to mockup on Page 6. Object Name: Caption 8 Top Video Stories – Navigation Arrows. 4 9 Video Ttile Platform/Type DHTML unit will include previous and next navigation 4 Google Search. Lorem ipsum arrows. Watch Now Custom Shortened Google search for hub (Web, IGN.com, hub Arrow will enlarge, change color or otherwise indicate image dolor sit amet Object Name: Caption options). 5 Platform/Type INSIDER active state on hover. 10 Refer to mockup on Page 6. Clicking left arrow displays previous image and headline; right for next image and headline. 5 Section Navigation. Links to individual sections within video channel. Xbox 360 PS3 Wii PC Movies Insider 9 Top Video Stories – Watch Now button. Thumb Thumb Thumb Thumb Thumb Thumb DHTML unit will contain a button that links to video player
Video Channels – dropdown that contains the following for Top Video currently displayed. links to video indices (which correspond with links in Featured Originals Button will animate (glow, enlarge, etc.) on hover (TBD Video Channels section described on “Bottom of by visual design.) Page” page): 10 Top Video Stories – Image Picker. DHTML unit will feature an image picker below image(s). [Games] [Entertainment] DVD Picker will not have labels but user should intuitively Wii Med rect Gear Customimage promo Customimage promo Customimage promo comprehend purpose. Xbox360 300x250 Movies Each rectangle corresponds to an image and order of Playstation 2 Stars rectangles mirror order of images as slotted by Playstation 3 TV editorial. PC Games Picker will have three states: unselected, current DS Video Title Video Title Video Title selection and hover selection. Each state will be PSP Lorem ipsum dolor sit amet, Lorem ipsum dolor sit amet, Lorem ipsum dolor sit amet, visually distinct. Retro consectetuer adipiscing elit. consectetuer adipiscing elit. consectetuer adipiscing elit. Clicking on unselected rectangle will cause DHTML Top Game Trailers – links to Games Trailer Index (NEW). Story image unit to transition to image which Game Trailers view all > Latest Videos Movie Trailers – links to Movie Trailers Index (EXISTING.) 1 | 2 | 3 | 4 | 5 corresponds to clicked rectangle. See Hulu.com for Reviews – links to Video Reviews Index (NEW.) [time] [channel] [video title] example (albeit in Flash.) Previews – links to Video Reviews Index (NEW.) [date] [caption] (Combines multiple classifications: Behind the Scenes, Preview, Developer Commentary) [time] [channel] [video title] [date] [caption] More – dropdown with additional links. Each item links to Notes for Visual Designers Video 160x120thumbnail Video 160x120thumbnail Video 160x120thumbnail Video 160x120thumbnail video index for listed item (THESE ARE ALL NEW INSIDER INDICES): [time] [channel] [video title] 1 Login/Google Search Sections. [date] [caption] To appear on the same line, space permitting. Object Name Object Name Object Name Object Name Gameplay (Combines multiple classifications: Google search options will appear in a dropdown rather Platform Platform Platform Platform [time] [channel] [video title] Cinematic, Single-Player Gameplay, Multiplayer [date] [caption] than as radio buttons. Gameplay) Movie Trailers view all > Likewise, links to community content will be displayed in Movie Clips 1 | 2 | 3 | 4 | 5 [time] [channel] [video title] a drop down. TV Clips [date] [caption] Top Video Stories – General Requirements Interviews 2 Shows This section should be DHTML. Flash may be utilized as a last resort if DHTML is technically incapable of fulfilling requirements.
(See next document page of Images must be 16:9 aspect ration. Pixel dimension of document for continuation of image area will be fixed and must be in the range of top of hub.) 427 x 240 to 480 x 270.
Images may transition via animation (TBD by technical limitations of DHTML.) Video Hub Update Project v1.0(7)
Overview Notes for Developers (cont’d) Network Imprint
Description: IGN Video Hub – Top of Page (2) 6 Top Video – Content and Behavior (cont’d). IGN Logo and Video Image Example content: Entry Points: IGN Home Page, global nav, search engines. Alone in the Dark Video Review -X360 The Mummy: Tomb of the Dragon Emporer (2008) Trailer #2 – Movies Google Search My Account | Hello [user name] | Logout The Mummy 3 Trailer #2 – Movies MGS4: Guns of the Patriots Preview – PS3 Video Channels Game Trailers Movie Trailers Reviews Previews More Categories Metal Gear Solid 4 Easter Egg: Photo Beauty – PS3 1 1 4 5 2 Top Videos 2 Video Ttile If Media Classification is utilized, follow these rules for Notes for Developers display of text. Lorem ipsum Commercial Custom Common Object Name or Caption Video Title 6 Cinematic Review image3 dolor sit amet 1 Platform/Type Common Classification 1 Featured Video – Slotting. Lorem ipsum dolor sit amet, Single-Player Gameplay Preview Three (3) featured videos will be slotted at all times consectetuer adipiscing elit. (Output text as: Interview Common Object Name or Caption which. Aenean ultrices. 2 Platform/Type Common Classification Gameplay) Developer Commentary Each featured video will link to the video player. Video Ttile Multiplayer Gameplay Music Video (Output text Lorem ipsum (Output text as: as: Video) Custom Common Object Name or Caption Featured Video – Custom Image. dolor sit amet Gameplay) Fan Video 2 Customimage Top Video image 3 Platform/Type Common Classification Each Featured Video will be represented by a thumbnail Movie Clip (Output text as: Show
image. Clip) Behind the Scenes Common Object Name or Caption Image ratio will be 16:9; exact pixel dimensions to be TV Show Clip (Output text Video Video Ttile 4 Platform/Type Common Classification determined by visual design. as: Clip) Watch Now Lorem ipsum Image will be slotted by editorial. Custom 7 Trailer image dolor sit amet Common Object Name or Caption As with Top Video Stories, Featured Story image should be 5 Platform/Type Common Classification SEO friendly with headline for each image included as Display object name using Common Object Name format INSIDER an ALT tag. (if available.) 8 3 Featured Video – Play Control. Xbox 360 PS3 Wii PC Movies Insider 7 Top Video – Insider. Hovering over image will cause a play control to display Thumb Thumb Thumb Thumb Thumb Thumb If a video is tagged as Insider-only, display an INSIDER (via DHTML fade-in or other aesthetically graphic identifier (to be designed.) pleasing/technologically possible method.) If a video is HD, display HD logo. Featured Originals view all > 9 Clicking Play control or image will take user to video 8 Core Content Channels. player for video represented by thumbnail. Prominent links to XBox360, PS3, Wii, PC, Movies, and Insider. 160x120 thumbnails are displayed as 4 Featured Video – Headline and Strapline. reduced via tag properties down to 80x60. Headline of featured video and linked to video player followed by strapline for same video. (). Slotted by editorial. Customimage promo Customimage promo Customimage promo 300x250 Image and channel text are linked to video player.
Images and links are slotted by editorial. 5 Top Videos. Images should have relevant ALT tags for SEO. Listing of the five most popular videos from the previous day as determined by ATA data. Video Title Video Title Video Title 9 Featured Originals. Text layout of Common Object Name, Caption and Lorem ipsum dolor sit amet, Lorem ipsum dolor sit amet, Lorem ipsum dolor sit amet, Three (3) promotional images appear in the Featured Platform/Type Classification TBD by visual design. consectetuer adipiscing elit. consectetuer adipiscing elit. consectetuer adipiscing elit. Originals section.
Images may be of an original size in this area (TBD by 6 Top Video – Content and Behavior. editorial/visual design.) Game Trailers view all > 1 | 2 | 3 | 4 | 5 Latest Videos Each Top Video listing should be considered an integral unit Each image will be accompanied by a title and (that is, clicking any part of the content area should link to [time] [channel] [video title] description linked to original content/shows index. [date] [caption] video player for that video.) Link may also go to video player at editorial discretion. Unit should highlight upon hover and return to a neutral state For SEO, image elements should contain ALT tags when cursor moves off. [time] [channel] [video title] [date] [caption] mirroring title and description of the promo image Each Top Video unit should contain rank graphic for video Video 160x120thumbnail Video 160x120thumbnail Video 160x120thumbnail Video 160x120thumbnail (show name, etc.) (TBD by visual design), object name, video caption, INSIDER [time] [channel] [video title] View All should link to a dynamic index of all videos platform type and Insider badge (if video is Insider-only), [date] [caption] with media classification “show”. and HD logo (if video is HD.) Object Name Object Name Object Name Object Name Platform Display media classification as: Video. Platform Platform Platform [time] [channel] [video title] When displaying Object Platform or Type use the following [date] [caption] Notes for Visual Designers text: Movie Trailers view all > 1 | 2 | 3 | 4 | 5 [time] [channel] [video title] 1 Featured Video Slotting. This section needs to be DS PC Anime [date] [caption] visually distinct from the Top Video section to avoid Wireless PS3 Gear possible impression of linkage. Retro PS2 Sports Movie PSP Car 2 Top Videos. Suggested formatting: TV X360 Stars (See next document page of DVD MGS4: Guns of…(Common Object Name) Wii Comics document for lower portion of TGS 2007: Sneaking… PS3 (Short, Truncated Caption) hub page.) TGS 2007: Sneak… (Short Truncated Caption) MGS4: Guns of the Patriots – PS3 (Common Name Object, Platform) Video Hub Update Project v1.0(7)
Overview 1 Notes for Developers (cont’d)
Description: Video Hub – Bottom of Page Med rect 7 Latest Movie Trailers. 300x250 Entry Points: Four 160h version of movie thumbnail images to be IGN Home Page, global nav, search Video Title Video Title Video Title automatically displayed at all times. engines. Lorem ipsum dolor sit amet, Lorem ipsum dolor sit amet, Lorem ipsum dolor sit amet, Each image is linked directly to video player. consectetuer adipiscing elit. consectetuer adipiscing elit. consectetuer adipiscing elit. Accompanying each image, display [common] object name and game platform (both also directly linked to 3 10 Game Trailers view all > 6 1 | 2 | 3 | 4 | 5 Latest Videos video player.) Database pull logic: Latest 20 videos which are of media Notes for Developers [time] [channel] [video title] [date] [caption] classification “trailer” and with a primary movie object attached. 1 Med Rect Ad. 2 [time] [channel] [video title] [date] [caption] Display med rect ad (300 pixels by 250 pixels). 8 Latest Video Reviews. Video 160x120thumbnail Video 160x120thumbnail Video 160x120thumbnail Video 160x120thumbnail At least 70% of ad must appear above the fold. INSIDER Display three to four (TBD by visual design) 160 x 120 4 5 [time] [channel] [video title] [date] [caption] thumbnail images to be automatically displayed at all 2 Latest Game Trailers. Object Name Object Name Object Name Object Name times. Each image is linked directly to video player. Display three to four (TBD by visual design) 160 x 120 Platform Platform Platform Platform [time] [channel] [video title] thumbnail images to be automatically displayed at all [date] [caption] Accompanying each image, display [common] object times. Movie Trailers view all > 3 name and game platform (both also directly linked to 6 1 | 2 | 3 | 4 | 5 [time] [channel] [video title] video player.) Each image is linked directly to video player. [date] [caption] Accompanying each image, display [common] object Database pull logic: Latest 20 videos which are of media classification “review”. name and game platform (both also directly linked to [time] [channel] [video title] video player.) [date] [caption] Database pull logic: Latest 20 videos which are of media 9 Latest Video Previews. classification “trailer” and with primary game objects [time] [channel] [video title] Display three to four (TBD by visual design) 160 x 120 7 from all platforms attached. [date] [caption] thumbnail images to be automatically displayed at all
boxart boxart boxart boxart times. Movie Poster Movie Poster Movie Poster Movie Poster [time] [channel] [video title] 3 View All Link. Each image is linked directly to video player. [date] [caption] Accompanying each image, display [common] object Link to dynamic index page for appropriate section (game trailers, movie trailers, video reviews, or video name and game platform (both also directly linked to [time] [channel] [video title] video player.) previews.) Object Name Object Name Object Name Object Name [date] [caption] Database pull logic: Latest 20 videos which are of media 4 HD Logo. 4 [time] [channel] [video title] classification “preview” and “developer commentary” [date] [caption] Display standard HD logo with thumbnail images that link and “behind the scenes”. to HD videos. Placement TBD by visual design. Video Reviews view all > 3 Featured Shows 6 1 | 2 | 3 | 4 | 5 10 Latest Videos. 5 Insider Badge. Display automatic list of up to 10 (minimum 5 – number Mega64 Tetris Guys TBD by visual design) of latest videos. Display standard INSIDER badge over thumbnail of videos which are restricted to Insider-only. Display “Hot” icon if item is designated as hot. Display publish time. Placement TBD by visual design. (No movie trailers are 8 Display publish date, Insider-only. Consequently, Insider badge is not Video160x120 thumbnail 4 Video160x120 thumbnail Video160x120 thumbnail 11 INSIDER 5 required for Movie Trailers section.) Display channel. Display video title. Object Name Object Name Object Name 6 Paging. Display caption Platform/Type Platform/Type Platform/Type Game Trailers, Movie Trailers, Video Reviews and Video Previews sections should each be accompanied by a 11 Featured Shows.
paging device that contains forward and reverse Display slotted list of links to Shows video playlists (if any arrows, and an appropriate page numbering for the Video Previews view all > 3 12 exist.) 6 | 2 | 3 | 4 | 5 given number of available videos. 1 If no shows are currently active, do not display section. Arrows behave in the standard manner for IGN paging.
Numbers and arrows will repopulate section with appropriate image thumbnails for that section. 12 IGN Footer and Adsense. Display Google AdSense at bottom of right column. Images should appear to animate into position via 9 Google AdSense Display standard IGN footer at bottom of page. DHTML (TBD by visual design and available Video160x120 thumbnail 4 Video160x120 thumbnail Video160x120 thumbnail technology.) INSIDER 5
Object Name Object Name Object Name Platform/Type Platform/Type Platform/Type
12 IGN Footer Video Hub Update Project v1.0(7)
Overview
Description: IGN Video Hub – Login/Google Search Bar
Entry Points: IGN Home Page, global nav, search engines.
Notes for Developers
1 Proposed Configuration for Login/Google Search. Login and Google Search appear on same bar.
2 Login/Logout Box. 4 User name (links to Profile) 2 My Account (links to Account page.) Also on hover, displays drop down with Alerts and Club links. 1 Login/Logout. Same functionality as current IGN Login.
3 Login Options. 3 Displays when user hovers over “My Account” link.
Displays links to Account page, Alerts page, and Blog and List pages.
Only displays if user is logged in.
4 Google Search. “Search:” label.
Drop down of options rather than radio buttons as on current Google Search.
Search field shorter than current implementation but should display at least 25 characters (but accommodate current number.)
Search button and Google logo. Video Hub Update Project v1.0(7)
Overview
Description: SEO Requirements for Video pages
Entry Points: N/A
URL/Page description Title Description Notes for Developers video.ign.com IGN: Game Videos, Game Trailers, Movie Trailers, Watch videos, trailers, clips, and reviews for the latest and More! video games and Movies only at IGN! Find the latest video reviews for video games and Video Review Index2 IGN: Video Game Video Reviews movies at IGN! Browse IGN's complete HD Video library. Check out HD Video Index2 IGN: HD Video Index gameplay videos, trailers, and more - all in HD! Browse IGN's extensive list of Video Game Trailers. Game Trailers Index2 IGN: Video Game Trailers Also, watch out for exclusive trailer premiers available only at IGN.
Browse IGN's extensive list of Movie Trailers. Also, Movie Trailers Index1 IGN: Movie Trailers watch out for exclusive trailer premiers available only at IGN.
1 – Existing index 2 – New index Video Hub Update Project v1.0(7)
Overview
Description:
Entry Points:
Notes for Developers Video Hub Update Project v1.0(7)
Overview
Description:
Entry Points:
Notes for Developers