Challenge Summary
Welcome to [topcoder] – New Challenge Creation and Launch Design Challenge. Current methods for creating and launching a [topcoder] challenge can be … well.. Challenging at times. We would like to do something about that! Please help us refine the interface, and the very process, of defining a challenge. We’d like to add all kinds of helpful cues to the experience, so that anyone — [topcoder] copilots, end-customers or Appirio employees — can quickly, easily and accurately spin up good challenges. (What is a good challenge? One that is clear, complete and succeeds in building adequate interest from the community.) This work will be vital to the ongoing growth and development of [topcoder] -- here’s your chance to make a big impact on the [topcoder] platform!
You are provided with wireframes and Appirio branding guidelines for you as guidance for branding and visual reference. Come and join us!
Round 1
For your R1 deliverables please submit the following screens:
1. Summary Section
2. Project Requirements Section
3. Technologies Section
7. Challenge Map
- If you have time - please provide us with a click map for your design.
- Readme.jpg : Provide notes about your submission.
- Make sure all pages have correct flow! Use correct file numbering. (00, 01, 02, 03)
Round 2
Final Design plus any Checkpoint feedback:
1. Summary Section
2. Project Requirements Section
3. Technologies Section
4. Starting Material Section
5. Timeline Section
6. Prizes Section
7. Challenge Map
- If you have time - please provide us with a click map for your design.
- Readme.jpg : Provide notes about your submission.
- Make sure all pages have correct flow! Use correct file numbering. (00, 01, 02, 03)
Challenge Details:
The primary goal of this challenge is to make it possible for primarily an Appirio community customer or other interested party that wants to create and launch [topcoder] challenges to be able to easily complete that process without more than minimal knowledge of the community and/or it’s process. The challenge creation and launch process should be easy to understand (e.g. be self-service and not require training), should be possible to complete quickly without assistance (in under 15 minutes), should be flexible and allow those with greater expertise to have access to control more settings, and should generate challenges that successfully garner interest from the community including generating many valid submissions.
Supporting Documents:
- Wireframes (Wireframe.zip)
- Appirio Application Framework (Storyboard.zip); use it also for branding guideline.
- Challenge map (challengemap.png)
Design Considerations:
- We are providing a clickable set of wireframes that comes close to describing the experience that we would like this UI to have. But we’d like to see the following changes:
-- We would like the process to contained in a single, scrolling page, with form separated into distinct sections.
-- There is an element to the right that we would like contestants to explore more fully: the ‘Challenge Map’; a floating element that follows the user down the page. It is present in the wireframes provided. It is described in more detail below as well.
- Design of this new process should integrate with the Appirio Application Framework. Please use the visual design of the header and footer from this framework, and use the remainder of the Framework (elements, widgets, controls) as inspiration for your own visual design of this form.
Required Screen Size:
- Desktop page of size 1024px width and height as required.
Required Features:
Note: A single-page form, with multiple sections of content for user to fill out. The section are listed below:
1) Summary Section:
Reference Wireframe summary.html
- “Describe Your Challenge” this section should contain 3 fields:
-- Challenge Name
-- Short Description (up to 120 characters)
-- Long Description
- Please use wireframe for inspiration. Feel free to diverge from / improve upon it.
2) Project Requirements Section:
Reference Wireframe requirements.html
- For this round of design, we do not need a lot of direction / guidance for this section (we’re going to run a second, specific, design challenge on the Requirements writing UI.) For now, please take guidance from this wireframe, and feel free to improve or innovate upon it.
- We do like the notion of a ‘Complexity Meter’ that rises / falls with the number of requirements that have been entered.
3) Technologies Section:
Reference Wireframe technical.html
- In this section, provide a simple UI for adding ‘Technologies’ to a challenge. These ‘Technology tags’ will ultimately be displayed to users, to assist them in finding / monitoring specific technologies or skills that they’re proficient in.
- There is a ‘Technology’ screen in the provided wireframes, but it feels somewhat cumbersome -- please suggest some lightweight / easier interactions for quickly capturing a set of technologies related to a challenge.
4) Starting Material Section:
Reference Wireframe guidance.html
- This is the section where challenge creators can upload supporting files / provide some guidance on what format the final deliverables should take.
- This wireframe provides some of that, but is somewhat incomplete. Use it as guidance, but please add the Following field:
-- Additional Guidance - this is a field that will be available to Challenge contestants only after they have registered for the challenge.
5) Timeline Section:
Reference Wireframe timeline.html
- This is the section where challenge creators can choose a starting date and select from a number of different timeframes to let a challenge run.
- We need the design to capture the following information:
-- Starting date and time
-- Timeframe.
Note: Please don’t include any information about milestone/checkpoints
- Use this wireframe as guidance, but feel free to refine / simplify it even further.
6) Prizes Section:
Reference Wireframe prizes.html
- This is the section where challenge creators can specify dollar-prize amounts for the challenge.
- It should be presented very simply:
-- The UI should easily accommodate prize amounts for 1st, 2nd, 3d places and have the ability to add additional prizes (4th-Nth place.)
-- Checkpoint prizes and for how many submissions.
- The provided wireframes feature a screen for prize amounts that is more complicated than necessary. You may review it for guidance, but please limits the featured elements to only what’s described above;
7) Challenge Map:
Reference challengemap.png
- This element ‘floats’ as user scrolls down the length of the challenge creation form. It provides an at-a-glance summary of progress (showing which sections have been completed, which have failed validation for some reason, and how many sections remain.
- Also nice-to-have for this element:
-- Provides navigation to each section - clicking on a section in the Challenge Map should jump the user to that section.
-- Provides visual feedback about which section user is current viewing.
- Please feel free to modify / improve / leverage any piece of challengemap.png design.
Target Audience:
- Customer technical resource
- Customer non-technical resource
- Appirio consultant
- Appirio management
- Appirio [topcoder] expert services resource
- [topcoder] co-pilot
Judging Criteria:
- How well you plan the user experience and capture your ideas visually
- Cleanliness of your graphics and design
- Your design should possible to build and make sense as a mobile application
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 for your submission files.
Source Files
All original source files of the submitted design. Files should be created in Adobe Photoshop and saved as layered PSD file, or Adobe Illustrator as a layered AI 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. We may ask you to update your design or graphics based on checkpoint feedback.
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.