devices_3.png

Lightspeed: App Redesign

Agency Client

devices_2_banner.png
 
 

About Lightspeed Technology

Lightspeed's instructional audio and video solutions reveal hidden insights to learning that are otherwise missed by students and teachers.  The Access product line engages the whole classroom, ensuring every student can clearly hear through low-volume, highly intelligible sound that is evenly distributed through the classroom.

The Activate platform is designed for small-group instruction allowing teachers to listen and assess where to best invest their time, gaining insights and observations without interfering. The Activate mobile app helps educators collaborate and share ideas by capturing high quality video and audio recordings of authentic classroom interactions. Teachers store and share these videos as evidence of learning, for self-reflection, for coaching, or to model a lesson for teammates.

 

How the Activate Platform Works

Each platform consists of three main components

Artboard.png

AUDIO SYSTEm

A pod sits with each small group keeping the teacher within earshot - but without disrupting - every learning moment. The wireless, battery-powered pods include a speaker and microphones to enable 2-way communication. Up to 12 pods can be connected to a single system.

ACTIVATE STATION

 In addition to charging Pods and Flexmikes, Activate Station is also the connection to teacher's mobile devices via Bluetooth for Pod control and audio streaming. Audio jacks make it easy to connect computers and other audio sources, acting as the audio hub for all your multimedia devices.

ACTIVATE APP 

The app allows the teacher to connect to each pod and the whole class to instruct, monitor and enable student sharing. It also records video synced with high-quality audio from the teacher microphones and pods. Teachers can capture critical teaching and learning moments.

 
1-2.png

My Role

Working closely with the Lightspeed Founders and Product Team, my role as the sole Product Designer was to identify key opportunities to simplify and expand on the existing functionality of the Activate Mobile Application. More specifically, I was tasked with re-imagining the video-collaboration capabilities to tie in deeper and more meaningful peer-to-peer engagement. I lead the UX work, producing all major deliverables and presenting these to the client between March 2018 and August 2018. In addition to the user-experience, I was also responsible for an overhaul UI uplift.

 

Objectives + Constraints

Our client approached us with two primary objectives —to enhance their app's functionality and usability; and to deepen collaboration between teachers and their peers. To coincide with a tight demo schedule we were under extreme pressure to move fast. On top of that, I was brought-on  midway through kickoff to replace the original Product Designer. We were tasked to deliver an iPhone high‐fidelity prototype to our technical production team within 3 months. The combination of a fixed deadline, app store submission time, security testing, and usability testing meant I needed to get the experience right in the first 8 weeks.

PROJECT GOALS

  1. Deepen peer-to-peer collaboration by creating a platform where teachers can share and engage

  2. Collect better data in order to provide users with more personalization

  3. Clarify value propositions and generally how the service works

  4. Create a flow that saves teachers valuable time by reducing the legwork it takes to share classroom content

KEY CONSIDERATIONS

  1. The design should be familiar upon first-use, introducing paradigms that are natural, effortless, and unobtrusive-- we should not be reinventing the wheel.

  2. Must balance: educating the user, the number of steps in the flow, and the amount of data collected with the ease of getting through the flow quickly.

 
 
PHP-Education-Wireframes.png

Understanding the Problem

A "problem first" approach rooted in empathy

 
 

Begin with Empathy 

The Scenario

Imagine you are an Elementary school teacher who teaches Math for Grades 3, 4 and 5 and Science Grades 4 and 5. Everyday you wake up at 6:30am to arrive at school 1 hour before your students to prepare lesson plans and setup your classroom for the day. From 8:30am to Noon you teach your first three periods, which is followed by a 1-hour lunch-break (that you typically work through),  and then finished with your last two classes. The day wraps with your free period which is often spent grading papers or exams,  followed by the occasional staff/admin meeting (occasional meaning: at least 2 times a week). Did we mention the all-too-frequent teacher/parent visits that get tacked onto the day? Or the several post-dinner hours grading exams that you could not get to during your lunch-break?  

Needless to say, your time is LIMITED with few windows available to spend collaborating with peers on lesson plans, evaluating student performance, and time for personal growth to enhance classroom methodology and techniques. 

You came to this job because you want to move every child forward, improve learning for all, and collaborate with likeminded educators who share your passion for teaching. You consider yourself a connected-educator: one who seeks collaboration with other educators, experts, and students, both locally and around the world.  However you struggle to achieve this level of competence because you find yourself spending most of your time dealing with day-to-day minutia and unexpected meetings that turn into time sinkholes.

