What if teenagers had a more engaging way to develop career skills?
It was late Spring, and Ivan Cestero had Summer on his mind. But he wasn’t dreaming of beach vacations.
Ivan runs strategic partnerships and career-connected learning at Portal, an education non-profit based in Los Angeles.
This time of year is always an important time for students. But this year it was also important for the Portal’s team. They were entering a critical time in the organization’s journey.
Portal was pivoting away from ‘micro campuses’ on the premises of their partner companies to a more fluid and scalable offering - licensing their unique peer-to-peer focused curriculum and approach to other organizations (mainly schools and non profits).
Sounds simple? Perhaps. But - as with any startup in pivot mode - it was definitely not easy.
To help navigate this new chapter, Ivan reached out to us. But this wasn’t the first time we’d crossed paths.
A year previously Howard had joined a Slack channel called ‘Future of Higher Education’. After pinging an intro into the #introductions channel, a DM arrived from Ivan.
They soon got together for a chat - spanning not just education, but electronic music, local club scenes, and beyond.
At this point Ivan was working at another EdTech company. He kept in touch, catching up every couple of months or so. When he started at Portal, he asked if Wavetable could contribute to a new project he was working on.
‘Portal Consults’ were a series of immersive design challenges Portal ran with local and global industry partners. Working from custom briefs, student teams would use design thinking and entrepreneurship tools to develop and present solutions, documenting their journeys along the way.
Joining partners like Snap, Belkin and Carnegie Mellon University, we co-created a brief linking fast fashion and our Edutainment 3.0 trend report, and set a student team to work on it.
Here’s the rundown (and a full case study)
One of the other Project Consults initiatives was called ‘Portal Cards’. Students in this project team collaborated with Carnegie Mellon University on new ways to make student skills more accessible and legible. They did it via the creation of digital artefacts, kinda like interactive baseball cards.
Each Card focused on a particular skill, and contained a bunch of prompts, questions, activities and other content. The goal was to encourage a student to think about that skill and how it related to their own life, and then go out and explore it - and share their work with peers and teachers for input and feedback.
The concept the students came up with was pretty cool. But it needed a few iterations to make it usable in a real setting. Alongside this, Ivan had his own prototype of a Cards solution with a more detailed taxonomy (i.e. set of fields relating to each Skill).
This one was built in Google Slides, and although it integrated with Portal’s current Google Classroom setup, it was kinda flat and lacked design polish.
Ivan wanted to expand on the project as he sensed something valuable within both concepts.
He also knew he wanted:
a) to move away from Google Slides and Docs, and
b) Portal to have their own digital products they could share with students in other schools
‘Cards’ was to be the first of these products - where students would spend time using the cards for self reflection and goal setting, then later use a dedicated digital platform for uploading all their work.
But this felt like a big challenge.
How do you go about tackling this in the most optimal way?
And who’s got the right blend of expertise to help?
Which brings us back to that moment in late Spring when an email landed in Howard’s inbox.
Two of Ivan’s biggest goals for this first version of Portal Cards were:
But there were two big challenges to bring the Cards project to life:
We put three of the team on this project: Howard (project lead), Fer (strategy and LX design), and Dani (branding and digital design).
Portal also enlisted four of their students to join us as ‘Micro Interns’. They were paid for the duration of the project to each work with us for around 6 hours each week.
This meant we had some extra resource, but we also needed to tweak our workflow so they could join in without getting confused or overwhelmed.
We initially agreed to do two things:
This first proposal assumed some kind of custom development. But something didn’t feel right. Building a platform from scratch… that could become an enormous undertaking, full of risk and assumptions.
After some discussion, we settled on an off-the-shelf product. But we also know a regular LMS (learning management system) wasn’t going to do the job. They were too bulky for what we wanted to do. Luckily, Fer had something else in mind… (more on that in a moment)
With that, and a whole bunch of other scope items that we won’t bore you with here, we got to work.
The build had two main phases (think of these as ’Mapping’ and ‘Production’), each with a handful of smaller projects. Here’s the breakdown.
In this first version of the product, our focus was on developing content based on skills from the ‘Durable Skills’ framework created by fellow nonprofit America Succeeds. We liked it immediately (not least because it felt better than using the term ‘Soft Skills’). The taxonomy had 100 skills, all selected as being crucial for success in the evolving world of work:
In an era when technical skills are evolving at an unprecedented pace, there is an important set of durable ‘soft skills’ that last a lifetime. Durable Skills include a combination of how you use what you know – skills like critical thinking, communication, collaboration, and creativity – as well as character skills like fortitude, growth mindset, and leadership.
We knew we couldn’t build out learning journeys and content for all 100, and agree we wanted to focus on 10. The Portal team chose two skills from the ‘outer’ wheel, and then 5 of the 10 related skills to each of these. Knowing the easy trap of naming confusion, we set about calling these ‘Main’ skills and ‘Sub’ skills.
Main Skill No.1: Growth Mindset
Main Skill No.2: Communication
This part appeared relatively straightforward, but we needed to stress-test these ‘skills’.
What is ‘Social Media’ as a skill?
How do we define being self-sufficient?
This took some time and thinking to clarify. In hindsight, we should have got these even more specific - some of the vagueness in the taxonomy caused us challenges in the content curation phase.
Portal already had a concept for the Cards taxonomy. The taxonomy is different to the skills themselves - it’s a series of steps and prompts required to create a Card on any skill topic.
We liked the way this was designed, but felt there were some improvements that could be made, so Fer spent the first week mapping out other options in a Whimsical board.
The original taxonomy served as a guide as we worked on building the new version.
Fer figured out a new 5-step process, which we then refined down further into a three-act structure. This added more steps overall (9), but the three-act approach offered two things:
We didn’t expect a student to tackle a card in full (attention spans, hello!), so the 3-step approach felt more realistic and engaging.
The revised taxonomy was key - this was how the actual cards would work functionally, and serve as the framework for curating content around each one.
But before that, we had some other work to do.
Going for an existing platform seemed like the right choice for us, considering that the project was still in its pilot stage. This presented an opportunity to leverage existing technology.
We were looking for flexibility, reliability, and excitement, while also prioritizing ease of build and management.
Part of our ongoing work involves reviewing and keeping up to date with the latest tools that enable creativity, innovation, community and education. We’ve got an ever growing list of benchmarks that help us stay on top of things.
Given the project's needs, particularly the input from users looking a social component to nurture a vibrant community, Circle emerged as the ideal fit.
We mentioned tweaking our workflow to accommodate four interns. Here are a few things we learned:
Ok, let’s get back to it!
Ok, we’ll be honest. A new brand wasn’t really in the brief. But we sensed we needed it. This thing had to feel engaging, fresh and something students would want to interact with.
Howard’s mind went straight to Citymapper - a city navigation app with a simple yet engaging squad of mascots that represent each featured city. Anime also felt like a good reference point, as did Duolingo’s now-legendary owl.
We sensed this should feel like a mini adventure, and the mascot was important to have as a guide.
Dani started on some character ideas:
The first batch felt a bit too much like school, so future versions leaned more fun and friendly:
Around this time, we also saw Portal had gone through the first version of their own rebrand. We brought the initial brand palette in line with this, adding some additional secondary colors. We also created a simple typeface-based logo that could be easily run across a variety of mediums - particularly educational / course content.
Once we had the palette, logo, mascot, and initial guidelines down, Dani set about doing three other key things:
🧠 We created a Card production system in Notion to assist the team in advancing the project, enabling scalability, and facilitating rapid iteration.
We put together a production system using a series of Notion databases. This offered a bunch of cool perks:
Each Card needed to have some material to work with. The taxonomy included a few different modes - videos, audio, creative prompts, activities and so on. With 10 skills and a 9-part journey, we had 90 individual ‘pages’ to build out.
We’d started pulling together a few content ideas as soon as we had the skills and taxonomy in place, but the Card Production System was a real game-changer in terms of both efficiency and effectiveness. We did three things:
Now we had all the elements (Skills, Content, Brand and Platform), they needed bringing together into Circle to produce a cohesive final product.
Phew! Nearly there. But not quite. A critical part of our process and approach is focusing on the full End to End Experience in a product or program. And that applies to our own workflow, too.
We’d put together all the building blocks for the launch version of the Cards, but the final deliverables needed to be handed across to Portal so they could run with it right away.
Fer built out a Delivery Space in Notion, broken out into three sections, each with text and video-based explainers, plus links to all the key assets and tools.
The resulting product was a community learning space where students could explore and work through ten different skills. They could also create and remix their own unique skill Cards to share with peers, teachers and employers. All of it with no code, and from concept to delivery in less than 8 weeks
Here’s a summary of how we did it:
There’s huge potential here. We put forward a few recommendations on where to go next:
We were so pleased to avoid custom dev - it would have made the project take 3x longer, and probably meant Portal spending too much money on a v1. Today’s no code tools are hugely powerful, and have a decent amount of scope to white label / brand
We were sourcing, curating and also creating and shaping content across 10 different skills, and across a range of different formats. It’s easy to underestimate the time and energy involved in doing this well.
Another recent project involved us diving deep on how narrative works (it’s fascinating!). We brought these learnings into the Cards project - utilizing ‘master’ and ‘local’ narrative concepts for each skill to help it land with students.
Stroke of brilliance loading …