BONUS: 5‌ CHECKPOINTS AWARDED WORTH ‌$75‌ EACH

Register
Submit a solution
The challenge is finished.

Challenge Summary

Welcome to Service Request Tool Storyboards Design Contest. You are required to design the look and feel of a business web application, dashboard style. We are providing visual guidelines and an application sample for you to design.

Round 1

For your R1 deliverables please submit the following screens:
1) Service Requests (Draft/Submitted Tabs)
3) Service Request Details (Submitted)
4) Create Request
4.1) Project Info
4.2) Service Request Info
4.3) Services / Activities
4.3.1) Infrastructure
4.4) Review

Round 2

Final design will contain all the requested screens plus any updates from client feedback.
1) Service Requests (Draft/Submitted Tabs)
2) Service Request Details (Draft)
3) Service Request Details (Submitted)
4) Create Request (All 4 steps and sub-steps)
4.1) Project Info
4.2) Service Request Info
4.3) Services / Activities
4.3.1) Infrastructure
4.3.2) Unified
4.3.3) Mainframe
4.3.4) BC
4.4) Review
5) Edit Request


Our pre-sales user’s productivity is essential to our organizations success.  They need a tool to assist them in quickly generating request for services quotes to an internal team of quoting experts. Due to the high volume of customers and projects they need a clean and efficient tool that will allow them to quickly enter in the necessary information needed to generate quote requests for a large number of services.

The primary goal of this contest is to design the look and feel of a web application which has very defined guidelines and the look is dashboard oriented, for business purposes. You are provided with another application that uses the same guidelines as a start point. However, it’s recommended you go through the guidelines to have a clear perception of the visual style.

Branding and Guidelines
- SRT_Wireframes.zip contains the layout/content guidance.
- ECUEv3.pdf contains strict guidelines you need to follow through in order to provide the business corporate identity, such as colors, graphics, tabs, icons, navigation, alerts, UI elements, and so on.
- See ECUE_SampleApp.zip for reference about how ECUE looks. You can re-use any UI components from these storyboards. In fact, it should be your starting point.
- Icons.zip is a compliment to the ECUE guidelines. You need to use every elements from this graphics set. In case you need to design something new that is not in this set please follow the same style.
- Use a logo placeholder for the application.
- Screen resolution width should work fine at 1000 pixels. Since this is a dashboard style UI it should adjust to any possible width, larger or lower than 1000 pixels; but the minimum amount to be supported is 1000 pixels.
- Use web-safe fonts for the pages content. Declare your fonts according to the Studio font’s policies.
- Show all the hover states for all the UI elements you create (buttons, hyperlinks, dropdowns, etc).

Storyboard Requirements
Overall
- Interact with the wireframes and make sure to show all the different actions from the UI. Click checkboxes from services activities, see how add/delete buttons work, and so on.
- Make sure to display UI form errors.
- Make sure to display UI form success messages.
- We don’t want a cluttered user interface that doesn’t expand well with the screen user interface and we don’t want a mass of modal dialogs that the user has to wade through. t

1) Service Requests (Draft/Submitted Tabs)
- Design “Service Requests – Draft” and “Service Requests - Submitted”from wireframes.
- They are essentially the same with a very slight variation (one field on the table).
- Show row selected style.

2) Service Request Details (Draft)
- Design “Service Request Details - Draft” from wireframes.

3) Service Request Details (Submitted)
- Design “Service Request Details - Submitted” from wireframes.
- Same as #2 with a very slight variation.

4) Create Request (All 4 steps and sub-steps)
- Cover “Create Request - Step 1” through “Create Request - Step 4” from wireframes.
- Design screens for all the sub pages:
4.1) Project Info
4.2) Service Request Info
4.3) Services / Activities (make sure to click every checkbox from the services to see how the form behaves according to the actions)
4.3.1) Infrastructure
4.3.2) Unified
4.3.3) Mainframe
4.3.4) BC
4.4) Review.

5) Edit Request
- Design “Edit Request - Step 1” from wireframes.
- Basically, same as #4 with pre-loaded data and edit features.


Target Audience
Our users are highly specialized technical users.

Judging Criteria
- Consistency with the provided guidelines reference.
- Quality.
- User Experience.

Submission File
All requested contest requirements/screens as JPG or PNG files at 72dpi.

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 a 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.

Stock Photography

Stock photography is not allowed in this challenge. All submitted elements must be designed solely by you. See this page for more details.

How To Submit

  • New to Studio? ‌Learn how to compete here
  • Upload your submission in three parts (Learn more here). Your design should be finalized and should contain only a single design concept (do not include multiple designs in a single submission).
  • If your submission wins, your source files must be correct and “Final Fixes” (if applicable) must be completed before payment can be released.
  • You may submit as many times as you'd like during the submission phase, but only the number of files listed above in the Submission Limit that you rank the highest will be considered. You can change the order of your submissions at any time during the submission phase. If you make revisions to your design, please delete submissions you are replacing.

Winner Selection

Submissions are viewable to the client as they are entered into the challenge. Winners are selected by the client and are chosen solely at the client's discretion.

ELIGIBLE EVENTS:

2014 TopCoder(R) Open

Challenge links

Screening Scorecard

Submission format

Your Design Files:

  1. Look for instructions in this challenge regarding what files to provide.
  2. Place your submission files into a "Submission.zip" file.
  3. Place all of your source files into a "Source.zip" file.
  4. Declare your fonts, stock photos, and icons in a "Declaration.txt" file.
  5. Create a JPG preview file.
  6. Place the 4 files you just created into a single zip file. This will be what you upload.

Trouble formatting your submission or want to learn more? ‌Read the FAQ.

Fonts, Stock Photos, and Icons:

All fonts, stock photos, and icons within your design must be declared when you submit. DO NOT include any 3rd party files in your submission or source files. Read about the policy.

Screening:

All submissions are screened for eligibility before the challenge holder picks winners. Don't let your hard work go to waste. Learn more about how to  pass screening.

Challenge links

Questions? ‌Ask in the Challenge Discussion Forums.

Source files

  • Layered PSD files created in Adobe Photoshop or similar

You must include all source files with your submission.

Submission limit

5 submissions

ID: 30035222