Challenge Summary
Welcome to TopCoder-CloudSpokes Challenges Pages Storyboard Design.
We are building a NEW website from scratch and we need the Design Studio Community to help design it! The audience for our new site consists of both our customers and our community. It is our goal to give everyone a great user experience.
For this contest we need you to design some pages for the Challenge section in our website, by following the provided storyboard theme/look and feel from our previous contest.
So, what are you waiting for? Jump in now and get involve in our great change and improvements :)
Round 1
Your initial submissions for feedback:
- Design Challenges Section (1 - 5)
- Any Notes for the client explaining your design
Round 2
Your complete final design with checkpoint feedbacks applied.
Primary Goal:
The main goal of this contest is to design some screens for "Design" and "Software Development" challenges pages as we listed below, and you must keep following the theme from the provided storyboard. All of these new pages have to match the table styling from the Main Challenges page of the storyboard (see 05_Chalenges_list.png and 06_Challenges_grid.png).
Design Consideration:
- Please keep in mind that we are calling "challenges" here instead of contests.
- Please use the provided storyboard as your base design (The Challenges pages). Your design need to match the theme of this storyboard.
- Please keep things consistent.
- Follow the flat design theme in the storyboard and please consider great use of white space.
- Your design should be responsive, see the provided storyboard. We need you to design TWO pages (listed below) in both pc and mobile layout. You will not design the challenge listing pages in mobile.
- Feel free to design some icons for the new 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.
Required Screens:
If you check the provided storyboard, you will see 3 main icons at the top of the page (IA/UX Designers, Software Developers, and Analytics). User will see the Active challenge track for each section by clicking the icon.
In this contest we need you to design some pages for the Design and Software Development tracks.
DO NOT too worry about the numbers of the screens, some of them are just the same with only a few table headers differences.
A. "DESIGN" Challenge section:
1. Active Challenges (this is the main home page of the Design Challenges section)
- Please use the Contest Column.xlxs for the table column header.
- For the content, use: http://studio.topcoder.com/?module=ViewActiveContests
---Please show some examples here, use dummy text for any content you think appropriate.
--For this active contest page we need you to show in two views:
--a. Table View
--b. Grid View
2. Past Challenges
- There should be a way to navigate to this past challenges page on the Design Challenge section
- Please use the Contest Column.xlxs for the table column header.
- For content, use: http://studio.topcoder.com/?module=ViewPastContests
---Please show some examples here, use dummy text for any content you think appropriate.
3. Review Opportunities
- Please use the Contest Column.xlxs for the table column header.
- For content use: http://studio.topcoder.com/?module=ViewReviewOpportunities
4. First to Finish (this is the name we will use instead of "bug races")
- Please use the Contest Column.xlxs for the table column header.
- For content, use: http://studio.topcoder.com/?module=ViewActiveBugRaces
5. Individual Challenge Details page (the page that describes the challenge in detail,etc).
- Use this page for required elements: http://studio.topcoder.com/?module=ViewContestDetails&ct=30035966
- We are looking for your best approach how to display this page with the new theme. Feel free to re-layout this page. How will you think this page enticing with the new theme?
B. "SOFTWARE DEVELOPMENT" challenge section:
6. Active Challenges (this is the main home page of the Development Challenges section)
- Please use the Contest Column.xlxs for the table column header.
- For content use: http://community.topcoder.com/tc?module=ActiveContests&pt=14
--For this active contest page we need you to show in two views:
--a. Table View
--b. Grid View
7. Past Challenges
- There should be a way to navigate to this past challenges page on the Software Development Challenge section
- Please use the Contest Column.xlxs for the table column header.
- For content use: http://community.topcoder.com/tc?module=CompList&ph=125
8. Review Opportunities
- Please use the Contest Column.xlxs for the table column header.
- For content, use: http://community.topcoder.com/tc?module=ViewReviewAuctions&pt=14
9. First to Finish (this is the name we will use instead of "bug races")
- Please use the Contest Column.xlxs for the table column header.
- For content, use: http://community.topcoder.com/tc?module=ViewActiveBugRaces
NOTE - Include the explanation text on this page in your design.
10. Individual Challenge Details page (the page that describes the challenge in detail,etc).
- use: http://community.topcoder.com/tc?module=ProjectDetail&pj=30036165
NOTE: Please don't replicate yellow highlighted text.
FOR PAGE 5 and PAGE 10: these two pages should look very similar. We know that each page will have different elements, but you should think about the user experience. Mainly, if a user was viewing a Design competition, and then viewed a Software competition, We want the user to feel like they can find similar information (deadlines, requirements, prizes, points, eligibility, etc) on both pages easily because they are in the same area/look the same.
IMPORTANT NOTES:
- For mobile screens, on this contest you only required to submit Page 5 and Page 10 (Design contest detail page and Software contest detail page)
- For icons, i.e Contest type, public/private, you are free to use and replicate what we currently have in Studio or if you want to offer something fresh with our new site theme.
Target Audience:
- The main target audience on this are the specific competitors for each track (Design and Software).
- Potential competitors.
Judging Criteria:
- How well your design follow and match the current theme of the provided storyboard especially the table styling
- Cleanliness and consistency of your graphics and design
- Is your design for the challenges pages responsive for all the devices?
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.