Design Process

Research & Validate

Since Canopy was newly launched and did not have concrete data of its user base, we predicted our ideal user for the product with a provisional persona and conducted user interviews with people who had an interest to learn stock-trading and have used learning platforms in the past. We asked them questions regarding their learning behaviors and previous experiences.

We found 4 key insights from this process:

• Users wanted short, bite-sized lessons when learning new material 

• Users wanted elements of interactivity within the lesson to keep them engaged 

• Users wanted structure to their learning process 

• Users were unsure what level they were considered regarding knowledge of material

Researching best practices for the learning platform industry, we examined successful models, such as Duolingo and Codecademy, to discover which attributes they had in common and to figure out which methodologies were considered most effective.

We noted pros and cons for each platform and agreed upon which we thought had potential to be best suited for Canopy.

Ideate

With our persona’s needs and industry inspirations in mind, we started our extended version of the Google Ventures Design Sprint. Normally, this whole process would be conducted in a week, but instead, we spanned this over the course of a couple weeks.

We conducted an idea dump of all possible directions we can take in order to create an engaging learning platform for users. Some ideas I pitched were having short, bite-sized lessons with quizzes scattered throughout and a type of scoreboard with friends to drive engagement through competition.

We then narrowed our scope to what we could accomplish for the version 1.0 of the web application.

Wireframe & Feedback

We started our sketches with a round of Crazy 8’s, an activity where we sketched 8 lo-fi variations of our design ideas in 5 minutes. Using a mobile first methodology, we focused on the course roadmap and the lesson page. Gathering insight from each other’s work, we continued on to sketch out a full-page layout, one for the roadmap and one for the lesson. I decided to focus on the lesson page, and helped create the baseline for the final product.

Next, we created 3 separate wireframe flows and invited the Founders in to validate decisions in a design review. Together we aligned on the overall vision, look, and feel of the product.

Prototype & Test

After critique, we converged on a singular design we decided would solve the problem in the best way. For the roadmap, a card UI was favored for its ability to scale from small mobile screens to large desktop windows. For visual interest and engagement, icons and progress bars were introduced. In the lesson pages, the content would be divided to one (mobile) page views with quizzes and lesson summaries throughout to ensure user learning.

A prototype was created using Pixate and we tested it with 6 users. Although 7 users would have provided more statistical significance, the result from testing 6 users was enough to inform our next steps in the process. We walked users through a usability test and asked them comprehensive questions.

Unfortunately, most of the confusion from our users came from misunderstanding the dummy content in the prototype. In our next iteration, we used more relevant copy and iconography.

Iterate

Despite this, there were some aspects that went incredibly well: all users understood it was a learning platform, knew how to start a lesson, and liked the interactivity within the lesson. For everything else, we mapped out all the pain points we needed to address for our next iteration.

We made the appropriate changes to our prototype from the results of our first testing. To combat the confusion with our dummy copy and iconography, we also took our designs into high fidelity.

For consistency, we tested another group of 6 users.

These results were much more agreeable and from here, we only made minor changes were needed before the final deliverable.

One thing we had to unquestionably address was our “cheat sheet.” Although our comprehension testing told us users enjoyed the idea of having a lesson summary, “cheat sheet” was indecipherable to users. We decided to simply rename this as “lesson summary” for our next iteration.

Here are some screen examples of the evolution of our prototypes.

Next Steps

For next steps, we encouraged the Canopy team to:

• Conduct another round of testing using “lesson summary” instead of “cheat sheet” to confirm users' understanding 

• Arrange lessons by topic to resonate with users who do not know their level of knowledge (currently it is in the form of “levels of difficulty”)

• Research other forms of engagement to create an even more dynamic learning platform

The Canopy is now working on implementing the changes we have proposed.