Challenge Summary
Welcome to the GE Foundation - Brilliant Career Labs Web Application Wireframe Challenge! In this challenge, we are looking for you to design wireframes for a new web application used to help students find the necessary resources to help them choose their best career path. We will be running two wireframe challenges; this first one to get the overall application flow, then a subsequent to add more detail.
For this challenge, we need you to create wireframes for the entire application. We’re very interested in you reading the materials and figuring out how the target user would want to use the app. We are ok with a lot of placeholders for content or interaction, but want to see the best layout of information across the application, and features that you think would help the most.
We look forward to seeing your creative wireframe designs!
Round 1
Round 1 will focus on the following functionality for the new application.
00 Navigation and Overall Structure
01 Login and Registration
02 Landing Page and Welcome
03 Assessment Module Landing
04 Assessment Module Detail
05 Essential Skills Module Landing
NOTE: If anything is unclear, please ask for clarification on the forum and we will be happy to help!
Round 2
In Round 2, you will need to include all Round 1 screens (updated based on checkpoint feedback). For Round 2, you must also include all the remaining functionality described in the project documentation, including the following screens:
00 Navigation and Overall Structure
01 Login and Registration
02 Landing Page and Welcome
03 Assessment Module Landing
04 Assessment Module Detail
05 Essential Skills Module Landing
06 Essential Skills Module Details
07 Career Path Landing
08 Career Path Search
09 Career Path Details
NOTE: If anything is unclear, please ask for clarification on the forum and we will be happy to help!
The goal for this challenge is to create wireframes for the major areas of the app, detailing how you see the user using that path to find out more about a career..This app will be an interactive experience (Digital) to gain soft skills (aka GE Essential Skills) as well as career explorations for digital industrial jobs of the future.
Background Information:
As GE relocates their Headquarters to Boston, there is an opportunity for the GE Foundation to partner with the Boston Public Schools (BPS) high school system through its Developing Skills™ Initiative. Developing Skills™ in Boston will empower all Boston Public School high school students to become globally productive citizens by providing access to learning experiences necessary for the workforce of tomorrow.
The GE Foundation will launch the GE Brilliant Career Labs in both physical and virtual form, with the goal of reaching every Boston Public High School student to clearly link the education skills of today with the careers of tomorrow. The GE Brilliant Career Labs will be the first-of-its-kind interactive experience to prepare students for the innovative industrial jobs of the future. The physical and virtual labs will be high-tech places for youth to discover, invent, design, develop and create. The student learning experiences will also be driven by the changing global economy and the needs for a skilled workforce. In essence – we will link a local school district to the global community. The GE Brilliant Career Labs will be high-tech innovation centers dedicated to increasing the students’ STEM awareness about expertise needed in the next generation of the workforce globally. The Labs will be focused on empowering youth through exploration and creativity, while having them see and imagine what’s coming in the future. The Labs are designed for students to explore various career pathways and understand the skills needed for jobs in STEM fields.
This application will incorporate publicly available information with learning modules to teach soft skills and methods needed to stand out from the rest in today’s workforce.
Application Overview/ Suggested Screens:
00 Navigation and Overall Structure:
- Come with a navigation that allows users to access different pages of the site
- Please take a look at the “Application Flow” and come up with thoughts on what pages need to laid out.
01 Login and Registration:
- Allow the user to register with the site (Required details to be captured: Name, Email (username), Password, confirm password and have optional fields as phone and address).
- If the student has already registered then provide the ability to login into the application
02 Landing Page and Welcome:
- Main landing page after a user logs in to the site
- Welcome message and introduction
- Overall flow of the sections/ site, outline or overview of the 3 main areas, etc.
Please see the Application Path image attached to the challenge: Application_path.pdf.zip
The overall application doesn’t need to follow this diagram, it is strictly to provide some background. The three main focuses of this app are:
1. Digitize the GE Essential Skills modules to aid students in gaining soft skills.
2. Enable students to explore high-demand STEM careers in an interactive manner.
3. Provide students with the necessary steps (education, skills, qualifications).
This application will have three main areas: Assessment Module, Essential Skills Module, and a Career Pathing Module.
A. Assessment Module
The Assessment Module is used for career explorations and to assess a student’s skills and interests. The Assessment Module should be a simple questionnaire to determine skills, interests, and abilities of students BEFORE beginning the Essential Skills and/ or Career Pathings Modules. Think of this module as the first pieces of information from a student to assess the best options and guidance for them.
Examples of the type of questions and how users are ranking and assessed can be found at: https://www.onetcenter.org/IP.html
03 Assessment Module Landing:
- Initial landing page for the assessment module
- Ability to start their assessment questionnaire/ test
- Progress of their assessment test if they’ve already started, but haven’t completed
- Once assessment test is complete, next steps and information for moving the user to the Essential Skills Module.
04 Assessment Module Detail:
- Assessment test flow and overall UX
- Detailed progress on a test they’ve already started, but haven’t completed
- Overall score/ results from test
- Next steps after completing test to move the user to the Essential Skills and/ or Career Path modules
B. Essential Skills Module:
The Essential Skills Module provides the user with modules in soft skills pertinent to managing yourself in the workplace. Think of these modules as simple surveys of questions with different response types. The user’s progress will be stored and reported on. Not necessarily if the sections are done “correctly” but if responses have been given for each module. Essentially: has the user completed the module.
The GE Foundation Workplace Skills Program is intended for high school and college-age students. The purpose of the program to provide participants with a comprehensive introduction to the “soft skills,” or what we believe are the critical essential skills, needed to help them make a successful transition from their schooling to the modern day workplace. This program is about expanding your emotional intelligence, learning how to develop positive relationships, and connecting with people so you can become a person everyone wants to work with. This program will help participants acquire and polish their soft skills.
In addition to the assessment module, here are ten modules in the program:
Module 1: Understanding Self
Module 2: Understanding Others
Module 3: Presenting Yourself
Module 4: Navigating the Workplace
Module 5: Teamwork
Module 6: Critical Thinking
Module 7: Interpersonal Communication
Module 8: Having Difficult Conversations
Module 9: Developing Wellbeing in the Workplace
Module 10: Learning to Value Diversity
05 Essential Skills Module Landing:
- This page will act as a dashboard, it shows the list of essential skills modules in the program and what each of the modules assess?
- If the user has already begun working on the modules, then we need to show the progress of each module (overall percentage completed?)
- How will the user know about the remaining modules in the program?
- Looking for your ideas on what needs to be shown in this page
06 Essential Skills Module Details:
- Details in each of essential skills modules vary. In this challenge, we are just looking for you to lay a framework of how these modules can be presented to the user… we will be adding more details to it in a subsequent wireframe challenge.
- Each module is broken-down into a number of activities and, based on the number of activities completed, the progress is shown.
- Each module details needs to show a description of what the module is all about and what will they learn as a part of that module needs to be highlighted.
In this challenge, we would like you to wireframe the “Module 1: Understanding Self”:
- Show module title and description of what they will learn as a part of that module (in this example, page 3 in the pdf)
- Show the list of activities within this module and overall progress for this module (show status that an activity is pending, or completed)
- In module 1, there are 15 activities (please see PDF for the list of activities) - some of the activities are performed as a group of four and some as a pair.
- Think how these activities can be presented within the module and how we can show the current activity that’s being performed by the student.
- Please use placeholder for the details within each of the activities, we will be adding more details to each of the activities in the next challenge.
Module 1: Understanding Self:
Activity 1: Words That Describe Me
Activity 2: Your Personal Identity
Activity 3: A Portrait of Yourself
Activity 4: Setting Priorities About Values
Activity 5: Success Stories
Activity 6: My Unique Picture Album
Activity 7: Responding to Change
Activity 8: Changes in Our Lives
Activity 9: Change and Emotions
Activity 10: Understanding Change
Activity 11: Transitions
Activity 12: Important People and Experiences - My Lifeline
Activity 13: “What If” Discussion Group
Activity 14: Two-Minute Personal Identity Speeches
Activity 15: Feedback
C. Career Pathing Module:
The Career Pathing Module contains information to filter a user from a main page, down through one of the sciences, into a career in that science. The overall goal is to allow a user to find the information they need quickly, but also provide some guidance if they need a little direction.
07 Career Path Landing:
- This will act as the landing page that allows the user to get started.
- We show the available streams (Science, Technology, Engineering and Mathematics) and allow the user to select one of them to see the list of careers.
- You can grab the list of careers from the below reference website.
Reference:
- O*Net Resource Center provides data that can be searched using their API to provide career data to users. We are to use this information in this Assessment and Career Path Modules. The api documentation is provided here: https://services.onetcenter.org/
Example tools that use data from above services are: https://www.onetcenter.org/tools.html, http://www.mynextmove.org/explore/ip, etc..
08 Career Path Search:
- Should allow the user to initiate a search and help them find the career path they are looking for!
- The user career path can also be based on their assessment from the Assessment Module
- Do you think, it will be good if we allow users to search to be based on certain criteria?
- This page needs to list the available career paths that matches user search criteria.
09 Career Path Details:
- This page should list types of courses they need to look at, certain degrees, necessary skills in order to attain this particular career they have chosen in the previous step.
- Include additional information from O*Net: salary, whether the job is in high-demand, connections/ links to local training programs
- In depth information on what the job description and day-in-the-life is
- Reference: Example of details displayed about a specific career:
http://www.mynextmove.org/profile/summary/17-2141.00
- It could also videos or interactive games that show how technology is used for these careers. For example, the physical lab will include 3D printers, laser cutters, coding classes, etc. Incorporating some of these interactive exercises would be ideal.
- Reference: Example of content around about a specific career:
https://github.com/Khan/khan-api/wiki/Khan-Academy-API
- The user should also have the ability to “save” the careers they are interested in. Have the options to email the information to themselves or a guidance counselor.
Wireframe Requirements:
- All screens / functionality described in this challenge spec must be included in your submission.
- Provide us with your interaction and click-path thoughts and suggestions.
- The application must be very easy to use and intuitive. Keep that in mind when you create your solution for the layout and flow information.
- Have your wireframes of size - desktop : 1024px width and height as required.
Documentation Provided:
- Module 1 Understanding Self PB v3.pdf
New to axure RP, get started right-away!!
Here are some quick tutorials to help you get started http://www.axure.com/support
Target Audience:
- The target age group is high school age students (14 to 18 years of age) looking to enter college for their desired career.
Judging Criteria:
- User Experience of the application
- Completeness and accuracy of the wireframe as defined in the attached requirements.
- How well your wireframes provide a consistent user flow.
- How well your wireframe captures all the requirements.
- Any suggestions, interactions and user flows you recommend (provide any notes or comments for the client).
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 Files
- All requested contest requirements as clickable HTML files generated by Axure. All the content must be listed and the pages are linked together to show page flow.
Source Files
- Wireframes should be built in Axure. The resulting source files used to generate the clickable HTML files. Also, all the content must be listed and the pages are linked together to show page flow. All fully editable original source files of the submitted wireframe as required by the contest under "Source Files" in the sidebar should be included in your Source zip file.
Final Fixes
As part of the final fixes phase you may be asked to modify content or user click paths. See more information about Final Fixes.
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.