We want to create an innovative online learning platform for all our internal employees. The platform needs to be innovative, intuitive, user-friendly and mobile responsive.
This new online platform will group the learning materials via 2 ways:
- By Area (4 Areas): Leadership Training Materials, Management Training Materials, Soft Skill Training Materials and Technical Training Materials (ie. claims, underwriting, IT, etc)
- By Behavior of our employees: Focus On Customers, Drive Innovation, Work Collaboratively, Support & Develop People, Provide Clear Direction, Deliver on Promises
The platform also needs to customize the interaction with the user based on a friendly communication approach (this should be applied to the notifications & messages the user see when using the platform)
Provide an innovative, intuitive, user-friendly and mobile responsive landing page & user dashboard for our online Learning
The new portal must have these requirements:
- Easy access to relevant learning (organization of the page by functions, intuitive search functionality etc.)
- The possibility of assigning mandatory training.
- Complete learning history saved on employee profile
- Personalized recommendations (based on my profile, in people like me)
- Improve Engagement for learning activities (apply marketing concepts to do it)
1# Employees enter landing page.
- The landing page should show interesting information for the employees. In this point, until the user does not log in the information is "agnostic" (not related to the employee)
- Login functionality
2# After login they will access to their private zone. The main page should be a dashboard with all the key information.
3# They user should have access to:
- See their learning history
- Begin new and assigned learning
- Get recommended learning
- Access to career path/explorer tools
- Access to their profile
- Easy to understand flow from page to page, users are guided
- Intuitive for the user; should never be left asking "what do I do next?"
- Simple, clean, modern.
- Each page is not overcrowded with information, (but it is obvious where to access more info)
- A learning portal, by its very definition, needs to make it easy to access content quickly. A great way to achieve this is to embrace the "like/dislike" feature that is popular on social media sites.
- All the messages, recommendations & notifications should be friendly. Remember the portal is an Advisor/Friend for the employees to improve their skills and achieve the career path they have in mind.
- A single, delightful solution to access and track all learning. Organize content from everywhere and integrate
- Simple; not too many steps involved in any part
- Easy to understand the navigation from section to section
- Encourages your learners to be independent.
- Enable learners to curate content that's relevant to them.
- It provides multiple learning journeys.
- It allows learners to communicate and connect with other learners and their teachers.
- It allows learning to take place in all contexts across all devices.
- Desktop: 1366px width with Height adjusted accordingly
- Mobile: 750px(w) x 1334px(h)
- Ask in Forum for Access to Branding Guidelines
- Modern Crisp look and feel adhering to our standards.
- We are open to creativity here. Creativity first, SDK and branding guidelines document second!
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.
1) Landing Screen (Home)
- Show introduction of what this platform all about
- What benefit can the employee get from this platform
- Marketing material to make employee that not yet become user become interested to join the platform
- Testimony from successful learner?
- Registration form?
2) Login Screen
- Ordinary login form (username, password)
- Simple logo for the app
- Some marketing or intro regarding sneak peek of what beyond login form
- Error condition when the wrong credential entered
3) My Learning Dashboard Screen
- Dashboard needs to use the career path as a central aspect.
- Show list of training material that employee currently joined
- List of potential/recommendation materials?
- Provide personalized messages, the idea is the portal becomes an Advisor/Assistant for our employees in the learning journey (ie. providing personalized welcome messages, remainder the platform is missing the employees when he is not doing courses etc)
- Notification? News? List of Top Learners? etc?
4) Profile Screen
- Employee personal info
- List of online material that already taken
- Badges and Achievement on the platform
- Statistic of Learning Progress - How well user doing on the platform per material/time/etc?
5) Career Explorer Screen (Key Important Screen!!)
- Provide tools to help the employee to define their ideal career path: ie. "your career path to become the next CIO"
- Provides an automatic rollout of structured learning plans for each job role
- Everything should be around the career path. The learning process should be aligned with the career path and employee goals: short, medium and long-term.
- The learning should be personalized
- Profile and the learning process should be gamified
- Access to the content of all the finalized courses.
- We are looking for creativity on this specific screen!!
6) Learning Recommendations Screen
- Training recommendation should be based on employees with similar profiles or employees that have done a similar career path.
- Should be aligned with the career path (the idea is that the employee defines the positions he wants to achieve in the next 10 years by using an interactive, lean and simple way: now I am a developer in 10 years I want to be CIO)
7) Notifications & News Screen
- To allow managers and portal owners to disseminate important details, provide up to date info and keep the site current
- Maybe it can be integrated into user dashboard? Or a specific screen? Your call!
- Might need the admin screen to manage this features?
8) Achievement Screen
- Leaderboards – which provide a fun competitive environment to motivate learners
- Badging – a system for earning and collecting awards
9) Material Learning List Screen
- List of all online training material available on the platform
- Show thumbnail, summary of the material and how long to complete the course
10) Training Detail Screen
- Show details content of training material
- List of training Videos, PDF, and other content materials
- Feedback? Rating Content? Forum? etc?
- Keep things consistent. This means all graphics styles should work together.
- All of the graphics should have a similar feel and general aesthetic appearance
- We need you to upload your screens to Marvel App.
- Please send your Marvel App request to email@example.com
- You MUST include your Marvel App URL (in your Marvel App prototype, click on share and then copy the link & share it within your notes/comment this link while you upload).
Please ask in forum for access to documentation
- Branding Guidelines Document
- SDK Document
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
- Overall design and user experience
- Cleanliness of screen design and user flow
Submission & Source Files
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.
- Submit JPG/PNG image files based on Challenge submission requirements stated above.
- Marvel App link for review and to provide feedback
All source files of all graphics created in either Adobe Photoshop/Illustrator/Sketch and saved as editable layer
As part of the final fixes phase, you may be asked to modify your graphics (sizes or colors) or modify overall colors.