Challenge Summary
Welcome to "WellLog - LAS Simple Parsing Tool Design Challenge". In this challenge, we need your creative skills and help us create the best UI/UX screens for our WellLog application that will be used to parsing LAS file and display it to the user. 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!
02) Dashboard Screen
03) Alternative Dashboard Screen
04) LAS Files Screen
05) LAS Details Page
- 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 correct flow. Use the proper file numbers, (1, 2, 3, etc.)
01) Login Screen
02) Dashboard Screen
03) Alternative Dashboard Screen
04) LAS Files Screen
05) LAS Details Page
06) Analytics & Reports Screen
07) Settings Screen
08) Help Screen
- 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 correct flow. Use the proper file numbers, (1, 2, 3, etc.)
Background Overview
Our existing system that usually being used to open the LAS file has been commissioned out and our user right now needs to use notepad or any text editor to open the file. This is not a good approach because data in the LAS files are huge, so viewing the data or searching data using text editor quite hard and not effective and efficient at all.
Through this project, we want to initiate and create a new system that able to open the LAS file for our user, giving our user an ability to parsing and choose what kind of information that they want to see from the files, able to edit and update the data in the file, and also saving and export the updated files either to the same format (LAS) or other formats (CSV, XML, XLSX, etc).
Challenge Goal
Create the best UI/UX for the new WellLog application to display LAS files to the user and allow them to view, edit, saving, process and export LAS files.
Design Consideration
- New, Professional, and Modern look and feel.
- Simplicity to view and add necessary information
- Desktop/Web application (Follow Desktop/Web Design Best Practice)
- Easy to understand flow from page to page
- Intuitive for the user; should never be left asking "what do I do next?"
- Simple, clean, modern.
- Easy viewing for pages that may be over overcrowded with information (eg. when hovering over an item will enlarge for easy viewing or similar)
Challenge Forum
If you have any doubts or questions regarding challenge requirements, please ask in our challenge forum:
https://apps.topcoder.com/forums/?module=ThreadList&forumID=628835
Screen Requirements
For this challenge, we are looking for the below pages to be designed/considered in your concepts. The screen functionality details listed below are suggested functionality for consideration. Do not allow the suggestions below to impact the creativity of design. If there is a better way to accomplish the same goal, then feel free to take creative liberties.
01) Login Screen
- The user needs to log in to be able to use the app
- Create a simple logo for this app
- Ordinary login field (username/password)
- Needs error scenario added as part of a failed login attempt
- Feature for reset and forgot a password
02) Dashboard Screen
- The user will be redirected to this screen after successful login
- The user can view the application latest activity in this screen/statistic summary
- Ability/Features to upload new LAS file
- Ability to see file upload progress
- Show list of Recent LAS file that being uploaded to the app
- Ability to do a quick preview of any LAS file (modal window)
- Needs Engaging Main navigation
- The recent LAS files table needs to provide high-level information to the user, it would be kind of a list of last files with status and file location link. Now for each LAS file, we need to show these details in a table, with a button on the right-hand side to view/edit, for example:
-- File Name
-- Available UWI/API
-- Well name
-- Service company
-- Operator and a file name
-- Link to the LAS file (where the files comes from, for ex, Dropbox file, google drive file, temporary link, etc)
-- ability to perform some actions to the LAS files (quick preview, edit LAS files, Export as.., Delete)
- In the table list, need to show the LAS File condition status (success upload, failed upload)
- Filter? Sorting? Pagination for the Recent LAS files?
- Upload LAS File
-- User should be able to upload new LAS file to the app
-- Create this screen as a new screen? Or popup/modal window? Your call! (use wireframes as references)
-- Ability to upload single or multiple LAS file at one time
-- Since the LAS file have quite a huge size, show percentage of upload progress
-- Fails and Success upload status
-- Ability to cancel the upload
-- Ability to hide the upload progress so user can continue and do any activity in the app.
-- User should be able to preview the LAS file content (read-only/quick preview) once user finishes uploading the LAS files to make sure it is the correct files.
03) Alternative Dashboard Screen
- This screen is an alternative dashboard that we would like to explore as well.
- This second dashboard shows the results of the predictions in this page.
- In our original dashboard right now, the details being shown on the details page and we need to flip through well by well which will make user overwhelmed.
- So in this alternative dashboard screen, we want to shows the file name and then columns of predictions possibly colored by certainty where we could quickly review the results.
- In this screen, shows the file name and then columns of predictions possibly colored by certainty where we could quickly review the results.
04) LAS Files Screen
- Show list of available LAS files in the app
- Active/Archive/Failed to Upload file status information
- Consider this as a repository to find all LAS files in the system
- Needs to have a filter, sorting, and search features in this screen to help the user find particular LAS files easily.
05) LAS Details Page
- In this screen, the user will be able to see the full content of LAS file.
- User can go to this screen via the dashboard, or after user finishes uploading the LAS file.
- User will only able to open one LAS files at one time.
- Ability to manage and set which content that needs to be displayed (parsing feature) - what header field that needs to be selected and appear, set quantity of content/limitation per page, etc.
- There are a lot of information available in the LAS files, the app needs to parsing the content based on the category and heading from the LAS files and show the following information (in some files, there might be some of the below information not available):
-- Header Information
-- Supplemental Metadata Information
-- Version Information
-- Well Information Block
-- Curve Information Block
-- Parameter Information Block
-- Other Information
-- Details Content (all data content)
- User will be able to edit the data inside LAS file in this screen
- Ability to save/approved the data
- Ability to export the LAS files into other formats (CSV, XLS, etc)
- We also need to simulate the "Run ML Algorithm". What is happening right now is an issue with the data in LAS file is being manually fixed/updated by the client, in future, they want to implement machine learning and predict the data. e.g. file name, service company, data source, etc. Everything will be predicted by the machine learning code we will build in the coding phase. We need an interaction to put the machine learning and predict the data in the wf. Please provide the screen interactions when the user hit the "Run ML Algorithm".
06) Analytics & Reports Screen
- In this screen, the user can analyze the LAS file and User activity.
- A trend of LAS files mined over a period of time
- Provide a simple set of reports so users can see what they have done over the past week or month or an arbitrary time period
- A trend over time for files analyzed, may be the count of metadata extracted from each file. Number of parsing jobs and it's success/failure.
- Over a period of time we need Machine Learning, so we want to provide analytics to help that process.
07) Settings Screen
- Ability to edit profile
- User Management Area (add a new user, edit, delete, assign roles, etc)
- LAS File configuration (min/max file size, export options, etc)
08) Help Screen
- Documentation
- FAQ
- Contact Support
Branding Guidelines
- Font, Style, Icons is up to Designers
Documentation
Google Drive Link: https://drive.google.com/drive/folders/1edtx9CbrtLEOpt1nA57N5376zfwUqazv?usp=sharing
- LAS File example
- Wireframes
Target Devices
Desktop: 1366px(w) & height up to your design
Target Audience
Internal Employees
Judging Criteria
Your submission will be judged on the following criteria:
- Overall idea and execution of concepts
- How well does your design align with the objectives of the challenge
- Execution and thoughtfulness put into the solving the problem
- The overall design and user experience
- Cleanliness of screen design and user flow
- Ease of use
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 image files based on Challenge submission requirements stated above
- MarvelApp link for review and to provide feedback
Source Files
All source files of all graphics created in either Adobe Photoshop, Illustrator (might need to convert it to photoshop later), XD, or Sketch and saved as an editable layer
Final Fixes
As part of the final fixes phase, you may be asked to modify your graphics (sizes or colors) or modify overall colors.
Round 1
Submit your initial design for a Checkpoint Feedback02) Dashboard Screen
03) Alternative Dashboard Screen
04) LAS Files Screen
05) LAS Details Page
- 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 correct flow. Use the proper file numbers, (1, 2, 3, etc.)
Round 2
Submit your Final Design plus Checkpoint Updates01) Login Screen
02) Dashboard Screen
03) Alternative Dashboard Screen
04) LAS Files Screen
05) LAS Details Page
06) Analytics & Reports Screen
07) Settings Screen
08) Help Screen
- 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 correct flow. Use the proper file numbers, (1, 2, 3, etc.)
Background Overview
Our existing system that usually being used to open the LAS file has been commissioned out and our user right now needs to use notepad or any text editor to open the file. This is not a good approach because data in the LAS files are huge, so viewing the data or searching data using text editor quite hard and not effective and efficient at all.
Through this project, we want to initiate and create a new system that able to open the LAS file for our user, giving our user an ability to parsing and choose what kind of information that they want to see from the files, able to edit and update the data in the file, and also saving and export the updated files either to the same format (LAS) or other formats (CSV, XML, XLSX, etc).
Challenge Goal
Create the best UI/UX for the new WellLog application to display LAS files to the user and allow them to view, edit, saving, process and export LAS files.
Design Consideration
- New, Professional, and Modern look and feel.
- Simplicity to view and add necessary information
- Desktop/Web application (Follow Desktop/Web Design Best Practice)
- Easy to understand flow from page to page
- Intuitive for the user; should never be left asking "what do I do next?"
- Simple, clean, modern.
- Easy viewing for pages that may be over overcrowded with information (eg. when hovering over an item will enlarge for easy viewing or similar)
Challenge Forum
If you have any doubts or questions regarding challenge requirements, please ask in our challenge forum:
https://apps.topcoder.com/forums/?module=ThreadList&forumID=628835
Screen Requirements
For this challenge, we are looking for the below pages to be designed/considered in your concepts. The screen functionality details listed below are suggested functionality for consideration. Do not allow the suggestions below to impact the creativity of design. If there is a better way to accomplish the same goal, then feel free to take creative liberties.
01) Login Screen
- The user needs to log in to be able to use the app
- Create a simple logo for this app
- Ordinary login field (username/password)
- Needs error scenario added as part of a failed login attempt
- Feature for reset and forgot a password
02) Dashboard Screen
- The user will be redirected to this screen after successful login
- The user can view the application latest activity in this screen/statistic summary
- Ability/Features to upload new LAS file
- Ability to see file upload progress
- Show list of Recent LAS file that being uploaded to the app
- Ability to do a quick preview of any LAS file (modal window)
- Needs Engaging Main navigation
- The recent LAS files table needs to provide high-level information to the user, it would be kind of a list of last files with status and file location link. Now for each LAS file, we need to show these details in a table, with a button on the right-hand side to view/edit, for example:
-- File Name
-- Available UWI/API
-- Well name
-- Service company
-- Operator and a file name
-- Link to the LAS file (where the files comes from, for ex, Dropbox file, google drive file, temporary link, etc)
-- ability to perform some actions to the LAS files (quick preview, edit LAS files, Export as.., Delete)
- In the table list, need to show the LAS File condition status (success upload, failed upload)
- Filter? Sorting? Pagination for the Recent LAS files?
- Upload LAS File
-- User should be able to upload new LAS file to the app
-- Create this screen as a new screen? Or popup/modal window? Your call! (use wireframes as references)
-- Ability to upload single or multiple LAS file at one time
-- Since the LAS file have quite a huge size, show percentage of upload progress
-- Fails and Success upload status
-- Ability to cancel the upload
-- Ability to hide the upload progress so user can continue and do any activity in the app.
-- User should be able to preview the LAS file content (read-only/quick preview) once user finishes uploading the LAS files to make sure it is the correct files.
03) Alternative Dashboard Screen
- This screen is an alternative dashboard that we would like to explore as well.
- This second dashboard shows the results of the predictions in this page.
- In our original dashboard right now, the details being shown on the details page and we need to flip through well by well which will make user overwhelmed.
- So in this alternative dashboard screen, we want to shows the file name and then columns of predictions possibly colored by certainty where we could quickly review the results.
- In this screen, shows the file name and then columns of predictions possibly colored by certainty where we could quickly review the results.
04) LAS Files Screen
- Show list of available LAS files in the app
- Active/Archive/Failed to Upload file status information
- Consider this as a repository to find all LAS files in the system
- Needs to have a filter, sorting, and search features in this screen to help the user find particular LAS files easily.
05) LAS Details Page
- In this screen, the user will be able to see the full content of LAS file.
- User can go to this screen via the dashboard, or after user finishes uploading the LAS file.
- User will only able to open one LAS files at one time.
- Ability to manage and set which content that needs to be displayed (parsing feature) - what header field that needs to be selected and appear, set quantity of content/limitation per page, etc.
- There are a lot of information available in the LAS files, the app needs to parsing the content based on the category and heading from the LAS files and show the following information (in some files, there might be some of the below information not available):
-- Header Information
-- Supplemental Metadata Information
-- Version Information
-- Well Information Block
-- Curve Information Block
-- Parameter Information Block
-- Other Information
-- Details Content (all data content)
- User will be able to edit the data inside LAS file in this screen
- Ability to save/approved the data
- Ability to export the LAS files into other formats (CSV, XLS, etc)
- We also need to simulate the "Run ML Algorithm". What is happening right now is an issue with the data in LAS file is being manually fixed/updated by the client, in future, they want to implement machine learning and predict the data. e.g. file name, service company, data source, etc. Everything will be predicted by the machine learning code we will build in the coding phase. We need an interaction to put the machine learning and predict the data in the wf. Please provide the screen interactions when the user hit the "Run ML Algorithm".
06) Analytics & Reports Screen
- In this screen, the user can analyze the LAS file and User activity.
- A trend of LAS files mined over a period of time
- Provide a simple set of reports so users can see what they have done over the past week or month or an arbitrary time period
- A trend over time for files analyzed, may be the count of metadata extracted from each file. Number of parsing jobs and it's success/failure.
- Over a period of time we need Machine Learning, so we want to provide analytics to help that process.
07) Settings Screen
- Ability to edit profile
- User Management Area (add a new user, edit, delete, assign roles, etc)
- LAS File configuration (min/max file size, export options, etc)
08) Help Screen
- Documentation
- FAQ
- Contact Support
Branding Guidelines
- Font, Style, Icons is up to Designers
Documentation
Google Drive Link: https://drive.google.com/drive/folders/1edtx9CbrtLEOpt1nA57N5376zfwUqazv?usp=sharing
- LAS File example
- Wireframes
Target Devices
Desktop: 1366px(w) & height up to your design
Target Audience
Internal Employees
Judging Criteria
Your submission will be judged on the following criteria:
- Overall idea and execution of concepts
- How well does your design align with the objectives of the challenge
- Execution and thoughtfulness put into the solving the problem
- The overall design and user experience
- Cleanliness of screen design and user flow
- Ease of use
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 image files based on Challenge submission requirements stated above
- MarvelApp link for review and to provide feedback
Source Files
All source files of all graphics created in either Adobe Photoshop, Illustrator (might need to convert it to photoshop later), XD, or Sketch and saved as an editable layer
Final Fixes
As part of the final fixes phase, you may be asked to modify your graphics (sizes or colors) or modify overall colors.
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.