Challenge Summary

Welcome to the “Technology-as-a-Service Web Console Responsive Design Wireframe Challenge Part 1”.  In this challenge we are looking for your help to design an intuitive and easy to follow user experience, with wireframes and user flows, for a new TaaS (Technology as a Service) platform. You will be focused on creating the concepts for desktop and mobile device experiences.

The winning designs will be used as inputs to the next rounds of visual design and prototype creation challenges in support of this project. Modern UI/UX best practices should be considered when creating the wireframe designs and user flows.

This Studio competition will be run as a two-round tournament with a total prize purse of $2,500.

This challenge requires members to sign the Challenge NDA before being able to access detailed specifications and resources related to the challenge.

Round 1

Submit your initial wireframes for checkpoint review.
01 Technology-aaS Landing Page (Desktop)
02 Dashboard (Desktop)
03 Clusters (Desktop)
04 Provision Cluster Wizard (Desktop)
04.1 Provision Cluster “I know what I am doing” (Desktop)
04.2 Provision Cluster “I have no idea” (Desktop)
05 Cluster (Desktop)
05.1 Cluster Dashboard: Service Monitoring (Desktop)
05.2 Cluster Settings (Desktop)
05.3 Cluster User Management (Desktop)
06 Admin (Desktop)
06.1 Download Drivers (Desktop)

Feel free to add any screens which are necessary to explain your concept.

Round 2

Submit your final wireframes for checkpoint review.
01 Technology-aaS Landing Page  (Desktop & Mobile)
02 Dashboard (Desktop & Mobile)
03 Clusters (Desktop & Mobile)
04 Provision Cluster Wizard (Desktop & Mobile)
04.1 Provision Cluster “I know what I am doing” (Desktop & Mobile)
04.2 Provision Cluster “I have no idea” (Desktop & Mobile)
05 Cluster (Desktop & Mobile)
05.1 Cluster Dashboard: Service Monitoring (Desktop & Mobile)
05.2 Cluster Settings (Desktop & Mobile)
05.3 Cluster User Management (Desktop & Mobile)
06 Admin (Desktop & Mobile)
06.1 Download Drivers (Desktop & Mobile)

Feel free to add any screens which are necessary to explain your concept.
 
Full Description & Project Guide
Background Information

We need to design the new wireframes and user flows for a new TaaS (Technology as a Service) platform. This platform allows users to provision compute clusters that they can use to process data using Structured Query Language (SQL).

This should be designed as a single page web application with a responsive design and we want to see both desktop and mobile experiences, so keep that in mind. The designs should use the existing design library (included in the forum) as a guide. The existing design library closely follows Material Design guidelines. This is part 1 of 3 challenges. The next challenge will be to create the Visual Design, followed by the Visual Prototype. We have selected the 15 screens option to allow for the screens need to show the UI on both desktop and mobile.

For this challenge, you must include a "Notes.txt" file (or PDF) explaining the design choices and recommendations for your concept.

Required Screens / Functionalities
01 Technology-aaS Service Landing Page (Desktop and Mobile)

- This screen will be a product specific landing page with a login button and product details.
- The product specific details would include:
  • Product name
  • Product description
  • Service Status (hyperlink)
  • Service Agreement (hyperlink)
  • Privacy Policy (hyperlink)
  • Help Documentation (hyperlink)
  • Community (hyperlink)
- Support a dynamic area where system operation notifications can be displayed. This dynamic area may or may not be displayed depending on if there are any operation notifications. For example: Maintenance windows
- When the user clicks on the Login button, the user is directed to a SSO page (not in scope) and then navigates to the Welcome Onboarding (not in scope) or Dashboard page depending on if it’s their first time to login to the system (see product map in forum).

02 Dashboard (Desktop and Mobile)
- This screen will show overall cluster health with charts including an attribute for the total number of units consumed for nodes and storage.
- Charts would include:
  • Total number of Provisioned Cluster Nodes with attribute for units consumed.
  • Total number of Provision Storage with attribute for units consumed.
- Support date filtering on the chart.

