BONUS: 5‌ CHECKPOINTS AWARDED WORTH ‌$100‌ EACH

Register
Submit a solution
The challenge is finished.

Challenge Summary

Welcome to Living Progress - Mentor ME - Wireframe Challenge

This challenge is part of the HPE Living Progress Challenge Blitz Series. Competitors who win challenges in this series will compete in a leaderboard and earn points towards additional cash prizes.
The objective of this challenge is to create the HTML wireframes for Living Progress - Mentor ME application based on requirements and guidelines stated on challenge details.

This project will be developed as responsive web application for Tablet & Mobile platform. You need focus on delivering top notch features, ease to use application also present the best practice for responsive web application.
 

Round 1

Submit Initial Living Progress - Mentor ME - Wireframe for these following roles:
- Mentee
Note: Submit as much application features as you can for our review.

Round 2

Final Living Progress - Mentor ME - Wireframe with updated Checkpoint Submission Feedback  
- Mentee
- Mentor

Note: Submit as much application features as you can for our review.
Design Problem
Mentor ME is a responsive mobile app with the objective at assisting underachieving high school students – particularly those at risk of becoming school dropouts. Mentor ME enables, empowers and inspires new talent by building networking relationships from a list of mentors that assist you sharing ideas, guidance, learning and connecting with other leaders.

The propose of Mentor ME is be more effective, efficiency at mentorship programs and to increase the coverage of current programs where younger adults can have access to volunteer mentors to get guidance and motivation to graduate. The core of Mentor ME is the match between the Mentee interests and opportunities to Mentor Skill, this will be available by Hewlett Packard Enterprise products like Idol engine or Vertica ondemand, but this is optional. We are open to use the technology that better fit the needs and that have scalability option. The web app has the features easy to use as LinkedIn, Google map, Skype apis and Analytical modules for dashboards and sharing to stakeholders (Education institutions, government) trend of the community needs.

For this challenge we will be exploring the initial user experience flows for the Mentor ME App that connects industry experts (mentors) to youngsters students (mentees). Today many students don’t have the opportunity to have a mentor to teach and help them to prepare their carrier path. This application will help give students that opportunity.

Sample Use Cases to Explore:
For Mentee
1. Submit/build your Profile by complete the questions or import from LinkedIn
2. Need to add a Terms and Conditions and if the mentee is younger than 18, electronic approval from their parents or legal guardian
3. Show your availability to be a Mentee
4. Mentee will select from a list of subject they want to join
5. Select from the list of Mentors or Skills available why you want to him/her be you mentor, write a description
6. We need the option to show a personal introduction video linked to youtube in mentee profile
7. Start the program
8. You can post a “Lesson Learned” which is a comment and can be visible to all the Mentor ME users
9. Evaluate your Mentor - This should be an evaluation form attached to the mentor profile

For Mentor
1. Submit/build your Profile by complete the questions or import from LinkedIn
2. Need to include a Terms and Conditions acceptance.
3. Show your availability to be a Mentor
4. Select your proposal Mentee base at what you can contribute. The mentor will select from a list of subject they can contribute.
5. We need the option to show a personal introduction video linked to youtube in mentee profile
6. We need to capture the number of hours per week the mentors will be available to participate at the program
7. Plan your face to face meetings, you can select by Skype or select at location to meet can be a local park. This should be some sort of calendar interface.
8. You can follow-up the Mentor ME program to track the goals or select by your own expertise. Consider a dashboard with goal setting and tracking
9. You can post at “Lesson Learned” a comment and can be visible to all the Mentor ME users
10. Evaluate the different skills of your Mentee - This should be an evaluation form or notes on a mentee profile
11. You can import to Linkedln the number of hours or mentor work supported  into your profile

General Requirements
- This is going to be a responsive web application. Keep this in mind in your approach.
- Need able to drill down all the pages flow.
- Screen Sizes for the application: Tablet (768px x 1024px to your Design) & Mobile (320px x 480px)
- For this wireframe challenge submission, you can just submit on 768px x 1024px

Downloadable Files
- Mood Board

Submission Requirements
For this challenge you need build the Living Progress - Mentor ME wireframe for these following features and roles:

I. Required Screens per user
A). Mentee
Log In

- Log in w/ username & password
- Log in with social credentials

New user flow
- Onboarding instructions and overview of the Mentor ME App

