Challenge Summary
Welcome to OPM Storyboards Contest Part 4. We need you to design pages for a business web application following an existing design. This contest is focused on designing reports and dialog windows.
Round 1
For your R1 deliverables please submit the following reports:
1) Account Details > Print Statement (Reprint statement per earlier email)
2) Account Details > Billing Summary > Print Final Statement
3) Account Details > Payment History > Payment Receipt
5) Suspense > History
6) Approval > Pending Payments > View Audit Trail
9) Tools > Printing Tools > Show Sample Initial Statement for Current Account
11) Admin > Payment Invoices
12) Admin > Initial Bill Invoices
14) Admin > Stop ACH Letters
Feel free to add some notes (jpg or text file) to comment your design features for the client.
Number your screens (01, 02, 03 etc.) – it’s easier to review.
Round 2
Final design will contain all the requested reports plus any updates from client feedback.
1) Account Details > Print Statement (Reprint statement per earlier email)
2) Account Details > Billing Summary > Print Final Statement
3) Account Details > Payment History > Payment Receipt
4) Suspense > Print
5) Suspense > History
6) Approval > Pending Payments > View Audit Trail
7) Approval > Interest Adjustments > View Audit Trail
8) Approval > Payment Moves > View Audit Trail
9) Tools > Printing Tools > Show Sample Initial Statement for Current Account
10) Tools > Printing Tools > Print Charge Card for Records Search
11) Admin > Payment Invoices
12) Admin > Initial Bill Invoices
13) Admin > Reversal Invoices
14) Admin > Stop ACH Letters
15) Admin > Refund Memos
16) Admin > Interest Rates
17) Admin > Holidays
Feel free to add some notes (jpg or text file) to comment your design features for the client.
Number your screens (01, 02, 03 etc.) – it’s easier to review.
The primary goal of this contest is to design the look and feel of the OPM legacy application. We provide you with an existing design for branding guidance, so you need to design other pages to complete the application from the wireframes.
This contest is focused on designing report pages. You are provided with PDF reports; you must turn them into web design reports, very clean, easy to read and useful.
About OPM
The Office of Personnel Management (OPM) has an existing legacy application called the Service Credit Redeposit/Deposit System (SCRD).
The mission of the SCRD is to compute deposits and re-deposits, create an initial bill, post payments, and send out receipts to federal employees for periods of federal employment service that were either not covered by retirement deductions (deposits), or were covered and later refunded by the federal government (re-deposits). The SCRD must be a flexible system that can be easily updated or modified for ongoing legislative mandates and must be able to provide robust accounting tools for posting and adjusting payments.
Branding and Guidelines
- Follow the same color palette from the provided design.
- Use web-safe fonts for the pages content. Beware of declaring your fonts according to the Studio font’s policies.
- Your design must meet the Section 508 requirements (see below).
Storyboard Requirements
The mapping document (OPM_APP_ReportsMap.xlsx) shows where the report is located in the wireframes/storyboards and what the associated PDF is (Reports.zip).
Overall
- You will design reports and dialog screens only.
- There is an empty Report Placeholder designed already (see 07-Report-Viewer.png at Storyboards part1 for instance). All reports are displayed inside this dialog (don't modify it, use the same window with its components).
- The dialog width must not exceed 900 pixels width and 700 pixels height BUT keep in mind all report dialog windows must share the same width to have consistency. Use scrolling if necessary to show all the report content (some of them have several pages in the PDF files).
- You must display a printer-friendly version for each report. See “Print” button on the report placeholder, when the user clicks this button it opens a standalone page with simple visual style for printing. See this article for reference (click on the print button).
1) Account Details > Print Statement (Reprint statement per earlier email)
2) Account Details > Billing Summary > Print Final Statement
3) Account Details > Payment History > Payment Receipt
4) Suspense > Print
5) Suspense > History
6) Approval > Pending Payments > View Audit Trail
7) Approval > Interest Adjustments > View Audit Trail
8) Approval > Payment Moves > View Audit Trail
9) Tools > Printing Tools > Show Sample Initial Statement for Current Account
10) Tools > Printing Tools > Print Charge Card for Records Search
11) Admin > Payment Invoices
12) Admin > Initial Bill Invoices
13) Admin > Reversal Invoices
14) Admin > Stop ACH Letters
15) Admin > Refund Memos
16) Admin > Interest Rates
17) Admin > Holidays
*Notice that the provided Storyboards don’t show the Admin pages (11-17). For these ones just display the reports over any page of the application.
Section 508 Guidelines
There are government standards for applications regarding to accessibility. Your design must meet the following requirements:
- Color coding shall not be used as the only means of conveying information, indicating an action, prompting a response, or distinguishing a visual element.
- Web pages shall be designed so that all information conveyed with color is also available without color, for example from context or markup.
- Row and column headers shall be identified for data tables.
- Foreground and background color combinations should provide sufficient contrast.
About CCA Contests
- CCA (Competition Confidentiality Agreement) is required for this contest. If you don’t have a signed CCA on file you need to follow these instructions and then request for the access: http://apps.topcoder.com/wiki/display/tc/Competition+Confidentiality+Agreement+%28CCA%29
- If you have a signed CCA on file, send the access request for this project to: support@topcoder.com.
Target Audience
Internal OPM users/employees. This will not be a public facing web application.
Judging Criteria
- Section 508 Compliance.
- Originality.
- Design execution 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.