03 Clusters  (Desktop and Mobile)
- This screen will show clusters (grid / list view) with the possibility to filter based on different criteria (cluster status, cluster performance class, cluster size, cluster region, etc.)
- Each cluster can have a status such as running, stopped, provisioning, terminated.
- Each cluster has an ID that is unique and should be displayed.
- Support a primary call-to-action button that allows for provisioning of new clusters. This button will bring up the provision cluster wizard.
- One or more clusters can be selected, and an action button/app bottom bar gives options for common actions that can be performed such as stop, start, or terminate.

04 Provision Cluster Wizard  (Desktop and Mobile)
- The Provision Cluster screen offers 2 choices to select cluster type “I know my cluster size.” or “I don’t know my cluster size.”.
- Support a checkbox “Remember my settings and do not ask me again”.

04.1 Provision Cluster “I know my cluster size.”  (Desktop and Mobile)
- “I know my cluster size.” screen provides a form that allows user to exactly choose the cluster type that they want.
- Step 1: User will complete multiple form fields to setup their cluster. The UI should display how each setting impacts the number of units consumed. E.g. If they select a Cluster size of 128 then the unit consumed is 100 vs Cluster size of 8 uses 10 units.
- Support the following required fields:
  • Name - String input field
  • Location: (US East (N. Virginia), US East (Ohio), EU (Frankfurt)) - Drop down list.
  • Cluster Size: (2, 4, 8, 16, 32, 64, 128) - Slider or something similar.
  • Performance Class: (Economy, Standard, Sport) - Drop down list.
  • Whitelist Application IP:
    • Placeholder Text: IP address in CIDR notation e.g. A.B.C.D/N or public 0.0.0.0/0
    • Supports a comma-delimited list of IP addresses.
    • Support auto-populating the field with my IP such as a link or button to “Use my IP”
- Step 2: Select or Create New 3rd Party Credentials (e.g. AWS S3)
  • For Example: AWS S3
    • Access Key ID - String input field (secure)
    • Access Secret Key ID - String input field (secure)
- Step 3: Select or Create New Cluster User Permissions
  • Select an existing cluster user
  • Add new cluster user
  • Set Username
  • Set Password
  • Set Role: Database Administrator, Data Engineer, Data Analyst
- Support tooltips to provide additional information about each field.

04.2 Provision Cluster “I don’t know my cluster size.”  (Desktop and Mobile)
- Step 1: “I don’t know my cluster size.” screen shows a simple form that asks you 3 questions:
A) How much data do you plan to process with this cluster? (Slider that allows selection from 1TiB to 500 TiB of data)
B) How many concurrent users? (1 – 10, 11 – 100, 101 - 1000)
C) Query complexity: (Not Complex, Somewhat Complex, Complex / Don’t know)
D) Recommend a cluster type based on user selection for #1 - 3. Include unit consumption based on recommendation.
- Step 2: Select or Create New 3rd Party Credentials (e.g. AWS S3)
  • For Example: AWS S3
    • Access Key ID - String input field (secure)
    • Access Secret Key ID - String input field (secure)
- Step 3: Select or Create New Cluster User Permissions
  • Select an existing cluster user
  • Add new cluster user
  • Set Username
  • Set Password
  • Set Role: Database Administrator, Data Engineer, Data Analyst
05 Cluster (Desktop and Mobile)
- These screens would show additional information for a specific cluster including a Cluster dashboard, Cluster Settings (Cluster size, Cluster Performance, Whitelist IPs, etc.), and Cluster User Management. These items should be broken into logical sub-tabs (see Style Guide in forum).
- Display the status of the cluster
- Display the hostname and include a sample JDBC, ODBC and .net connection strings.
- Support the ability to run, stop or terminate the cluster.

05.1 Cluster Dashboard: Service monitoring  (Desktop and Mobile)
- Shows important cluster related metrics which can be current or historical (date filter). These metrics can be charted.
- Support filtering based on date and cluster.
- Support the following cluster metrics:
    - Free disk space in the cluster (percentage)
    - Cluster CPU utilization (percentage)
    - Cluster network read (in MB/sec)
    - Cluster network write (in MB/sec)

