BrainStation Student Portal Redesign

This is a group project I worked on while studying at BrainStation. BrainStation is a progressive technology school that offers both part-time and full-time technology courses in digital marketing, web development, user experience and user interface design, etc. Currently, students accessed their course materials, weekly challenges and events updates through the student portal.

Project Scope

 

Tools

The Challenge

 

Teaming up with three other members, we were instructed to the adapt the Design Sprint methodology to redesign BrainStation educational student portal. The Design Sprint method was first developed by Google Venture. It is an effective product management and creation tool that quickly defines the problems to be solved, generates quick initial ideas, creates working prototype and performs user testing just in five days.

 

Our Goal

 

To empower students and alumni with intuitive access to educational information and to foster a community share environment.

 

 

The Design Sprint Process


We were asked to complete this task in 4-days with high-fidelity wireframes instead of a traditional 5-Day sprint creating low-fidelity wireframes.



Day 1 - Brainstorm Ideas and Mapping

 

We analyzed the present student portal to identify the existing problems and areas of improvement. We conducted interviews with students who regularly use the portal to better understand their gain and pain points, behaviors, needs and wants. We identified the target users, made the assumptions and wrote the "How Might We..." questions. After voting on the HMW questions, we set the direction for the portal redesign.

Possible portal improvement:

 

Accessibility
• easy onboarding process
• easy access to course files and related resources

• simple interface

 

Education
• listing and sharing of resources
• listing of educational events

Management
• daily course agenda
• track project progress
• platform to upload projects
• project to-do-list

Communication

• students receive / request feedback in their work

• engage instructors on the portal and give feedback

• help each other when we fall behind
• topical  discussion forum

 

Job/network building
• help students to find job

• notification of events within the tech community

• stay connected with BrainStation community

• job posting board

 

Mentor-ship from alumni for current students
• profile pages for alumni and students
• mentor matching platform

 

Target User

• millennial, career switcher, tech savvy

• current students

• alumni

• users who want more out of the portal

• users who want portfolio feedback

Assumptions of users

• want to download course files easily

• want to upload work online

• want project feedback from instructors and students

• want support from each other

• want help with jobs search

• want to find information in one click

• want a simple easy access portal

• want to track project progress

 

Other groups in the class focused on the management redesign of the portal to track student weekly challenges, daily class schedule and course materials, our group after much debate and discussion decided to take a different approach. We decided to focus on job and network building and wanted to add a section with contents and resources that helped students and alumni to network and find work through job referral and mentor-ship program. We then mapped out the user flow.

Day 2 – Research & Sketching

 

We spend some time to research on portal design inspiration before sketching. We then focused on rapid sketching and refining our ideas.

Few Research Inspiration and Rapid Sketching:

Day 3 – Finalize Solution and Feedback

 

After rapid wireframing, we staged an art museum for speed critiquing and silent dot voting to decide and pick one direction. We gave and received feedback from each other. I then drew the storyboard.

Day 4 – Hi-Fidelity Wireframes and Testing

 

We assigned each team members to create high-fidelity wireframes for the portal. I was responsible for the job pages. We included the dashboard, alumni network, and job board following the branding of BrainStation.

 

The job page wireframes that I worked on:

Other wireframes that my team worked on:

Refinement

 

I made refinements according to the user test results after the Sprint week:

  • On the job pages, the job filter area was moved under the search area.
  • Labels for the icons on the vertical bar were added for clarity.
  • Card style was added to the student/alumni profile page to match the job page visual style, and made the information to be read easily.
  • Overall visual design style was unified throughout all pages. Dashboard was redesigned.

 

Copyright © 2017 Lai-Kit Chan

  •  

BrainStation Student Portal Redesign

 

This is a group project I worked on while studying at BrainStation. BrainStation is a progressive technology school that offers both part-time and full-time technology courses in digital marketing, web development, user experience and user interface design, etc. Currently, students accessed their course materials, weekly challenges and events updates through the student portal.

 

Project Scope

 

Tools

TOP