Yes, these are all responsibilities that come with the job, but you wish there was a platform that allowed you to engage with your fellow educators in a more meaningful way. This kind of platform would not only save you valuable time and open opportunities to deepen your peer relationships, but it would provide a mirror to reflect and improve on your own personal performance.

"Being able to observe and collaborate on student performance together (rather than siloed) creates an ecosystem where the progress of every child is derived from a multitude of perspectives and viewpoints. This wholistic and multifaceted approach to education offers students a path forward that is intentional, free of bias, and in their best interest."

 

 
1-2.png

Problem Statement

With crowded calendars, today’s educators can be hard-pressed to find time to learn from each other. Agendas tend to be structured with district initiatives and teachers’ peer-to-peer collaboration-time may sometimes be limited to a four-minute passing period, lunch, or the few precious moments before or after students come into the classroom. Educators need a quick and easy way to to connect, collaborate, and engage with peers , parents, and students beyond traditional outlets.

 
 
solution.png
 
 

A re-imagined Activate experience—From a tool to a platform.

One that…

 
 
PHP-Education-Wireframes.png

The Approach

Strategy + Kickoff

 
 

A collaborative culture with lean UX

Due to time constraints I opted for a lean approach which emphasized rapid sketching, wireframes, user feedback and design mockups. This created early team‐wide alignment, and sparked tons of great ideas

 
1-2.png

Going back to the Drawing Board

Meeting with key stakeholders weekly helped us to understand their business challenges, goals, and constraints. Together we identified risks and aligned on expectations and constructed a shared vision for the app. Following this, I crafted an experience strategy outlining our phased approach and direction for the app.

 

Building trust through transparency

Sharing  methods and thinking from the outset helped to build a strong client relationship. Ample opportunities for input at all stages of the project built trust and created a safe environment to share ideas—forming a partnership which will serve much value beyond this phase. Coming on later to the project meant that I had limited time to make an impression, so it was important that I built that trust by showcasing my intentions openly. 

 
 
 
PHP-Education-Wireframes.png

Research + Discovery

A look into user needs, behaviors and pain‐points

 
 

Heuristic Evaluation

In an effort to uncover strengths and areas of improvement within the existing application I conducted a thorough heuristic evaluation. These heuristics proved to be a helpful starting place and offered a structure for presenting findings and recommendations. It also allowed me to collect feedback early in the design process and identify areas of immediate friction and discourse to focus my attention on— i.e. low hanging fruit that required minimal time and effort to improve.

Areas of focus when conducting my tear-down:

• Efficient Navigation
• Organizational Clarity
• Clear Labeling
• Consistent Design

• Matching User Expectations
• Effective Visual Design
• Supporting Readability & Scannability
• Facilitating User Tasks
• Providing Help

Canvas 1.png
 

Stakeholder Interviews 

It was crucial for me to establish relationships with stakeholders as early as possible as I viewed this as an opportunity to build credibility and establish a line of communication. My first order of duty was conducting a series of Stakeholder interviews with an objective of answering the following questions: 

  • What is the product? Who will use it?

  • What is this product is meant to accomplish?

  • What do THE STAKEHOLDERS think users need?

  • What customers and users are most important?

  • What challenges do we face?

  • How would the stakeholders like to be involved?

  • How do they define success?

 

User Interviews + Findings

Before we dove into ideation, we wanted to take a closer look at our users. Following  my Stakeholder interviews I conducted a series of 6 interviews with teachers and school administrators at their schools. The goal was to understand the user behaviors and get a sense for their motivations, pain points, and pleasure points. This provided us with a human-element that allowed us to emphasize and form a deeper connection.

Our interviews consisted of three parts

 
 
 
 
 
 
 
 

Personas

Our persona hypothesis consisted of four different archetypes which we used to facilitate discussions about our users needs, desires and varying contexts of use. Through careful analysis of our research, we uncovered patterns and trends and identified sufficient behavioral variables to segment our user audience. I came up with a personas that focused on their behaviors, pain points, goals and needs, and what they were lacking from the current experiences they use today. We discussed the personas with our client to develop a clear picture of who the design of the app would target.

“We used personas constantly throughout the project to guide design decisions, priorities, and create empathy amongst the client and our team.”

