Derek Blancey
UX Research & Design

LectureTools

Interactive Learning

Product Overview

LectureTools is an interactive web app for use in large lecture classrooms that allows students and instructors to interact with one another in real-time. The company was acquired by Echo360.

LectureTools is an interactive web app for use in large lecture classrooms that allows students and instructors to interact with one another in real-time. The company was acquired by Echo360.

Requirements and Goals:

Design an intuitive, easy-to-use web app that would provide value to both students and instructors

Instructors should be able to prepare interactive slideshows, present activities in class, and assess student understanding in real time. Students should be able to engage with the instructor and other students.

 Early lo-fidelity mockup of NexText the grad school project that would become LectureTools.

 Early lo-fidelity mockup of NexText the grad school project that would become LectureTools.

My Role:

  • Student and Instructor Interviews
  • Contextual Inquiry
  • Heuristic Evaluation
  • Information Architecture
  • Specification Definition
  • Wireframe Design
  • Prototype Design
  • Usability Tests

Tools:

  • Balsamiq
  • Photoshop
  • Illustrator
  • HTML/CSS/Javascript

Discovery

Affinity Diagram comprised of notes that were gathered from interviewing many students and instructors at the University of Michigan.

Affinity Diagram comprised of notes that were gathered from interviewing many students and instructors at the University of Michigan.

Defining the product with Instructors and Students.

LectureTools grew out of a grad school class in which a professor pitched a project with a question: "What if you had all of the world's textbooks available online?" My interest was piqued by the question and I put together a team of 5 students to design a study aid called NextText. At the end of the semester the professor was impressed by our work and we all decided to form a company that would incorporate the study product that we designed with a web app that he had been using in large lecture halls.

While with LectureTools I headed up the user experience research efforts, performing contextual inquiries with a dozen students and instructors. After the research phase I was part of a two-person design team, and together we designed all of the interactions of the 3 modes of use within the app: Preparation, Presentation, and Assessment. Through iterative design cycles we accomplished the initial goals set out in the project by creating an innovative web app for use in large lecture halls.

The product and company that we created is LectureTools, a way for instructors to more readily engage their students with interactive activities, quizes, and slideshows, while also gauging student comprehension. Students use the app both while in lecture to annotate slides and perform activities, and also outside of class using the study mode that was initially designed as NextText.

Design

Hi-fidelity mockup of Instructor Interface.

Hi-fidelity mockup of Instructor Interface.

Wireframes

A colleague and I were responsible for all wireframes of the various interaction modes of the Instructor and Student interfaces. Using balsamiq, we designed the app over the course of 5-6 months, iterating on feedback we received from usability tests and our engineering team. Once all wireframes were designed we created a clickable prototype in Powerpoint that we used to display the layouts and interactions to the rest of the team. 

After presenting the clickthrough prototype to the engineers we handed off all assets to them and they began to architect and build the system. Our graphic designer used the Powerpoint prototype to provide a high-fidelity mockup of the screens and to create the assets that were used in the app.

Usability Validation

User Testing

This project provided the most and resources time to do sufficient user research given that we were doing some the usability tests as part of classwork, and because we had access to our exact demographic: college instructors and students. This allowed us to do multiple rounds of research, starting with interviewing our primary demographic in order to find out how technology might better serve them in the classroom. This gave us a rich feature set that would go on to be incorporated into the final product.

In addition to user interviews, we also performed multiple rounds of usability tests that we would use to ensure the conceptual understanding and usability. After analyzing the various rounds of usability tests we would modify the design and design new iterations of the product.

Lessons Learned

This was the first project that I ever worked on as a UX Researcher and Designer, and I learned a great deal about every aspect of product development from initial ideation to going to market. Being a part of the process from the beginning has subsequently helped me in multiple startup roles, and in agency work when working on different products from conception all the way through user testing, engineering and QA.

I also learned a lot about entrepreneurship, as we were a part of the University of Michigan incubator, the TechArb. In this program we were mentored by local business and technology experts who had worked on many different products over the years, and their feedback and mentorship were invaluable in the development of my understanding of creating usable products for a viable market.