Beyond the Syllabus

UI/UX Designer
Guild Education

Beyond the Syllabus offers resources to adults going back to school so they can succeed in their classes and beyond.

My role

  • UI/UX Designer collaborating with the Marketing team at Guild Education to design a one-page website to serve as a resource hub

  • Created wireframes, high-fidelity mockups, and made design suggestions based on the content and the intended user

  • Used Squarespace to design a branded website for the launch

Results

  • A website for users to find resources for how to succeed in their classes and careers

  • Light survey to collect feedback to make sure the website is serving its purpose

Beyond the syllabus screenshot 1
Beyond the syllabus screenshot 2

Beyond the Syllabus website

Definition

Guild Education currently does not have a central location to send students to for school or career resources.

 

So we wanted to create a page to learn from where students can self-serve and find the resources they need.

HMW 1: How might we enable students to self-serve and find information to make them more successful in school?

HMW 2: How might we organize the resources to make it easy for students to find what they need?

HMW 3: How might we understand what resources that we don't have or that we have but isn't quite what the students need?

HMW 4: How might we keep students on the page long enough to explore through our resources?

Iteration and wireframes

Based on the requirements, I used Sketch to create some basic wireframes for the site.

The hub needed information for  had three categories, Community, School resources, and Career resources.

 

To keep the website simple and easy to navigate in, I decided to make it a one-page website where a student could find all they needed on a single page. Anchor links would be the main navigation interaction.

Student resource hub - Wireframe - 1600.png
Student resource hub - Filled Wireframe 1-1 - 1600.png

Wireframes for Beyond the Syllabus

Implementation and final designs

Once the wireframes were done, I designed the site directly in Squarespace.

 

I also worked together with the Graphic Designer on the team to decide on graphics for the hero image and other secondary images.

View the site here.

To address the HMWs, I implemented the following solutions:

Solution 1: Each section is action-oriented with copy like "Find a community" so the site answers questions a student may have.

Solution 2: Each category has its own section that the student can navigate to and explore.

Solution 3: I created a simple feedback form for students to give feedback on the site.

Solution 4: Each section has many different resources to explore, both on this site and the Guild-branded sites it links to.

 

With a few minor tweaks from the Marketing side, the site was ready to launch soon after I finished it in Squarespace. 

To provide space for students to give feedback, I created a simple Google form at the very bottom.

Beyond the syllabus screenshot 1

I'd be happy to talk more about this if you have questions. Thanks for reviewing!