Solving Technical Training

or Starting Design School: A Case Study

Alex Lund
mrtailsdesign
9 min readApr 17, 2018

--

The Team

It was the first week of design school. I had been waiting for this moment for the better part of a year, and secretly, my whole life. It was time to jump into my first project, with almost no prior experience under my belt. I was sorted into a team of three— fellow students whose names I barely knew at this point. We were to learn as we went, applying design principles learned in class as we worked together to solve a problem. My group excitedly met for our first meeting. Other than myself, the group consisted of Cass Koller and Miciah Buttars.

The Problem

My group received the following design requirements:

“Work as a team designing a web solution for low-income workers providing access to various types of technical training. The training needs to offer up-to-date technical skills and give the learner an array of technical skills and an aptitude to succeed.”

The goal is to help unskilled workers move into better jobs.

Technology is an integral part of life and as technology advances, we rely on it more and more to perform tasks for us. Menu kiosks allow us to select, place, and pay for orders without the help of attendants. Self-help kiosks provide automated services for grocery stores, hotels, and restaurants.

It’s estimated that by 2030, millions of jobs will become automated. Waiters, clerks, accountants, tellers, salespeople, laborers, and brokers are just a few of the jobs that will disappear. One industry that isn’t going away any time soon is Information Technology. Society may become more reliant on robotics, but we still need humans to design and code them.

The problem is that many low-income workers aren’t pursuing the necessary education to land them in positions that are more secure. Why is this the case? Surely something as important as a persons livelihood should take precedence.

The Research

I needed to understand why unskilled workers weren’t pursuing technical training. While I had been in the same boat — working hourly positions, trying to make rent, trying to figure out what I wanted to do with my life — I was here in my first week at design school, learning technical skills with all the hope in the world. But, I had recently been in that position and felt it was safe to assume a few things:

  1. Education is expensive
  2. People are busy and can’t make time for school
  3. It’s scary to take that leap
  4. There are an overwhelming amount of options out there

These are very valid, very real concerns. I set out to speak with individuals who may be working in low-income positions to see if I could validate those assumptions.

I got a mixed bag of respondents: a medical student, a barista, a ski instructor and three factory workers. The factory workers provided the most relevant information:

  • They didn’t feel smart enough
  • They had considered a career in IT at some point
  • They didn’t know where to start
  • They looked into online learning but got stuck when they didn’t understand a concept
  • They felt there wasn’t anyone available to help or mentor them

“I don’t really have a math mind, so a career in IT is probably for someone else.”

Our data led us to another issue — if high school students don’t go to college right after graduation, they are taking low-income jobs and getting stuck there. After learning about this issue we decided to speak with someone in education. To get to the root of the problem, we had to shift our focus to what was happening in high school that was setting these students up for failure. We conducted an interview with a high school teacher in a low income area. What we found was surprising:

  1. Most students are illiterate when it comes to desktop computers. Many students only mobile devices and don’t get to use traditional computers much — there is a 2:1 or 3:1 ratio for students to computers.
  2. Many students are plagued by social issues like gang recruitment or addiction in their family.
  3. Students who are accepted to four-year continuing education don’t actually attend — only about two per year.
  4. Online schooling is challenging — many students can’t type well and lack the proper motivation or resources to complete courses.

We realized tech training started much earlier than originally assumed. If graduating students are computer illiterate, of course they aren’t pursuing tech training. My group decided to shift the focus of our design to high school and post-high school users — through the product would still be accessible to users of all ages.

The Solution

The next step was to take all that data, combine it, and create a persona. The persona was a high school senior worried about the next steps after graduation. We had found a lot of empathy for our users and wanted to be reminded of that. Once we had a persona to guide our designs, the next step was a user story map, to understand how our persona might interact with the product. Based on our story map we came up with the following features we felt would benefit our users the most:

  • Courses on job skills, professional behavior, and tech literacy
  • A Resume builder
  • A skill assessment to help point users to the right courses
  • A resources page containing job related articles
  • A community page for users to connect with mentors.
  • A way to track progress and badges to showcase learned skills.

After some debate we decided to move the mentor and badging features to sprint two, as they weren’t required to make the product function.

The Design

The next step in the process was to create sketches of the user story map. The way I found that worked best was to sketch each task in the story map using the 10x10 method until a solution was found

