User Experience/Information Architecture

V 7.0

Date | Version | Description
12/20/12 | 6.8 | •Fixed the registration “forgot username/password” in all instances / user-flows •Rearranged the information on the Tournament history tab to make it “friendlier” •Added a launch state for the tournament history tab •Added rules for the tournament ticker
12/20/12 | 6.9 | • Added specification to locked content on Games Index page • Added detail on N-TEK file pages (not including Character pages)defaulting to the very first item in each section.
12/21/12 | 7.0 | • Added phase infromation in yellow based off of the Post-Launch Phased Items documentation. • Updated the games fly out window to accurately reflect unlocking structure. • Updated Tournaments Team leaderboards to look more like a traditional leaderboard

0.0

Home Page

Registration

0.1

0.2

0.3

0.4

Login/Sign Up
Modal

Registration
Form

Confirmation
Page

Ultralink
CTA

0.5

0.6

Forgot
Username

Forgot
Password

MAX STEEL • SITE MAP

KEY:

In wireframe development

Awaiting final approval/
feedback

Approved but will evolve with metagame

Approved and
in development

Future phase

1.0

Games Index

2.0

Videos Index

• Brand Films
• TV Show Promos
• Bonus Content

3.0

N-Tek Files

4.0

N-Tek Lab

5.0

Toys
Index

6.0

Parents

7.0

My
Dashboard

1.1

Story Mode
Menu Page

1.2

Quick Play
Game Page

2.1

Videos
Listings

2.2

Individual
Video Page

Footer Links

8.0

Help

Transition Users (Latin America)

9.0

9.1

Welcome
Splash
Page

Initial
Login
Reward

Global Functionality

0.8

0.9

0.10

0.11

Share

Alerts

Quizzes

Polls

0.12

0.13

Likes

Ratings

3.1

Archive

3.2

Turbo
Chamber

• Camo Mode
• Turbo Base Mode
• Turbo Strength Mode
• Turbofied STEEL
• Turbo Flight Mode
• Turbo Speed Mode
• Turbo Stealth Mode

3.3

3.3.1

Characters Modal

Characters

• Max and Steel
• Good Guys
• Bad Guys

3.4

Vehicles

• MS Turbocycle
• MS Turbo Racer (Car)
• N-Tek Air Assault Vehicles/Jets
• N-Tek Copter
• High Altitude Jump Jet/HAJJ
• N-Tek Mobile Command (ROCC)
• Dredd/Naught’s Main Ship

3.5

Weapons

• MS Turbo Blaster
• MS Turbo Sword
• Turbo Rang
• Laser Chainsaw
• N-Tek PulseZooka
• N-Tek Handgun
• N-Tek Rifle
• THI Handblaster
• THI Rifle

3.6

Locations

• N-Tek
• THI
• Copper Canyon High
• Vista View Apartments

4.1

Ultralink
Editor

4.2

4.3

Downloads Index

• Paper Crafts
• Activity Sheets
• Downloadables

4.3.1

Downloads
Listings

4.3.2

Individual
Download
Page

5.1

Product
Listings

5.2

Product
Detail Page

5.3

Coming Soon Page

Turbo Fighters
Turbo Team Up Figs
Maximized Deluxe
Deluxe Fighters
Vehicles
Battle Packs
Misc.
• Value Pack
• Arena
• Iconic Item
• Punch Max

6.1

Knowledge
Center

6.2

Market
Template

6.3

Where
to Buy

7.1

Profile

7.1.1

Trophies

7.1.2

Badges

7.2

My Toy Collection/Wish List

7.2.1

7.2.2

7.2.3

Wish List
(Print Format)

7.2.4

Toy Collection

Wish List

Share Modal

7.3

Tournaments/Missions

7.3.1

7.3.2

Pick a
Tournament Team
(Phase 2)

7.3.3

7.3.4

Tournament
Join Panel

Tournament
Teams
Leaderboard

Tournament Players
Leaderboard

7.3.5

7.3.6

7.3.7

7.3.8

Tournament History

Challenge
Panel

Tasks:
Active

Tasks:
Completed

7.4

Enter a Code

7.4.1

7.4.2

7.4.3

7.4.4

Enter a
Code

Right
Default Panel

Code
Confirmation

Code Error

7.5

Public
Profile

MAX STEEL • 0.0 MAIN NAVIGATION

Logged in

MY PROFILE   LOGOUT

A

C

J

K

MATTEL

Games

Videos

Toy Factories

My Mattel

Our Shop

Shop

LOG IN/REGISTER

ENTER A CODE

ENGLISH (US)

B

GAMES

D

VIDEOS

E

F

N-TEK FILES

N-TEK LAB

G

TOYS

H

PARENTS

I

L

ARCHIVE

TURBO CHAMBER

CHARACTERS

VEHICLES

WEAPONS

LOCATIONS

Sections with subcategories will have a dropdown
treatment from the Main Navigation to allow users to quickly jump to a
subcategory or page.
Sections with subcategories at launch:
• N-Tek Files
Sections with subcategories in Phase 2:
• Toys

Dropdown always displays selected language/country. Selections are formatted as Language (Country/Region) with the Language being translated and country/region remaining in English. Selections are alphabetized by country/region.

LOCALIZATION:
Global: All live text (pink) on all pages will be sent to World Server for localization/language translation. Requirements should be created at the translation level to indicate which character names and key phrases should be left in English.
The following items will NOT be localized:
• Mattel Global Header
• Username choices from dropdown menus (TBD)
• Max Steel logo
LOCKED/UNLOCKED CONTENT:
N/A

FUNCTIONAL SPECIFICATIONS
PAGE DESCRIPTION: The Main Navigation of the Max Steel site. Navigation copy will be localized for language, but all content and links remain consistent across markets.
A. MATTEL GLOBAL HEADER
The Mattel Global Standard Header is present in North America only and will not be localized.
B. SITE LOGO
This is the logo for the site. Clicking here will return the user to Home. This is also Steel’s dock that he comes from and returns to after talking to the user.
C. MAIN NAV
The Main Nav contains the following:
D. GAMES BUTTON
This button takes the user to the Games index page.
E. VIDEOS BUTTON
This button takes the user to the Videos section.
F. N-TEK FILES BUTTON
This button takes the user to the N-Tek Files index page. On rollover, the user can quickly link to one of the content subpages.
G. N-TEK LAB BUTTON
This button takes the user to the N-Tek Lab index page.
H. TOYS BUTTON
This button takes the user to the Toys index page. On rollover, the user can quickly link to a pre-loaded category. For launch, all markets will show a coming soon page.
I . PARENTS BUTTON
This button takes the user to the Parents page.
J. LOGIN/REGISTER LINK
Launches the Janrain login/register modal window where the user can choose to log in or register.
When logged in, the links update to “My Profile” and “Log Out.”
K. ENTER A CODE LINK
This link expands the user’s dashboard to the code panels. If the user is logged out, he will be prompted to log in first.
L. LANGUAGE/COUNTRY DROPDOWN
Allows the user to select the language/country to view content. Location will be pre-selected based on geo-detection. Once the user changes his selection, this setting will be saved for future visits (in a cookie) until the user changes it again.

MAX STEEL • MAIN NAVIGATION

MAX STEEL • 0.0 SITE TEMPLATE

PAGE TITLE

Information provided by Bunchball

USERNAME

12

NEWS FLASH AREA

Footer Option: 3 Promo Areas

Footer Option: 2 Promo Areas

LOCALIZATION:
All text and video on this page will be localized for language. Primary and secondary CDAs can contain localized content to show different promotional content in each market.
LOCKED/UNLOCKED CONTENT:
N/A

The International Rollout (19 other markets) is introduced in phase 2.0.
In July the teasers for the  digital comic downloads from Viz. (Assuming we don’t want download to user desktop…would need special display) will be introduced in phase 3.5
The Rise of Elementor website takeover will be introduced in phase 4.0
Sound effects: play on rollover of buttons and CTA’s will be introduced in a future phase (TBD). Need sufficient amount of sounds for launch.
Homepage CDA animation will be added at a later phase (TBD). Can hardcode
animation for launch - temporary solution. Will need to explore options after launch.  For launch - CDA’s can be localized.
Animations in general will be introduced in a later phase (TBD) Need to regroup internally and determine what is feesable for launch.
Mobile responsive design will be developed (TBD).
Based on corporate initiative, “Friend-ing” will be introduced in a future phase (TBD)
Canned chat will be dependant on ‘Friend-ing” at a later phase (TBD).
Meta-game currency and virtual items will be introduced in a future phase (TBD).
Gifting will be introduced at a later phase (TBD)

FUNCTIONAL SPECIFICATIONS
PAGE DESCRIPTION: This home page container is the primary template for the site. It contains the Max Steel Main Navigation, a large CDA to feature promotional content and four secondary CDA buttons in the footer. Content on the home page may be localized.
A. MAIN NAVIGATION
The main navigation will contain a link to the home page (logo) and the global links to the main sections. It has been designed to accommodate up to 8 global nav links if needed in the future, but there must always be an even number of links.
B. UTILITY NAVIGATION
The utility navigation lives above the main navigation and is used to handle secondary links such as the country selector and help button.
C. PAGE TITLE
Every page other than the home page will have a page title/header at the top left to let the user know where he is in the experience. In sections with multiple levels of navigation, a breadcrumb header style will be used so the user can use this area to navigate back or jump to other sections.
D. PRIMARY CDA
The primary CDA on the home page will feature promotional frames that can be localized per market. These CDAs can include full-page video, flash objects or javascript animations and static jpgs.
E. USER DASHBOARD
The footer area will be used to house the user dashboard, which handles login, registration and metagame content as well as a news flash section that updates daily.
F. STATIC PROMO AREAS
The static promo areas contain four CDAs for deeplinks to internal pages. The header for each of these links will utilize an action word. These promos will be section-specific and handled through the CMS. This area has the option to localize these promos per market through the CMS.
G. PROMO AREA OPTIONS The promo area can house 2, 3 or 4 static promos. In the event that fewer than 4 promos need to be displayed, the left and right promo areas can be combined into a larger promo space.

MAX STEEL • SITE TEMPLATE

MAX STEEL • 0.1 REGISTRATION: JANRAIN WORKFLOW

Members

SIGN IN

Username:

Password:

Forgot your password?

Forgot your username?

Not a member yet?

SIGN UP NOW!

Use of this site signifies your acceptance of Mattel’s Website Terms and Conditions and Privacy Policy.
©2012 Mattel, Inc. All Rights Reserved.

Welcome!

Become a member so you can play games, win awards and more! Fill in the fields below.

Create a Username:

3D

1

X

Create a Password:

Password

That name is not available

Choose a Secret Question:

Secret Question

Answer Secret Question:

Answer

Already a Member?

LOG IN NOW!

SECURITY CARD

Welcome to N-Tek! Here is your Security ID card.

Take a second to print out your new username and password so you don’t forget them!

MEMBERSHIP CARD

Username

Use safety scissors to cut along the dotted line, and keep your card in a safe place!

PRINT

If the User isn’t a member, they press the SIGN UP NOW! button.

The User selects their Username from 3 different drop downs (negative result = red indicator), creates a Password, chooses a Secret Question, answers the Secret Question and selects their LANGUAGE. The User either presses the a) NEXT arrow button or b) the CLOSE WINDOW BUTTON.

3D
Ablaze
Agent
Athlete
Avenger
Burto
Best
Biggest
Bio
Bionic

1
2
3
4
5
6
7
8
9
10

The User is presented their N-Tek Security card. The User can either a) close the panel, b) Print the card or c) press the NEXT BUTTON.

THANKS FOR JOINING!
CREATE YOUR ULTRALINK

GO!

The User is prompted to Edit their Ultralink via the GO! BUTTON or close the window via the CLOSE BUTTON.

Auto-generate the option with the user name will be introduced at a later phase (TBD).

MAX STEEL • REGISTRATION

MAX STEEL • 0.1 LOGIN/SIGN UP MODAL

MEMBERS

FUNCTIONAL ANNOTATIONS
DESCRIPTION: Registration and login uses the Janrain workflow. Clicking on a login or registration CTA anywhere on the site will bring up the Janrain sign up/sign in modal window. This first screen allows the user to choose between signing up and signing in.
A. SIGN IN PANEL
The user enters their:
1) Username
2) Password
B. CLOSE BUTTON
The user closes the panel here.
C. SIGN IN BUTTON
When the information in the Sign In section is filled in, the user then clicks this button to sign in.
D. SIGN UP PANEL
The user can sign up for a membership here. Included is:
1) Sign Up Now! Button
2) Forgot Your Password Button
3) Forgot Your Username Button
E. LEGAL
This is the legal copy of the popup.

LOCALIZATION:
All text on this page will be localized for language. Content will remain the same across all markets.
LOCKED/UNLOCKED CONTENT:
N/A

MAX STEEL • LOGIN/SIGN UP MODAL

MAX STEEL • 0.2 REGISTRATION FORM

SIGN UP

Random

