Challenge Summary
It's time to get ready for the 2012 TopCoder Open! We're very excited of our annual event. As the premier TopCoder event, we need an exciting website to showcase the event, the details, and all the fun stuff that goes along with it. We're looking for something even better than we've done in the past: http://community.topcoder.com/tco11/
Round 1
Your submitted design solution for a review.
1. Homepage - Banner
2. Additional Pages - Blog Page
3. Additional Pages - Schedule Page
4. Additional Pages - Leaderboard Page
5. Additional Pages - Final Result Page
Any other screens?
Please note some explainations of your design solutions.
Round 2
Final Designs
1. Homepage - Banner
2. Additional Pages - Blog Page
3. Additional Pages - Schedule Page
4. Additional Pages - Leaderboard Page
5. Additional Pages - Final Result Page
6. Additional Pages - Photo Page
7. Additional Pages - Twitter Page
Any other screens?
Please note some explainations of your design solutions.
Contest Details
The 2012 TopCoder Open website is the first glimpse of the exciting tournament that TopCoder members, sponsors, and prospect clients have of this exciting event. Each year, we strive to make the site more exciting and visually different. At the end of this contest, your design will replace temporary design at http://community.topcoder.com/tco12/. So, give some fresh, new but also the art touch that reflecting our TCO12 logo and make it looks awesome, but also don't want to start from scratch when build the page in the current site.
Design Considerations
The TCO12 website is the public representation of TopCoder for the duration of the tournament. As such, it should be professional and cleambut that doesn't mean boring or corporate! TCO is the showcase of our talented members and we want everyone that goes to the site to be as impressed with our members as we are!
While we want the site to be new and fresh, the same basic page layout need to stay, such as: Tabbed navigation (secondary and tertiary), Sponsor side-bar as explained below. Be creative and think about what would make this page amazing. The interface should be straightforward, simple, inviting and sleek. It should induce excitement and showcase skill. Be sure to adhere to the color, size and font requirements below.
Design Requirements
For this contest you will be designing the main tournament page for TCO12 and some additional pages.
While we showed you past examples of tournament website design logos please stay away from any idea that was used in the past by going here: http://community.topcoder.com/tc?module=Static&d1=tournaments&d2=home. We want to stay away from anything that has been done in the past and expect something fresh and new.
Below are the major UI elements need represents in your submission:
TCO12 LOGO
- The new TCO12 logo must be included in your design.
- Storyboard design should have same feeling and theme with the logo.
TOPCODER LOGO
-The Topcoder logo must be included in your design, secondarily to the TCO12 logo. DO NOT change the colors or proportion of the logo. Please re-use tc-logo.ai.
SPONSOR LOGOS
- Sponsor logos must be placed within a sidebar on every page, just like the previous TCO sites.
- You may position the sidebar however you like. Please provide twelve (12) blank boxes showing the placements.
- Six (6) of the boxes should be suitably larger in size than the other six (6).
- As mentioned below, the boxes should have a white or black background.
- DO NOT USE ACTUAL LOGOS FROM CLIENTS/SPONSORS!
- DO NOT add any additional logos, including the TopCoder Studio Logo.
NAVIGATION
You must include the following navigation:
- Primary Navigation for all tracks (refer to the TCO11 site). We are looking for new icons, ones that fit with the new design. These track icons will be used all over branding materials.
- Secondary and Tertiary navigations: Both should be kept in the same format as shown on the TCO11 website. Do not create drop-downs or other forms of navigation. You may skin this navigation however you like as long as the functionality can remain the same when coded.
- Multimedia Navigation/Icons: You must also show a navigation or icons that include the following elements:
--- TCO Program
--- Blog
--- Photos
--- Movies
--- Twitter
- We need these icons to be present on ALL PAGES. You're encourage to enhance the icons, but still have same meaning like previous.
- You should include examples for each navigation area (primary, secondary and tertiary) in both "on" (marks the page you are currently on) and "off" mode. The secondary and tertiary
- Navigation must be text-based. The background of these text-based navigations may be graphical, if you choose.
- Also we'd like you to improve Forum Post or Blog Categories text link in the sidebar.
SAMPLE TEXT
- Your page title should be in text, not a graphic.
- Show us best practices Font Typography of page title, sub page title, bold, strong , text link, paragpraph, etc should looks like.
- Please use placeholder/dummy greek text to show where main content will be placed.
SAMPLE TABLE
- Show a sample table with 5 rows and 2 columns, including headers and a table title.
- Some page required pagination. You might also design this to match the page.
REGISTER NOW
- You should create "Register Now" button that can attract user to click
- We also need "Register Now" modal windows design.
- Refer to current looks of modal windows when you click "Register Button" in http://community.topcoder.com/tco11/development/
- Re-use exisiting text content based on "Register Now" modal windows
COLOR
- Complimentary with TCO12 Logo
FONTS
- Be creative for the font typography.
- Fonts are open to the designer with exception of the Bank Gothic family. All non-standard Windows fonts must be listed in a text file within your submission folder. Include the name of the font and a link to where it can be downloaded/purchased. DO NOT include any font files in your submission or source files.
For the task in this contest, you're required to submit following pages:
HOMEPAGE
- Make sure you not copying the TCO11 site. No countdown clock, no news ticker etc. We need your creative to build infrastructure of this page. Impress us!
- We don't want the designers to be limited for sure to current layout, please suggest us any best practices.
LEADERBOARD PAGE
Page Reference: http://www.topcoder.com/tco10?module=AlgorithmQualification.
- Please show all the listed handles with corresponding colors placed (see http://community.topcoder.com/tco10?module=ContestDetails&eid=3432&ct=476).
- Show a sample table similar to the leaderboard table. Label your table header and table rows. You can use the data within the link provided.
- Some page required pagination. You might also design this to match the page.
SCHEDULE PAGE
Page Reference: http://community.topcoder.com/tco11/studio/studio-schedule/
- Show a sample table similar to the leaderboard table. Label your table header and table rows. You can use the data within the link provided.
FINAL RESULT PAGE
Page Reference: http://community.topcoder.com/tco11/studio/studio-final-results/
- This page is the spotlight for the winner. Bring us any idea, so this page will give "champion" feeling.
BLOG PAGE
Page Reference: http://community.topcoder.com/tco11/blog/
- Show us any possibilities content will be show in blog page
PHOTO PAGE
Page Reference: http://community.topcoder.com/tco11/photos/
- Suggest how this photo gallery looks great, also improve the usability
MOVIE PAGE
Page Reference: http://community.topcoder.com/tco11/movies/
- Suggest how movie and live streaming looks great, also improve the usability
TWITTER PAGE
http://community.topcoder.com/tco11/twitter/
ANY OTHER PAGES?
Target Audience
- TopCoder and Studio members
- TopCoder's Clients and Sponsors
- Potential Member
- Potential Client and Sponsors
Judging Criteria
- Usability: Will this design be easy for all users to find what they need? Does it call out important information?
- Concept: We're looking for something new and fresh!
Preview Image
Please create your preview image as one (1) 1024x1024 JPG or PNG file in RGB color mode at 72dpi and place your submissions within it.
Contest Deliverables
Submission File
All requested Contest Deliverables in JPG or PNG file format in RGB color mode at 72dpi.
Source Files
All original source files of the submitted design. Files should be saved as layered PSD files.
Final Fixes
As part of the final fixes phase you may be asked to modify colors or fonts.
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.