NextLesson Glossary

NextLesson Glossary

A feature of our interactive tool

After the initial version of our interactive learning tool was live, it was up to the curriculum team to fill it with amazing lessons. In the meantime, we focused on new features and learning tools. Since many of our lessons centered around real world jobs—like accountants and sports team managers—there were bound to be industry-specific words that students wouldn't know. We set about building a “toolbox” that a student could use. We had visions of many tools down the road, but for now, the first tool would be a glossary.

The User Experience

When a student encounters a underlined glossary term, they can click on it to see the definition. A little pop up tooltip will tell the student the definition and show an image if there is one. They can also access a list of all the terms in the lesson by going to the right hand toolbar and clicking on the glossary icon. This will slide in the list of glossary terms in the lesson that they can look over.

A video depicting the two ways you can view a glossary term's definiton.

Having the experience unobtrusive was key, because we didn't want students to get distracted. Rather than open up separate tabs or new windows, we intergrated it as much as we could. This lead to the side toolbar. The secondary vertical pane that shifted out of the toolbar also served a great place to hold the table of contents, which allowed quick navigation.

The Visuals

We had a variety of concepts and objects to diagram including careers, mathematic principles, and industry‑specific terms. Fortunately, I had a library of image assets that I'd slowly created over time, making this task a little less time-intensive. However, it still required a bit more thought over how to illustrate more abstract concepts like “viable” and “hypothesize.”


Vector Illustrations

2016

  • Illustrator
  • Sketches

Vector Illustrations

2016

  • Illustrator
  • Sketches

The User Experience

When a student encounters a underlined glossary term, they can click on it to see the definition. A little pop up tooltip will tell the student the definition and show an image if there is one. They can also access a list of all the terms in the lesson by going to the right hand toolbar and clicking on the glossary icon. This will slide in the list of glossary terms in the lesson that they can look over.

A video depicting the two ways you can view a glossary term's definiton.

Having the experience unobtrusive was key, because we didn't want students to get distracted. Rather than open up separate tabs or new windows, we intergrated it as much as we could. This lead to the side toolbar. The secondary vertical pane that shifted out of the toolbar also served a great place to hold the table of contents, which allowed quick navigation.

The Visuals

We had a variety of concepts and objects to diagram including careers, mathematic principles, and industry‑specific terms. Fortunately, I had a library of image assets that I'd slowly created over time, making this task a little less time-intensive. However, it still required a bit more thought over how to illustrate more abstract concepts like “viable” and “hypothesize.”

Revenue

Viable

Agility

Baker

Cost of Production

Video Wall

Production Costs

Entrepreneur

Marketing

Counting Principle

Critically Endangered

Budget

Median

Coupons

Critique

Telephoto Lens

Personal Shopper

Stage Manager

List Price

Pricing Structure


Other NextLesson Projects

Nextlesson Search and Browse

NextLesson InterestID

NextLesson Glossary Terms

NextLesson Characters

Back to all projects