TAG UI Wireframe Phase 1

This is an internal tool for a tv/movie database, where related movies and tv episodes from various sources are matched together.

Round 1

At the end of Round 1, the Client will choose two (2) Round 1 winners, each will win $100 and a review, as Round 1 Milestone Winners. These winners and any member who had a passing submission in round one will be eligible to compete in Round 2.

Round 2

Round 2 will start with the announcement of the two (2) $100 Round 1 winners and their review.

Please read the contest specification carefully and watch the forums for any questions or feedback concerning this contest. It is important that you monitor any updates provided by the client or Studio Admins in the forums. Please post any questions you might have for the client in the forums.

This is the first of a number of contests related to the creation of this tool. For this contest, Wireframe Phase 1, you will create the first seven (7) views in the wireframe.

ALL PAGES - CONTENT

1) HEADER
- logo placeholder

- (login page):
---- NO CONTENT other than logo placeholder

- (all other pages):
---- welcome username | logout [LINK > Login page (1)]
---- search module (text input with auto-suggest drop select on input & "search" button) [LINK > Search Result page (3)]

2) FOOTER
- one sentence lore ipsum


SPECIFIC PAGES - CONTENT


1) Login
- username (text input)
- password (password input)
- submit button (login)

2) Dashboard (3 columns)
- COLUMN 1
---- title, "Unmatched / VOD"
---- data (repeat 6 times):
-------- "Acme Video Title"
-------- "REF: xxxxxxxxxxxx
-------- "Source: VOD
-------- "Type: Episode"
-------- "Release: 2009"
-------- "View More Details [LINK > Tooltip] | Edit [LINK > Edit Modal page (5)]
-------- "Suggest Matches" (button) [LINK > Matches page (7)]
---- pagination

NOTE: tooltip for "View More Details" here is the same as on results page

- COLUMN 2
---- title, "New Series / Movies"
---- data (repeat 6 times):
-------- "Acme Video Title"
-------- "REF: xxxxxxxxxxxx
-------- "Source: VOD
-------- "Type: Episode"
-------- "Release: 2009"
-------- "View More Details [LINK > Tooltip] | Edit [LINK > Edit Modal page (5)]
-------- "Suggest Matches" (button) [LINK > Matches page (7)]
---- pagination

NOTE: tooltip for "View More Details" here is the same as on results page

- COLUMN 3
---- title, "EKB Stats"
---- stats (NOTE: show each stat in a "box" / 1px border
-------- "16,650 Rovi"
-------- "23,004 VOD"
-------- "6890 Matches"
-------- "1002 Fixed Manually"
-------- "16,008 UnMatched"


3) SEARCH RESULT
NOTE: See results-data-example.jpg for content
NOTE: Collapse all expandable divs, by default
NOTE: Content for "Filter Results" div will be announced for round 2 - leave this an empty expandable/collapsable div for round 1
NOTE: Sorting does not have to function for this wf - just show

NOTE: "View More Details" is a tooltip link with the following content:
- tooltip title, "Acme Title XTC"
- data row, "Source: TVGD"
- data row, "Air Date: 09/16/2010"
- data row, "Season: 3"
- data row, "Episode:2"
- data row, "Type: Series"
- data row, "Credits: Acme Actor name, Acme Actor name"
- data row, "Summary (two sentences Lorem ipsum)"
- data row, "License: 10/25/2010 - 12/31/2010- data row, "Rank: 0.620974"
- data row, "Genres: Comedy, Other"
- text link, "View Complete Description" [LINK > "Complete Details Modal" page (4)]
- text link, "Edit" [LINK > "Edit Modal" page (5)]
- button, "Suggest Matches" [LINK > "Matches" page (7)]

NOTE: only show "Suggest Matches" button on details for titles that have no matches!

4) COMPLETE DETAILS MODAL
NOTE: Show a "close (x)" button to top left corner

The content here is the same as the tooltip, except:
- remove the "View Complete Description" text link
- make the "edit" text link a button here [LINK > "Edit Modal" page (5)]
- add the following data (under "Genres")
---- section title, "Language: ENG"
---- section title, "S/E: (SS, E10)"
---- section title, "TV Rating:" with "TV-G"
---- section title, "Keywords: (none)"
IMPORTANT NOTE: WE WILL BE ADDING MUCH MORE DATA HERE, so we want the modal content area to scroll BUT the "Edit" and "Suggest Matches" buttons should be on a layer that lays outside of the scroll - ie these buttons show at all times, regardless of scrolling data)


5) EDIT MODAL
The content here is the same as the Complete Details modal page (4), except:
- the following data is now editable:
---- "Language:" (text input with "ENG" showing by default)
---- "Season" (text input with "1" showing by default)
---- "Episode" (text input with "3" showing by default)
---- "TV Rating:" (drop select with "TV-G" showing by default)
---- "Keywords:" (text area with no content and "comma separated list" help text)
- replace "Edit" and "Suggest Matches" buttons with "Update [LINK > "Update Success" page (6)]" and "Cancel [LINK > "Complete Details Modal" page (4)]"

6) UPDATE SUCCESS
NOTE: The content here is the same as Complete Details Modal" page (4), except there is now a "Title Successfully Updated" message at the top.

7) MATCHING
NOTE: this is the main activity page for the wireframe. Users can come here to take an UNMatched title and find other titles to match it to. In this scenario, the title to be matched (unmatched title, selected on a previous page) is shown and then a list of result data (and associated filters) are displayed, in order to be compared to the unmatched title.

NOTE: See results-data-example.jpg for content