Challenge Summary
In this challenge, we are looking for the topcoder design community to come up with a design for an internal mobile application that will be used by employees of a large company for self-service access to technology requests, project status, company events and more.
This will be a hybrid mobile app, we are excited to see your designs for this challenge!
Let’s discuss in forums on any question you have!
Good Luck!
Round 1
Submit your initial design for a Checkpoint Feedback01 Dashboard
02 Company Events
04 Project Status
05 Technology Support
06 Performance Incentive
07 Message Employees
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 the comments while uploading your submission
- Make sure all pages have correct flow. Use the proper file numbers, (1, 2, 3, etc.)
Round 2
Submit your Final Design plus Checkpoint Updates
00 Login
01 Dashboard
02 Company Events
03 Company News
04 Project Status
05 Technology Support
06 Performance Incentive
07 Message Employees
08 Notifications
As part of your final submission, you must upload your submission to MarvelApp so we can
provide direct feedback on your designs.
- Please include the MarvelApp URL in the comments while uploading your submission
- Make sure all pages have correct flow. Use the proper file numbers, (1, 2, 3, etc.)
This mobile app will provide consumer-oriented experience for employees across the company by delivering them a work experience that is more like the consumer brands they use outside the office.
Design Considerations:
- Come up with clean and modern design
- Think about the user experience
- You are designing the screens for a hybrid mobile app - so keep that in mind while designing your screens.
- For this challenge, design your screens of size 750 x 1334 px (iPhone)
- We have attached branding guidelines that need to be followed (we may not be able to supply the font mentioned in the branding doc, so please use a font that is similar to the one mentioned - the winner will be required to replace it in final fixes).
~
Screen Thoughts:
We wanted to give you an idea of the screens and functionalities:
00 Login:
- Keep this page simple.
- Include all elements necessary for a login screen
- Include Username / Password
- Provide a way for the user to Reset Password
- Should allow users to Opt-In for Biometric Auth for iOS and Android
01 Dashboard:
- What needs to be on this screen? a quick overview of the items that need user’s attention?
- Quick Links to other screens?
- Provide ability to raise a request?
- What else can be put up on this screen?
02 Company Events:
- This shows a list of events at the company
- Example: Casual Days, Employee All Hands, Employee Appreciation Week, Holiday
03 Company News
- This screen includes all types of feeds
- Intranet (private feed), news from the company to employees (i.e., updates, celebrations, etc.)
- Company's Facebook feed
- Company's Twitter feed
04 Project Status
- This screen shows a list of company projects (projects are technology projects. So, analytics, websites, vendor system integrations, RFP’s... etc)
- Project Status (purpose to convey the status of all major company projects)
- Project Status:
- Project Name
- Project Description
- Project Phase (i.e., planning, analysis, design, implementation, maintenance)
- Business Owner (First/Last Name)
- Project Manager (First/Last Name)
- Overall Status Color (red, yellow, or green)
- Schedule Color (red, yellow, or green)
- Scope Color (red, yellow, or green)
- Budget Color (red, yellow, or green)
- Resources Color (red, yellow, or green)
- Reason Not Green (if a project is not green status)
- A path to Green (plan to get from red or yellow to green)
05 Technology Support
The user will be able to get technical support on this screen, think through on how we can make it intuitive to raise a request.
- Should be able to see the System Outage Alert
- Have an ability to Click to Call IT Help Desk
- Users will be able to Open Ticket / Messaging 2 Ways for Support (asynchronous chat)
06 Performance Incentive
- The performance incentive is a visual (think it like a dashboard). It refreshes at the start of each year with new targets. So, each month the actual is compared to the target. The trigger is either on/off. The others have a target as a range (minimum, midpoint and max) then show the actual value of where we are at each month. They could also allow a user to see it over time.
- Should allow the users to view the current status of their annual performance
- - Manage the business (on/off switch)
- - Trend (% value, example: 3%)
- - Customer Experience (0-100 score, example: 83)
- - Efficiency ($ amount, example: $28.5)
07 Message Employees
- For the users of the app, the employee can 2-way message with each other
- They should be able to send rich content
- Ability to locate the person to contact
- Ability to chat with more than one contact per message (group messaging)
- Ability to add or remove people from a chat
- Alert within app of a new message received
08 Notifications:
- Show us how the notifications will look like!
- Employees will be able to receive push notification of the message.
09 Other ideas?
- Feel free to ideate on other employee features that might be useful.
- We are looking for your thoughts!
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
- Focus on User Experience / how the user interacts with the dashboard and other pages
MarvelApp Prototype
- We need you to upload your screens to Marvel App.
- Please send your Marvel app request to csystic@gmail.com
- 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).
Target Audience
- Employees
Judging Criteria:
- How well you plan the user experience and capture your ideas visually.
- Cleanliness of your graphics and design.
- Overall design, UI and user experience.
- Consistency across the UX/UI
- How well you interpret the example screens (business relevance) and show us new ideas and concepts.
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 and saved as layered PSD file, or Adobe Illustrator as a layered AI file 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.