Challenge Summary
Challenge Objectives
- Create Website App Design for TopcoderMobile - Contract Tracking Manager Proposal
- Focus on Desktop screen size
1). Bulk Upload
2). Vendor
3). Contracts
4). Contract Details
5). Site
6). Ordering Guide Info
Notes:
- Create numbering of your submission filename (eg: 01-features-name.jpg)
- Feel free to submit more screens for early feedback
1). Bulk Upload
2). Vendor
3). Contracts
4). Contract Details
5). Site
6). Ordering Guide Info
Notes:
- Create numbering of your submission filename (eg: 01-features-name.jpg)
Project Background
For this challenge we need Topcoder Community Designer to create User Interface design for contract management of Telco Contracts. The web app will be used internally by TopcoderMobile employees to add, edit, update, and delete records in the context of purchased circuit contracts. It will also include a custom user interface that allows the user to bulk upload circuit data from spreadsheets.
General Requirements
- This challenge's purpose is to explore, concept, and design how TopcoderMobile - Contract Tracking Manager Proposal should look and feel.
- TopcoderMobile - Contract Tracking Manager Proposal application will be used by Internal Employees
- We are open to seeing your unique ideas and concepts as well. Make sure any additional sections or content types make sense for the user and the type of microsite that we are creating.
- Use logo placeholder on your design
User Roles
There will three roles in page
- Admin,
- Read-only
- Group assignment
Sample Data:
Please download from here: https://drive.google.com/open?id=1UXPJuGVWG6G2ZtLA5ku1YU3uW4UStPG_
You need show same fields based on these sample data:
- Vendor.xlsx
- Contract.xlsx
- Sites.xlsx
- Ordering Guide Info.xlsx
Initial App flow
You can follow this initial flow, but we’re welcome to suggest better app structure:
- Page 1 is Bulk Upload
- Page 2 is for Vendor,
- Page 3 will display Contracts linked to the Vendor,
- Page 4 is Contract Details,
- Page 5 is Details of Site,
- Page 6 is Ordering Guide Info.
Individual Requirements
1). Bulk Upload
- User need able to see this page by default to allow them to do the Bulk Upload
- Need allows the user to bulk upload from spreadsheets.
- Need able to upload CSV format file
- There is a name called contract owner. We need to send a notification to contract owner after upload completed
- We need support the smart bulk upload when user upload all files. Here is the hierarchy:
-- 1 Vendor to Many contracts.,
-- 1 Contract to Many Sites and
- 1 Contract to 1 detailed Ordering Guide.
- Even though the excel does not show explicitly the contract ID, we will want the user to import all details related to one contract in one go and then allow for multiple such imports to happen. It may be okay to impose a naming convention (other ideas are acceptable) on the files and allow for all the files in a folder to be imported at once, assembled based on the same convention.
- Suggest how design look and feel for Bulk Upload and the user interaction
- Design for error messages when upload from CSV to UI Error while writing to DB. Our web services would return an error message if any failures are returned while a submission is made to the DB, we would like the UI to display the same error message feedback by our web services
- We would like to have statistics regarding the upload process with specific message on the UI to show the number of records uploaded
2). Vendor
- Design how Vendor page look for each contract
- Use data from Vendor.xlsx
- How your design look of multiple contracts under this vendor?
- We would like to have pagination while the use would be viewing data
3). Contracts
- Create list of current purchased circuit based on Contract.xlsx
- Design how all data displayed in page, make sure all columns captured
- Need able to add, and update records in the context of purchased circuit contracts.
- There should be no deletes function in page.
- Circuit locations will need address
- Contacts need linked to many site.
- List like view is the first preference. Map view can be useful to display where each related Sites.
- We would like to have pagination while the use would be viewing data
4). Contract Details
- Design how Contract details look for each contract
- Use data from Contract.xlsx
5). Site
- Design how Site page look.
- Use data from Sites.xlsx
- We would like to have pagination while the use would be viewing data
6). Ordering Guide Info
- Design how Ordering Guide page look.
- Use data from Ordering Guide Info.xlsx
- We would like to have pagination while the use would be viewing data
User Target
- Contract Tracking Manager
Form Factors
- Please make sure your design supports these form factors:
- Desktop Screen Size (1400px Width x Height up to your design)
Branding Guidelines
- Color Palette: #E20074, #FFFFFF, #000000
Final Deliverables
- All original source files.
- Files should be created in Adobe Photoshop, Adobe Illustrator, Sketch or Adobe XD
Marvel Prototype
- We need you to upload your screens to Marvel App.
- Please send your marvel app request to dedywahyuditc@gmail.com
- You MUST include your Marvel app URL as a text file in your final submission labeled “MarvelApp URL” (in your marvel app prototype, click on share and then copy the link).
- Create Website App Design for TopcoderMobile - Contract Tracking Manager Proposal
- Focus on Desktop screen size
Round 1
Initial TopcoderMobile - Contract Tracking Manager Proposal Design for these following sections on Desktop screen size1). Bulk Upload
2). Vendor
3). Contracts
4). Contract Details
5). Site
6). Ordering Guide Info
Notes:
- Create numbering of your submission filename (eg: 01-features-name.jpg)
- Feel free to submit more screens for early feedback
Round 2
Final TopcoderMobile - Contract Tracking Manager Proposal Design for these pages features on combined with Checkpoint Feedback on Desktop screen size1). Bulk Upload
2). Vendor
3). Contracts
4). Contract Details
5). Site
6). Ordering Guide Info
Notes:
- Create numbering of your submission filename (eg: 01-features-name.jpg)
Project Background
For this challenge we need Topcoder Community Designer to create User Interface design for contract management of Telco Contracts. The web app will be used internally by TopcoderMobile employees to add, edit, update, and delete records in the context of purchased circuit contracts. It will also include a custom user interface that allows the user to bulk upload circuit data from spreadsheets.
General Requirements
- This challenge's purpose is to explore, concept, and design how TopcoderMobile - Contract Tracking Manager Proposal should look and feel.
- TopcoderMobile - Contract Tracking Manager Proposal application will be used by Internal Employees
- We are open to seeing your unique ideas and concepts as well. Make sure any additional sections or content types make sense for the user and the type of microsite that we are creating.
- Use logo placeholder on your design
User Roles
There will three roles in page
- Admin,
- Read-only
- Group assignment
Sample Data:
Please download from here: https://drive.google.com/open?id=1UXPJuGVWG6G2ZtLA5ku1YU3uW4UStPG_
You need show same fields based on these sample data:
- Vendor.xlsx
- Contract.xlsx
- Sites.xlsx
- Ordering Guide Info.xlsx
Initial App flow
You can follow this initial flow, but we’re welcome to suggest better app structure:
- Page 1 is Bulk Upload
- Page 2 is for Vendor,
- Page 3 will display Contracts linked to the Vendor,
- Page 4 is Contract Details,
- Page 5 is Details of Site,
- Page 6 is Ordering Guide Info.
Individual Requirements
1). Bulk Upload
- User need able to see this page by default to allow them to do the Bulk Upload
- Need allows the user to bulk upload from spreadsheets.
- Need able to upload CSV format file
- There is a name called contract owner. We need to send a notification to contract owner after upload completed
- We need support the smart bulk upload when user upload all files. Here is the hierarchy:
-- 1 Vendor to Many contracts.,
-- 1 Contract to Many Sites and
- 1 Contract to 1 detailed Ordering Guide.
- Even though the excel does not show explicitly the contract ID, we will want the user to import all details related to one contract in one go and then allow for multiple such imports to happen. It may be okay to impose a naming convention (other ideas are acceptable) on the files and allow for all the files in a folder to be imported at once, assembled based on the same convention.
- Suggest how design look and feel for Bulk Upload and the user interaction
- Design for error messages when upload from CSV to UI Error while writing to DB. Our web services would return an error message if any failures are returned while a submission is made to the DB, we would like the UI to display the same error message feedback by our web services
- We would like to have statistics regarding the upload process with specific message on the UI to show the number of records uploaded
2). Vendor
- Design how Vendor page look for each contract
- Use data from Vendor.xlsx
- How your design look of multiple contracts under this vendor?
- We would like to have pagination while the use would be viewing data
3). Contracts
- Create list of current purchased circuit based on Contract.xlsx
- Design how all data displayed in page, make sure all columns captured
- Need able to add, and update records in the context of purchased circuit contracts.
- There should be no deletes function in page.
- Circuit locations will need address
- Contacts need linked to many site.
- List like view is the first preference. Map view can be useful to display where each related Sites.
- We would like to have pagination while the use would be viewing data
4). Contract Details
- Design how Contract details look for each contract
- Use data from Contract.xlsx
5). Site
- Design how Site page look.
- Use data from Sites.xlsx
- We would like to have pagination while the use would be viewing data
6). Ordering Guide Info
- Design how Ordering Guide page look.
- Use data from Ordering Guide Info.xlsx
- We would like to have pagination while the use would be viewing data
User Target
- Contract Tracking Manager
Form Factors
- Please make sure your design supports these form factors:
- Desktop Screen Size (1400px Width x Height up to your design)
Branding Guidelines
- Color Palette: #E20074, #FFFFFF, #000000
Final Deliverables
- All original source files.
- Files should be created in Adobe Photoshop, Adobe Illustrator, Sketch or Adobe XD
Marvel Prototype
- We need you to upload your screens to Marvel App.
- Please send your marvel app request to dedywahyuditc@gmail.com
- You MUST include your Marvel app URL as a text file in your final submission labeled “MarvelApp URL” (in your marvel app prototype, click on share and then copy the link).
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.