Challenge Summary
Welcome to "ITE - Operations Management Console Design Concepts Challenge". In this challenge, we are looking to redesign an existing web application that is being used for planning, monitoring, and controlling the test cycle executions.
The customer of this challenge is looking for the help of topcoder design community to improve the overall user experience, we would like to get better ideas for the look and feel (UI) for the application.
We are really excited to see your designs for this challenge.
01 OMC Homepage
02 Plan - Create Test Iteration
03 Plan - Configuration Stops
04 Plan - Configure Ctrl M based Apps
05 Plan - Feed Configuration
06 Plan - Finalize Functionality
- As a part of your checkpoint submission, you must upload your submission to MarvelApp so we can provide direct feedback on your designs.
- Make sure to include a URL/comment the link to your marvelapp while uploading your submission
- Make sure all pages have correct flow! Use correct file numbering. (00, 01, 02, 03)
01 OMC Homepage
02 Plan - Create Test Iteration
03 Plan - Configuration Stops
04 Plan - Configure Ctrl M based Apps
05 Plan - Feed Configuration
06 Plan - Finalize Functionality
07 Monitor - Control/stops
08 Monitor/Control Feeds
- As a part of your checkpoint submission, you must upload your submission to MarvelApp so we can provide direct feedback on your designs.
- Make sure to include a URL/comment the link to your marvelapp while uploading your submission
- Make sure all pages have correct flow! Use correct file numbering. (00, 01, 02, 03)
This application helps us perform the following:
- Test cycle iteration planning
- Test cycle monitoring and controlling
- Real-time status tracking of test cycle execution
- Application Availability
Design Considerations
- We are looking for simple, easy-to-use, intuitive, modern design.
- Think about improving the user experience of the existing application (screenshots provided).
- Have your designs of size: 1366 x 768px
- There are no branding guidelines, at the checkpoint, we might have some direction from the client.
- We are sharing a wireframe reference to help you get started, please make sure you are NOT copying the provided wireframes!
Required Designs:
We need below screens to be designed
00 Logo, Navigation:
- Include a placeholder logo
- For navigation, please include these “Home, Iteration Manager and Monitor Control”
01 OMC Homepage:
- This is the landing page for the users once they login into the application.
- We are open to your thoughts on how things to arranged and if it helps us improve the user experience.
OMC:
- Ability to display the status of high-level steps that constitutes the test iteration, the status should be real time.
- This shows the chain of dates and clicking on each date reveals more details about the iteration
Testing Calendar:
- This shows the list of upcoming iterations
- Testing Calendar showing future testing schedule - dates and test cycle description
Status of application Availability:
- Each application will have a color code and clicking on an application will reveal more details about the list of components within and their individual status which is indicated with a color code (green or red).
- This just shows the ability to track application components by showing their status.
- Each application can have a different number of application components. For example, application1 could have 1 component within it, application2 can have 5 components within it and so on. So, the overall status of the application is indicated by color codes (red, yellow and green).
- Ability to display real-time notifications to authorized users.
02 Iteration Manager
- This page allows the user to manage the iterations.
- It will allow choosing an existing iteration for configuring.
- Also, will allow the user to create a new iteration.
02 1 Plan - Create Test Iteration:
- This page allows users to create Test iteration & relevant dates.
- Only authorized users to be able to create iteration by providing “Iteration name, Business date, Testing dates & planning dates”.
- Once iteration is created, the user should be able to search for it and start configuring the same.
03 Plan - Configuration Stops:
- These are the stops that will be executed once iteration has been finalized.
- Ability to upload iteration plan in “Excel” format
- The user should be able to add new “stops” or modify/delete existing ones
- Each of the stops will have/include below details:
- - Type (Manual/Auto),
- - Business Date, Scheduled Date
- - Name, Description, Owner, Dependency
- Provide the flexibility for the user to copy, move or delete existing “stops”
- Type = Manual vs Auto
- - - In Manual Mode, application execution flow is expected to stop during the manual stop. This should occur after all preceding steps are completed.
- - - In Auto mode, the system automatically executes a script when an event happens
- After saving the stops, the user should be able to retrieve the form again in its current state until its finalized (finalization of stops happens in 06 Plan - Finalize Functionality- please see below).
Dependency
- Stops can only be configured against a chosen Test Iterations
04 Plan - Configure Ctrl M based Apps:
- The purpose of this page is to configure applications & relevant details associated with the given Test iteration.
- Only Authorized user should be able to choose Application name, control-m folders & execution schedule - start/end time
- After saving the details, the user should be able to retrieve the form again in its current state until its finalized
Dependency
- This can only be configured against a chosen Test Iteration
- Application name and Control-M folders should be available as a part of drop down
05 Plan - Feed Configuration:
- The purpose of this page is to configure feeds required for given Test Iteration
- On load, The form to be pre-populated with last saved configurations
- Authorized user should be able to modify
- - Priority ( i.e. sequence in which feeds will be processed )
- - Respective application & Feed names
- - Indicators flags for “cyclic feeds”, “Source (prod vs Test)” and “Ignore/Applicable”
- - Source and Destination paths
- After saving the details, the user should be able to retrieve the form again in its current state until its finalized
- The form should have added features like “clear rows”, “Save all” etc
Dependency
- This can only be configured against a chosen Test Iteration
- Application name DB tables should be created in advance
06 Plan - Finalize Functionality:
- The Purpose of this page is to freeze any user from making any further changes to the given Test Iteration
- On load, The form to be pre-populated with last saved configurations in read-only mode
- Authorized user should be able to traverse through all the information so far associated with the Test Iteration
- The user should be able to freeze or finalize the changes
- Once finalized, Test Iteration name should not be visible in the drop-down. In other words, User should not be able to retrieve form again.
Dependency:
- This can only be done against a chosen Test Iteration
- The content of this form depends on what was configured via other tabs - “Stops”,
“Control-M” and “Feed Configuration”.
07 Monitor - Control/stops:
Once the user freezes the steps in iteration by doing the final step in 06 Plan - Finalize Functionality, the user will start the execution of flow of applications configured in the test iteration.
- The Purpose of this is to Trigger execution flow of applications configured in specified Test Iteration. Control and Monitor the same
- The user will be able to choose an iteration to view the list of stops (these are the steps that were configured in 03 and 04 of planning)
- After choosing an iteration, the user will have the ability to trigger the iteration flow (start button), force complete and restart it from scratch.
In the list, the user will see these columns “Status, Executions, Business Time, Scheduled Time, Name and Actions”
- For actions column: the user will be able to start a task and if the process has started, it will have an option to “Mark it as complete”. Once the job is completed, in the next row, user can see the “Start” button.
- Executions will open another page where the user can see the monitor the status of control-M jobs (please see 07 1)
07 1 Control-M Jobs:
- Ability to monitor & control all the control-M jobs that arrive before any given “Stop”
- Ability to Re-Run and forcefully complete failed control-M job
- Ability to mark the “Stop” as complete
Dependency
- This can only be done against a chosen Test Iteration
- The content of this form depends on what was configured via other tabs - “Stops”, “Control-M” and “Feed Configuration”.
08 Monitor/Control Feeds:
- The Purpose of this page is to monitor feed processing status.
- Note: This is a read-only view
Dependency
- This can only be done against a chosen Test Iteration
- The content of this form depends on what was configured via other tabs – “Feed Configuration”
Important:
- Keep things consistent. This means all graphics styles should work together.
- All of the graphics should have a similar feel and general aesthetic appearance.
- Focus on User Experience / how the user interacts within the dashboard.
MarvelApp Prototype
- We need you to upload your screens to Marvelapp
- Please send your Marvel app request to csystic@gmail.com (Challenge Copilot)
- You MUST include your Marvel app URL in notes /comments while uploading (in your marvel app prototype, click on share and then copy the link & share it within your notes while you upload).
Target Audience
- Operational team
- QA management
Judging Criteria
-How well you plan the user experience and capture your ideas visually.
- Cleanliness of your graphics and design.
- Overall design, UI and user experience.
- Consistency across the UX/UI
- How well you interpret the example screens (business relevance) and show us new ideas and concepts.
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
- Submit Marvelapp as part of your submission.
Source Files
All original source files of the submitted design. Files should be created in Adobe Photoshop, Illustrator, XD, or Sketch!
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.
The customer of this challenge is looking for the help of topcoder design community to improve the overall user experience, we would like to get better ideas for the look and feel (UI) for the application.
We are really excited to see your designs for this challenge.
Round 1
Submit your initial designs for a checkpoint feedback01 OMC Homepage
02 Plan - Create Test Iteration
03 Plan - Configuration Stops
04 Plan - Configure Ctrl M based Apps
05 Plan - Feed Configuration
06 Plan - Finalize Functionality
- As a part of your checkpoint submission, you must upload your submission to MarvelApp so we can provide direct feedback on your designs.
- Make sure to include a URL/comment the link to your marvelapp while uploading your submission
- Make sure all pages have correct flow! Use correct file numbering. (00, 01, 02, 03)
Round 2
Submit your final designs with all checkpoint feedback implemented.01 OMC Homepage
02 Plan - Create Test Iteration
03 Plan - Configuration Stops
04 Plan - Configure Ctrl M based Apps
05 Plan - Feed Configuration
06 Plan - Finalize Functionality
07 Monitor - Control/stops
08 Monitor/Control Feeds
- As a part of your checkpoint submission, you must upload your submission to MarvelApp so we can provide direct feedback on your designs.
- Make sure to include a URL/comment the link to your marvelapp while uploading your submission
- Make sure all pages have correct flow! Use correct file numbering. (00, 01, 02, 03)
This application helps us perform the following:
- Test cycle iteration planning
- Test cycle monitoring and controlling
- Real-time status tracking of test cycle execution
- Application Availability
Design Considerations
- We are looking for simple, easy-to-use, intuitive, modern design.
- Think about improving the user experience of the existing application (screenshots provided).
- Have your designs of size: 1366 x 768px
- There are no branding guidelines, at the checkpoint, we might have some direction from the client.
- We are sharing a wireframe reference to help you get started, please make sure you are NOT copying the provided wireframes!
Required Designs:
We need below screens to be designed
00 Logo, Navigation:
- Include a placeholder logo
- For navigation, please include these “Home, Iteration Manager and Monitor Control”
01 OMC Homepage:
- This is the landing page for the users once they login into the application.
- We are open to your thoughts on how things to arranged and if it helps us improve the user experience.
OMC:
- Ability to display the status of high-level steps that constitutes the test iteration, the status should be real time.
- This shows the chain of dates and clicking on each date reveals more details about the iteration
Testing Calendar:
- This shows the list of upcoming iterations
- Testing Calendar showing future testing schedule - dates and test cycle description
Status of application Availability:
- Each application will have a color code and clicking on an application will reveal more details about the list of components within and their individual status which is indicated with a color code (green or red).
- This just shows the ability to track application components by showing their status.
- Each application can have a different number of application components. For example, application1 could have 1 component within it, application2 can have 5 components within it and so on. So, the overall status of the application is indicated by color codes (red, yellow and green).
- Ability to display real-time notifications to authorized users.
02 Iteration Manager
- This page allows the user to manage the iterations.
- It will allow choosing an existing iteration for configuring.
- Also, will allow the user to create a new iteration.
02 1 Plan - Create Test Iteration:
- This page allows users to create Test iteration & relevant dates.
- Only authorized users to be able to create iteration by providing “Iteration name, Business date, Testing dates & planning dates”.
- Once iteration is created, the user should be able to search for it and start configuring the same.
03 Plan - Configuration Stops:
- These are the stops that will be executed once iteration has been finalized.
- Ability to upload iteration plan in “Excel” format
- The user should be able to add new “stops” or modify/delete existing ones
- Each of the stops will have/include below details:
- - Type (Manual/Auto),
- - Business Date, Scheduled Date
- - Name, Description, Owner, Dependency
- Provide the flexibility for the user to copy, move or delete existing “stops”
- Type = Manual vs Auto
- - - In Manual Mode, application execution flow is expected to stop during the manual stop. This should occur after all preceding steps are completed.
- - - In Auto mode, the system automatically executes a script when an event happens
- After saving the stops, the user should be able to retrieve the form again in its current state until its finalized (finalization of stops happens in 06 Plan - Finalize Functionality- please see below).
Dependency
- Stops can only be configured against a chosen Test Iterations
04 Plan - Configure Ctrl M based Apps:
- The purpose of this page is to configure applications & relevant details associated with the given Test iteration.
- Only Authorized user should be able to choose Application name, control-m folders & execution schedule - start/end time
- After saving the details, the user should be able to retrieve the form again in its current state until its finalized
Dependency
- This can only be configured against a chosen Test Iteration
- Application name and Control-M folders should be available as a part of drop down
05 Plan - Feed Configuration:
- The purpose of this page is to configure feeds required for given Test Iteration
- On load, The form to be pre-populated with last saved configurations
- Authorized user should be able to modify
- - Priority ( i.e. sequence in which feeds will be processed )
- - Respective application & Feed names
- - Indicators flags for “cyclic feeds”, “Source (prod vs Test)” and “Ignore/Applicable”
- - Source and Destination paths
- After saving the details, the user should be able to retrieve the form again in its current state until its finalized
- The form should have added features like “clear rows”, “Save all” etc
Dependency
- This can only be configured against a chosen Test Iteration
- Application name DB tables should be created in advance
06 Plan - Finalize Functionality:
- The Purpose of this page is to freeze any user from making any further changes to the given Test Iteration
- On load, The form to be pre-populated with last saved configurations in read-only mode
- Authorized user should be able to traverse through all the information so far associated with the Test Iteration
- The user should be able to freeze or finalize the changes
- Once finalized, Test Iteration name should not be visible in the drop-down. In other words, User should not be able to retrieve form again.
Dependency:
- This can only be done against a chosen Test Iteration
- The content of this form depends on what was configured via other tabs - “Stops”,
“Control-M” and “Feed Configuration”.
07 Monitor - Control/stops:
Once the user freezes the steps in iteration by doing the final step in 06 Plan - Finalize Functionality, the user will start the execution of flow of applications configured in the test iteration.
- The Purpose of this is to Trigger execution flow of applications configured in specified Test Iteration. Control and Monitor the same
- The user will be able to choose an iteration to view the list of stops (these are the steps that were configured in 03 and 04 of planning)
- After choosing an iteration, the user will have the ability to trigger the iteration flow (start button), force complete and restart it from scratch.
In the list, the user will see these columns “Status, Executions, Business Time, Scheduled Time, Name and Actions”
- For actions column: the user will be able to start a task and if the process has started, it will have an option to “Mark it as complete”. Once the job is completed, in the next row, user can see the “Start” button.
- Executions will open another page where the user can see the monitor the status of control-M jobs (please see 07 1)
07 1 Control-M Jobs:
- Ability to monitor & control all the control-M jobs that arrive before any given “Stop”
- Ability to Re-Run and forcefully complete failed control-M job
- Ability to mark the “Stop” as complete
Dependency
- This can only be done against a chosen Test Iteration
- The content of this form depends on what was configured via other tabs - “Stops”, “Control-M” and “Feed Configuration”.
08 Monitor/Control Feeds:
- The Purpose of this page is to monitor feed processing status.
- Note: This is a read-only view
Dependency
- This can only be done against a chosen Test Iteration
- The content of this form depends on what was configured via other tabs – “Feed Configuration”
Important:
- Keep things consistent. This means all graphics styles should work together.
- All of the graphics should have a similar feel and general aesthetic appearance.
- Focus on User Experience / how the user interacts within the dashboard.
MarvelApp Prototype
- We need you to upload your screens to Marvelapp
- Please send your Marvel app request to csystic@gmail.com (Challenge Copilot)
- You MUST include your Marvel app URL in notes /comments while uploading (in your marvel app prototype, click on share and then copy the link & share it within your notes while you upload).
Target Audience
- Operational team
- QA management
Judging Criteria
-How well you plan the user experience and capture your ideas visually.
- Cleanliness of your graphics and design.
- Overall design, UI and user experience.
- Consistency across the UX/UI
- How well you interpret the example screens (business relevance) and show us new ideas and concepts.
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
- Submit Marvelapp as part of your submission.
Source Files
All original source files of the submitted design. Files should be created in Adobe Photoshop, Illustrator, XD, or Sketch!
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.