After designating persona types we were able to prioritize  who we would be focusing on supporting in the early stages. The phase 1 app focused on supporting the goals of Stacey and Roberta, our primary personas. We planned for later phases to support Stephen, and Loretta.

 
 
 
 
 

Research Findings

Consistent pain-points uncovered during initial user-research

 
 
 
4.png

Customer Journey Mapping

Storytelling and Visualization

 
 

Visualizing the end‐to‐end

We used experience mapping techniques to visualize and communicate the users end‐to‐end journey. This allowed us to represent user pain‐points and see where we needed to focus our attention. Mapping out the users emotions was key to setting client expectations about the aspirational emotional state we were aiming to design for. We used thoughts as a wait to empathize with what a teacher goes through throughout his/her day.

We approached the challenge first by deeply studying a teacher's workflow.

 
 
 
 
 
 

Designing with Intention

Synthesizing user needs and goals from our research served as a lens through which we could consider not only what the app should do, but also how it should feel.  Thinking about emotional design early on helped our client understand the importance of aesthetics and tone of voice to the experience.

Knowing who exactly I was designing for allowed me to ask myself how the app fits into the lives of the users. I imagined ideal experiences and focused on how our personas think and behave rather than getting into specifics about interfaces, technologies or business goals.

Keeping the scenarios at a high‐level allowed us to work fluidly and explore concepts that we could easily communicate with the team and client. They formed the backbone of our requirements, and allowed us to express these from both a functional and emotional perspective allowing for further empathy with our users

 
 
4.png

Exploration

Inspiration, Ideation, and Wireframes

 
 

extracting user stories + requirements

Combing through research and brainstorming the different things teachers do before, during, and after school to allowed me to come up with a broad set of tasks–quickly. From here I was able to rapidly sketch various design concepts and move fluidly into low-fidelity wireframes. During these early phases of design exploration I spent a lot of time studying social paradigms and patterns to make sure I wasn't re-inventing the wheel with overly-complex features or navigation paths.

My goal was to keep the designs stripped-down to their simplest core functionality with a lot of time spent narrowing the scope and re-aligning efforts of the client to focus on the MVP we were hoping to achieve. Building on-top fo the video capabilities posed a unique challenge-- staying within a realm of pre-existing structure, while completely re-imagining its capabilities. 

 
 
 

wireframes + user flows

Weekly design sessions with the client gave me the freedom to rapidly iterate on concepts and flows while staying out of the weeds of details and functionality. I sent bi-monthly annotated "Blueprints" to keep the feedback loops in constant cycle while continuing to re-think and polish the experience until finalized flows were agreed upon and more importantly, confidently achieved the goals  of our users. 

 
 
 
 

Setting the Design Direction

Thanks to modern technology, collaboration has become more efficient and manageable. There are a variety of benefits to using tools that connect us with experts all over the world, with teachers in the classroom next door, and face-to-face. With the growing popularity of apps like Snapchat and Facebook Live, capturing and sharing video is becoming a staple of our daily communication, to the point that it is changing the way teachers collaborate and share their insights. This became the cornerstone of our design-thinking— it was important for us to keep video content-creation at the heart of the experience.

Through our research and ideation phase, we narrowed the scope to four areas that we needed to focus the experience on:

 
 
 
 
 

Proposed Experience

We took a top‐down approach to defining the overall structure of the experience. Sketching, I generated stacks of ideas about the arrangement of UI and functionality.I defined the primary pathways our personas would explore through the app. Crafting several key user journeys for each of our personas, was the best way to conceptualize and structure the proposed content and functionality. I began to think about particular usage contexts, the opportunities they present and how elements manifesting themselves in the interface would help to support the user.

 
 
 
 
 
4.png

Refinement

User Testing, Iteration, and Defining the Visual Language

 
 

User Testing + Iterating

With a tight timeline we had minimal time to user-test with a broad set of users. I had to get scrappy with testing and in retrospect this would be the one area I would have liked to have more breathing room for. That said, I was able to conduct enough testing to go through several rounds of iteration. It was important for me to make sure the primary flows were locked down and accessible.

 

Defining the Visual Language 

Once our designs were in a stable state we were able to begin to piece together and define a new visual language for the experience. I took inspiration from apps such as Duolingo, Pinterest, and Airbnb. I appreciate their minimal use of color and lightweight approach to visual designs— I feel it allows the content to be center stage.

