Quartz Energy - LNAM Prediction Prototype

 

CHALLENGE OBJECTIVES

In this challenge, we will be building the prototype of web desktop app from design file using Angular

• Develop prototype from design

• 11-15 screens

 

PROJECT BACKGROUND

Topcoder has been working with a client in the oil and gas exploration industry to develop a tool to assign a particular name (and some other data elements) to a log file.  In previous challenges, Quartz Energy - LNAM Prediction Data Science Challenge, LNAM Prediction by Curve Attribute and Vendor Name and LNAM Prediction by Curve Attribute and Vendor Name - Part 2, our community has developed an application which parses and analyzes the log files which are in LAS text format. In the meantime, we are preparing the python app to support the web application which will be developed with this prototype.

 

• This web app will be used by our client to see the result of prediction result given by the prediction application. 

• This challenge will provide the prototype for the web application, which will be integrated with the result of prediction application.

• After this challenge, we will create API and finally integrate with this prototype. 

 

USERS/ROLES

There will be a single role for the application and all users will be from active directory.

 

SCREENS

Please make sure your app includes the following screens:

 

General Requirements

• Please use json-server or any other to create mock API

• Unless specified all data should be come from API

• Develop the prototype as angular module

• Lint should be maintained

• Angular Material is mandatory and should be used in every possible elements/components

• Develop prototype such that we can integrate this with Client’s custom components which are based on material. For that we need to use material design effectively and make header (labeled with 1) and content part(labeled with 2) in this image https://prnt.sc/p4th77 as separate. We will replace the header component later.

 

FORM FACTORS

Please make sure your design supports these form factors:

• In-scope

  • Should support Chrome, Firefox, Internet Explorer 11, Edge, Safari

  • Header should be separate component which can be easily replaceable

 

DEVELOPMENT ASSETS

• User Interface Design (https://drive.google.com/drive/folders/1NNOULd_3I4ELuCgATI5Wbfdx9JEePC8f)

• Marvel app https://marvelapp.com/4efje50/screen/61017381

 

TECHNOLOGY STACK

Angular 7.x, SCSS, HTML, TypeScript, Material Design

Final Submission Guidelines

• The source code

• Deployment with guide to replace header step

• Verification guide.