Manage/ Create Profile
- Allow user to view and update simple profile page adding relevant information about skills
- User can either walk thru manually creating their profile or import profile from Linkedin
- First Name (Mandatory)
- Last Name (Mandatory)
- Birth Date (Mandatory)
- Family Income (Optional)
- Year in School (Mandatory)
- School or Institution Name (Mandatory)
- Phone Number (Optional)
- Email Address   (Optional)
- Skype Username  (Optional)
- Whatsapp Username  (Optional)
- School:  (Mandatory)
- Picture (Optional)
- Occupational Interest (Mandatory) -- What will this list look like?
- At least one contact mechanism should be mandatory.
- Load from Facebook or other Social Networks? Nice to have feature
- Select/ Create Goals - Allow user to select skills or personal goals to develop with mentor's guidance

Dashboard:
- Displays recent activity, goals, tasks, meetings, possible mentor matches, mentorship programs,  upcoming tasks, and upcoming meetings for the mentors

Mentor Match:
- From the dashboard the mentee is able to view possible mentor candidates and view the match criteria that aligns them with their mentor
- From a list of possible mentors, a mentee is able to view a mentor detail or mentor profile
- Submit a request to become a mentee from the mentor detail page

Mentorship Program Page:
- After a mentee has been selected into a mentorship program the mentor/ mentee relationship will be managed in a mentorship program page
- Allow user to create goals and agreements as well as track progress on goals/ tasks
- Allow users to schedule meetings with mentors (Outlook API)
- Allow user to view and update Mentorship program posted to the system
- Allow user to view and update progress of Mentorship
- Allow user to view Roles & Responsibilities record on the tool
- Allow users make Skype calls with mentors
- Allow user to send summary or make comments of mentorship program
- Allow for messaging between the mentor and mentee
- Show mentorship program timeline for an overview of the engagement
- Upon Program completion, the Mentee fills out a survey about the mentorship program
- Allow user to rate the mentorship program and use of tool
- Allow user to answer questionnaire about mentor's performance
- Messages between the Mentor/ Mentee

Forum
Allow user to post messages (mentee and Mentor) to have an internal community to share comments and thoughts regarding different topics (i.e. Yahoo Q&A)

Messages/Inbox
- A page that contains all of the communications for a user w/in the APP

B.) Mentor
Manage/ Create Profile
- Allow user to view and update simple profile page adding relevant information about skills
- User can either walk thru manually creating their profile or import profile from LinkedIn
- First Name (Mandatory)
- Last Name (Mandatory)
- Birth Date (Mandatory)
- Family Income (Optional)
- Employer (Mandatory)
- School or Institution Name (Mandatory)
- Phone Number (Optional)
- Email Address (Optional)
- Skype Username (Optional)
- Whatsapp Username (Optional)
- School: (Mandatory)
- Picture (Optional)
- Occupational Interest (Mandatory) -- What will this list look like?
- At least one contact mechanism should be mandatory.
- Load from Facebook or other Social Networks? Nice to have feature
- Allow Mentors to validate they experience and knowledge, can be picture of the Grade diploma or contacts reference

Dashboard:
- Displays recent activity, mentor requests, calendar requests, mentorship programs, goals, tasks, meetings, possible mentee matches,upcoming tasks, and upcoming meetings for the mentors
- Allow user to search of mentors according with match criteria (geography, skills, job, career, university, economic situation, etc)

Mentor Match:
- From the dashboard the mentor is able to view possible mentee candidates and view the match criteria that aligns them with mentees
- From a list of possible mentees, a mentor is able to view a mentee detail or mentee profile. Mentor is able to filter the search results list w/ criteria

Mentorship Program Page:
- After a mentee has been selected into a mentorship program the mentor/ mentee relationship will be managed in a mentorship program page
- Allow user to create goals and agreements as well as track progress on goals/ tasks
- Allow users to schedule meetings with mentees (Outlook API)
- Allow user to view and update Mentorship program posted to the system
- Allow user to view and update progress of Mentorship
- Allow user to view Roles & Responsibilities record on the tool
- Allow users make Skype calls with mentees
- Allow user to send summary or make comments about the mentee
- Allow for messaging between the mentor and mentee
- Show mentorship program timeline for an overview of the engagement
- Upon Program completion, the Mentor fills out a survey about the mentorship program
- Allow user to rate the mentorship program and use of tool. Evaluate the different skills of your Mentee - This should be an evaluation form or notes on a mentee profile
- Allow user to answer questionnaire about mentee's performance
- Allow Mentors to call in registered professional consultant (Psychologist, Physicians, Attorneys, etc) to support specific needs of the mentees.
- Mentor need the capability to submit their own program thru the app
- We need the capability to attach content to each session, like PDF files, word documents, excel files, links to web pages that will help mentor and mentee to develop a special skills or better understand a topic.

