Challenge Summary
Welcome to Topcoder Starting Guide Landing Page Design Challenge. We need you to design fresh storyboards for one single page that will be held in the [topcoder] website. We’re looking for educative and professional designs. It’s time to show off some skills!
NOTICE this is a FAST deadline. Jump in now!!
Round 1
For your R1 deliverables please submit the requested screens design under “Design Requirements” section.
1) Getting Started Landing Page (Mobile and Desktop View)
Round 2
Final design will contain all the requested screens under “Design Requirements” section plus any updates from client feedback.
1) Getting Started Landing Page (Mobile and Desktop View)
2) Thank You Page (Mobile and Desktop View)
The primary goal of this challenge is to design a brand new page to demonstrate information in a VERY GRAPHIC and educative way about how to get started with [topcoder]. We’re looking forward to see high quality graphics that can help explaining this important information to new users who don’t know much about [topcoder] and competition.
Branding and Guidelines
- Provide desktop and mobile view of the screens. Specific limitations 1010px wide for desktop and 320px wide for mobile, as the provided baseline (LandingBaseline.zip). Re-use the header and footer. The content and layout must be something NEW.
- Follow the provided Website PSD GUI Kit. The design needs consistency among all the features you create.
- Follow the flat design theme in the storyboard and please consider great use of white space.
- You are encouraged to create icons and quality graphics for your design to standout where you think appropriate. Keep in mind your graphics should follow the look and feel of the site.
- Keep the same fonts. If you have any issue with the provided source files fonts just replace those fonts with a regular one (like Arial) and add a note in your submission explaining you made the change. You will be asked to replace those fonts if you become the winner. Declare your fonts according to the Studio font’s policies.
Design Requirements
1) Getting Started Landing Page
- The page should be graphical in nature. Keep the white background BUT add creative graphics for each section (Design, Development, Data).
- Text and links should not be graphics.
- IMPORTANT! Show the steps in a fun way! We envision an infographic-style workflow. See these samples we’ve created before. Use them as inspiration for this part of your design and DO NOT COPY ANYTHING.
-- Appirio Sales Infographic.
-- Appirio Customer Workflow.
-- [topcoder] 500k Community.
- Add “Getting Started” heading title.
- Display the following content (graphically represented, clean and simple):
1. Sign Up (show button with this)
2. Pick a Track (or try all three!)
--- Design (add Read the Quick Start Guide and View This Track’s Homepage link/button).
--- Development (add Read the Quick Start Guide and View This Track’s Homepage link/button).
--- Data (add Read the Quick Start Guide and View This Track’s Homepage link/button).
3. Pick a Challenge
4. Compete and win!
- Create designs for the following items on the page and place them wisely at your criteria (show these on the side? in a call-out box? be creative!):
-- Follow the blog, twitter, FB, G+ (for social media, use the icons from the UI Kit).
-- Check out TCO14 (banner elements attached - feel free to use).
-- Subscribe to the RSS Challenge Feed.
-- Introduce yourself in the forum.
2) Thank You Page
- This will be the very same Getting Started Landing Page. Just replace the heading title with “Your account has been confirmed. Welcome to [topcoder]! We’re glad you’re here.”
Target Audience
- Potential new members and clients.
- Current community members and clients.
Judging Criteria
- Originality.
- Quality of design execution.
- Consistency. Design must feel part of the branding.
Submission File
Submit JPG/PNG image files based on challenge submission requirements stated above.
Source Files
All original source files of the submitted design. Files should be created in Adobe Photoshop and saved as layered PSD files.
Preview Image
Create one 1024x1024 JPG or PNG file in RGB color mode and place a screenshot from your submission within it.
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.