Challenge Summary
In this initial challenge, we are looking for topcoder community’s help in coming up with the initial design direction for the overall application by designing some screens for this mobile application. In the follow-up challenge, we will be working on the gamification concepts.
We are excited to get started with this challenge.
Round 1
Submit your initial designs for a checkpoint feedback02 On-Boarding
03 Bills and Payments
04 Meter Readings and Submissions
05 Customer Interaction
- As a part of your checkpoint submission, you must upload your submission to MarvelApp so we can provide direct feedback on your designs.
- Make sure to include a URL/comment the link to your marvelapp while uploading your submission
- Make sure all pages have the correct flow! Use correct file numbering. (00, 01, 02, 03)
Round 2
Submit your final designs with all checkpoint feedback implemented.01 Register Account/login
02 On-Boarding
03 Bills and Payments
04 Meter Readings and Submissions
05 Customer Interaction
06 Reports
07 Customer Support
08 Account Management
09 Help Page
- As a part of your checkpoint submission, you must upload your submission to MarvelApp so we can provide direct feedback on your designs.
- Make sure to include a URL/comment the link to your marvelapp while uploading your submission
- Make sure all pages have the correct flow! Use correct file numbering. (00, 01, 02, 03)
We are looking to build a mobile application that provides a platform for NWL to meaningfully engage with customers and for customers to engage with NWL.
The customer will be able to:
- Complete key billing activities, such as view and pay new and existing bills.
- Communicate important messages to customers in a variety of ways.
- Allow customers to view a map of water issues in their area.
- We have a target of reaching 2 million ‘meaningful customer engagements’ by 2025 and we see the app as a big part of this.
- Provide gamification to reward customers for their engagement with NWL (Can these rewards also benefit the community?)
Design Considerations
- We are looking for a simple, easy-to-use, informative, modern design.
- Mobile: 750px width and 1334px height (increased as needed).
- Use grid systems for your layout
Required Designs
This challenge regards UX and UI only, there are no technical or integration requirements.
01 Register Account/login:
- Provide a screen for customers to create an account by providing an email address on which they can be contacted, and creating a secure username and password.
- Allow customers to securely reset their password or generate an email reminder.
- Allow customers to login by entering username/email address and password.
02 On-Boarding:
- The first time the customer uses the application they should be offered a demonstration screen so that they can see the key features.
03 Bills and Payments:
- Must allow customers to view new and existing bills, view the details of each bill and view bill status.
- Customers must be able to make a payment for a current bill or bills in arrears.
04 Meter Readings and Submissions:
- Must allow customers to submit a meter reading (via camera + phone light) and apply for a water meter.
05 Customer Interaction:
- Must provide a platform for customers to easily engage with NWL (e.g. to report a leak in their area/highlight environmental concerns/provide feedback on an NWL employee).
- Use of camera functionality and geo-tagging to support customer interaction – e.g. for report a leak
- Any customer engagement must be meaningful.
- Push notifications for bills, payment due to messages, water issues in their area.
- We are looking for creative ideas/Open to suggestions.
- Provide a platform for NWL ‘Water Rangers’ to easily report environmental issues to us via a picture/form.
- The ability for NWL to send surveys and questions to app users (i.e. like Google Rewards app).
- Encourage greater awareness of community/local surroundings (e.g. suggestions for local walks around reservoirs/key facts on the area).
06 Reports:
- Reports to demonstrate how customers are engaging with the platform.
- NWL is able to make valuable business decisions based on these reports.
- Please provide recommendations on reports which you think would be suitable.
07 Customer Support:
- Should aim to help customers who are vulnerable or require additional support from NWL.
- For example, flag customers who repeatedly pay their bills late or fall into arrears.
- This needs to be handled in a sensitive way, but we are open to your suggestions.
08 Account Management:
- Must provide a secure area which allows customers to change their account password, log out of the app, update personal information including their email address and home address, delete their account or report any faults.
09 Help Page:
- Customers must have access to help page and be able to contact NWL if needed via Chat/Phone depending on the query type.
Branding Guidelines:
- These will be provided in a pdf format, please see forums
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?
- The overall design and user experience
- Cleanliness of screen design and user flow
Target Audience:
- The application will be used by customers of NWL. Please note, some areas may be restricted to customers who need to be treated with an additional level of sensitivity.
Important:
- Keep things consistent. This means all graphics styles should work together.
- All of the graphics should have a similar feel and general aesthetic appearance.
MarvelApp Prototype
- We need you to upload your screens to the Marvel App
- Please send your Marvel app request to csystic@gmail.com (Challenge Copilot)
- You MUST include your Marvel app URL in notes /comments while uploading (in your marvel app prototype, click on share and then copy the link & share it within your notes while you upload).
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
- Submit Marvelapp as part of your submission.
Source Files
All original source files of the submitted design. Files should be created in Adobe Photoshop, Illustrator, XD, or Sketch!
Final Fixes
As part of the final fixes phase, you may be asked to modify your graphics (sizes or colors) or modify overall colors. We may ask you to update your design or graphics based on checkpoint feedback.
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.