What is Crowdschool?
Crowdschool is a project-based learning platform for both teachers & students.
Tools Used: Whiteboard, Sketch, Invision
Duration: 1 Week
My Role: The Sole UX/UI Designer
Crowdschool's platform tested poorly in usability, and was aesthetically outdated.
To redesign the current platform's usability based on user testing, and to do an initial pass on a UI update.
(or scroll down to watch a video of the walkthrough).
from problems to solutions
1. testing the previous design
Crowdschool's designs tested poorly in UI & Usability, and my goal was to change that.
2. creating a better design based on results
After user testing the previous designs, gaps were identified in order to create solutions for an optimal experience.
User Goals / features
The site needed a design for Persona A; the teacher, and persona B; the student.
For the sake of keeping this to a minimum, I will focus on Persona A, the teacher, and the "projects" section.
Teachers Goals for Classroom Projects:
1. I want to have the ability to create a project overview that is easily editable.
2. I want to add resources for my students that can include articles, videos, presentations, graphs, etc. (with easy option to edit, delete).
3. I want to add specific assignments per each project (with easy option to edit, delete).
4. I want to grade students on each assignment per project, and have an overall average score (with an easy option to edit, delete).
5. I want to easily be able to jump from resources, to assignments, to grading-- and know where I am without any confusion.
6. I want to share a project with (1) a classroom, or (2) more than one classroom.
7. I want to have a view of all my projects, and easily jump to and from individual projects.
A/B Testing Different Designs
I tested the top two designs for the teacher’s flow on 10 different users to see which one was more intuitive and user friendly.
Design A: Divided into sections with a Top nav
Design B: All in one with a Side Nav
results: Design b is the winner
1. Design A felt emptier than B.
2 Positive: All the content in B was in front of them / Content felt more connected in one place.
3. Positive: It was easy & intuitive to jump to different sections in B.