FUNCTIONAL ANNOTATIONS
DESCRIPTION: This is the second screen in the
Janrain workflow and prompts the user to register for an account on MaxSteel.com by filling in the
appropriate form fields.
A. SIGN UP PANEL
The user enters their:
1) Username
2) Password
3) Secret Question
4) Secret Answer
B. CLOSE BUTTON
The user can close the modal window to exit
registration.
C. AVAILABILITY INDICATOR
After the user chooses a username by selecting words in all 3 dropdown menus, this indicator displays whether the name is available. If not available, an indicator will appear informing the user.
D. NEXT BUTTON
When the information in the Sign Up section is filled in and username has been validated as available, the user can click this button to submit the registration form.
E. SIGN IN PANEL
The user can sign in to their membership here.
Included is:
1) Log In Now! Button
F. LEGAL
This is the legal copy of the popup.

LOCALIZATION:
All text on this page will be localized for language except for the text in the username dropdowns, which will be in English for every country. Content will
remain the same across all markets.
LOCKED/UNLOCKED CONTENT:
N/A

MAX STEEL • REGISTRATION FORM

MAX STEEL • 0.3 CONFIRMATION PAGE

CONFIRMATION

Welcome to N-Tek! Now you’re a member and can log in on other Mattel sites, too.

Membership Card

NEXT

OPENS USER PRINTER UTILITY

FUNCTIONAL ANNOTATIONS
DESCRIPTION: This confirmation screen is the third screen in the Janrain workflow and tells the user that his account has been created and allows him to print his login credentials. At this point in the registration, the user is automatically logged in and a country of origin will be assigned to his profile via IP address.
A. CLOSE BUTTON
The User closes the panel here.
B. MEMBERSHIP CARD
The user’s card. This card includes:
1) Username
2) Password
C. PRINT BUTTON
The User presses this button to print the Mattel Membership Card. Print flow/redirect TBD.
D. NEXT BUTTON
User can skip to the next page without printing.
E. LEGAL
This is the legal copy of the popup.

MAX STEEL • CONFIRMATION PAGE

MAX STEEL • 0.4 ULTRALINK CTA

CREATE ULTRALINK

Thank you for joining! Now, create your own Ultralink.

FUNCTIONAL ANNOTATIONS
DESCRIPTION: This thank you screen prompts to user to go to the ultralink editor. This screen also informs the user what an ultralink is.
A. CLOSE BUTTON
If the user closes the modal, they will return to the page they were on when they clicked on sign in/sign up.
B. ULTRALINK IMAGE
A flat jpg image of Steel to welcome users.
C. GO BUTTON
User clicks to go to the ulltralink editor.
D. LEGAL
This is the legal copy of the popup.

GO

MAX STEEL • SECURITY CARD

MAX STEEL • 0.5 FORGOT USERNAME: JANRAIN WORKFLOW

Forgot your Username?

Uh-oh! We can’t recover your Username, but you can try again or create a new account.

If the user forgets their Username, the user can press the FORGOT YOUR USERNAME? button.

The user can either press the TRY AGAIN button or be prompted to enter a new Username, Password, Secret Question and Secret Answer. The user then presses the NEXT button to create the new account.

MAX STEEL • FORGOT USERNAME

MAX STEEL • 0.6 FORGOT PASSWORD: JANRAIN WORKFLOW

FORGOT YOUR PASSWORD?

No problem. Enter your Username to see your secret question.

Secret Question:

Answer Your Secret Question

Enter Answer Here

If the user forgets their password, the user can press the FORGOT YOUR PASSWORD? button.

The user is prompted to enter their Usename. The user then presses the NEXT button.

The user is prompted to enter the answer to their Secret Question. Once entered, the user presses the NEXT button.

THAT’S RIGHT!

Now let’s reset your password.

Enter a Password

YOU DID IT!

Now sign in using your new password.

Enter Password

The user is prompted to change their Password. Once entered, the user presses the  NEXT button.

The user is prompted to enter their Username (if the Username is legitimate, a checkmark is displayed by the field) and Password. Once entered, the user presses the NEXT button and is logged into the site.

MAX STEEL • FORGOT PASSWORD

MAX STEEL • 0.8 SHARE

LOGIN/REGISTER

COUNTRY

SHARE [PAGE]

To share this, enter an email
address and press Send.

EMAIL ADDRESS:

SEND

PAGE
TEAR

ERROR MESSAGE

Error! You must enter an email address.

Error! Email address must be in the format abc@domain.com.

CONFIRMATION MESSAGE

Thank you!
Your email has been sent.

CLOSE WINDOW

FUNCTIONAL ANNOTATIONS
SCREEN DESCRIPTION: The share pop-up appears when the user clicks on the share link.
Share exists for:
• Wish list
• Videos
• Games
• N-Tek file entries
• Toys
A. SHARE TITLE
Title of the share window indicating what the user is sharing.
B. INSTRUCTIONAL COPY
Instructional copy to explain the email form. Any legal disclaimers required will also be displayed here.
C. EMAIL ADDRESS FORM FIELD
User enters recipient’s email address here. A simple form validation checks to make sure the form field is filled and that conventional email syntax is followed. Error messages are handled inline.
D. SUBMIT BUTTON
User clicks submit to send a link to selected content to recipient. Recipient email address is used only to send the email; it is not stored. After an email is successfully submitted, a confirmation message is shown. Are we going to rate/limit the frequency user tries to share/send an item? Want to make sure we protect against spambots or hackers that can repeatedly use this form to jam our system.
E. CLOSE BUTTON
User can click on the close button to cancel and return to the wish list panel.
Share wishlist will be introduced in phase 2.0 (OK’d by DIG)

MAX STEEL • SHARE

MAX STEEL • 0.8 SHARE (EMAIL)

SOMEONE HAS SHARED [ITEM] WITH YOU!

IMAGE

Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.

Content Link

PROMO AREA

UNSUBSCRIBE FROM FURTHER EMAILS

Footer Link 1 | Footer Link 2 | Footer Link 3 | Footer Link 4 | Help

MATTEL EMAIL FOOTER

FUNCTIONAL ANNOTATIONS
SCREEN DESCRIPTION: When a user shares an item via the share function, the recipient gets an email detailing the item with a link to the item.
A. SHARE TITLE
Title of the share email. The item being shared [ITEM] is named here. These are either:
• Wish list
• Videos
• Games
• N-Tek file entries
• Toys
B. IMAGE
Instructional copy to explain the email form. Any legal disclaimers required will also be displayed here.
C. COPY
This is the copy for the share email.
F. CONTENT LINK
This link takes the user to the item being shared in the email.
E. PROMO AREA
Optional promo area to support localized market content or toy-related promotions.
F. UNSUBSCRIBE LINK
This link takes the user to site in order to be permanently unsubscribed from further emails.  G. EMAIL FOOTER
This is the email footer that contains other links for Max Steel. This may include social media pages, privacy policies, copyright information, etc.

MAX STEEL • SHARE (EMAIL)

STEEL FLIES OUT

MAX STEEL • 0.9 ALERTS

“LOREM IPSUM SIT DOLOR.”

LEVEL UP!

You’ve reached
clearance level:
13

You’ve unlocked:

VIDEO

WEAPON

ULTRALINK
COLOR

10,000HP TO THE NEXT LEVEL!

See new missions >

“WE HAVE A  NEW MISSION!”

FUNCTIONAL ANNOTATIONS
DESCRIPTION: Alerts and notifications on the website will be handled through a pop-up window from the dashboard. Any notification windows appear and after 10 seconds dissapear. If there are multiple they will stack on top of each other.
A. STEEL FLYOUT
Steel flyout notifications will be reserved for instructional copy and random humor in specified areas of the website. This copy will be static and triggered by page loads.
• First site visit
• During registration
• During Ultralink editor
• First visit on content pages
B. METAGAME ALERTS
These notifications will be communicated through a small notification window from the user’s dashboard panel and can include alerts such as hero points rewarded, badges rewarded or new missions.
Alerts will be delivered by a show character, primarily Forge Ferrus, Max and the user’s Ultralink. Messages include:
• New Mission
• Mission Reminder
• Completed Mission
• Badge Awarded
• Trophy Awarded
• Unlocked Item
WEBSITE ALERTS
These notifications will be communicated through the same notification window but will be triggered manually or with a scheduled algorithm. They will be used to communicate:
• New content launched (videos, bios, locations)
• New tournament starting
• Tournament reminder
• Tournament ending soon
• Tournament ended, check results
• New challenge starting
• Challenge remidner
• Challenge ended
• New games
• New game levels released
C. LEVEL UP ALERT (FROM MAX STEEL)
The level up alert is larger and includes the following information: new level reached, items/content unlocked, effort to next level, CTA to missions.
Notifications from additional characters (Forge, Ferris, Etc.) will be introduced at a later phase (TBD). Phase 1 has Max/Steel/Dredd.

MAX STEEL • ALERTS

MAX STEEL • 0.9 TOURNAMENT ALERTS

JOIN TOURNAMENT X!!!

This tournament will end on XX/XX/XXX

Not on a team yet?
Sign up here!

TEAM
ICON

YOUR TEAM WON THE TOURNAMENT!

Congratulations!

You’ve won the:

TROPHY NAME

See Results>

See Trophies>

TEAM NAME WON THE TOURNAMENT!

Great game! But sorry, better luck next time!

YOU HAVE THE BEST SCORE OF THE TOURNAMENT!

BADGE NAME

YOU HAVE THE BEST SCORE OF YOUR TEAM!

FUNCTIONAL ANNOTATIONS
DESCRIPTION: Alerts and notifications on the website will be handled through a pop-up window from the dashboard. Any notification windows appear and after 10 seconds dissapear. If there are multiple they will stack on top of each other.
A. NEW TOURNAMENT ALERT
Registered users get this alert when a new tournament starts. The user can join the tournament by clicking the sign up cta (7.3.1).
B. USERS TEAM WINS ALERT
Each member of the winning team gets this alert and the specified trophy. The user can opt to see the tournament results (7.3.2) or see their trophies (7.1.1).
C. USERS TEAM LOST ALERT
Each member of the losing teams gets this alert. The user can opt to see the tournament results (7.3.2).
D. USER HAS BEST SCORE OF THE
TOURNAMENT ALERT
When the user gets the highest score of the tournament, they receive the specified badge. The user can opt to see the tournament results (7.3.2) or see their trophies (7.1.1).
E. USER HAS BEST SCORE OF THE
TEAM ALERT
When the user gets the highest score of the tournament for their team, they receive the specified badge.  The user can opt to see the tournament results (7.3.2) or see their trophies (7.1.1).

MAX STEEL • TOURNAMENT ALERTS

MAX STEEL • 0.9 CHALLENGE ALERTS

This week’s challenge!

ALL USERS WHO JOIN AND PLAY DURING THIS SUMMER WEEK WILL EARN THE SUMMER BADGE.

This challenge will end on XX/XX/XXX

Take the
challenge!

Challenge Over!

You earned the

SUMMER BADGE

See Badges

THE CHALLENGE HAS BEEN EXTENDED!

This challenge now ends on XX/XX/XXX

See the
Challenge!

FUNCTIONAL ANNOTATIONS
DESCRIPTION: Alerts and notifications on the website will be handled through a pop-up window from the dashboard. Any notification windows appear and after 10 seconds dissapear. If there are multiple they will stack on top of each other.
A. CHALLENGE START ALERT
Registered users get this alert when a new challenge starts. The user can take the challenge by clicking the challenge cta (7.3.6).
B. CHALLENGE OVER ALERT
When the challenge is over, all of the participating users receive the specified badge.The user can see their badges by clicking the badges cta (7.1.2)
C. CHALLENGE EXTENDED ALERT
Registered users get this alert when a challenge has been extended. The user can take see the current challenge by clicking the see the challenge cta (7.3.6).

MAX STEEL • 0.10 QUIZZES

QUIZ

This Quiz is worth XXXX HERO POINTS!

INCORRECT ANSWER

SORRY, THAT WAS THE WRONG ANSWER. BETTER LUCK NEXT TIME!

TRY AGAIN

CORRECT ANSWER

CORRECT! YOU GOT THE XXXX HERO POINTS!

FUNCTIONAL ANNOTATIONS
SCREEN DESCRIPTION: This is the layout of the quiz modal.
A. QUIZ MODAL WINDOW
The quiz modal window appears anywhere on the site. If the user has completed the quiz correctly in the past, they will not be served the same quiz again.
Note: Quizzes can pop up on content pages such as N-Tek Files, Videos and N-Tek Lab. TBD: Requirements need to be written around when and where quizzes are served up.
B. CLOSE QUIZ BUTTON This button closes the quiz modal if the user wishes to skip the quiz. Once a user skips a quiz, they will not be served the same quiz again.
C. QUIZ ANSWER SELECTION
Quizzes are multiple-choice.
D. QUIZ POINT AMOUNT
The possible hero point award amount is displayed on the quiz question modal.
E. QUIZ SUBMIT BUTTON
User clicks the submit button to submit their answer.
F. INCORRECT ANSWER SCREEN
This screen is displayed if the user selects the wrong answer. User can try again or close the modal.
G. CORRECT ANSWER SCREEN
This screen is displayed if the user selects the right answer. The user can only close the window.
Quizzes will be introduced in a later phase (TBD).

