Campcademy — learn a new language
For this third week of UX/UI bootcamp, our challenge was to help a fictional workshop camp create an engaging online experience for students that for some aren’t able to attend the real camp.
This made-up workshop camp offers different kinds of courses, such as yoga and cooking, but me and my partner of the week chose to focus on creating a mid-fi prototype of a happy path for attending a language course.
Unlike the previous weeks, this week it was up to us to plan the whole project, prioritize which tools we wanted to use and set deadlines for ourselves.
Empathise
The first thing we did was to write down the CADIs (certainties, assumptions, doubts, ideas) for the aheading project — what do we know, what do we assume, what do we need to understand? With room for adding any ideas popping into our minds.
Survey & interviews
Based on this, we created a survey and with the responses in our hands, we conducted four interviews.
This research gave us many useful insights, including:
- What mainly keeps people motivated and engaged when learning something new includes gamification of the learning, interaction with other people, a sense of humor, getting feedback, practical activities and seeing their progress.
- Problems that people have with online learning is that you easily get distracted without a routine, that it’s hard to find the time and energy for both work and studies, and that it’s hard to learn without support and practically apply the skills.
- But — there are also positive things with learning online, including time management, the ability of having a flexible schedule and the use of effective, digital tools.
Competitive analysis
While waiting for our survey results, we analyzed the market to see what is already out there and what opportunities there are.
The four apps that we compared focused on either fun or interactivity, and none of the apps had access to professionals. Thus, the gap on the market we found was in combining social interactivity and having fun while learning a new language.
Define
Our insights led us to create a How Might We statement, which is used to turn user frustrations and needs into opportunitities, as follows:
How might we make learning a new language both fun and interactive while keeping the routine and support that a school provides?
We also created the persona Joana.
In order to understand Joana’s user experience with learning a new language, the context in which she does it, and to identify opportunities, we made a user journey.
This shows the current path of her starting a language course — from the trigger-point that leads to the decision, the browsing of different alternatives and engagement in an app, until she loses motivation and discipline since she misses interaction, support and practical applications.
Summarizing all of our research, we had a quite clear grasp of what we needed to solve. Obviously, people want to be a bit flexible, but still have a routine and a community to receive support from. They want to have fun and make conversations with other people and get practical.
Ideate
We kind of brainstormed during the whole process, but put together our thoughts in a final brainstorming session, and managed to achieve the goal of defining a concept quite quickly.
Concept testing
Concept testing allows us to test our ideas in the early stages of the process without going into details, but still collecting user feedback on the idea.
We targeted users for whom the product might be useful — that wants to learn a new language in a playful way — and presented the idea to them. We described how it would benefit their lives and evaluated the product based on their responses.
The feedback in this phase was in general very positive, people were really into our idea of the interactive challenge games. However, we got some feedback on the importance of flexibility and having small groups rather than whole-class lessons. They also stressed the importance of doing practical exercises related to the podcast lessons.
Site Map and User Flow
Next up, in order to understand how all the content we had in our minds would connect and be displayed for our users, we created a site map (or maybe more of a site-flow). We thought about how we could structure the navigation bar, if we would have an additional menu, and which flow we would focus on as our happy path.
We decided to go for the flow of showing how the user during the weekday completes today’s lesson, including listening to a podcast, reading the related dialogue and vocabulary and complete an exercise.
Now, with the site-flow in place we were ready to make the wireframes for the chosen flow.
Prototype & test
We made the user flow as lo-fi wireframes using Invision Freehand (for me it was great to discover this super cool tool!) in order to have something for our users to test.
Lo-fi prototypes are good for validating the idea and defining the preliminary layout. We wanted to know if the navigation and interactivity is intuitive and how easy it was to perform the task.
With a bit of refinement, we made it to our final concept and mid-fi user flow and tested it in order to define navigation, the structure of information and user interaction.
After a couple of smaller iterations of testing and revising the prototype, we felt satisfied with the final concept and prototype.
Let me present…
And here goes our final prototype:
Learnings
This week was the best so far, it was great to have the freedom of managing your own project and still have support from the teachers at any time. It was very educative and I believe me and my team mate Laissa complemented each other very well and had a good flow throughout the process. From all the groups I’ve worked with so far, I’ve gained a lot of learnings and insights.
- Even though I’ve been so immersed in the UX processes and tools these last weeks and feel more comfortable with the UX design approaches — it’s clear how many ways there are to work with the different design tools and that you have to tailor the use of them for every new project.
- For usability testing, I want to try different approaches next time — let the user explore on their own more and just write short instructions on a note on the side in order to receive feedback on the bigger picture.
- Don’t printscreen wireframes in one application and try to make prototypes in another application… creating the wireframes in Figma from the beginning will save you a lot of time and effort!
Thank you for reading!
