• Compete
  • Learn
  • Community

    CxO Dashboard F2F Design Challenge




    The challenge is finished.
    Show Deadlines icon-arrow-up

    Challenge Summary

    Welcome to "CxO Dashboard F2F Design Challenge". In this F2F Design Challenge, we need your help to create several Dashboard screen variation for our CxO app. Read more details below and join us now!

    Note: This F2F will use the following format, the first submission that meets our requirements will win this challenge!!

    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.

    Full Description & Project Guide

    Background Overview
    Currently, our team presenting various data metrics in a powerpoint to senior management. These metrics data was created manually using chart features in powerpoint. Now, we want you to give us some automatic and creative way to represent the data which may include metrics, texts, etc via our CxO Dashboard app. All the dashboard details would be representing the 3 perspectives (run, change/grow, transform). These data representation then will be captured by our team (taking a screenshot) and then they will put the screenshot in powerpoint for presentation in front of our senior management. 

    Challenge Goal
    Create a neat, modern and simple dashboard and it's layout variation to present various data metrics.

    Note: This F2F will use the following format, the first submission that meets our requirements will win this challenge!! 

    Screen Requirements
    01. Input Data Screen
    - Before able to show the dashboard metrics with value on it, we need a screen where our user will enter some input to get the data processed by the app
    - we need to imagine the input required to generate those metrics in other pages. For now, let's create a set of dummy form fields and provide submit button on this screen
    - Before goes to the dashboard page, the user will be asked (can be via modal window, etc) to select which metrics that they want to see in the dashboard (check our xlsx docs for 14 mandatory metrics and additional metrics)
    - Provide error scenario for mandatory form and error data processing.

    02. Dashboard Screen
    - This dashboard will be used as a template where the user can get the metrics content and then take a screenshot of the dashboard and copy them to the powerpoint presentation
    - Needs an ability where the dashboard template suggest the best layout presentation to all selected metrics (provides layout recommendation)
    - Because of the recommendation features, please provide at least 3 kind of different dashboard layout for the recommendations with the following metrics available in each layout:
    -- All 14 required metrics
    -- All Additional metrics
    -- Half required metrics combined with additional metrics
    - The content visualization of the dashboard can be vary, including metrics, texts, etc
    - Check our powerpoint reference documents, page 1 gives the 3 perspectives and KPI categories and pages 2 elaborate the key metrics under each perspective and each category.
    - Check the excel reference documents, the listed 14 metrics and other reference metric list also can be picked up by the user to show (check xlsx docs)
    - Do not give us fancy chart that cannot be developed by existing chart framework. Your chart design creation MUST be able to be developed using chart framework that available on the internet (Chart.js, d3.js, etc) 

    - Keep things consistent. This means all 
    graphic styles should work together.
    - All of the graphics should have a similar feel and general aesthetic appearance
    - Focus on User Experience / how 
    user interacts with the dashboard

    Branding Guidelines
    - Open to Designers

    Screen Size
    - Consider Responsive Web Design when designing the layout
    - For this challenge, you just need to focus on the Desktop part
    - Desktop: min 1366px width with height adjusted accordingly
    - How can we make the dashboard content fit withing powerpoint presentation?

    - Executive Dashboard_v2.pptx, contains references to the current approach from our team to presenting the metrics to our senior management
    - Metrics_List_v1.xlsx, explanation of mandatory metrics and other metrics that can be included as variations

    Target Audience
    - Internal Employee
    - Senior 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

    Source Files
    All original source files of the submitted design. Files should be created in Adobe Photoshop and saved as a layered PSD file, or Adobe Illustrator as a layered AI file or Sketch!

    Final Fixes
    This F2F Design Challenge might have final fix!

    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.

    Reliability Rating and Bonus

    For challenges that have a reliability bonus, the bonus depends on the reliability rating at the moment of registration for that project. A participant with no previous projects is considered to have no reliability rating, and therefore gets no bonus. Reliability bonus does not apply to Digital Run winnings. Since reliability rating is based on the past 15 projects, it can only have 15 discrete values.
    Read more.


    2018 TopCoder(R) Open



    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. Create a JPG preview file.

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


    All fonts within your design must be declared when you submit. DO NOT include any font files in your submission or source files. Read about the font policy here.


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

    Questions? ‌Ask in the Challenge Discussion Forums.


    • Layered PSD files created in Adobe Photoshop or similar
    • AI files created in Adobe Illustrator or similar
    • Sketch

    You must include all source files with your submission.