Projects

About

copied

Product Designer with a background in teaching, based in Madrid.

Using Figma and the UX design thinking, I’ve designed apps and websites that provide compelling user experiences and drive client success.

I was a teacher for 10 years but I’m also a student, some of the things I’ve been learning: Accessibility, CSS, JavaScript, Design Systems, Framer.

Show recent photo

My Work

Responsive legal recruitment website

I designed and built a responsive website with a job board for Matthews and Carters Associates.

Case study coming soon

Results

  • Increased website traffic by 80% within the first month


  • Increased conversions by 200% within the first month

Role

  • UI Designer and Developer


  • Create prototypes in Figma and build in Framer


  • Lead research at all stages

Go to website

homepage

jobs page

Language academy website

I redesigned the website for Seif English Academy, Madrid, on mobile and desktop.

Go to Case Study

Results

  • Increased page findability to 100% in user testing


  • Optimised the onboarding level test for mobile


  • Improved the information architecture related to vital course information

Role

  • Sole designer


  • Lead research and testing at every stage


  • Create prototypes/wireframes

Level Test

Price Calculator

Landing Page

Seif Academy Design System

I created a design system for this project which:

  • helped speed up the design process

  • ensured consistency across the website

  • was a learning experience - how to use a design system linked through Figma

check it out

Sustainable logistics platform

I co-designed a logistics platform for an early-stage green-focused start-up.

Results

  • Co-created an innovative logistics platform including research and testing all in a 4-week period


  • Helped prepare the product for an investor meeting

Role

  • Product designer


  • Lead research and testing at every stage


  • Create prototypes/wireframes

Go to Case Study

Homepage

Contract Form Flow

About me

Experience

Conducted user research multiple times and led testings/interviews

Worked in multifunctional teams using agile methodology

Ran a project as the sole designer

Working with a design system; utilizing, modifying and amplifying it.

Created and utilised my own design system

Studies

2022

IronHack: UX/UI Bootcamp

2023

FreeCodeCamp: Responsive Web Design Certification

2024

FreeCodeCamp: JavaScript Algorithms and Data Structures Certification

History is my first love, you’ll always find me listening to podcasts.

I grew up about an hour’s drive from Stonehenge.

“Joe’s a great son who you should definitely work with!”

Gill Watson

my Mum

Links

Teaching

Teaching English as a Foreign Language
for 8 years, I guided people from many different ages and backgrounds to internalise difficult concepts in order to reach their goals.

Great design like teaching has a human touch at its heart. The user or student’s needs has to be the core focus.

Skills I learned:

Effective communcation: teaching people with limited English skills

Empathy: teaching various ages, nationalities and backgrounds

Leadership: in charge of the course and students sucessfully reaching their goals

Adaptation: constantly tailoring and improving my approach

My coding projects

JavaScript

CSS

HTML

CSS utility classes, keyframe animations, CSS pseudo-classes, Array methods, while loops

This website converts numbers into their Roman numeral equivalents. The style was inspired by SASS websites with animated mesh gradients, and dynamic light effects using ::before and ::after pseudo classes. This was a project for the FreeCodeCamp JavaScript course.

JavaScript

CSS

HTML

Fetch API, promises, JSON object, Async/Await, try..catch statement

This website fetches data from an external API to return statistics about a requested Pokémon. For this project, I learned about asynchronous programming and the style is based on Material Design 3. This was a project for the FreeCodeCamp JavaScript course.

JavaScript

CSS

HTML

Dark mode, Fluid type scale, Array methods, CSS pseudo-classes

This website checks if an entered word or phrase is a palindrome. the interface and aims to teach the user about the concept and history of palindromes. The website includes a light and a dark mode based on ancient Roman/Greek styles. This was a project for the FreeCodeCamp JavaScript course.

JavaScript

CSS

HTML

CSS utility classes, Material Design, Functional Programming, JavaScript loops

This website calculates the change due (if any) from a transaction while updating the change left in the cash register. the values are updated and displayed with a UI that is based on Material Design 3. This was a project for the FreeCodeCamp JavaScript course.

Let's make this a conversation!

My Email

hey@joe-watson.com

My Resume

My Socials