International State Academy

Portal Design Challenge:

8 Hours

In a team of three, we were challenged to design an education portal for three personas: Teacher, Student, and Parent. All three portals must be on different platforms, and we must decide collectively which platform suited each user’s needs. Within the first hour of collaborating, the three of us agreed on the distribution of responsibilities as follows:

Group Responsibilities:

Julie Deleval: Teacher (iPad view)

Steven Roberts: Student (Desktop view)

Jessica Liang: Parent (iPhone X view)

International State Academy (1).png

Value Definition

We defined the purpose of the portal in order to design cohesively and productively, addressing the needs of our personas.

International State Academy (2).png

Personas and Needs

We split up to analyze the needs of our specific users, and prioritize certain services over others so that we could create an organized and useful interface for each user.

International State Academy (3).png

Information Architecture

We set up the portal structure of the client “State Academy” by analyzing how information transfers between users in the real world. We defined how the users interacted with the school, specific classes, assignments, and grades. The general hierarchy is as follows: Teachers (with multiple classes) produce results that Students would receive. Parents are then notified of the Students’ results.

International State Academy (4).png

Portal View: Teacher

The Teacher’s priorities are: the multiple courses that they teach, followed by the classes (groups of students) taking each course, followed by the students within each class. Their main responsibility is to grade assignments, so Julie prioritized this task on top, followed by the statistics (class averages). The left side navigation bar and other buttons are optimized for a larger screen tablet interactions.

International State Academy (5).png

Portal View: Student

The Student’s priorities are: viewing all their courses, assignments, and their grades. Steven added a schedule in order to remind the student to attend classes on time, future/past assignments and their grades, as well as a navigation bar on the left. Just like Julie’s iPad view, the Desktop design is optimized for larger widescreen interactions.

International State Academy (6).png

Portal View: Parent

The Parent’s priorities are: viewing the profiles of their children, their children’s schedules, upcoming alerts (due dates, notifications), and an overview of their academic reports. A mobile interface makes sense for a parent, who can conveniently keep track of their children’s progress, since they likely have other daytime responsibilities as well. The stages of interaction are optimized for a smaller mobile screen, easily being able to toggle between multiple children’s profiles and a long continuous scroll, while benefiting from a direct bottom navigation bar.

Our collaboration process began at 9am, and we had to present our entire case by 5pm. We found that our initial definitions were foundational to our organized process: we focused on the core needs of each user, and we stuck to our brand identity by using Google Drive to harmonize our customized asset libraries. This continuous proactive effort shows in our final products. Our audience responded with feedback that “our three platforms look seamless when put together”.

What a valuable experience this was! We now have real results of our 8-hour focused efforts to collaborate effectively and create intuitive designs.