MAX STEEL • QUIZZES

MAX STEEL • 0.11 POLLS

POLL

This Poll is worth XXXX HERO POINTS!

POLL OUTCOME

XXXXX

FUNCTIONAL ANNOTATIONS
SCREEN DESCRIPTION: Polls can pop up anywhere on the site. TBD: Requirements need to be written around when and where polls are served up.
Phase: TBD
A. POLL MODAL WINDOW
The poll modal window can appear on any content page and will be set on a timer (for example, 10 seconds after page load). If the user has completed the poll in the past, they will not be served the same poll again.
B. POLL ANSWER SELECTION Polls are multiple-choice.
C. POLL POINT AMOUNT
The possible hero point award amount is displayed on the poll question modal.
D. POLL SUBMIT BUTTON
User clicks the submit button to submit their answer.
E. RESULTS SCREEN
Upon submitting an answer, the results screen loads the current poll tallies.
Polls will be introduced in a later phase (TBD).

MAX STEEL • POLLS

MAX STEEL • 0.12 LIKES

XXXXX LIKES

User presses like

FUNCTIONAL ANNOTATIONS
PAGE DESCRIPTION: A click counter will be used for like functionality. The like feature will have 3 states: off state (displays the number of likes), rollover state (on rollover) and on state (displays the number of likes, and an indication that the user has already liked the item). On click, the counter will go up by one and the off state will change to an on state. Likes are stored in the user’s profile and will remaiin logged when the user returns to the site. For users who are not logged in, their like will be stored in a cookie for return visits.
A. LIKE BUTTON (CLICKABLE)
The user presses this button to like a subject.
B. LIKE COUNT
This is the like count for the subject.
C. LIKE BUTTON (CLICKED)
This is the like button after the user has used it to like a subject.
COUNTER AT LAUNCH
Option to assign a random start number for every likable item to avoid launching with low like counts.
Likes will be introduced in a future phase (TBD). For launch an image will be used instead of functionality.

MAX STEEL • LIKES

MAX STEEL • 0.13 RATINGS

Rating

User selects rating

FUNCTIONAL ANNOTATIONS
PAGE DESCRIPTION: A 5-star rating system allows the user to see the average rating for the game and to rate the game. There is an off state (average rating before the user rates), rollover/click state (when user is interacting with the ratings) and an on state (average rating after the user rates the game).
A. RATING (NON USER RATED)
The rating as it appears before the user rates an item.
B. RATING (USER RATED)
The rating as it appears after the user rates an item.
Ratings will be introduced in a later phase (TBD).

MAX STEEL • RATINGS

MAX STEEL • 1.0 GAMES INDEX

FUNCTIONAL ANNOTATIONS
SCREEN DESCRIPTION: Game index page to allow the user to select the game and mode they would like to play.
A. GAMES HEADER
Page title and a short description for the game index page.
B. SHARE
User clicks to share the game section.
C. PROMO AREAS
Promotional areas to the right can be used to promote:
• Tournament Information
• Challenges
• How to information
• Game titles
D. SHOW STORY MODE WINDOW
User clicks on the story mode window link to see the story mode window that slides open to the right, which allows the user to continue where he left off.
E. QUICK PLAY DESCRIPTION
Contains a short spiel on unlocking more mini-game quick play levels through progression of the story mode. Also includes a Login CTA if user is not logged in to view progress.
•(Not logged in): “Unlock more levels through playing in story mode!”
F. QUICK PLAY LINKS
User clicks on a quick play link to play a game from.
Each quick play link will contain a tooltip roll-over state to explain the user must play the story mode to unlock this level.
Game 3 Rollout: Turbo Racer will be introduced in phase 3.0.
Game 4 Rollout: Turbo Fighter will be introduced in
phase 4.0.
Metagame Unlockables - global functionality will be introduced in a future phase (TBD). Need to parse bunchball data for user’s progression, then build rules engine to manage unlock rules for content. Managing rules around them. SIMPLIFY TO ONE ACTION OR USER LEVEL.

Game page intro text.

SHARE

STORY MODE

PROMO

ARCADE

Unlock more levels through story mode or [LOGIN] to see your progress

GAME 1 LEVEL 1

GAME 1 LEVEL 2

GAME 1 LEVEL 3

GAME 2 LEVEL 1

GAME 2 LEVEL 2

GAME 2 LEVEL 3

You may also like:

MATTEL FOOTER

MAX STEEL • GAMES INDEX

MAX STEEL • 1.0 STORY MODE WINDOW

FUNCTIONAL ANNOTATIONS
SCREEN DESCRIPTION: This page shows the story mode menu window. By default this page will show the user the last level they have reached and allow the user to continue the game play. Or, the user can select a previously played level to replay that level for a high score or rewards. User may share or like this page.
A. OPEN LEVEL This thumbnail indicates a previously passed level that the user can choose to replay. On click, the achievements and leaderboard below refresh to reflect the selected level. The CTA also changes from “continue” to “play”. Note: replaying a previous level does not reset the user’s latest save point. When they return to this page they can still continue where they left off. TBD
B. CURRENT LEVEL The thumbnail for the current level will look slightly different, to show the user that this level contains the user’s last save point. This is the default level selected when the user loads this page. Clicking on continue will drop the level to the last save point.
C. LOCKED LEVEL Locked levels will be grayed out and have a lock icon to indicate that it is not available to the user.
D. GAME CTA
This dynamic CTA lets the user know whether he is continuing or replaying a level. On click the game swf will load in this game container area.
E. CLOSE STORY MODE LEVEL WINDOW This arrow closes the story mode level window to the left.
Unlocking levels in mini-games will be introduced in a future phase (TBD) Need to parse bunchball data for user’s progression, then build rules engine to manage unlock rules for content. Managing rules around them.   SIMPLIFY TO ONE ACTION OR USER LEVEL.

Click continue to start or choose a previous level to replay.

PLATFORMER
LEVEL 1

PLATFORMER
LEVEL 2

SHOOTER LEVEL 1

RACER LEVEL 1

SHOOTER LEVEL 2

RACER LEVEL 2

SHOOTER LEVEL 3

RACER LEVEL 3

CONTINUE

MAX STEEL • GAMES INDEX WINDOW

MAX STEEL • 1.1 STORY MODE PLAY PAGE

GAME TITLE STORY MODE

TITLE SCREEN FOR GAME/LEVEL

Do you want to unlock more stuff? Play Game 1 level 2

QUICK PLAY

PLAY

ACHIEVEMENTS

GAME 1 LEVEL 3 LEADERBOARD

Missions – 3 out of 7 complete

50)              PLAYER1 100,000

FLAG

51)              PLAYER2 90,000

Unlocked Items – 11 out of 30 complete

52)              (USER) 80,000

53)              PLAYER3 70,000

54)              PLAYER4 60,000

REFRESH

FUNCTIONAL ANNOTATIONS
SCREEN DESCRIPTION: This page shows the quick play game page. User may share or like this page.
A. PAGE TITLE
This page title indicates the game and level that the user is playing.
B. TITLE SCREEN
The title screen indicates what game and level the user is playing.
C. PLAY BUTTON Clicking on play will load the appropriate game swf in the game container area.
D. PLAY OTHER GAME CTA This area is used to show an optional game-related promo or game tip to help the user who can then play that game from a link.
E. ACHIEVEMENTS
This area displays the missions and unlocked items for the current game level, updated upon refresh with the user’s personal chievements. User can click refresh at anytime during the game to update this information.
F. GAME/LEVEL SPECIFIC LEADERBOARD
This is the leaderboard associated with the selected level. The leaderboard is contextual and jumps to the user’s place in the leaderboard.

MAX STEEL • STORY MODE PLAY PAGE

MAX STEEL • 1.2 QUICK PLAY GAME PAGE (GAME LOADED)

GAME TITLE QUICK PLAY

Do you want to advance farther in the story based game?

ACHIEVEMENTS FOR THIS LEVEL

Your high score: 50,000
Your fastest time to beat: 4:07
All-Time High Score: 75,000 PLAYERNAME1

FUNCTIONAL ANNOTATIONS
SCREEN DESCRIPTION: This page shows the quick play game page. User may share or like this page.
A. PAGE TITLE
This page title indicates the game and level that the user is playing.
B. TITLE SCREEN
The title screen indicates what game and level the user is playing.
C. PLAY BUTTON Clicking on play will load the appropriate game swf in the game container area.
D. PLAY OTHER GAME CTA This area is used to show an optional game-related promo or game tip to help the user who can then play that game from a link. When this is clicked it takes the user to the current story mode level.
E. ACHIEVEMENTS
This area displays the achievements for this level in quick play mode. It shows the performance-based badges that are unique to quick play and a list of game stats for the user to beat.
F. GAME/LEVEL SPECIFIC LEADERBOARD
This is the leaderboard associated with the selected level. The leaderboard is contextual and jumps to the user’s place in the leaderboard.

MAX STEEL • QUICK PLAY GAME PAGE (GAME LOADED)

MAX STEEL • 1.2 INDIVIDUAL GAME PAGE • SAMPLE END SCREEN

GAME

750x422

OPTIONAL PROMO
NO PROMO: GAME WILL CENTER

NOT IN TOURNAMENT

GAME OVER

IN TOURNAMENT

PLAY OTHER GAME

Villains defeated: 5
Points: 3,100
New high score!  +10HP
Previous high score: 2,500

You’ve earned 100HP!

Quickplay
level 1

Quickplay
level 2

PLAY AGAIN

Villains defeated: 5 Points: 3,100 New high score!
Previous high score: 2,500
TOURNAMENT WINNINGS:
YOURTEAM XXX,XXX ++
Tournament bonus +10HP
You’ve earned 110HP!
You’ve unlocked:

FOR BKOM/FLASH

FUNCTIONAL ANNOTATIONS
SCREEN DESCRIPTION: When the user is finished with gameplay, he is shown the points he earned.
A. NOT IN TOURNAMENT ENDING This is a sample default game over screen for the game. The user is given the following:
• Game points and stats
• Previous high score
• New high score
• Hero points earned
• A list of items unlocked
B. PLAY AGAIN BUTTON This button re-launches the game.  C. IN TOURNAMENT ENDING This is a sample game over screen when the user is part of a tournament. The user is given the following:
• Game point and stats
• Previous high score
• New high score
• Hero points earned
• A list of items unlocked
• Tournament team score
D. IN GAME OPTIONS
This area contains options to play other games or revist levels in quickplay buttons. If a level hasn’t been completed, then the quickplay button is greyed out.

MAX STEEL • INDIVIDUAL GAME PAGE • POINT RESOLUTION

MAX STEEL • 2.0 VIDEOS INDEX

Category 1

Video page intro text.

WHERE TO
WATCH ON TV

VIDEO TITLE

NEW

NAME

POPULAR

See All>

Category 2

FEATURED VIDEO TITLE

Category 3

DESCRIPTION: Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.

Category 4

See All

VIEW BY CHARACTER

CHARACTER

CATEGORY 1

CATEGORY 2

CATEGORY 3

See Videos>

CATEGORY 4

FUNCTIONAL ANNOTATIONS
SCREEN DESCRIPTION: This is the videos index page. The top three modules display random videos tagged as featured, new or popular. This page also allows the user to sort by character or category.
A. CATEGORY LINKS
A category list appears on the left. Clicking on a category allows the user to jump to an individual video in that list (2.2). Note: There can only be 10 videos per category. When the user presses “See All>” all of the videos in that category are displayed via video listings (2.1)
B. VIDEO PAGE INTRO
Introductory text that only appears on the index page.
C. FEATURED VIDEO PLAYER
The featured video will play directly on the index page. The CMS will allow up to 5 featured videos to be tagged to play in this area. Upon page load, a random video from that pool will be displayed here. Autoplay is enabled.
D. NEW VIDEO LINK
A thumbnail, title and link will randomly display one of the five most recently uploaded videos.
E. POPULAR VIDEO LINK
A thumbnail, title and link will randomly display one of the five most popular videos based on view counts or likes (if we do not launch with view counter).
F.VIEW BY CHARACTER User clicks on a charcter to bring up the listings page (2.1) with the selected character as the listing reference.
G. CATEGORY LINKS Category links are repeated on the main index page with an associated image or description to give visual context around the category choices.
Tagging videos so that users are constantly served up fresh content will be introduced in a later phase (TBD). DIG confirmed OK for phase 2, but would rather have an “auto-scroll” feature.

MAX STEEL • VIDEOS INDEX

MAX STEEL • 2.1 VIDEOS LISTINGS (PARSED)

VIDEOS > CATEGORY

10 VIDEOS

VIEWS: XXXXXX

TITLE