Just a few of the many sketches

We opted to prototype our sketches in Balsamiq, and then linked them together in InVision.

Design Review and Feedback

We got a few notes from our first design review. The first was that we needed to think about where our content was coming from. We initially thought that they would be written and hosted on the website, but decided it would be best to host them on an external platform.

The second piece of feedback was that we had a lot of content but it seemed to be presented in a confusing way. We lacked the visual hierarchy we needed to present content in a way users could understand.

The last and biggest feedback we received was that we should focus on doing one or two things really well as opposed to many things kind of well. I reluctantly agreed. I knew from our research that many resume builders and skills assessments already existed. I also knew that there are multitudes of online education websites out there — that was a pain point discovered during our research after all. It bothered me that we weren’t doing anything particularly different. It could be said that we were putting all of those things together, but it just didn’t feel like a strong enough reason to keep doing what we were doing. So, back to the drawing board — or in this case, the wall of sticky notes.

Reiteration

While we were discussing how to restructure the designs, one of the things that stood out from our research was a comment that online courses feel like ads, and ads don’t feel trustworthy. This was a problem we could actually solve. What if we created a way for a community to verify and discuss the merits of different educational programs and resources, rather than creating our own?
This time our product would have two parts: Resources and Community.

Resources

Resources would include links and information about educational programs, resume builders, the job market, and other related articles.

Taking the feedback about how we presented our content, we created visual hierarchy using size and color. Educational programs, being the most important, would be large and feature a darker shade. Articles and links would be medium sized with a lighter shade, and so on.

All of this content would be presented to the user based on their recent activity.

Community

Community would be a place for users to connect, create discussions around the resources offered, and otherwise network.

Users could create, edit, and delete posts

Ask questions about educational programs, resources or the job market in the question hub

Content would again be presented based on recent activity and trending topics, with search tags presented as cards to help with quick searching.

Visual Design and Testing

I spent a good two days with my group creating color palettes. We decided on blue and yellow. Blue because of its association with social media, and yellow to represent creativity. Blue was for Community content, yellow was for Resources. Yellow was a bit of a struggle because it’s hard pass contrast. We tested upwards of eight different shade pallets before we found a darker almost gold color to represent the resources section. The biggest takeaway from this is just to try different things and test them as much as possible.

Another issue found during testing was the categories button (pictured below). It served as a toggle to sort content by type, but most of our testers weren’t understanding that. I’m pretty sure we ended up beating our heads against the table before we found the solution:

Icons can now be toggled to sort content easily

During our testing phase, I was pleased to find that most of our users encountered the same problems with each round of tests, but none of the problems ever came up again once we fixed them.

In Conclusion

This was a learning project and I definitely felt like I learned a great deal. I learned how to conduct guerrilla research in appropriate environments. I learned how to be a better collaborator. I embraced being bold and became a better leader.

If I could start this project again or continue on, I would focus on a few things:

  • Identifying more pain points from potential users who were actively seeking technical training.
  • More initial research into what competing products already exist.
  • Test more user flows. We had a complete prototype of the entire product, but we could have focused on testing specific user flows — new users, returning users, etc. In future projects, I will be thinking about user flow before I start wireframing.
  • If we had more time, I would have loved to test more. I would have tested our color palette in an A/B test. Where we had so many issues with contrast, I would have liked to create a complete solution.

I also learned a lot about working with a team and collaborating with other designers. At first, I had a hard time speaking up because I wasn’t confident in my own abilities. I learned that it’s much better to be vocal and ask questions, especially if you don’t feel like you’re getting it. I also learned a lot about how to move forward without having established leadership: when a team is working together without a project manager, it takes a lot of thinking out loud and encouragement of fellow designers.

I can’t wait to apply everything I learned when solving future problems.

Thanks for reading this far! Since you did, might as well give it a 👏🏻 or 500. I wish I could take the time to write about every aspect of this project. If you have questions or comments, I’d love to hear from you! You can fling an email my way via mrtailsdesign@gmail.com, or you can connect on LinkedIn if you’d like. Bye!

--

--

Alex Lund
mrtailsdesign

UX Designer. I am MrTailsDesign. Passionate about good User Experience, Foxes, and all things geeky.