Challenge Summary
Welcome to the Cockpit Studio Submissions Viewer Improvement REPOST Contest. The goal of this contest is to improve the usability and UI of the Submission Viewer in Cockpit Applications.
Please read the specification details below and let us know if you have questions
Round 1
Round One
Your submitted solution for a review.
Enhanced Submission Viewer(s)
Notes = Any comments about your design for the Client
Round 2
Final Design
Enhanced Submission Viewer(s)
Notes = Any comments about your design for the Client
Contest Details
TopCoder has recently introduced the TopCoder Cockpit Application, which allows Customers, as well as Staff, Copilots, etc., to directly engage with the TopCoder processes and Community.
TopCoder Cockpit allows users to
- Launch and Monitor Contests
- View Submissions
- Choose Winners for Competitions
- Pay for and Download Finished Products and generally manage a project within the TopCoder platform.
TopCoder Cockpit is the bridge between the Client and the TopCoder Community that gives a customer the ability to build software and complete design projects of any size or scope through competition.
For this contest Topcoder Direct Submissions Viewer is page that will make client can review all submissions more faster, by provide them new way to view all images placed in competitor submissions.
IMPORTANT
- Keep simple and clean design! And have great user experience.
- Group/package each graphics in its own folder layer with appropriate names/titles.
- Keep things consistent. This means all graphics styles should work together.
- All of the graphic should have a similar feel and general aesthetic appearance.
- Make sure your design use Windows standard fonts (arial, tahoma, etc)
- All text must be editable and non-graphical.
- You must provide us how every screens looks in 1024px width and more wider screens.
- Before you redesign the PSD, please click around on attached prototype(submission-viewer-prototype.zip) and Cockpit GUI Kit PSD(Cockpit_GUI_Kit_PSD.zip) to get more familiar with Cockpit Start a New Project application.
DESIGN REQUIREMENT
One of the main issue is layout usage - we have a lot of things going on at the top of the page before we actually see the submissions.
The goal of the submission viewer would be:
1) See submissions
2) Navigate submissions
3) View details and select submissions
So what we expected from the submission viewer is you see the submission first, in our design you have to scroll down the page to get to the submission image.
- The key redesign this page is to try different layouts. Don't get stuck on the currently layout of the information. We looking forward your help improve the page.
- Notice the ranking controls and the Feedback area be on the top instead of buried at the bottom. It isn’t obvious to user that there even is a place to save feedback.
- We need to compress the area that has "feedback" or make it a modal window? or tie it into the actual submission ID bar better?
- No need for the feedback box to be so large and maybe it would work better as a modal? We're thinking you should create the icon/text to triggered the modals and placed in action bar?.
- Our main concern Submission Grid and Single View layout still not looking great. We need your idea improve them. It seems like makes better use of the space. Maybe that top table could be condensed? There is a lot of space used for fields on top. Please use the white space wisely.
- You're encourage the re-arrange the layout of grid and single view page. Or update/improve some thumbs size on both pages to get optimal view.
- We not like grey rounded background in Full Size submission page, the plan is to make this page load faster by reducing extra images except than full size image. Keep it using plain style.
- Navigation in Full Size page must update to "Previous/Next Image" instead of "Previous/Next Submission". Text must only using plain text.
- You may explore and add any ideas to make the page user experience.
- There are some difference between design and prototype, regarding screens resolution, for example please the page looks in 1024px and 1440px browser screen, thumbnails not have correct alignment, etc. We need your best solutions regarding this issue.
- Please create new "Download All Submission" button in thumbnails view page. The button visual need attract user attention.
- Please show us notes in your solutions.
Target Audience
- New Customers - Non expert Customers
Judging Criteria
- How well you improve "Submission Viewer" graphics and keep things consistent with the current Cockpit Application.
- Cleanliness of your graphics and design
- User Experience of "Submission Viewer"
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
All Requested Contest 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 file.
Final Fixes
As part of the final fixes phase you may be asked to modify your graphics (sizes or colors) or modify overall colors.
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.