FUNCTIONAL ANNOTATIONS
SCREEN DESCRIPTION: This is the video listings page used to list videos when a user sorts by category, character, weapon or vehicle. User gets to this page by clicking a category, a character on the video index page, or a tag link on an individual video page.
A. CATEGORY NAME
This is the name of the category or the listing reference which can be a tag, such as character, weapon or vehicle. For category, breadcrumb navigation will be shown.
B. VIDEO COUNT
This is the number of videos in the category. Option to assign a random start number for every likable item to avoid launching with low like counts, or to hide the counter at launch and display it once the counts get to a higher number.
C. FEATURED VIDEO
The first item in the list will be displayed as a featured video, with a larger image and added video description. All remaining videos will be listed below in chronological order from newest to oldest. (Sorting by unwatched TBD)

MAX STEEL • VIDEOS LISTINGS (PARSED)

MAX STEEL • 2.2 INDIVIDUAL VIDEO PAGE

VIDEO DESCRIPTION: Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.

IN THIS VIDEO:

GO TO BIO>

GO TO WEAPON>

SEE MORE VIDEOS WITH DREDD>

SEE MORE VIDEOS WITH TURBO RANG>

RELATED VIDEOS:

FUNCTIONAL ANNOTATIONS
SCREEN DESCRIPTION: This is the individual video page which features the video player and relevant information.
A. VIDEO TITLE
This is the title of the video.
B. VIDEO PLAYER
Videos will be displayed using the Mirror Image player. Autoplay is enabled.
TBD: Exploring full-width capabilities for the video player. Looking into requirements for responsive design, video size, etc.
C. VIDEO DESCRIPTION This is the description of the video.
D. IN THIS VIDEO CONTENT
This is some of the related items in the video. These take the user to areas in the N-Tek Files that correspond to the item.
E. VIDEO TAG LINKS
These links take the user to a page listing of videos with that specific tag.
F. RELATED VIDEOS
This module displays links to related videos so the user can jump to a related video without waiting for the end screen of the video player.

MAX STEEL • INDIVIDUAL VIDEO PAGE

MAX STEEL • 2.0 VIDEO PLAYER

F.P.O.

00:02/00:15

FUNCTIONAL ANNOTATIONS
SCREEN DESCRIPTION: This is the video player. Auto start will be off. This player is from JW Video. All videos will be h.264. The video player is scalable to view on tablet and desktop.
A. LARGE PLAY ICON BUTTON
This button appears at page load and when pressed starts the video.
B. PLAY/PAUSE BUTTON
This button plays and pauses the video.
C. VIDEO SCRUBBER This is the scrubber for the video. The user can scrub through the video.
D. TIME
This is the amount of time in the video as well as the current placement in the video.
E. VOLUME
This regulates the loudness of the audio.
F. FULL SCREEN BUTTON
This button makes the video full screen.
G. SHARE BUTTON
This opens the share modal.
H. RATING (PHASE 2)
The user can rate the video here.

MAX STEEL • VIDEOS (PLAYER)

MAX STEEL • 3.0 N-TEK FILES

LOREM IPSUM

TURBO
CHAMBER

Accesses the available content on the timeline.

LOCALIZATION:
All text and video on this page will be localized for language. Content will remain the same across all markets.
LOCKED/UNLOCKED CONTENT:
N/A

FUNCTIONAL ANNOTATIONS
PAGE DESCRIPTION: The N-Tek Lobby is the main index page for the N-Tek subsections.
A. LINK TO TURBO CHAMBER
User clicks to go to the Turbo Chamber page.
B. LINK TO CHARACTERS
User clicks to bring up the character modal.
C. LINK TO VEHICLES
User clicks to bring up the vehicles modal.
D. LINK TO WEAPONS
User clicks to bring up the weapons modal.
Maintenance will be needed for the N-Tek files for the following:
• Swap in transformation modes as they are available.
• Add in character interview animations to come April 15th.
• Add in rest of the character 360’s (TBD)
• Ultralink Editor: more parts/textures/
accessories.
• Profile: Add additional flags throughout the year (TBD).
• Add more printables:  DJ Cole ringtones/music, downloads, buddy icons, other personalization stuff.
• All Additional locations (TBD)

MAX STEEL • N-TEK N-TEK FILES

MAX STEEL • 3.1 ARCHIVE

< RETURN TO N-TEK FILES

EVENT 1

EVENT 2

FUNCTIONAL ANNOTATIONS
PAGE DESCRIPTION: The archive page will feature 8 to 12 events in a linear timeline. 2 or 3 events show at a time and the user can side scroll to view more items. Users can roll over or tap an item to bring up a short description which can include an associated CTA to a game, bio page or video.
A.TITLE
A title and description to give context around the story told through the archive/interactive story.
B. TIMELINE EVENTS
The events in the timeline feature a series of stills that visually progress as the user scrolls. Events are organized into dynasties which will denote sub-series of events that will be distinguished by a visual cue in the background.
C. ACTIVE EVENT
As the user scrolls to the left or right, one event at a time is denoted as active, and will display a discreet animation. Active events are reflected as highlighted in the event links below.
D. MOVING THROUGH THE TIMELINE
The user can move through the timeline in 3 ways:
a) User can click on the right (or left) arrow to scroll.
b) User can use the keyboard to scroll left and right.
c) User can swipe left and right on a tablet or mobile.
E. EVENT LINKS
A series of small links will allow the user to quickly jump to other events in the timeline. An “on state” will be used to visually inform the user where they are within the timeline. Dynasties and events can be added at any time and the events links will be updated to reflect added events. When a historical event is added, the default event can still be Event 1 but the user now must scroll left to access the historical event.
The archive section will be introduced in a future phase (TBD). When it would be implemented, the button will appear in the N-Tek files page (3.0).

MAX STEEL • ARCHIVE

MAX STEEL • 3.2 TURBO CHAMBER

MODE 1

MODE 2

TURBO FLIGHT MODE

BASE MODE

GO TURBO!

FUNCTIONAL ANNOTATIONS
PAGE DESCRIPTION: The Turbo Chamber features an interactive tool where the user can click through video clips of Max transforming between turbo modes. To view the videos, the user can either click on a thumbnail or scroll left and right through the series of videos. User can share the Turbo Chamber page or like individual turbo modes.
When Turbo Chamber page loads it defaults to the very first item in this section.
A. RETURN TO N-TEK FILES BUTTON
This takes the user back to the N-TEK Files.
B. TURBO MODE vertical NAVIGATION
A series of links allows the user to quickly jump to a turbo mode video.
C. TURBO MODE DESCRIPTION
A title and short description for each turbo mode.
D. TURBO SLIDER
As the user slides left and right, the image display goes through a series of stills to simulate Max and Steel going turbo in the various turbo modes.
MODES AVAILABLE AT LAUNCH (TBD):
• Turbo Base Mode
• Turbo Flight Mode
• Turbo Strength Mode
• Camo Mode (Not on video list)
• Turbofied Steel (Not on video list)

DEFAULT PAGE STATE

TURBO BASE MODE

MAX

STEEL

The page loads with an image of Max and Steel as separate bodies and introduces the user to both characters.

When the user clicks on “Turbo Base Mode” a video animation plays to show the transformation of Max and Steel into turbo base mode.

As the User scrolls though the available mode samples, the associated video plays.

MAX STEEL • TURBO CHAMBER

MAX STEEL • 3.3 CHARACTERS MODAL

MAX AND STEEL

GOOD GUYS

BAD GUYS

LOCALIZATION:
All text and videos on this page will be localized for language. Related toys will display toys that are available in the localized market.
LOCKED/UNLOCKED CONTENT:
N/A

FUNCTIONAL ANNOTATIONS
PAGE DESCRIPTION: This is the characters modal window that allows the user to browse available characters. Characters are divided into three categories. Characters that are locked due to episode release will be grayed out and not clickable.
A. MAX AND STEEL BIOS
These link to the Max and Steel bios below:
• Max McGrath
• Steel
• Max Steel (Turbo suit, speed, flight, strength and stealth modes will be represented)
B. GOOD GUYS BIOS
These link to the good guys’ bios below:
• Molly McGrath
• Forge Ferrus
• Berto
• C.Y.T.R.O.
• Kat
• Jefferson
• Sydney
• Kirby
C.BAD GUYS BIOS
These link to the bad guys’ bios below:
• Dredd
• Toxzon
• Water Elementor
• Wind Elementor
• Earth Elementor
• Fire Elementor
• Ultimate Elementor
• Extroyer
• Fishy
• Dr. Titus Xander
D. CLOSE MODAL WINDOW
This closes the modal window.

MAX STEEL • CHARACTERS MODAL

MAX STEEL • 3.3.1 CHARACTERS

MAX STEEL

NAMES: Maxwell McGrath /
N’Barro Akstel x377 “Steel”
AGE: 16+
OCCUPATION: Protectors of planet Earth and beyond.

TURBO MODES

GO TO
TURBO CHAMBER >

Bio:

INTERESTS: Lorem ipsum dolor sit amet.
ASSOCIATIONS: Lorem ipsum dolor sit amet.
OBJECTIVE: Lorem ipsum dolor sit amet. Lorem ipsum dolor sit amet.
PLANET OF ORIGIN: CLASSIFIED

Collected Intel:

4

6

7

Known Associates:

Last Seen:

STEEL
ULTRALINK

SEE
BIO >

SEE
VIDEO >

LOCALIZATION:
All text and videos on this page will be localized for language. Related toys will display toys that are available in the localized market.
LOCKED/UNLOCKED CONTENT:
Topic-level locked content can be unlocked when the user reaches a cleared hero level.

FUNCTIONAL ANNOTATIONS
PAGE DESCRIPTION: This is the character bio template. This page displays an example Max Steel bio which has turbo modes in addition to the standard bio content. Users can like or share individual character pages.
A. CHARACTER vertical NAVIGATION
Allows the user to quickly jump to a specific
character in selected category. Locked characters will be displayed but not clickable.
B. SCROLL UP/DOWN
Allows the user to scroll up and down through
character files in the chosen tab/category.
C. CHARACTER CATEGORY
Characters will be split up into three categories, and
the category selector will stick to the bottom of the browser window, allowing the user to select a
category without scrolling below the fold.
D. LOCKED CONTENT
Locked content will display as a grayed-out area with a lock icon. A rollover (or tap) can be used to show the user how to unlock this content.
For example:
“Tune in next week to see this character revealed.”
“Reach hero level 20 to view Max’s secret video.”
E. TURBO TRANSFORMATIONS Clicking on a thumbnail opens the turbo mode image in a modal window with a “see more” CTA that links to the appropriate turbo mode in the Turbo Chamber.

MAX STEEL • CHARACTERS

MAX STEEL • 3.3.1 CHARACTERS (CONDENSED)

NAME:

JASON NAUGHT

AGE: XX
OCCUPATION: Lorem ipsum sit dolor amet consectetur.
ASSOCIATIONS: Lorem ipsum sit dolor amet consectetur.

INTERESTS: Lorem ipsum dolor sit amet.
OBJECTIVE: Lorem ipsum dolor sit amet. Lorem ipsum dolor sit amet.
PLANET OF ORIGIN: Earth

VIDEO >

GAME >

ACTIVITY >

TOY >

FUNCTIONAL ANNOTATIONS
PAGE DESCRIPTION: The character template can allow flexibility for the amount of content available. This is an example of a bio with less content.

MAX STEEL • CHARACTERS (CONDENSED)

MAX STEEL • 3.3.1 CHARACTERS (USER)

N-TEK EMPLOYEES

AGE: CLASSIFIED
OCCUPATION: CLASSIFIED
ASSOCIATIONS: N-Tek
SECURITY LEVEL CLEARANCE: 12

?

Last Known Activity:

ULTRALINK

VILLAINS

CITIZENS

LOCALIZATION:
All text and videos on this page will be localized for language. Related toys will display toys that are available in the localized market.
LOCKED/UNLOCKED CONTENT:
Most recent badges are pulled from Bunchball

FUNCTIONAL ANNOTATIONS
PAGE DESCRIPTION: This is the example of the user’s character bio. If the user isn’t registered/logged in, then this page won’t show up. User’s bio appears in the “Good Guys” category. Users cannot share or like their bio page since it is only viewable by them when they are logged in.
A. ULTRALINK MODULE
This area displays the user’s ultralink avatar.
B. LAST KNOWN ACTIVITY MODULE
This area displays up to 3 recent badges earned by the user. If the user has no badges, it will display “unknown.”
Note: This page disappears when the user is logged out.

MAX STEEL • CHARACTERS (USER)

MAX STEEL • 3.4 VEHICLES

VEHICLE 1

N-TEK ASSAULT VEHICLE

Lorem ipsum: XXXX
Dolor: 12345
Modo: 12 seq.
Conseq: XXXX

VEHICLE 2

Reach Level 20 to view this in action!

Coming soon,
stay tuned!