05.2 Cluster Settings (Desktop and Mobile)
- This screen will show cluster settings defined during the initial cluster setup wizard.
- Support the ability to edit cluster settings (see Style Guide for existing user experience for settings).
  • Name
  • Location
  • Cluster Size
  • Performance Class
  • Whitelist Application IP
  • 3rd Party Credentials (e.g. AWS S3)

05.3 Cluster User Management  (Desktop and Mobile)
- This screen will show authorized users that have access to the clusters.
- Support the ability to add, delete or modify users and their role.
- User roles will be Database Administrator, Data Engineer or Data Analyst.

06 Admin (Desktop and Mobile)
- This section would show additional administration or settings related to the system.

06.1 Download Drivers (Desktop and Mobile)
- This screen would provide the ability to download drivers based on the 3rd party visualization tool they have chosen.
- Support the ability to download one of the following drivers:
JDBC
ODBC
.net

Supporting Material
- As this is a NDA challenge, all documentation will be provided in forum once you register to this challenge.

Target Users
- Developers, Database Engineers, Database Admins, DevOps

Tools & Deliverables
You are free to work with any of the following tools:
Axure: Your deliverable must be a fully clickable HTML wireframe
Sketch: You can also work with static images (PNG/JPG - Black and White) created in Sketch but you must include a fully navigable prototype in HTML created in Marvel App or Invision.
You are also allowed to submit pure HTML wireframes

Judging Criteria
Wireframe Scorecard 1.6.0 will be the primary scorecard, and guided by the following assessments by the Client. Final feedback and acceptance is with the Client.
- User Experience of the application/portal
- Completeness and accuracy of your wireframes
- How well your wireframes provide a consistent user flow

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
Wireframes should be built in HTML or Axure

Source Files
All original source files of the submitted ideas.
Design thinking in the notes.txt file with your submission.

Final Fixes
As part of the final fixes phase you may be asked to modify content or user click paths.

Review
The submissions will be scored by Actian team, and the winners will be selected in Actian's sole discretion. There will be no appeals or appeals responses.

Additional terms and conditions for all participants

By participating in this Competition, You acknowledge and agree that                          
  • You must comply with the terms of the Challenge NDA.
  • You must comply with all applicable laws in submitting a Competition Submission, and you represent that you are authorized to submit the Competition Submission.
  • Actian Corporation (“Actian”) is free to use, disclose, distribute or otherwise exploit Residual Knowledge. Residual Knowledge means information that is retained in the unaided memories of Actian’s employees and contractors who have had access to any Competition Submissions submitted by You. An employee’s or contractor’s memory will be considered unaided if the employee or contractor has not intentionally memorized the information for the purpose of retaining and subsequently using or disclosing it; and If You provide comments, criticism, suggested improvements, test results, answers to questions, and other feedback regarding the function, features, and other characteristics of the Actian products in written or oral form (“Feedback”), You agree that all Feedback is the property of Actian and may be used, reproduced, adapted, modified, distributed, and otherwise exploited by Actian in any manner and for any purpose.
  • You are not entitled to any compensation from Actian or any of the benefits which Actian may make available to its employees, and You are not authorized to make any representation, contract or commitment on behalf of Actian.
  • Employees and direct and indirect subcontractors of Actian Corporation and its subsidiaries and other affiliates, and employees and direct and indirect subcontractors of Actian’s partners (including TopCoder and its affiliates) are not eligible to participate in the challenge.
  • You may only use data or images that are open and that can be shared with anyone in the world and which is freely available or to which you have rights to use and share the data in submitting such data and images.
  • You may only use software that you are licensed and permitted by law to use.
  • Submissions are viewable to the client as they are entered into the challenge. Winners are selected by the client and are chosen at the client's sole discretion.

 

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.

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

  • HTML
  • RP file created with Axure
  • Sketch

You must include all source files with your submission.

Submission limit

5 submissions

ID: 30067458