Challenge Summary
TopCoder has recently introduced TopCoder Direct, which allows Customers, as well as Staff, CoPilots, etc., to directly engage with the TopCoder processes and community.
It implies the ability to utilize the browser-based Cockpit tool to:
- Launch and Monitor Contests
- View Submissions
- Choose Winners for Competitions
- Pay for and Download Finished Products
and generally manage a project within the TopCoder platform.
In other words, TopCoder Direct is the bridge between the Client and the TopCoder Community that gives a customer the ability to build software and complete design projects of any size or scope through competition.
We are moving Direct (http://www.topcoder.com/direct) to an HTML based platform. We have completed the first Studio Wireframe Contest and Storyboard Contest. This is the Second Storyboard Contest that will focus on updating and modifying the design of the first Storyboard Contest and adding a few new pages.
The goal of this contest is to produce Storyboards that accurately capture the design requirements listed below. Please think about how this application will be used - What would you find useful? The Wireframes are meant as a Guide! - You are open to use your design ability and input into how this application will flow. Design Requirements For this contest we are looking to combine elements from the first and second place winners of the first Storyboard Contest as well as adding some new pages. Refer to the first contest here:Link Contest Files 24797-First.zip - Files to update/modify. Folder contains PSD files from the first contest plus NEW files with an updated color scheme. 24798-Second.zip - Files to be used for reference and resources (see modifications below) tab-samples.zip - Reference files for the new Navigation structure and overall general page layout. 24502_preview.zip - Older Wireframe files used for reference Modifications We want to keep the overall layout and graphic design look of the 1st place submission (24797-First). We would like the following changes made. 1) Update the top tab navigation structure in accordance with the attached sample (tab-samples.zip). We are removing the 2 tiers of tabs and adjusting the entire navigation strategy. 2) Incorporate the design of the right side bar/column from the 2nd place submission (24798-Second). 3) Try to improve the color and visual elements. Think of the color hierarchy - what colors should the buttons be? links? Top Tabs? 4) Work on the overall application page flow - Should something be a link or a button? Is it easy to see what is on the page and does the workflow make sense? 5) Remove the Carousel controls on the Submission Page Thumbnails. Take advantage of the additional white space. 6) Remove the top icons for "How it Works", "Why TC Direct" and "FAQ". Replace it with a single "Help" button/icon that will take the user to a content area that will have help, faq, etc. 7) Make Search a constant "tab" in the upper right. 8) Make Pipeline a constant "tab" in the upper right. 9) Rework the main contest Dashboard page in accordance with the updated sample. (tab-samples.zip) Required Pages 1) Landing Page (Color updates, Header Updates, Make this more of an Application Home Page) 2) Dashboard (for logged in user - first page a user see's after logging in) - This page is separate from Direct Landing Page - Simple table of information contains latest activity (all activity) - What are different types of Activity? - Displays Activity Alerts - List of Active Projects (right side) - List of Active Contests (listed below a project) - Ability to Create a New Project - Ability to Launch a Contest 3) Submission Viewer (Add any hover states we need to review (like flagging and cancelling a submission). Please show both the thumbnail view as well as the individual submission view. This will require multiple pages to demonstrate the design for this section. 4) Launch Contest Pages (Based on the provided Wireframes. It should be simple and intuitive to create a contest for both a power user and someone using it for the first time. Show multiple screens if necessary) Design Considerations - The pages should be simple and not cluttered. It should be open with a lot of white space. - The pages and information on them should be organized in an intuitive way such that it is obvious what the user is looking at and what actions they can/should take. - Keep it simple. Think about the usage and what makes the most sense. Target Audience When a user comes to our application, they may be: - Potential Customer - Current Customer (workers and executives) - Co-Pilots Judging Criteria You will be judged on the following: - Quality of your design and did you continue the desired look and feel appropriately - How the design met the above requirements and considerations - User Experience Contest Deliverables Round One 1_LandingPage.jpg= Your submitted design solution for a review (pay attention to the navigation!) 2_Dashboard.jpg= Your submitted design solution for a review 3_SubmissionViewer.jpg= Your submitted design solution for a review 4_Launch Contest.jpg= Your submitted design solution for a review (also any additional screens that will help the client understand your design and user flow) Notes.jpg = A file that explains your design and solution Round Two 1_LandingPage.jpg= Final Design 2_Dashboard.jpg= Final Design 3_SubmissionViewer.jpg= Thumbnail View Final Design 3b_SubmissionViewer.jpg= Individual Submission View Final Design 4_Launch Contest.jpg= Final Design (also any additional screens that will help the client understand your design and user flow) Notes.jpg = A file that explains your design and solution You must submit all requested deliverables to be considered for prizes - you may submit more if necessary to explain your design Submission & Source Files Preview Image Please create your preview image as one (1) 1024x1024 JPG or PNG file in RGB color mode at 72dpi and place a screenshot of your submission within it. You are free to resize or crop your submission to fit this size, but do not add any filters or elements for dramatic effect, such as drop shadows or reflections. Submission File All Requested Contest Submission Requirements stated above. Files should be saved as JPG or PNG files in RGB mode at 72dpi. IMPORTANT- If you are submitting "small updates or changes" with multiple submissions please include in your notes file what is different or changed - this can be confusing to the client sometimes when they can't tell what is different. Source Files All original source files. Original source files should be saved as layered Photoshop PSD files or AI / EPS (Illustrator) files. Final Fixes As part of the final fixes phase you may be asked to modify fonts (sizes or colors) or modify overall storyboard colors. Please let us know in the forums if you have any questions.
Round 1
At the end of Round 1, TopCoder will choose five (5) Round 1 winners, each will win $50 and a Design Review. These winners and any member who had a passing submission in Round 1 will be eligible to compete in Round 2 for the additional $1250 in prizes.Round 2
Round 2 will start with the announcement of the Five (5) $50 Round 1 winners and their design review from TopCoder.The goal of this contest is to produce Storyboards that accurately capture the design requirements listed below. Please think about how this application will be used - What would you find useful? The Wireframes are meant as a Guide! - You are open to use your design ability and input into how this application will flow. Design Requirements For this contest we are looking to combine elements from the first and second place winners of the first Storyboard Contest as well as adding some new pages. Refer to the first contest here:Link Contest Files 24797-First.zip - Files to update/modify. Folder contains PSD files from the first contest plus NEW files with an updated color scheme. 24798-Second.zip - Files to be used for reference and resources (see modifications below) tab-samples.zip - Reference files for the new Navigation structure and overall general page layout. 24502_preview.zip - Older Wireframe files used for reference Modifications We want to keep the overall layout and graphic design look of the 1st place submission (24797-First). We would like the following changes made. 1) Update the top tab navigation structure in accordance with the attached sample (tab-samples.zip). We are removing the 2 tiers of tabs and adjusting the entire navigation strategy. 2) Incorporate the design of the right side bar/column from the 2nd place submission (24798-Second). 3) Try to improve the color and visual elements. Think of the color hierarchy - what colors should the buttons be? links? Top Tabs? 4) Work on the overall application page flow - Should something be a link or a button? Is it easy to see what is on the page and does the workflow make sense? 5) Remove the Carousel controls on the Submission Page Thumbnails. Take advantage of the additional white space. 6) Remove the top icons for "How it Works", "Why TC Direct" and "FAQ". Replace it with a single "Help" button/icon that will take the user to a content area that will have help, faq, etc. 7) Make Search a constant "tab" in the upper right. 8) Make Pipeline a constant "tab" in the upper right. 9) Rework the main contest Dashboard page in accordance with the updated sample. (tab-samples.zip) Required Pages 1) Landing Page (Color updates, Header Updates, Make this more of an Application Home Page) 2) Dashboard (for logged in user - first page a user see's after logging in) - This page is separate from Direct Landing Page - Simple table of information contains latest activity (all activity) - What are different types of Activity? - Displays Activity Alerts - List of Active Projects (right side) - List of Active Contests (listed below a project) - Ability to Create a New Project - Ability to Launch a Contest 3) Submission Viewer (Add any hover states we need to review (like flagging and cancelling a submission). Please show both the thumbnail view as well as the individual submission view. This will require multiple pages to demonstrate the design for this section. 4) Launch Contest Pages (Based on the provided Wireframes. It should be simple and intuitive to create a contest for both a power user and someone using it for the first time. Show multiple screens if necessary) Design Considerations - The pages should be simple and not cluttered. It should be open with a lot of white space. - The pages and information on them should be organized in an intuitive way such that it is obvious what the user is looking at and what actions they can/should take. - Keep it simple. Think about the usage and what makes the most sense. Target Audience When a user comes to our application, they may be: - Potential Customer - Current Customer (workers and executives) - Co-Pilots Judging Criteria You will be judged on the following: - Quality of your design and did you continue the desired look and feel appropriately - How the design met the above requirements and considerations - User Experience Contest Deliverables Round One 1_LandingPage.jpg= Your submitted design solution for a review (pay attention to the navigation!) 2_Dashboard.jpg= Your submitted design solution for a review 3_SubmissionViewer.jpg= Your submitted design solution for a review 4_Launch Contest.jpg= Your submitted design solution for a review (also any additional screens that will help the client understand your design and user flow) Notes.jpg = A file that explains your design and solution Round Two 1_LandingPage.jpg= Final Design 2_Dashboard.jpg= Final Design 3_SubmissionViewer.jpg= Thumbnail View Final Design 3b_SubmissionViewer.jpg= Individual Submission View Final Design 4_Launch Contest.jpg= Final Design (also any additional screens that will help the client understand your design and user flow) Notes.jpg = A file that explains your design and solution You must submit all requested deliverables to be considered for prizes - you may submit more if necessary to explain your design Submission & Source Files Preview Image Please create your preview image as one (1) 1024x1024 JPG or PNG file in RGB color mode at 72dpi and place a screenshot of your submission within it. You are free to resize or crop your submission to fit this size, but do not add any filters or elements for dramatic effect, such as drop shadows or reflections. Submission File All Requested Contest Submission Requirements stated above. Files should be saved as JPG or PNG files in RGB mode at 72dpi. IMPORTANT- If you are submitting "small updates or changes" with multiple submissions please include in your notes file what is different or changed - this can be confusing to the client sometimes when they can't tell what is different. Source Files All original source files. Original source files should be saved as layered Photoshop PSD files or AI / EPS (Illustrator) files. Final Fixes As part of the final fixes phase you may be asked to modify fonts (sizes or colors) or modify overall storyboard colors. Please let us know in the forums if you have any questions.
Please read the challenge specification carefully and watch the forums for any questions or feedback concerning this challenge. 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.