TopCoder Social Sites - Landing and Profile Pages

Help TopCoder go social by designing TopCoder's Facebook Landing Page, and profile pages for our Twitter Account and YouTube Channel! We're looking for a trio of designs that flow together while embracing the uniqueness of the respective social media channels. The designs must represent the TopCoder brand in a clean and professional manner and we are open to creative designs that cater to the specific social site.

Round 1

Design a Facebook Landing page and 2 background images for Twitter and YouTube. Your designs will be reviewed and feedback will be given to help you finalize your artwork for Round 2.

Round 2

Submit final artwork and winners will be selected at the end of Round 2.

Facebook Landing Page:
A Facebook landing page is a page that gives new visitors a quick overview of TopCoder, what we do, and then directs them to what to do next.

Copy for body of page:

TopCoder is the world's largest competitive software development community with over 301,000 developers, technical innovators and graphical artists representing over 200 countries. Join our Facebook (possibly use FB logo) community for exclusive content, videos and a chance to share your innovation and software development stories and opinions today. We want to know what you want to create!

Copy for bottom of page (combine with Call to Action buttons):

Check out all the TopCoder projects currently paying $32,750 {Join Our Community *Call to Action Button}
Become more productive through Open Innovation and Global Competition {Connect With TopCoder *Call to Action Button}

For the TopCoder Facebook Landing Page please follow these guidelines:

• Use all Copy provided for text.
• Use colors consistent with TopCoder brand - Red, Charcoal, Silver, White
• Use TopCoder Logo & Create Build Understand graphic (attached)
• Clean, Simple, Elegant and Persuasive
• Drive the viewers eye to the Facebook LIKE button at the top of page - We are looking for creativity here specifically, again be consistent with our brand and what we stand for: coding, technology, productivity, growth
• Create two Call-To-Action buttons for the bottom of the page and pair them with the "bottom of page" copy:
• Call to Action 1. Join Our Community
• Call to Action 2. Connect With TopCoder

File Format: .JPG .PNG .EPS

Dimensions: 525 pixels wide x 450 pixels high

 

Additional Information: Be creative and clean, we are open to various looks and want to ensure the user is driven to the Facebook LIKE button and secondarily, driven to the two Call to Action buttons at the bottom of the page.

 

Twitter Profile Page Background:
Design a static image that acts as the background for our Twitter page. Your background image will appear behind the center column of our Twitter page. Important content should appear to the left and right of the column: http://twitter.com/topcoder

• The image must be one image and properly sized so it won't be tiled – see Dimensions below.
• Consider using our "Create - Build - Understand" graphic for the background as a faded or transparent image. (Graphic attached)
• Use colors consistent with TopCoder brand - Red, Charcoal, Silver, White
• The overall look must be VERY clean
• A Twitter specific graphic or style can be employed and is encouraged (See attached Tongal Twitter Image)

Include the copy below in both sides of the background image:

• Left side should be client focused:
  TopCoder Logo & website (www.topcoder.com)
  Copy - "Start getting more done."
• Right side should be community focused:
  Topcoder Logo & site (www.topcoder.com/reg)
  Copy - "Join and compete today."

File Format: .JPG .PNG .EPS

Dimensions: You will NOT be disqualified if your sizing isn't exact for Twitter, we will ask the winner to re-size the image if needed. Please follow the guidelines below.

Overall Page Size: 1280 pixels wide x 800 pixels high

Top Toolbar with Twitter logo that will not have your design applied: 1280 pixels wide x 60 pixels high

Left side: 108 pixels

Right side: 108 pixels

Additional Information: The Twitter profile page contains the timeline column on the left and another column on the right. Your background image will appear behind these two columns. The right column is at 75% opacity, so it is slightly see-through. The color that you choose for this column and your background image will influence how readable the items in this column are.

 

YouTube Channel Profile Page:
Design a static image that acts as the background for our YouTube Channel page. Your background image will appear behind the center column of our YouTube Channel page. Important content should appear to the left and right of the column: http://youtube.com/topcoderinc

• Use colors consistent with TopCoder brand - Red, Charcoal, Silver, White
• Create one seamless background image (see attached the Professionals) like our Twitter page. Use TopCoder colors and possibly the "Create-Build-Understand" graphic.

Create the following buttons:

• A separate "Subscribe" button other than what is provided by YouTube - make it consistent with TopCoder brand (see attached Rhett & Link only for what we mean, not as a design suggestion)
• Other buttons for "Blog" "Twitter" "Facebook". Be creative and use the TopCoder bracket to design the button.  Make sure all buttons are visible in a clean line (see attached Rhett & Link)

Maximum File Size: 256 KB

File Format: .JPG .PNG .EPS

Dimensions: The YouTube channel background will work like the Twitter background in that it must account for the fixed width of the center column. The area that displays videos and profile information is 960 pixels wide. The top area that contains the YouTube logo will not display your background image. Your background image will begin below the white YouTube bar, so all content should be started at the top of your image.

Overall Page Size: 2000 pixels wide x 2200 pixels high

Top Toolbar with Twitter logo that will not have your design applied: 1280 pixels wide x 60 pixels high

Left side: 520 pixels

Right side: 520 pixels