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

Register
Submit a solution
The challenge is finished.

Challenge Summary

Welcome to the  "DViz - Data Feasibility Dashboard Design Concepts Challenge".

In this challenge, we are looking for you to come up with a design for a web application tool that will provide summary statistics in a dashboard for assessing the feasibility of specific data sets. This dashboard will be created using JavaScript.

Read the challenge specification carefully and watch the forums for any questions or feedback concerning this challenge. Let us know if you have any questions in the challenge forum!
We are really excited to kick off this DViz Design Concepts Challenge.

CHALLENGE OBJECTIVES

  • Web Application
  • 3 Desktop Screens

Round 1

Submit your initial designs for a checkpoint feedback

  • As part of your checkpoint submission, you must upload your submission to MarvelApp so we can provide direct feedback on your designs. Please include the MarvelApp URL in your notes.txt
  • Make sure all pages have the correct flow. Use the proper file numbers, (1, 2, 3, etc.)

Round 2

Submit your final designs with all checkpoint feedback implemented.

  • As part of your Final submission, you must replace your checkpoint submission with the final submission into MarvelApp so we can provide direct feedback on your designs. Please include the MarvelApp URL in your notes.txt
  • Make sure all pages have the correct flow. Use the proper file numbers, (1, 2, 3, etc.)
  • If you're not submitting in the Checkpoint/Round 1, you are not eligible to submit in the Final/Round 2

~
CHALLENGE DETAILS

OVERVIEW:
The main purpose of the Data Selection Tool is to enable users (mainly researchers) to search and compare relevant data sets for their purposes. Ex. Researcher(s) need to find good data sets on psoriatic arthritis, that have at least x number of patient records. The goal is to enable this search without fully querying the data set, which is more than 1TB large in some cases. So, this tool will show summary statistics of each data set, pulling from a smaller, descriptive data summary set prepared by the customer. This will allow the search to happen faster with less burden on their infrastructure than pulling the entire data source.

Customer expects to have two main functions for this tool:
Firstly it should allow the users to input search parameters from a menu and return a list of relevant data sources. They can explore each individually and are also able to view the summary statistics.
The second function doesn't allow user input in the search. It simply allows the user to compare known data sets, again viewing the data set summary, but now you can view three datasets side by side. Again, this is a view only of the summary for each data set side-by-side, no manipulation or integration of the data. 

In short, the data selection tool would provide easy access views to 20-30 data sources managed within the client’s environment, allowing users to quickly assess feasibility of specific data sets for their purposes. Rather than display all data, views will provide ‘summary statistics’ that characterize selected data sources based on attributes like patient count, contains patient data (y/n), etc.

AUDIENCE:
Data scientists, Business owners, Individual users

USER STORY
Amy is a new researcher at a top pharmaceutical company. The company she is employed with has been developing a lot of products for the different therapeutic areas. Currently, she is working on research and it requires her to find the list of patients who were diagnosed with psoriatic arthritis, was treated with product x, and has at least 400 patient records. She is worried about how she will be able to search through a huge amount of data and discuss it with her colleague - one of her colleagues informs about the new data selection tool which will help speed up the process of retrieving required data.

  • She immediately opens the portal
  • On the landing page, she is onboarded with instructions on how to use it
  • She finds a couple of ways to find the data / one is a predefined filter and another one is the user-defined filter
  • She understands that user-defined filters are the way to go in order to find the required data
  • She is able to enter all the required criteria, choose datasets, and enter the year/month range for which the data will be fetched.
  • On clicking the search button, she is displayed with summary statistics of each data set along with visualizations, pulling from a smaller, descriptive data summary set prepared by the customer.
  • And she is able to download the data as a CSV file
  • She is delighted by the fact that the portal looked simple and very easy to use.


DESIGN GOALS & PRINCIPLES
Below are some of the goals:

  • These datasets require a design that can display a lot of table data, in lots of rows.  While this is true, try not to have too much information on your screen, you can make them compelling by making the visualization interactive and enable users to walk through or drill into the different insights.
  • Elegant, clean, simple, user-centered look and feel with modern aesthetics
  • Use color, visual comparison, and drill-down charts to highlight comparison.
  • The overall design and user experience
  • Engaging and easy-to-use/interact UI
  • How well does your design align with the objectives of the challenge

EXPLORATION SCORE
In terms of expectations, we would like to measure the concept against the following in the one to ten scales (ask the client to rate each of the parameters):

Creativity: 10
1: barely new ideas
10: a utopic product but with features that can be fully implemented

Aesthetics: 8
1: low-fidelity design, wireframe or plain sketch
10: top-notch finished looking visual design

Exploration: 8
1: strictly follow an existing reference or production guideline
10: open to alternative workflows/features not listed here that would help the overall application

