Project Description

At Vista Higher Learning, I was one of two UX Engineers. Since there are a lot of different titles thrown around related to UX and UI designing and developing, let me elaborate somewhat on what we actually did - The two of us were responsible for creating wireframes and determining the user flow, working with the design department to ensure that the mockups covered the scenarios we thought would come up (as well as intended functionality), working with the backend developers to ensure that the designs were clear and any questions were answered, and then actually doing the design integration and reviewing with the design department. There were roughly seven backend developers for each of us, so we would often jump between projects depending on what was required in a given week.

The overall projct that we were working on was an Online Language Learning Platform. Vista Higher Learning had been publishing foreign language textbooks for years (the company formed in ~2000) and we were on the cutting edge of trying to translate that experience to the web. I was brought on in April, with the platform launch taking place in August (just before the new semester), which meant that I was able to see first-hand how a large project launch happens. Since we only did major feature releases between semesters, I would get a lot of experience with the excitement and worry that comes with such things.

The platform began as a “companion” application - where students and teachers would have accounts, and students could complete activities. Some of them were ripped right from the workbooks and were simple enough that grading was automatic (for instance, “true/false” or “select the answer from a dropdown”), while others were more that the teacher had to grade - things like “short answer” or even “essay” questions. The teacher then also had a Gradebook where they could view how their students were doing, see if any activities in particular gave the trouble, and so on.

As the project continued, we began to expand our offerings. Not only did we want to be able to support classes that were entirely online, but the activities we were offering felt somewhat… not exactly outdated, but out of place with the rest of the platform. They were analog on what was otherwise a digital experience. We began to do more with them as a whole - things like “listen and repeat” audio recording activities, or even “partner chat” activities where two students would record themselves having a conversation together. After all, a fair amount of learning a language is not only knowing the grammar in the abstract, but the application of being able to hear and speak it.

We also added functionality to allow things such as teachers creating their own activities, or adding detailed notes or recorded response to a student’s submission. We built a vocabulary page, where a student could save and tag words that they routinely had trouble with, and could then go through flash cards to help get better with them.

There was a lot more being added around when I was leaving about the notion of “education tracks” - that is, as a teacher when you created the course and set how many weeks or months long it was, the system would give you a recommendation of how many lessons and activities it thought would be reasonable to complete in that time, with added gradnularity if you were intending it to be a particular novice or advanced class.

The majority of the website was built in straight HTML/CSS/JS, with a Ruby on Rails backend. During the last 8 months or so that I was there, we also began to use AngularJS to build new activites, particularly to go with the idea of having classes that were strictly online. In one instance, for example, there would be a video of a teacher in front of a blackboard, who would be explaining the lesson, and at various points the video would zoom into the blackboard and seamlessly transition to having an activity on the board itself, giving an integrated learning & practicising exercise directed at the individual.

We also enhanced the ways that students and teachers could communicate. A teacher could specify that they had office hours, allowing a student to request a live chat with them during those periods. Additionally, we added the ability for students to request clarification or help on any activity - either before or after submitting it, and even for things that were automatically graded. It allowed the student to give the teacher more insight into why they may have gotten the wrong answer, and open up more dialogue to help them learn from their mistakes.

I wish that I had more screenshots of the things that I had worked on, but I lost most of them in a harddrive crash. I did stumble across a SuperSite Training Video listed publicly on YouTube, so I’ll share that for lack of anything better. Though it is from mid-2013 and I remained with the company for another year after that working on more features, it does show many things that I had a hand in creating, including impersonating a student, the “table of contents” view of a book, the vocabulary feature, an assignment calendar, the gradebook, and several activities including partner chat and recording. There are other videos on the channel that show more things that I worked on if you would like to poke around further, but this one gives a decent-enough overview for our purposes.

Reflection

There is a lot that I learned at Vista Higher Learning, and I’m incredibly grateful to have had the opportunity to drive things forward as much as I did during my time there. As someone who is a perfectionist and tends to grow to dislike most of what they’ve made, I’m (years later) still incredibly proud of the work that I did there, and how the company continues to strive to make a difference for students opening their minds to the languages and culture of others.

Role

UX Engineer

Technologies Used

  • HTML
  • CSS
  • Adobe Photoshop
  • Javascript
  • jQuery
  • AngularJS