HandLAB

Visual Design

What’s a Rich Text element?

HandLAB is Handmade Design's digital school tailored for companies. It enables teams to create innovative solutions through learning while experimenting together with mentors.

HandLAB homepage.

HandLAB offers a variety of courses that belong into four modules:

  • For innovative teams: Customer-Centricity and Design Thinking
  • For agile teams: Design Sprint and Agile Experimentation
  • For future-ready teams: Data, A.I. and Machine Learning
  • For collaborative teams: Soft Skills

They already had a homepage with an established visual language and needed pages for the modules and classes.

HandLAB homepage and basic scope for modules pages.

What’s a Rich Text element?

We designed a page layout that accommodates all the important things to know about the modules:

  • The courses that belong into that module (it's possible to click on the course card and open a page with detailed information)
  • How the classes work
  • The specialists who will mentor the students
  • Supporting tools and resources
  • ‍Design Sprint and Agile Experimentation page is the only page that does not follow that same logic because it offers only one course. In this case, the module page itself is also the course page.

At the end of the page there's a call to action: "Personalize this program for your team"

Pages for the four modules.

What’s a Rich Text element?

The course page presents the following information:

  • An overview of the course
  • The deliverables (what to expect as a result of the learning process)
  • The curriculum with detailed info about each class and who are the teachers
  • How the classes work
  • The specialists who will mentor the students
  • Supporting tools and resources

At the end of the page there's a call to action: "Personalize this program for your team"

Course page sections.

What’s a Rich Text element?

Each learning journey can be personalized according to the team's needs, and it all starts with mapping the team's profile: after completing an online survey, the team receives a diagnosis document highlighting its strengths, weak points, and opportunities to improve in both hard and soft skills.

Working closely together with a multidisciplinary team (product designer, product manager, and ux writer), I contributed doing visual design for the diagnosis document. Based on the website’s visual language, we came up with a 5 page PDF:

Diagnosis highlighting strenghts and weak points
Recommended learning path: Understand Your Audience - through video classes, frameworks, and online mentoring
Recommended learning path: courses
All learning paths
How it works
Schedule a call

What’s a Rich Text element?

Before launching HandLAB, we made sure to test the prototype both internally (at Handmade) and also with external collaborators and the feedback was very positive!

The document was created in Figma and allows further collaboration and improvements from any of the team members.