Branding: 6
1: don’t care at all about the branding just functionality
10: without a properly branded product there is no success

BRANDING GUIDELINES
There are no specific branding guidelines.  Clean designs are highly valued.  Users are in healthcare, are looking at a LOT of data, are thinking about math, and value clarity.

TARGET DEVICE
- Desktop: 1366px width and height 768px

SCREEN REQUIREMENTS
1) Filter/Choose Criteria

  • This will be the landing screen, include in your design any onboarding help that provides an interactive walkthrough on how to use the app.
  • User will be able to generate the dashboard visualization using couple of ways:

Pre-Defined Criteria:

  • Users will be able to select the pre-defined filter. This will have a set of attributes that is already selected based on the predefined filter and a visualization is generated based on that.
  • Examples of Pre-Defined Search Criteria:
    • Records of total patient counts
    • Continuous Enrollment
    • Look Backward (days)
    • Minimum Diagnosis Count
    • Two Diagnoses At Least 30 days Apart
    • Two Diagnoses < 365 days apart
    • Look Forward (days)

Custom User Search/Criteria:

  • Users will be able to select the required attributes and generate a report based on the selected criteria
  • User will be able to search and include filter options:
    • Gender: Male, Female and Undefined
    • Age Range: Below 18, 18-49, 50-64, 65-74, 75 & above
    • Ethnicity: White, Black, Asian, Hispanic, Native American & Other
    • Geography: North America, ‘Europe, Middle East & Africa’, Asia Pacific, Latin America
    • Year/Month range

2) Dashboard:
Once the user chooses the above criteria which could be either a pre-defined criteria or a custom user defined criteria, the dashboard visualization is generated

Overview

  • User chooses the Datasets
  • Search results will be shown on a dashboard with various visualizations/Statistics
    • # Patient Lives
    • # Men, # Women, # Unknown
    • Patient metrics by race/ethnicity
    • Patient Age by admission
    • Show the distribution in a map
    • Diagnosis Name table and Product Name table
    • Provide a way for the user to download the data as CSV

Compare:

  • Users will be able to compare the statistics from different datasets.
  • Provide a way for the user to choose multiple datasets and then compare their statistics.
  • We would like to see side by side comparison of the chosen dataset and each data set will be for different diseases 
  • We need to show comparison visualization for these attributes:
    • Show the total count of patients for a particular disease
    • You can show it as a numerical value or as a chart?
    • Show the breakdown of the age of the patients
      • Range: Below 18, 18-49, 50-64, 65-74, 75 & above
      • You can show a pie chart, etc
  • Show a comparison by gender, race, product, biologic
    • Gender: Male, Female and Undefined
    • Ethnicity/Race: White, Black, Asian, Hispanic, Native American & Other
    • Geography: North America, ‘Europe, Middle East & Africa’, Asia Pacific, Latin America
    • Product: Use dummy values for now (product 1, product 2...product n)
    • Biologic Treated: Show the breakdown of how the patient was treated “biologic treated, conventionally treated, or untreated”. 
    • All the above can be visualizations, you can show it as a bar-chart, it's up to you?
Diagnoses
  • Show the list of diagnosis, ICD-9, ICD-10
  • ICD means International Classification of diseases (revision 9 and 10) - it defines disease types, etc. Showing that list of diagnoses ICD-9 and ICD-10 will help customers understand.
  • Product names will have a list of particular products developed by the customer to treat that particular disease
  • Provide a way for the user to download the data as CSV

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
- Please also provide designs for common chart types, like Pie, Bar, and Line Graphs.  These will be implemented in later phases and while the data they would represent is not fully determined at this time, it will be later, and it will be important to work from a common design at that time.

MARVEL PROTOTYPE
- We need you to upload your screens to Marvel App
- Please request for marvel app in the challenge forum
- You MUST include your Marvel app URL (in your marvel app prototype, click on share and then copy the link & share it with your notes/comment on this link while you upload)

SUBMISSION AND SOURCE FILES
Submission File
Submit all JPG/PNG image files based on Challenge submission requirements stated above

Source File
All source files of all graphics created in either Adobe XD or Sketch or Figma and saved as an editable layer

Declaration File 
Declaration files document contains the following information:
- Stock Photos Name and Source Links from an allowed sources
- Stock Art/Icons Name and Source Links from an allowed sources
- Fonts Name and Source Links source from an allowed sources
- MarvelApp share link for review

FINAL FIXES
As part of the final fixes phase, you may be asked to modify content or user click paths

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.

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:

2021 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
  • Sketch
  • Adobe XD
  • Figma

You must include all source files with your submission.

Submission limit

5 submissions

ID: 30150783