FUNCTIONAL ANNOTATIONS
PAGE DESCRIPTION: Users can roll over or tap an item to bring up a short description which can include an associated CTA to a game, activity download page or video.
When Vehicles page loads it defaults to the very first item in this section.
A. VEHICLE vertical NAVIGATION
Allows the user to quickly jump to a specific
vehicle in selected category. Locked vehicles will be displayed but not clickable.
B. SCROLL UP/DOWN
Allows the user to scroll up and down through
vehicle files in the chosen tab/category.
C. VEHICLE INFORMATION AREA This is the information window of the current vehicle. This information is changed in the CMS.The content that can be accessed includes:
• Content that will be locked from the beginning
• Content that is locked within pages that need to be unlocked via an action (i.e., video watch, game level completed, etc.)
D. IMAGE AREA
This is the image area that shows the vehicle. This information is changed in the CMS.
E. LOCKED CONTENT
Locked content will display as a greyed out area with a lock icon. A rollover (or tap) can be used to show the user how to unlock this content.
For example:
“Tune in next week to see this vehicle revealed.”

LOCALIZATION:
All text on this page will be localized for language. Content will remain the same across all markets.
LOCKED/UNLOCKED CONTENT:
Any locks or videos can potentially be from Bunchball

MAX STEEL • VEHICLES

MAX STEEL • 3.5 WEAPONS

WEAPON 1

Lorem ipsum sit dolor amet.
Ipsum: XXXX
Dolor: 12345
Modo: 12 seq.
Conseq: XXXX

WEAPON 2

Take me to See this weapon being used
in Episode 1

FUNCTIONAL ANNOTATIONS
PAGE DESCRIPTION: Users can roll over or tap an item to bring up a short description which can include an associated CTA to a game, activity download page or video.
When Weapons page loads it defaults to the very first item in this section.
A. WEAPON vertical NAVIGATION
Allows the user to quickly jump to a specific
weapon in selected category. Locked weapons will be displayed but not clickable.
B. SCROLL UP/DOWN
Allows the user to scroll up and down through
weapon files in the chosen tab/category.
C. WEAPONS INFORMATION AREA This is the information window of the current weapon. When a user has the option to see a video, they are taken to the corresponding video in the video section. This information is changed in the CMS.
D. IMAGE AREA
This is the image area that shows the weapon. This information is changed in the CMS.

MAX STEEL • WEAPONS

MAX STEEL • 3.6 LOCATIONS

N-TEK

THI

Secret Research Project

FUNCTIONAL ANNOTATIONS
PAGE DESCRIPTION: Users can roll over or tap an item to bring up a short description which can include an associated CTA to a game, activity download page or video.
A. LOCATION vertical NAVIGATION
Allows the user to quickly jump to a specific
location in the selected category. Locked locations will be displayed but not clickable.
B. SCROLL UP/DOWN
Allows the user to scroll up and down through
location files in the chosen tab/category.
C. LOCATION INFORMATION AREA This is the information window of the current location.
D. IMAGE AREA
This is the image area that shows the location. This information is changed in the CMS.
F. LOCKED CONTENT SAMPLE
Locked content will display as a grayed-out area with a lock icon. A rollover (or tap) can be used to show the user how to unlock this content.
For example:
“Tune in next week to see this location revealed.”

LOCALIZATION:
All text on this page will be localized for language. Content will remain the same across all markets.
LOCKED/UNLOCKED CONTENT:
Topic-level locked content can be unlocked when the user reaches a cleared hero level.

MAX STEEL • LOCATIONS

ULTRALINK EDITOR

LAUNCH

MAX STEEL • 4.0 N-TEK LAB

YOUR SECURITY
BADGE

N-TEK SECURITY BADGE

Name: Username

Security Clearance Level: 5

www.maxsteel.com

Use safety scissors to cut along the dotted line and keep in a safe place!

DOWNLOADABLES

Intro lorem ipsum.

FUNCTIONAL ANNOTATIONS
PAGE DESCRIPTION: The N-Tek Lab section houses the Ultralink Editor and Downloadables pages. All content in this section is available in both the logged in/logged out states.
A. ULTRALINK EDITOR
The first module displays a generic ultralink image to depict the Ultralink Editor. TBD: Or is this the user’s ultralink?
B. LINK TO ULTRALINK EDITOR
User clicks on this button to launch the Ultralink
Editor in the same window.
C. SECURITY BADGE
The second module displays the user’s security badge. Username is passed in from Janrain. Level information and recent badges are pulled from Bunchball. If a user is not logged in, this module disappears. (TBD)
D. LINK TO PRINT SECURITY ID
User clicks on the print button to send the security ID to the printer.
E. DOWNLOADABLE BUTTON
This button takes the user to the downloadables page.

MAX STEEL • N-TEK LAB

MAX STEEL • 4.1.1 ULTRALINK EDITOR INTRO

Pair with your very own
Ultralink...

FUNCTIONAL ANNOTATIONS
PAGE DESCRIPTION: The Ultralink Editor loads with a short animated video of Steel welcoming the user to the experience. For LAAM users, this will help introduce the user to ultralinks.
Intro should appear on user’s first visit to the Ultralink Editor only.
Note: This will either be a video, image or copy. Content TBD.

MAX STEEL • ULTRALINK EDITOR

MAX STEEL • 4.1.2 ULTRALINK EDITOR

RANDOM

BODY

ARMS

ADD BACKGROUND

CHANGE BACKGROUND COLOR

EYES

RESET

I’M DONE

FUNCTIONAL ANNOTATIONS
PAGE DESCRIPTION: The Ultralink Editor is where the user can create or edit their ultralink avatar. There will be a lazy login/registration feature that allows the user to create an Ultralink before logging in or registering. For first-time users, the default ultralink will look like Steel. For existing users, the editor will start with their current saved ultralink.
See Steel_Customization.PDF.
Note: Visual representation shown as concept only. Full functionality and customization options TBD.
Customization Options for Launch:
• 4 Elements (Body, Arms, Eyes, Background)
• Each element will have its own color choices
• Final number of variations for each element and colors TBD
Suggested Metagame Options:
• Unlockable shapes and colors in a future phase
Asset Requirements:
• Body shape must be created in such a way that arm positioning stays consistent.
• Eye shape/size must be created in such a way that positioning stays consistent.
• Body elements must be designed in such a way that color layers on a PNG layer can easily be switched out.
Steel Message: A flyout Steel message will include buddy humor and help the user along.
The user can reset the ultralink to default.
If the user is not logged in and clicks on the “done” button, he will be prompted to log in or register.
Naming your Ultralink will be introduced in a later phase 2.0 (Ok’d by DIG)

LOCALIZATION:
All text on this page will be localized for language. Content will remain the same across all markets.
LOCKED/UNLOCKED CONTENT:
Additional utlralink variations.

MAX STEEL • 4.2.1 CONFIRMATION SCREEN: FIRST-TIME ULTRALINK CREATION

GREETINGS!

I’m your Ultralink. Nice to meet you!
Let’s check out missions to get started!

Here is your N-Tek security badge.

START A
MISSION

FUNCTIONAL ANNOTATIONS
SCREEN DESCRIPTION: Confirmation page for the Ultralink Editor for first-time users, which encourages them to print out their username and password.
A. ULTRALINK AVATAR
A full image of the user’s Ultralink avatar will appear here. Confirmation copy will be written so that it is delivered by the user’s ultralink and include buddy humor.
B. MISSION BUTTON
User clicks this button to expand the missions panel in the user’s dashboard.
C. USERNAME
User’s username is displayed on the security badge.
D. HERO LEVEL
User’s hero level is displayed on the security badge.
E. ULTRALINK AVATAR IMAGE
User’s updated ultralink avatar image appears on the security badge.
F. MOST RECENT BADGES
Up to 3 of the user’s most recent badges will be displayed on the security badge.
G. PRINT BUTTON
User clicks this button to send the security badge to the printer.
Do we need a save button to save image to desktop? TBD

MAX STEEL • CONFIRMATION SCREEN: FIRST-TIME ULTRALINK CREATION

MAX STEEL • 4.2.2 CONFIRMATION SCREEN: USER EDITS ULTRALINK

DONE!

You just updated your Ultralink. Here is your
updated N-Tek security badge!

BACK TO
N-TEK LAB

FUNCTIONAL ANNOTATIONS
SCREEN DESCRIPTION: Confirmation page for returning users which allows them to print out an updated security ID. For return visitors, the main CTA changes to a “Back to N-Tek Lab” CTA.
A. PRINTABLE SECURITY BADGE
The user’s card. This card includes:
1) Username (Passed in from Janrain)
2) Hero Level (Passed in from Bunchball)
3) Ultralink Image
4) Recent Badges
B. PRINT BUTTON
The User presses this button to print the Security ID.

MAX STEEL • CONFIRMATION SCREEN: USER EDITS ULTRALINK

MAX STEEL • 4.3 DOWNLOADABLES INDEX

Downloads intro text. Sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.

NEWEST

MOST POPULAR

FEATURED

DOWNLOADABLE DESCRIPTION: Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.

Go>

FUNCTIONAL ANNOTATIONS
SCREEN DESCRIPTION: This is the downloads index page. The top three modules display random downloads tagged as featured, new or popular.
A. CATEGORY LINKS
A category list appears on the left. Clicking on a category takes the user to the listings page (4.3.1) with the selected category as the listing reference.
B. FEATURED DOWNLOADABLE
This is the featured downloadable.The CMS will allow up to 5 featured downloads to be tagged to appear in this area. Upon page load, a random downloadable from that pool will be displayed here.
C. NEW DOWNLOAD LINK
A thumbnail, title and link will randomly display one of the five most recently uploaded downloadbles.
D. POPULAR DOWNLOAD LINK
A thumbnail, title and link will randomly display one of the five most popular downloadables based on likes.
E. CATEGORY LINKS Category links are repeated on the main index page with an associated image or description to give visual context around the category choices..

MAX STEEL • DOWNLOADABLES

MAX STEEL • 4.3.1 DOWNLOADABLES LISTING

DOWNLOADABLES > CATEGORY

DOWNLOADABLE NAME

DESCRIPTION laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.

DOWNLOAD

5

FUNCTIONAL ANNOTATIONS
SCREEN DESCRIPTION: This is the download category page.
A. CATEGORY NAME
This is the name of the category.
B. FEATURED DOWNLOADABLE
The featured downloadable in each category will be displayed at the top. The CMS will allow for a featured downloadable to be set for each category.
C. FEATURED DOWNLOADABLE INFO The information displaying for the featured video includes:
• Downloadable Name
• Likes
• Description
• Download or print CTA
D. FEATURED DOWNLOADABLE CTA
The associated CTA for the featured downloadable appears here. This can be download or print.
E. DOWNLOADABLES LIST
Downloadables in the category are listed chronologically displaying the most recently added downloadables at the top. Clicking on a thumbnail or an image takes the user to the individual download page (4.3.2).
NO PAGINATION
As new files get added, this page grows in length. No pagination needed. (TBD)

LOCALIZATION:
All text on this page will be localized for language. Content will remain the same across all markets.
LOCKED/UNLOCKED CONTENT:
Downloadables.

MAX STEEL • DOWNLOADABLES LISTING

MAX STEEL • 4.3.2 DOWNLOADABLES INDIVIDUAL  PAGE

FILE TITLE

INSTRUCTIONS: Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.

PDF
PAGE
1

PDF
PAGE
2

PDF
PAGE
3

PDF
PAGE
4

PDF
PAGE
5

MORE LIKE THIS:

FUNCTIONAL ANNOTATIONS
PAGE DESCRIPTION: This is the individual downloadable page that displays information about the downloadable, a CTA to download or print and links to related downloadables. User can share or like individual downloadables pages.
A. DOWNLOADABLE NAME
This is the name of the downloadable.
B. DOWNLOADABLE IMAGE
This is the image of the downloadable. In the case of paper crafts, this image shows the finished product.
C. DOWNLOADABLE DESCRIPTION
A short description for each downloadable. This should also detail what type of file the downloadable is and denote file size. (e.g., 1.4MB, 5 page PDF)
D. CTA BUTTON
The CTA for downloadables can be download or print, depending on the downloadable. Clicking on download will prompt the user to save the file to his desktop. Clicking on print will prompt the user to send the file to the printer. (Note: Tablet/Mobile?)
E. INSTRUCTIONS (OPTIONAL)
If instructions are needed, they can be displayed below the downloadable information.
F. PREVIEW THUMBS
These are the preview thumbs for the downloadable. When pressed, a modal window appears with the page image.
G. MORE LIKE THIS
This area displays 3 other downloadables from the same category.

MAX STEEL • DOWNLOADABLES INDIVIDUAL PAGE

MAX STEEL • 4.3.2 DESKTOP BACKGROUNDS

WALLPAPER FILE TITLE

800 x 600
1024 x 768
1280 x 960
1280 x 1024
1600 x 1200

Download

INSTRUCTIONS:

PC. Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.

MAC. Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.

FUNCTIONAL ANNOTATIONS
PAGE DESCRIPTION: This page shows how the downloadable template could change to fit a wallpaper download.
A. DOWNLOAD BUTTONS
These buttons allow the user to download their screen resolution of the background.
B. BACKGROUND IMAGE
The image of the background.
C. INSTRUCTIONS
Instructions on how to install the backgrounds on either a PC or a Mac.