ROLES AND RESPONSIBILITIES OF MENTEE AND MENTOR
For successful mentoring, both parties must understand their roles and responsibilities.

The Mentee’s role
- Interest in learning new things
- Ability and willingness to work as a team player
- Carry out tasks by agreed times
- Creativity in work
- Seek guidance and advice for personal development
- Try to take in new skills and knowledge and apply these in an educational context
- Maintain confidentiality.
- Bring up new topics that are important at any point during the program and give feedback to the mentor.
- Maintain a mentoring plan up to date and work with the mentor to set up goals, develop activities and special needs to achieve the goals
- Have flexible in changing expectations or plans
- Keeping the mentor informed about any problems, concerns, or progress made during the program.
- Complete evaluation of mentorship program

The Mentor’s role
- Facilitate the mentee’s personal growth.
- Create a positive counseling relationship and climate for open communication.
- Help your mentee identify problems and guide them towards solutions.
- Share own thought process and experiences with the mentee.
- Refer mentee to community consultant when you don't have the answers.
- Provide information, guidance and constructive comments.
- Evaluate the mentee’s plans and decisions.
- Support, encourage and critically assess performance
- Maintain confidentiality.
- Offer constructive criticism in a supportive way
- Solicit feedback from your mentee
- Be prepared for contact from your mentee. Before a call or meeting think about what might come up
- Keep your eyes open for things that could help your mentee. Look for articles and Websites that refers to things that you have discussed
- Be prepared for the relationship to end. The successful mentor-mentee cycle requires that the mentee moves on and the relation either ends or takes a different form.

Mentor & Mentee together will make:
- Work plan for Milestones and timelines
- Decide on frequency of interaction
- Logbook of activities, interaction and assessment/evaluation
- Cancel only when absolutely necessary

Target User
- Mentee
- Mentor

Judging Criteria
- How well you build wireframe solution for Mentor ME application
- Cleanliness of your graphics and design.
- Follow best practice of Responsive Design Patterns.
- User Experience of this application!

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
Your wireframes submission should be easy to review. You can create wireframe from these following tools: http://www.creativebloq.com/wireframes/top-wireframing-tools-11121302
The most important point is that all the content is listed and the pages are linked together to show page flow. Keep your source files out from this submission folder.
 
Source Files
All original source files of the submitted ideas. If you would like to submit notes please include notes.txt file

Final Fixes
As part of the final fixes phase you may be asked to modify content or user click paths.

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.

Stock Photography

Stock photography is not allowed in this challenge. All submitted elements must be designed solely by you. See this page for more details.

How To Submit

  • New to Studio? ‌Learn how to compete here
  • Upload your submission in three parts (Learn more here). Your design should be finalized and should contain only a single design concept (do not include multiple designs in a single submission).
  • If your submission wins, your source files must be correct and “Final Fixes” (if applicable) must be completed before payment can be released.
  • You may submit as many times as you'd like during the submission phase, but only the number of files listed above in the Submission Limit that you rank the highest will be considered. You can change the order of your submissions at any time during the submission phase. If you make revisions to your design, please delete submissions you are replacing.

Winner Selection

Submissions are viewable to the client as they are entered into the challenge. Winners are selected by the client and are chosen solely at the client's discretion.

ELIGIBLE EVENTS:

2016 TopCoder(R) Open

Challenge links

Screening Scorecard

Submission format

Your Design Files:

  1. Look for instructions in this challenge regarding what files to provide.
  2. Place your submission files into a "Submission.zip" file.
  3. Place all of your source files into a "Source.zip" file.
  4. Declare your fonts, stock photos, and icons in a "Declaration.txt" file.
  5. Create a JPG preview file.
  6. Place the 4 files you just created into a single zip file. This will be what you upload.

Trouble formatting your submission or want to learn more? ‌Read the FAQ.

Fonts, Stock Photos, and Icons:

All fonts, stock photos, and icons within your design must be declared when you submit. DO NOT include any 3rd party files in your submission or source files. Read about the policy.

Screening:

All submissions are screened for eligibility before the challenge holder picks winners. Don't let your hard work go to waste. Learn more about how to  pass screening.

Challenge links

Questions? ‌Ask in the Challenge Discussion Forums.

Source files

  • HTML
  • RP file created with Axure
  • Did you use other Wireframing Tools? Let us know with us via challenge forum!

You must include all source files with your submission.

Submission limit

5 submissions

ID: 30054164