My approach was to keep the interface clean, minimal, and bright. I aimed to remove the “weight” and bulk from the previous look and feel, allowing the UI feel airy, fresh, and inviting. Education is a space that is playful yet straight-forward; this was my mantra during visual exploration. I focused on using an ample amount of white space to allow the eye to flow effortlessly from screen to screen. I was able to reduce the navigation options from 5 to 3 and revamp icons, font styles, buttons, and interaction paradigms.

 
 
 
 
 
4.png

Final Designs

Design-Solving and High-Fidelity Designs

 
 
 
explore empty.png
Phone.png

Saves Teachers time

  • By trading videos, the teachers save the time they would’ve spent discussing the lesson, and “see” into each other’s classrooms without disrupting their students or having to track down other teachers

  • Posted content acts as digital record on how students progress, saving valuable instructional time

  • A streamlined posting-flow, allows teachers to rapidly record and post content in an efficient and easy way

  • The "explore" tab gives teachers a fast and easy way to discover content, and contribute to the discussion

  • User profile aggregates content in a singular destination, making it manageable and efficient to sift through after a day's work

 
 
 

From a Tool to a Platform

  • Provides a communal experience where educators are encouraged to actively create, share, and contribute to their passions together.

  • Teachers can share content with administrators or coaches after-the-fact therefore no key "ahah moments" or critical student interactions are missed or looked over.

  • Promotes peer-to-peer collaboration and dialogue by increasing time to connect, and giving educators a platform to comment and engage with content directly

 
 
 
 
 
profile empty state.png
profile.png

Promotes sharing and peer collaboration

  • A Personal Profile is a new addition to the experience allowing teachers to quickly access and share their content.

  • Teachers no longer have to hunt down their recordings or delete when their is an error. All content is aggregated into a single destination with the ability to delete and edit content at any time.

  • Group functionality allows teachers to control how they share their content to protect student privacy

  • Advanced settings are now consolidated and organized making it efficient and effortless for teachers to manage their account and Activate System.

 
 
 

Inspires independent learning & Self- Reflection

  • Educators can bring moments back to life, allowing others to experience the authentic conversations that occurred between students more than once

  • Educators can learn new methods when revisiting saved video lessons or viewing their peer lessons

  • Ratings and Criteria Tags attach measurable metadata to each recording, tracking data for future product improvements as well as collecting trends and patterns to further inform educators and administrators

 
 
 
 
 
Rectangle.png

Reflection

Reduce First-Time User Experience Friction
It is important to make users feel like getting started is an effortless and streamlined experience. I would like to reduce the amount of steps it takes to get started (especially with the system setup) and clearly introduce the technical elements in way that is more organic and contextual.

Design is Collaborative

The process of developing Lightspeed involved not only designing a thoughtful user experience but also identifying opportunities to innovate, making trade-offs for production and cost and creating compelling storytelling to customers. Cross-functional collaboration also took great part in this project, where we resolved conflicts, made compromises and set clear team values, to achieve our final design.

Continue to Emphasize Privacy
Recording content in a classroom environment with children t is tricky and requires teachers to be self-aware, thoughtful, and intentional with how they use the app and choose to share content. Tightening up privacy control and coaching teachers on how to ethically use the app I think is an important part of making this app successful.

I Am Not the User
With users participating along my design process, I have gained more comprehensive understanding of different factors surrounding the problem to reduce my design bias. I also found the iterative approach extremely critical to my design, and prototyping rapidly played a role in the process. Getting feedback from real users helped me to validate the hypothesis and refine my design at all levels.

4-2.png

Next Steps

Visualize Onboarding
Creating an on-boarding process to inform the teachers about Lightspeeds benefits and how to use it.

User-Test with a Build

I'd like to do further design testing with an actual build so no interactions or nuances are missed. I have found that doing a sequence of thoughtful beta-tests yields the most fruitful feedback.

More Interviews
Limited upfront research time made it challenging to get a broad set of perspectives. As a next step I would like to sit down with more teachers, administrators, and parents to round-out feedback and eliminate any potential bias that made its way into the designs.

Expand on Data Collection
Our MVP for data collection was a very focused effort to start collecting metrics. I’d love to do more research and identify ways to expand this component of the experience. Tracking performance metrics was a value proposition we heard teachers

Customization of Information By Teachers
Introduce the ability to create events and meet-ups with likeminded peers.
Introduce new features that expand on collaboration beyond video.