MAX STEEL • DESKTOP BACKGROUNDS

Toys

MAX STEEL • 5.0 TOYS INDEX

Consumer Products>

FEATURED TOY

All Toys>

See Toys>

PROMOTIONAL
AREA

FUNCTIONAL ANNOTATIONS
SCREEN DESCRIPTION: This is the toys index page. The main hero rotates through up to 4 featured toys. (Note: When consumer products are launched this page will be titled Toys and More.) User can share this page.
A. CATEGORY LINKS
A category list appears on the left. Clicking on a category takes the user to the listings page (5.1) with the selected category as the listing reference. Note: LAAM toys will be categorized as Stealth, Strength and Speed.
B. FEATURED TOY
This image rotates between up to 4 featured toys. Clicking on the toy will take the user to the product detail page for that toy.
C. CONSUMER PRODUCTS LINK
This takes the user to the consumer products category. When consumer products are not available, a second featured toy can be shown.
D. ALL TOYS LINK
This link takes the user to the listings page (5.1) displaying all toys.
E. CATEGORY LINKS Category links are repeated on the main index page with an associated image or description to give visual context around the category choices..
F. PROMO AREA
Optional promo area to support localized market content or toy-related promotions.
TBD: Can where to buy link appear on this page? Need to confirm # of clicks to where to buy page.
Toys will be available for Phase 1.5.  The Fall Global Toy roll out is introduced in phase 3.5
The Consumer Products page will be introduced in phase 4.5.

LOCALIZATION:
All text and content on this page will be localized for language. Only toys and categories/groupings that are available in the localized market will be displayed. Promo areas at the bottom will be localized as well.
LOCKED/UNLOCKED CONTENT:
N/A

MAX STEEL • TOYS INDEX

MAX STEEL • 5.1 TOYS LISTINGS

CATEGORY HEADER IMAGE

WANT

HAVE

NAME OF TOY

FUNCTIONAL ANNOTATIONS
SCREEN DESCRIPTION: This is the toys category page. This template is also used to view all toys. User can share this category.
A. CATEGORY NAME
The category name appears at the top of the page. The category appears highlighted in the left-hand navigation.
B. CATEGORY HEADER IMAGE
An image at the top of the page is used to visually explain this category.
C. TOYS IN A GRID
The toys in the category are displayed in a 3-column grid. Clicking on a toy or toy name takes the user to the product detail page for that toy. Each toy has the following information: • Thumbnail image
• Product name
• Likes
• “I have it” button
• “I want it” button
NO PAGINATION
As new files get added, this page grows in length. No pagination needed. (TBD)

MAX STEEL • TOYS LISTINGS

MAX STEEL • 5.2 PRODUCT DETAIL PAGE

TOYS > CATEGORY

TOY NAME

My Wish List

My Collection

WHERE TO BUY

Extra images/videos

See More>

CHARACTER INFO:

RELATED TOYS:

NAME: LOREM IPSUM
AGE: 20
OCCUPATION: LOREM IPSUM SIT DOLOR

SEE FULL BIO

R

VIDEOS >

GAMES >

WORLD >

Thumbnails open up a picture gallery modal. When the user clicks outside of the modal it disappears.

FUNCTIONAL ANNOTATIONS
PAGE DESCRIPTION: The product detail page displays the product information and related content. User can like or share individual toy pages.
A. TOYS BREADCRUMB NAVIGATION
The Toys button in the breadcrumb takes the User to the 5.0 Toy Index or 5.1 Toy Cateogry Page.
B. TOY IMAGE (TURNAROUND)
The main image for the toy. When available, user can click and drag to view the toy in 360.
C. TOY NAME
Displays the toy name.
D. “I WANT IT” BUTTON
The wish list button allows the user to add this item to the wish list. If the item is already in the wish list, the button will show an on state and is not clickable.
E. “I HAVE IT” BUTTON
The collection button allows the user to add this item to his collection. If the item is already in the user’s collection, the button will show an on state and is not clickable.
F. WISH LIST LINK
This link expands the wish list/collection panel in the footer dashboard.
G. MY COLLECTION LINK
This link expands the wish list/collection panel in the footer dashboard.
H. WHERE TO BUY LINK
Links to the where to buy page in the Parents’ section.
I. ADDITIONAL IMAGES/VIDEOS
Secondary images such as detail shots and TV spots will appear in a clickable gallery here. Clicking on a thumbnail will display the full-sized image or video in a modal window. This area will grow/hide depending on how many images are stored in the CMS.
J. CHARACTER INFO/LINK
When available, information about the related character appears here. User clicks to visit the bio page in N-Tek Files.
K. RELATED TOYS
Up to three related toys appear here. Toys are crosslinked via category. (TBD)

MAX STEEL • PRODUCT DETAIL PAGE

MAX STEEL • 5.3 COMING SOON (WORLDWIDE)

COMING SOON!

FUNCTIONAL ANNOTATIONS
DESCRIPTION: This is the placeholder for Worldwide markets where toys will not launch until Fall 2013 and for LAAM markets where toys will not launch until March 2013.
Note: Images and copy on this page are TBD pending requirements.

LOCALIZATION:
All text on this page will be localized for language. Toy content will be localized to only display toys
available in the local market.
LOCKED/UNLOCKED CONTENT:
N/A

MAX STEEL • COMING SOON (TOY)

MAX STEEL • 6.0 PARENTS

FOR PARENTS

KNOWLEDGE CENTER

AN INTRODUCTION TO MAX STEEL

1) WHO IS MAX STEEL?

Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum. Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.

2) LORUM IPSUM

3) LORUM IPSUM

WHERE TO WATCH:

CHANNEL 123
Showtimes

WHERE TO BUY:

Click here to find out where to buy Max Steel toys.

FUNCTIONAL ANNOTATIONS
SCREEN DESCRIPTION: The main page for the parents section is an introduction to Max Steel. This page offers information on the Max Steel story, show and toys.
A. PRIMARY CONTENT Primary content on this page will focus on information about Max Steel and the show.
B. WHERE TO WATCH The user can see localized information about the channel and times to watch Max Steel via I.P.
address.
C. WHERE TO BUY
This takes the user to the Where to Buy page. In phase 2, this area will split the Where to Buy/Toys and Where to Buy/Consumer Products links.
Parent registration, email capture and registering with a parental conset will be introduced at a future phase (TBD) based on corporate strategy behind Janrain.

MAX STEEL • PARENTS

MAX STEEL • 6.1 KNOWLEDGE CENTER

PARENTS’ KNOWLEDGE CENTER

At Mattel, we are committed to the future of play. That means every toy, online experience and interaction is created with a healthy play pattern in mind. Learn about that here.

Story Telling

Learn more about Max Steel

Creative Play

Competition

LEARN MORE

Conflict

Safe and Healthy Online Environment

Cooperation

Experimentation

FUNCTIONAL ANNOTATIONS
SCREEN DESCRIPTION: The knowledge center page offers information on the Max Steel franchise and how it contributes to healthy play patterns for children.
A. PRIMARY CONTENT Primary content on this page will serve like a glossary to educate the parent on child play patterns.
B. LEARN MORE ABOUT MAX STEEL
Secondary content in the sidebar could be used to drive back to the parent main page.
C. SECONDARY CONTENT Secondary content in the sidebar could be used to serve up details about online safety and privacy.

MAX STEEL • KNOWLEDGE CENTER

MAX STEEL • 6.2 MARKET TEMPLATE

MARKET PAGE TITLE

Image/Video Area

FUNCTIONAL ANNOTATIONS
SCREEN DESCRIPTION: This is the market template for the Max Steel website. Pending requirements or sample content.
A. PAGE TITLE Display the page title from the CMS.
B. SAMPLE IMAGE MODULE Display an image or video from the CMS.
C. SAMPLE TEXT MODULE Display text from the CMS.

MAX STEEL • MARKET TEMPLATE

MAX STEEL • 6.2 MARKET TEMPLATE (iFRAME)

iFRAME

FUNCTIONAL ANNOTATIONS
SCREEN DESCRIPTION: This is the market template for the Max Steel website.
A. iFRAME The information for this page comes in via the iframe.
Market template will be iFrame at launch and will be come templeted at phase 1.3

MAX STEEL • MARKET TEMPLATE (iFRAME)

MAX STEEL • 6.3 WHERE TO BUY

WHERE TO BUY PAGE TITLE

USERNAME’S WISH LIST >

SEE TOYS >

STORE 1 IMAGE

STORE 2 IMAGE

STORE 3 IMAGE

FUNCTIONAL ANNOTATIONS
SCREEN DESCRIPTION: This page displays a list of retail stores specific to each market. This page will launch along with the toys section. Phase 2: Separate Where to Buy page for consumer products.
A. WISH LIST PAGE LINK
When the user is logged in, a link will appear here to the user’s wish list.
B. TOYS PAGE LINK
This link takes the user to the toy index page.
C. RETAIL STORE LOGO BANNER
This template will organize up to 10 retail banners in a two-column format. When only one banner is present, it will appear at the top left. Banners are added horizontally, and a new row is added when needed.
Clicking on a banner will bring up an interstitial window for legal compliance, before linking the user to the retail store’s website.

MAX STEEL • WHERE TO BUY

My Dashboard

MAX STEEL • 7.0 MY DASHBOARD

Minimized/Mouse-Out State

NOT LOGGED IN

REGISTER

When the user is not logged in, this area will display the user’s hero points bar starting from Level 1. It will also contain a CTA to encourage the user to register to save their points (lazy registration).

LOGGED IN

When the user is logged in, this area will display their Ultralink avatar and hero points bar.

Mouse-Over State

Collection/Wish List

Tournaments/
Missions

Enter
Code

FUNCTIONAL SPECIFICATIONS
DESCRIPTION: The minimized user dashboard always appears at the bottom of every page for quick access to the profile, toy collection, wish list and other metagame CTAs.
A. NORMAL STATE
At rest, the dashboard is minimized and dashboard links are hidden. The user can mouse over anywhere in the gray area to bring up the mouse-over state. On a tap device, tapping this area will expand the full dashboard.
B. MOUSE-OVER STATE
On rollover, the four dashboard links appear. When the user is logged in, he can click a link to expand that panel. When the user is logged out, none of the links are clickable.
C. PROFILE BUTTON
This button expands the profile panels of the
dashboard. The profile view is the default view.
D. COLLECTION/WISH LIST BUTTON
This button expands the collection/wish list panels of the dashboard. Note: Copy is FPO.
This button will not be available to click at launch in worldwide markets where toys are not available. This button will be grayed out with a lock icon.
E. TOURNAMENTS/MISSIONS BUTTON
This button expands the tournaments/missions
panels of the dashboard. Note: Copy is FPO.
F. ENTER CODE BUTTON
This button expands the enter code panels of the dashboard. Note: Copy is FPO.
Mini-game Unlockables in Dashboard will be introduced in a future phase (TBD). Do-able but complex so recommend for Phase 2.
Tournament ticker will be added to the Dashboard in a later phase (TBD). This should launch with
tournaments.

MAX STEEL • MY DASHBOARD

MAX STEEL • 7.0 MY DASHBOARD (NOT LOGGED IN)

ACCESS DENIED!

CTA to register

Dashboard panels are not accessible.

FUNCTIONAL SPECIFICATIONS
DESCRIPTION: This page shows the mouse-over state of the dashboard footer when the user is not logged in.
A. HERO PROGRESS BAR
The user’s hero points are stored in an anonymous Bunchball account and displayed in a hero bar starting from level 1. If the user registers during this session, the temporary points are transferred to the user’s account.
B. REGISTER BUTTON
The user clicks here to bring up the login/register Janrain modal.
C. DASHBOARD BUTTONS (LOCKED)
When the user isn’t logged in, the dashboard
buttons are locked on mouse-over.
D. ACCESS DENIED POP-UP When the user isn’t logged in and clicks a
dashboard button, this pop-up appears with a CTA.

MAX STEEL • MY DASHBOARD (NOT LOGGED IN)

MAX STEEL • 7.0 MY DASHBOARD GROWTH

3 BUTTONS

Minimized/Mouse Out State

Mouse Over State

4 BUTTONS

5 BUTTONS

HERO LEVEL

XXXX HERO POINTS

Friends

FUNCTIONAL SPECIFICATIONS
DESCRIPTION: The number of buttons for the
dashboard can be flexable for site growth.

MAX STEEL • MY DASHBOARD GROWTH

MAX STEEL • 7.0 MY DASHBOARD EXPANDED

EDIT ULTRALINK

DASHBOARD LEFT PANEL

DASHBOARD RIGHT PANEL

Collection/
Wish List

Dashboard Clicked State

