Challenge Summary
Welcome to TopCoder - View Challenge Results Responsive Storyboard Challenge.
The new topcoder.com website has been released and now it's time to get more areas of the community functionality redesigned. The new site is tailored to our talented community and our goal is to give everyone a great user experience.
In this challenge we need you to create the Challenge results pages for both Design and Software Development track by following the provided storyboard theme/look and feel from our previous challenge (attached to the challenge).
So, what are you waiting for? Jump in now and get involve in our great change and improvements :)
Round 1
Your initial design for review:
- Submit all the screens to get the feedback from client.
- Any notes or comments about your design for the client.
Round 2
Your final Design with Checkpoint feedback implemented.
- Any notes or comments about your design for the client.
Primary Goal:
The goal of this challenge is to design the Challenge Results pages for both Design and Software Development track.
The Design and Development tracks show a “Results” (was called “Winners” on Studio) view within each Challenge. We’d like to create a more consistent Results view that shows a table of data on all tracks, followed by a small gallery of winning submissions on the Design track.
We are looking for your best approach and concept how this should work by using the provided storyboard as your base design. We are looking for a very clean, simple layout for these pages.
At the final you must provide your design in both devices, PC and mobile (see the provided storyboard as guidance)
Design Consideration:
- Please use the provided storyboard as your base design. Your design need to match the theme of this storyboard.
- These pages should be very clean and simple. Again SIMPLE!!
- Please keep things consistent.
- Your design should be responsive, see the provided storyboard. We need you to design these pages in 2 (two) devices, pc and mobile.
- Feel free to design some icons or any other elements for the results pages to make the design more standout where you think appropriate. But please keep in mind your graphics should follow the look and feel of the provided storyboard.
- Make sure your submission images name are arranged properly (i.e 01_Blog_Page_Main.png, 03_a_Blog_Page_Search_Result.png)
General Requirement:
1. We provide the Landing Page Update Header And Footer.zip
--- Use the header and footer from this storyboard on your design.
2. Use TC-CS Challenge Details - Registrant Page.zip as your base design.
3. We attached the new TC web GUI Kit. Feel free to explore the GUI kit and the new TC style guide. Your design elements must match the style or theme or look and feel of the new TC brand on this kit.
Required Screens:
1. Design - Winners Page
- Refer to this page: http://studio.topcoder.com/?module=ViewContestResults&ct=30038843
- this is the current winners page we have for Design Studio
- We need your ideas/concept to organize the new and better layout of this page.
- We need you to show these information on the page:
a. Number of total registrants
b. Round 1 (Checkpoint)
---Number of submitters
---Number of submitters who passed screening, followed by the percentage in parentheses
---Number of submissions that passed Screening, followed by the percentage in parentheses
c. Round 2 (Final)
---Number of submitters
---Number of submitters who passed screening, followed by the percentage in parentheses
---Number of submissions that passed Screening, followed by the percentage in parentheses
- Show individual winning result details with the following information:
---Submission thumbnail
---Handle
---Date Registered
---Date Submitted
---Prize received
---Studio Cup points
- Create the mobile version of each page.
2. Software Development - Results page
- Refer to this page : http://community.topcoder.com/tc?module=ProjectDetail&pj=30035150&tab=results
- In the storyboard provided you need to add a new Tab "Checkpoints" after the Registrant tab.
- Change the "Winners" tab to "Results".
- We need your ideas/concept to organize the new and better layout of this page.
- We need you to show these information on the page:
a. Number of total registrants
b. Round 1 (Checkpoint)
---Number of submitters
---Number of submitters who passed screening, followed by the percentage in parentheses
---Number of submissions that passed Screening, followed by the percentage in parentheses
c. Round 2 (Final)
---Number of submitters
---Number of submitters who passed screening, followed by the percentage in parentheses
---Number of submissions that passed Screening, followed by the percentage in parentheses
d. Additional details about the challenge results
---Average initial score
---Average Final Score
- Show individual winning result details in a table with the following information:
---Download submission icon
---Handle
---Date Registered
---Date Submitted
---Screening Score
---Final Review Score
---Digital Run points
- Create the mobile version of each page.
Important:
- We are looking for your best approach how to display these informations on the results page of each track.
- The links provided only as reference. Feel free to explore your ideas on designing every pages. The most important thing, you must follow the spacing and styling of the storyboard provided. Again think simple.
- Keep in mind that these pages should be responsive.
Target Audience:
- Current and potential topcoder community members.
Judging Criteria:
- How well your design follow and match the current theme of the provided storyboard
- Cleanliness and consistency of your graphics and design
- How well your layout work with the new theme of the site
- Is your design for all the screens responsive for all the devices?
- SIMPLICITY
Submission & Source Files:
Preview Image
Please create your preview image as one (1) 1024x1024px JPG or PNG file in RGB color mode at 72dpi and place a screenshot of your submission within it.
Submission File
Submit JPG/PNG image files based on contest submission requirements stated above.
Source Files
All original source files. Original source files should be saved as layered Photoshop PSD files.
Final Fixes
As part of the final fixes phase you may be asked to modify your graphics (sizes or colors) or modify overall colors. If items were missed from the checkpoint round you may be asked to include them in your final design.
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.