FUNCTIONAL ANNOTATIONS
DESCRIPTION: When the user is logged in, he can click on the minimized or mouse-over state of the dashboard to bring up the expanded view of the dashboard. On click, a user panel expands in the center and the left and right panels update to reflect the dashboard button the user clicks on. The default state of the dashboard is the Profile view.
A) EDIT ULTRALINK BUTTON
This button brings the user to the Ultralink Editor.
B) ULTRALINK IMAGE
This is the user’s Ultralink avatar. If a user does not create an avatar during registration, the default Ultralink avatar will be shown here. Customized avatars will be stored in a supplemental database along with other user settings.
C) USERNAME
The user’s registered username will be pulled via Janrain integration.
D) HERO LEVEL
This shows the level that the user is currently at. Data for the hero level will be pulled from Bunchball. This contains two elements.
1) Level Number
2) Progress Bar to Next Level
E) GAME HERO POINTS
This is the total number of game HERO POINTS that the User has accrued. This data will be pulled from Bunchball.

LOCALIZATION:
All text on this page will be localized for language.
LOCKED/UNLOCKED CONTENT:
N/A

MAX STEEL • MY DASHBOARD EXPANDED

MAX STEEL • 7.1 PROFILE PANELS

COMPLETED
TASK

MY ULTRALINK

SHARE PROFILE

BADGES

TROPHIES

8

9

UNLOCKABLES

1000 H.P. to
next level.

Collection/ Wish List

Play

TROPHIES VIEW

Preselected based on IP
address.

If the user is not one of the 22 markets,defaults to Max Steel flag.

Flags

LOCALIZATION:
All text on this page will be localized for language. Content will remain the same across all markets.
LOCKED/UNLOCKED CONTENT:
Badges will show both locked/unlocked content. Information about a badge will only be shown after it has been unlocked by the user. Some custom backgrounds will be locked to metagame level.

FUNCTIONAL ANNOTATIONS
SCREEN DESCRIPTION: The Profile panel features the user’s badges and trophies. The user can see the badges and trophies he has unlocked and roll over or tap them to see a short description. The user can choose a background for each panel, further
customizing how his profile is displayed to other
users.
A. BADGES/TROPHIES PANEL
In the Profile View, the left panel displays all of the available badges, with a distinction between the badges the user has unlocked and not yet unlocked. The user can toggle between seeing the badges and the trophies.
B. UNLOCKED BADGE
Unlocked badges are displayed in full color. User can roll over an unlocked badge to see the information pop up for that badge. Badge states are pulled from Bunchball.
C. LOCKED BADGE
Locked badges are grayed out. User cannot click or roll-over locked badges. Badge states are pulled from Bunchball.
D. INFORMATION POP-UP
The information pop-up displays the badge or trophy name and a short description.
E. UNLOCKABLES PANEL
In the Profile View, the right panel displays all of the unlockables that the user has won.
F. UNLOCKABLE
Each trophy will be displayed in full color. User can rollover a trophy to see the information pop-up for that trophy. Trophies are pulled from Bunchball.
G. BACKGROUNDS
User may select a custom background for their badges panel. The custom background will show up whenever this panel is displayed, including when other players are viewing the user’s profile. Some backgrounds require a hero level clearance to be unlocked.
H. HERO POINT LEVEL UP POP-UP
When the use mouses over the hero bar, this pop-up appears showing the amount of points to the next level.
I. COUNTRY INDICATOR/SELECTOR
The user’s country is indicated here. The user can change the country via a pull-down menu (arrow)  when clicked.
J. FLAG SELECTOR
The user selects their flag from this pop-up window.

MAX STEEL • TROPHIES & BADGES

MAX STEEL • 7.2 COLLECTION & WISH LIST

COLLECTION

ADD AN ITEM
(GO TO TOYS)

ULTRALINK CREATOR

WISH LIST

2

MARK AS
HAVE

3

ADD AN ITEM (GO TO TOYS)

PRINT
WISH LIST

SHARE WISH LIST

THE PRINTED VIEW FOR THE WISHLIST DISPLAYS A SIMPLE ORDERED LIST WITH A SHORT DESCRIPTION OF EACH TOY.

USER’S WISH LIST

USER PRINTER

M

clicking on a toy image or name will bring the user to the product detail page for that toy.

LOCALIZATION:
All text on this page will be localized for language. All toy content will be localized to only display toys available in the user’s country/market. (Note: What happens if the user tries to view his wish list from a different country?)
LOCKED/UNLOCKED CONTENT:
N/A

FUNCTIONAL ANNOTATIONS
SCREEN DESCRIPTION: The My Toys panel features the user’s Toy Collection and Wish List. The user can add toys from the Toy section and manage both lists here.
A. MY TOY COLLECTION PANEL
In the Toys View, the left panel displays the items that the user has added to his Toy Collection. (Self-reported)
B. TOY/PRODUCT ITEM
Clicking on a toy brings the user to the product detail page for that toy. User can click on the ‘X’ to delete an item from the collection. This action cannot be undone.
C. ADD A TOY TO COLLECTION CTA
Clicking on the CTA brings the user to the top level of the Toy section to add more toys. (4.0)
D. SCROLL BAR
When there are more items than can fit the screen, a scroll bar will appear to allow the user to scroll up and down through the collection list.
E. WISH LIST PANEL
In the Toys View, the right panel displays the items that the user has added to his Wish List.
F. WISH LIST ITEM
Clicking on a toy image or name brings the user to the product detail page for that toy.
G. MARK AS HAVE BUTTON
Clicking on this moves the item to the collection area.
H. DELETE ITEM
User can click on the delete button to delete an item from the wish list. This action cannot be undone.
I. MOVE ITEM UP/DOWN
User can click and drag an item up and down on the list to establish a priority/order.
J. ADD A TOY TO WISHLIST CTA
Clicking on the CTA brings the user to the top level of the Toy section to add more toys. (4.0)
CONTINUED ON NEXT PAGE...
CONTINUED...
K. SCROLL BAR
When there are more items than can fit the screen, a scroll bar will appear to allow the user to scroll up and down through the collection list.
L. PRINT WISH LIST
User clicks to send wish list to printer. A printer-friendly version will be created. (See left)
M. EMAIL WISH LIST
User clicks to bring up a modal window. (See next page.)

MAX STEEL • COLLECTION & WISH LIST

MAX STEEL • 7.3 TOURNAMENTS/TASKS OVERVIEW

TOURNAMENTS

TRAIN FOR BONUS HERO POINTS

... Tournament Ticker ... User123 just joined

NEW TASKS

COMPLETED

TASK NAME 4
+500 HP

VIEW

TASK NAME 5
+300 HP

TASK NAME 6
+300 HP

CHALLENGE

Take the Challenge!

NO TOURNAMENT

The last winner in the
tournament was

TEAM NAME

The next tournament will start on XX/XX/XXX

TASK
COMPLETED!

FUNCTIONAL ANNOTATIONS
SCREEN DESCRIPTION: The Game panel shows Tournament information on the left and metagame/mission information on the right. At the end of a tournament the winner needs to be immediately identified and announced on the announcement page.
A. TOURNAMENT PANEL
This panel displays the tournament information (7.3.1).
B. TASKS PANEL
This panel displays the tasks information (7.3.7).
C. CHALLENGE PANEL
This panel displays the challenge information (7.3.6).
D. NO TOURNAMENT PANEL
This panel displays the tournament information after the tournament has ended.
Tournament will be introduced in v2.0

LOCALIZATION:
All text on this page will be localized for language. Content will remain the same across all markets.
LOCKED/UNLOCKED CONTENT:
Tournament will be locked until the user joins. User is not able to see the leaderboards or other information until they join.

MAX STEEL • TOURNAMENTS/TASKS OVERVIEW

MAX STEEL • 7.3.1 JOINING A TOURNAMENT

NEW MISSION
AVAILABLE!

WELCOME TO THE TOURNAMENT!!

You are now a member of: TEAM NAME

Go to
Games!

See the Scores!

Learn More>

FUNCTIONAL ANNOTATIONS
SCREEN DESCRIPTION: When the user has joined a tournament, he will see current tournament stats in his Tournament Panel. This includes a tournament leaderboard, top players list and tournament history. There are 4 teams that the user is randomly added to (TBD). Users only need to opt-in once, and then are auto-assigned to the same team from that point on.
A. TOURNAMENT WINDOW
This is the window for The tournament before the user joins.
B. JOIN TOURNAMENT X TITLE
The title of the tournament.
C. TOURNAMENT ENDING DATE
This is the ending date for the tournament. The ending date is added in the CMS by the admin.
D. TOURNAMENT TICKER
This ticker shows tournament relation information in a cycle. This information includes but is not limited to:
• A tournament team moving up on the leaderboard.
EX: [TEAMNAME] is now rank[#]
• A tournament team becoming point leader on the
leaderboard. EX: [TEAMNAME] is now in the lead!
• [TEAM NAME] [USER] has scored XXXXX points.
(Will only feature extraordinary point scores)
- If tournament has low amount of participants
ticker will feature ALL point contributions.
F. TEAM ICON This is the icon of the team the user has joined.
G. TOURNAMENT END DATE
This is the ending date for the tournament. The ending date is added in the CMS by the admin.
D. GO TO GAMES BUTTON Takes the user to the games page (1.0).
I. SEE THE SCORES BUTTON Takes the user to the tournament scores thus far (7.3.3).
J. LEARN MORE BUTTON Takes the user to the knowledge center (6.1).

MAX STEEL • JOINING A TOURNAMENT

MAX STEEL • 7.3.3 TOURNAMENT TEAMS LEADERBOARD

TOP TEAMS

TOP PLAYERS

RESULTS

TEAM NAME
XXXXXXX

TEAM NAME XXXXXXX

MY TEAM NAME: NAME

TEAM RANK: X

PLAYER RANK: X

TEAM HERO POINTS TOTAL: XXXXXXX

This tournament will end on
XX/XX/XXX

FUNCTIONAL ANNOTATIONS
SCREEN DESCRIPTION: When the user has joined a tournament, he will see current tournament stats in his Tournament Panel. This includes a tournament leaderboard, top players list and tournament history.
A. TOURNAMENT LEADERBOARD
The tournament leader shows a listing of tournament teams in ranking order. The user’s team will be highlighted. Each team listing will display the team icon/image, team name and total score. There are only 4 teams.
B. TOP PLAYERS  This tab will show the list of the top players in this tournament.
C. RESULTS
This tab will show the results from the previous tournaments.
D. TOURNAMENT TEAM INFO
Tournament team information includes the icon/image for the team, team name, team rank, total team score and the user’s rank within his team. All of this information will be pulled from Bunchball.

MAX STEEL • TOURNAMENT TEAMS LEADERBOARD

MAX STEEL • 7.3.4 TOURNAMENT PLAYERS LEADERBOARD

1)              USERNAME • XXXXXXX

2)              USERNAME • XXXXXXX

3)              USERNAME • XXXXXXX

4)              USERNAME • XXXXXXX

5)              USERNAME • XXXXXXX

6)              USERNAME • XXXXXXX

7)              USERNAME • XXXXXXX

8)              USERNAME • XXXXXXX

SEE PROFILE

TEAM ICON

COUNRTY FLAG

FUNCTIONAL ANNOTATIONS
SCREEN DESCRIPTION: The Tournament Players Leaderboard tab will show a listing of all of the top players in the current tournament. The player listing will display a player’s avatar, username, score and country flag. Clicking on a player will bring the user to that player’s profile.
A. SEE PROFILE BUTTON This link takes the user to the corresponding users public profile (7.5)

MAX STEEL • TOURNAMENT PLAYERS LEADERBOARD

MAX STEEL • 7.3.5 TOURNAMENT HISTORY

HISTORY

[TOURNAMENT NAME]        DATE ENDED XX/XX/XX

WINNER: [WINNING TEAM NAME]

MVP!
USERNAME
XXXXXXX

No tournaments have been completed

The next tournament begins on:
[MONTH] / [DAY]

FUNCTIONAL ANNOTATIONS
SCREEN DESCRIPTION: The Tournament History tab will show a listing of all of the general history of the challenges and tournaments, as well as the badges or trophies won for each. This list is sorted by date.
A. TOURNAMENT WINNER INFORMATION The tournament information shows the following information:
• Winning team name
• Score • Date ended • Trophy image
• Trophy name
B. TOP PLAYER INFORMATION The top player information shows the following information:
• Team logo
• Name • Score • See profile button (7.5)
C. LAUNCH STATE
The launch state of the tournament history tab when there are no completed tournaments.
Includes:
• Indicator of next tournament start date

MAX STEEL • TOURNAMENT HISTORY

MAX STEEL • 7.3.6 CHALLENGES (JOIN)

AND UNLOCK A NEW (ITEM)!

FUNCTIONAL ANNOTATIONS
SCREEN DESCRIPTION: When a challenge becomes available, the user can join in. A challenge consists of all of the users making a certain amount of points in a set amount of time. The extension of a challenge and the outcome of the challenge is shown here. (7.3.6.2)
A. CHALLENGE PANEL The challenge window shows the current challenge status.
B. CHALLENGE NAME
This is the name of the current challenge.
C. CHALLENGE BADGE
This is the image of the badge that the user can win.
D. UNLOCKABLE ITEM
This is the name of the item that gets unlocked if the user succeeds in the challenge. These items can be:
• Character bio • Video
• Wallpaper
E. CHALLENGE END DATE This is the end of the challenge. This needs to be set maunally by the site admins.  F. TAKE THE CHALLENGE BUTTON This button lets the user opt into the challenge. Next time the user sees this panel they see the challenged opted in format (7.3.6.1)
Challenges will be introduced in phase 2.5

MAX STEEL • CHALLENGES (JOIN)

MAX STEEL • 7.3.6.1 CHALLENGE (OPTED IN)

THOSE WHO JOIN AND PLAY
DURING THIS SUMMER WEEK WILL EARN THE SUMMER BADGE.

XXXXXX Pts

A new tournament will begin on
XX/XX/XXX

CHALLENGE STATUS BAR EXAMPLES

XXXXXX PTS

XXXX  Villains
Beaten!

DREDD has been beaten XXXX times!

FUNCTIONAL ANNOTATIONS
SCREEN DESCRIPTION: When the user has joined a challenge, they will see current challenge stats in his challenge Panel.
A. CHALLENGE PANEL
When a user joins a challenge, the challenge panel updates to show the current status of the challenge.
B. CHALLENGE NAME
This is the name and information of the challenge the user is engaged in.
C. CHALLENGE BADGE
This is the image of the badge that the user can win.
D. UNLOCKABLE ITEM
This is the name of the item that gets unlocked if the user succeeds in the challenge. These items can be:
• Character bio • Video
• Wallpaper
E. CHALLENGE STATUS BAR This bar shows the variable (points, villains, time a villain is beaten) that consists of the challenge as well as a graphic bar graph. The challenge status can be either: • Total community points
• Total villains beaten by the community (The community needs to beat X amount of villains)
• A Villain beaten by the community (The community needs to beat Dredd X amount of times)
F. CHALLENGE END DATE This is the end of the challenge. This needs to be set maunally by the site admins.
G. NEXT TOURNAMENT START DATE
This is the start date of the next tournament. This information is entered into the CMS by the admin.

MAX STEEL • CHALLENGES (OPTED IN)

MAX STEEL • 7.3.6.2 CHALLENGES (EXTENSIONS & OUTCOMES)

CHALLENGE EXTENDED!

This week’s challenge has been
extended!

This challenge will now end on XX/XX/XXX

CHALLENGE WON

j

AND UNLOCKED THIS (ITEM)!

See (Item)

CHALLENGE FAILED

Unfortunately you didn’t win.

See Results

FUNCTIONAL ANNOTATIONS
SCREEN DESCRIPTION: During the course of a challenge, the challenges window will change depending on whether the challenge has been extended, won or lost.
A. CHALLENGE EXTENDED PANEL
The challenge window updates when the challenge is extended as well as showing the current challenge status.
B. CHALLENGE NAME
This is the name of the current challenge.
C. CHALLENGE BADGE
This is the image of the badge that the user can win.
D. UNLOCKABLE ITEM
This is the name of the item that gets unlocked if the user succeeds in the challenge. These items can be:
• Character bio • Video
• Wallpaper
E. CHALLENGE STATUS BAR This bar shows the variable (points, days) that consists of the challenge as well as a graphic bar graph.
F. UPDATED CHALLENGE END DATE This is the new end of the challenge. This needs to be set maunally by the site admins.
G. CHALLENGE OVER MESSAGE  This text indicates that the challenge is over.
H. EARNED BADGE  This is the name and image of the challenge badge.
I. SEE BADGES BUTTON Takes the user to their badges (7.1.2)  J. UNLOCKED ITEM This is the item that the user unlocked. This can be either:
• Character bio • Video
• Wallpaper
K. SEE UNLOCKED ITEM BUTTON When the user clicks this button, they are taken to the corresponding item that the user unlocked. (character bio, video, wallpaper, etc)
L. FAIL MESSAGE When the users fail the challenge, they get this
message.
M. SEE BADGES BUTTON Takes the user to their badges (7.1.2)

MAX STEEL • CHALLENGES (EXTENSIONS & OUTCOMES)

MAX STEEL • 7.3.7 TASKS: ACTIVE

1)
TEAM NAME
XXXXXXX

2)
TEAM NAME
XXXXXXX

3)
TEAM NAME
XXXXXXX

4)
TEAM NAME
XXXXXXX

TASK NAME 4 +500 HP

TASK NAME 6 +300 HP

VIEW TASK DETAIL

TASK NAME 1

GET TO KNOW MAX AND STEEL BY VIEWING THE FOLLOWING BIOS: - MAX MCGRATH
- STEEL
- MAX STEEL

GO TO BIOS>

SKIP

FUNCTIONAL ANNOTATIONS
SCREEN DESCRIPTION: When the user has joined a tournament, he will see current tournament stats in his Tournament Panel. This includes a tournament leaderboard, top players list and tournament history.
A. NEW TASKS
This shows the type of graphic: • N-Tek files
• Video
• Game
B. VIEW TASK BUTTON
This displays the View task detail window.
C. VIEW TASK DETAIL This displays the View task detail.
D. CLOSE TASK BUTTON This takes the user back to new tasks.
E. BIOS LINK Direct CTA that links the user to the appropriate
section.
F. SKIP LINK This button allows the user to skip the shown task.

MAX STEEL • TASKS: ACTIVE

MAX STEEL • 7.3.8 TASKS: COMPLETED

TASK NAME 1
+300 HP

TASK NAME 2
+300 HP

TASK NAME 3 +600 HP

VIEW COMPLETED TASK

FUNCTIONAL ANNOTATIONS
SCREEN DESCRIPTION: When the user has joined a tournament, he will see current tournament stats in his Tournament Panel. This includes a tournament leaderboard, top players list and tournament history.
A. COMPLETED TASKS
This shows the type of graphic: • N-Tek files
• Video
• Game
B. VIEW COMPLETED TASK BUTTON
This displays the View task detail window.
C. VIEW COMPLETED TASK DETAIL This displays the View task detail.
D. CLOSE TASK BUTTON This takes the user back to new tasks.
E. BIOS LINK Direct CTA that links the user to the appropriate
section.
F. SKIP LINK This button allows the user to skip the shown task.

MAX STEEL • TASKS: COMPLETED

MAX STEEL • 7.4 ENTER A CODE

ENTER CODE

Enter code to decipher what your compensation is.

How to get a code.

PLAYER NAME

YOU entered code
XXXXXXX

You received
THE SAMPLE BADGE
+XXX HERO POINTS

BEFORE CODE ENTRY

CODE ENTRY ERROR

Sorry, you entered the
WRONG CODE!

Try AGAIN!

FUNCTIONAL ANNOTATIONS
SCREEN DESCRIPTION: The Enter a Code panel allows a user to enter a code from a product package, TV episode or commercial or an event to receive a point or badge reward in the metagame.
A. ENTER CODE PANEL
The left panel in the Enter Code View is a code entry form. It contains instructional copy, a form field and a submit button.
B. CODE FORM FIELD
The code form field checks to make sure a value is entered before submitting a check against the database for code validity.
C. SUBMIT BUTTON
User clicks the submit button to submit a code for entry.
D. CODE ENTRY CONFIRMATION
The code entry confirmation appears when a code has successfully been entered and validated. It acknowledges the code entered and the reward earned.
E. CODE ENTRY (DEFAULT STATE)
The default state of the right panel for code entry shows a graphic or visual.
F. CODE ENTRY ERROR
When a user enters an unrecognized, invalid or expired code, the appropriate error message appears here.
G. HOW TO GET A CODE
Clicking on this link displays a “Where to Get” panel on the right which tells the user where to find codes.

MAX STEEL • TOURNAMENTS/MISSIONS

MAX STEEL • 7.5 PUBLIC PROFILE

30

My
Profile

user selected background

FUNCTIONAL ANNOTATIONS
SCREEN DESCRIPTION: When the user clicks on a username on a game or tournament leaderboard, the dashboard panels expand or refresh with the player’s information/profile page.
A. PLAYER’S PROFILE INFORMATION
The player’s profile information appears in the center, including the username, hero level, HERO POINTS total, country flag and Ultralink avatar image.
B. PLAYER’S BADGES/TROPHIES PANEL
Player’s badges appear in the badges panel against his custom background. The user can roll over a badge to see the title of the badge but cannot see the description of how the user won the badge.
C. PLAYER’S UNLOCKABLES PANEL
Player’s ulockables appear in the unlockables panel against his custom background. The user can roll over an unlockable to see the title of the item.
D. MINIMIZE/EXIT
The user can click to minimize or exit out of the profile.
E. SCROLL LEFT/RIGHT
The user can click the left/right arrows to browse through additional user profiles. User profiles will be arranged in order of ranking.

LOCALIZATION:
All text on this page will be localized for language. Content will remain the same across all markets.
LOCKED/UNLOCKED CONTENT:
Player’s unlocked badges will be visible in his profile.

MAX STEEL • PUBLIC PROFILE

| Type of alert | Alert description | Tone | Delivered by | Trigger
1.1 | Missions | New knowledge mission | Direct | Forge Ferrus | New mission is activated in the dashboard.
1.2 |  | New skills mission | Direct | Forge Ferrus | New mission is activated in the dashboard.
1.3 |  | New villain mission | Direct | Forge Ferrus | New mission is activated in the dashboard.
1.4 |  | Mission reminder #1 | Buddy Humor | Ultralink | Mission has been in dashboard for 3 days.
1.5 |  | Mission reminder #2 | Buddy Humor | Max | Mission has been in dashboard for 20 days.
1.6 |  | Villain mission reminder #1 | Taunting | Villain | Mission has been in dashboard for 3 days.
1.7 |  | Villain mission reminder #2 | Taunting | Villain | Mission has been in dashboard for 20 days.
1.8 |  | Completed mission | Buddy Humor | Ultralink | Mission has been completed.
2.1 | Badges | New mini-game badge | Buddy Humor | Ultralink | A badge unlocked based on gameplay.
2.2 |  | New knowledge badge | Geeky | Berto | A badge unlocked based on site actions.
2.3 |  | New skills badge | Direct | Forge Ferrus | A badge unlocked based on game actions.
2.4 |  | New score-based badge | Buddy Humor | Ultralink | A badge unlocked based on game points.
2.5 |  | New toy-based badge | Buddy Humor | Ultralink | A badge unlocked based on collection/wish list.
2.6 |  | New challenge badge | Direct | Forge Ferrus | A badge rewarded for challenge participation.
3.1 | Trophy | New tournament trophy | Heroic | Max | A trophy rewarded for winning a tournament.
3.2 |  | New challenge trophy | Heroic | Max | A trophy rewarded for challenge participation.
4.1 | Unlockables | Unlock weapon in a game | Geeky | Berto | An item is unlocked through gameplay.
4.2 |  | Unlock vehicle in a game | Geeky | Berto | An item is unlocked through gameplay.
4.3 |  | Unlock location in a game | Direct | Dr. Smith | An item is unlocked through gameplay.
5.1 | Level Up | User reaches the next hero level | Direct | Max | User reaches the next hero level.
6.1 | New Content | New videos | Buddy Humor | Ultralink | First site visit after new content has been added.
6.2 |  | New turbo modes | Buddy Humor | Ultralink | First site visit after new content has been added.
6.3 |  | New character bio | Direct | Forge Ferrus | First site visit after new content has been added.
6.4 |  | New weapons | Geeky | Berto | First site visit after new content has been added.
6.5 |  | New vehicles | Geeky | Berto | First site visit after new content has been added.
6.6 |  | New locations | Geeky | Berto | First site visit after new content has been added.
7.1 | Tournament | New tournament started | Direct | Forge Ferrus
7.2 |  | Tournament reminder | Direct | Forge Ferrus
7.3 |  | Tournament ending soon | Heroic | Max
7.4 |  | Tournament ended, check results | Buddy | Ultralink
8.1 | Challenge | New challenge started | Direct | Forge Ferrus
8.2 |  | Challenge reminder | Direct | Forge Ferrus
8.3 |  | Challenge over, reward | Direct | Forge Ferrus
9.1 | New Game | New game added | Heroic | Max
9.2 |  | New game levels added | Heroic | Max

MAX STEEL • 8.0 HELP

HELP

Using the dashboard

1) Lorem ipsum dolor sit amet
2) Consectetur adipisicing elit
3) Eed do eiusmod tempor incididunt ut labore et.
4) Dlore magna aliqua. Ut enim ad minim veniam.
irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum. Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.

FUNCTION IMAGE

Joining a tournament

FUNCTIONAL ANNOTATIONS
SCREEN DESCRIPTION: The User finds answers to usability questions for the site in this page.
A. PAGE TITLE
This is the title of the page.
B. SECTION HEADER
This is the function that is described in the adjoining section.
C. FUNCTION IMAGE
The function in question is displayed in this area. The  image will be animated to show the usage.
D. TEXT FIELD
The information for the function is in this field.
TBD: Content and format of this page is TBD, pending requirements.

MAX STEEL • HELP