Modern UI/UX & Webflow Freelancing Bootcamp

Learn UI/UX design with Figma and build responsive Webflow websites. Master design systems, UX strategy, conversion design, and client workflows to start your career as a freelance UI UX designer.

33+ hours

Total Bootcamp Duration
21+ hours

Total Video
Duration
23 Projects

Total Portfolio
Projects

Modern UI/UX & Webflow Freelancing Bootcamp

Learn UI/UX design with Figma and build responsive Webflow websites. Master design systems, UX strategy, conversion design, and client workflows to start your career as a freelance UI UX designer.

33+ hours

Total Bootcamp Duration
21+ hours

Total Video
Duration
23 Projects

Total Portfolio
Projects

Become a UI/UX and Webflow Freelancer

Design Websites People Love.
Build Experiences Businesses Pay For.

Great websites are not created by choosing colors and moving elements around. They are created by understanding people, solving problems, and designing experiences that guide users toward action.

This bootcamp transforms you into a professional UI/UX Designer and Webflow Creator who can design, build, and deliver complete websites from an idea to a live product.

You will learn the complete workflow used by professional designers:
Project Brief → Research & Mood Board →Wireframes → UI Design → Interactive Prototype → Webflow Development → Responsive Optimization → Testing → Website Launch

In this bootcamp, you will:

Master professional UI/UX design principles
Create complete designs in Figma
Build responsive websites in Webflow
Design websites focused on user experience and conversion
Create a professional design portfolio
Learn how to sell premium design services globally

Overview

Businesses Need Designers Who Can Think Beyond Visuals

Overview

Businesses Need Designers Who Can Think Beyond Visuals

You don't start as an expert. You start with curiosity. We guide you through a complete transformation

Stage 1
Discover Your Opportunity

Understand the freelancing market, choose your niche,

and identify high-demand UI/UX and Webflow services.

Stage 2
Build Real UI/UX Designs and Webflow Websites

Learn Technical Skills, Figma, Webflow, Layout systems, Typography, Color psychology, UX decisions by building practical projects.

Stage 3
Become Client Ready

Learn the freelancing skills, how to communicate with clients, price your services, write proposals, and deliver professional solutions.

Stage 4
Create portfolio-ready UI/UX designs, Webflow websites, case studies, redesigns, and responsive projects.

Build real-world automation systems that demonstrate your ability to solve business problems.

Stage 5
Start Your Freelancing Career

Launch your profiles, apply for opportunities, and start building your global income stream.

What You Will Do

By The End Of This Bootcamp, You Will Be Able To:

Figma
Webflow

Create designs based on:
User behavior
Business goals
Design principles

You will understand:
Layout systems
Typography
Color psychology
UX decisions

Create:
Wireframes
Design systems
High-fidelity mockups
Interactive prototypes

Design:
SaaS products
Landing pages
Business websites

Turn designs into real websites.

You will create:
Responsive websites
Interactions
CMS-powered websites
Professional client projects

Learn how to create:
Better headlines
Strong calls-to-action
Better user journeys
Conversion-focused layouts

Offer services such as:
Website design
Webflow development
Landing page design
SaaS landing-page design.
Website redesigns

What's included?

Learning Goal
Understand the design principles that create clear, balanced, usable, and visually organized website interfaces.

You'll Learn
UI/UX design principles
visual hierarchy
alignment
grids
composition

You'll Build
Website Design Analysis Case Study
Layout Project — Landing Page Wireframe
Visual Hierarchy Practice
Website Section Redesign — Before & After
Layout & Composition Practice Set

Outcome
Evaluate and improve website layouts using hierarchy, alignment, grids, proximity, contrast, whitespace, and intentional composition.

Learning Goal
Create a consistent visual identity through purposeful typography, color systems, photography, cropping, overlays, and brand rules.

You'll Learn
Typography
color systems
image selection
cropping
overlays
brand consistency

You'll Build
Typography System
Brand Style Guide
Hero Section Visual Design
Brand Color Palette Collection
Image Composition & Cropping Practice

Outcome
Design professional, brand-consistent interfaces with readable typography, strategic colors, and polished image treatment.

Learning Goal
Transform ideas and project requirements into wireframes, mood boards, high-fidelity Figma interfaces, and interactive prototypes.

You'll Learn
Wireframing
mood boards
High-fidelity interface design
prototyping in Figma

You'll Build
Landing Page Wireframe
Mood Board & Visual Direction
Apple Page Clone — High Fidelity
SaaS Landing Page — Figma
Healthcare Website & Interactive Prototype

Outcome
Create presentation-ready Figma work that communicates page structure, visual direction, interface details, and user flow.

Learning Goal
Build responsive, interactive, and dynamic Webflow websites using reusable structure, classes, CMS content, and professional publishing workflows.

You'll Learn
Responsive Webflow development
classes
layout structure
interactions
CMS
publishing

You'll Build
Convert Figma to Webflow Website
Responsive Website Case
Live Website Deployment
Full Responsive Website Build
Dynamic Blog / CMS Website

Outcome
Develop, optimize, test, and publish complete Webflow websites with responsive layouts, interactions, reusable classes, and CMS content.

Learning Goal
Handle client projects professionally—from briefs and conversion strategy to case-study presentation, portfolio building, and delivery.

You'll Learn
Client briefs
conversion design
case-study presentation
portfolio building

You'll Build
High-Converting Landing Page Redesign
Complete UX Case Study & Behance Presentation
Personal Portfolio — Conversion Landing Page
Graduation Project Portfolio

Outcome
Turn client requirements into conversion-focused solutions, present the process professionally, and deliver portfolio-ready work.

Learning Goal
Choose the freelancing platform that best fits your technical skill, English level, experience, work preferences, payment needs, and income goals.

You'll Learn
How to distinguish gig-based, bidding-based, and networking-based freelancing platforms.
How to compare platforms by entry difficulty, competition, pricing, English, fees, and payment security.
How to evaluate platform fit based on your skill, English level, experience, and payment needs.
How to compare Upwork, Freelancer.com, Mostaql, Khamsat, Fiverr, and LinkedIn.How to decide whether to focus on one platform or multiple platforms.
How to choose a platform based on your current freelancing stage.
How to assess your work style, communication preferences, and freelancing goals.

You'll Build
Complete a platform selection test based on your profile.
Choose the platform that best fits your current profile.

Outcome
You'll be able to select the marketplace that best matches your current profile and follow a focused plan instead of spreading your effort across unsuitable platforms.

Learning Goal
Build a professional Mostaql presence and use the platform workflow from niche selection and profile setup through proposals, delivery, payments, and growth.

You'll Learn
How to define your niche, main skill, and income goal on Mostaql.
How to create and optimize a professional Mostaql profile and bio.
How to find relevant projects and decide when to apply or skip.
How to write customized proposals and set beginner-friendly pricing.
How to present portfolio work that proves your skills.
How to build a focused application routine for your first project.
How to communicate with clients, clarify scope, deliver work, and handle revisions.
How to manage withdrawals, repeat work, and pricing growth.

You'll Build
Create a complete Mostaql profile and professional bio.
Create at least 3 portfolio projects for your Mostaql profile.
Analyze real projects, submit customized proposals, and track client responses.
Write a professional project delivery message.
Complete a simulated Mostaql client workflow from proposal to revision.

Outcome
You'll be able to use Mostaql end-to-end: present your profile, target suitable projects, submit stronger proposals, manage client work, and plan your next growth stage.

Learning Goal
Create a market-ready Khamsat service and manage the full buyer journey from service validation and publishing through delivery, reviews, and growth.

You'll Learn
How to define your skill, niche, and income goal on Khamsat.
How to create a professional Khamsat profile and bio.
How to choose and validate a service idea before publishing.
How to create, price, package, and improve a Khamsat service.
How to prepare work samples that help buyers evaluate your skills.
How to use visibility actions and demand signals to support your first order.
How to handle buyer questions, custom requirements, delivery, revisions, and order issues.
How to manage withdrawals, repeat buyers, pricing, and service growth.

You'll Build
Create a complete Khamsat profile and professional bio.
Create one Khamsat service ready to publish.
Prepare at least 3 work samples to support your service.
Write a professional order delivery message.
Complete a simulated Khamsat client journey from inquiry to revision.

Outcome
You'll be able to launch and manage a professional Khamsat service, communicate with buyers, deliver orders effectively, and build toward repeat sales and growth.

Learning Goal
Build a client-ready Upwork presence and manage the workflow from niche validation and profile setup through job search, proposals, negotiation, contracts, delivery, and growth.

You'll Learn
How to choose and validate an Upwork niche using marketplace demand.
How to create a professional Upwork account and profile overview safely.
How to build and present portfolio projects on your Upwork profile.
How to find relevant jobs, use filters, understand Connects, and choose where to apply.
How to write customized proposals and set practical pricing.
How to prepare for interviews, negotiate scope and rate, and evaluate offers.
How to manage contracts, delivery, revisions, difficult situations, and client feedback.
How to grow through higher rates, Project Catalog, recurring contracts, and agency expansion.

You'll Build
Create a professional Upwork profile.
Create at least 3 portfolio projects for your profile.
Evaluate real jobs and write customized proposals.
Prepare a client interview script and negotiation points.
Create one Project Catalog service offer.
Complete a simulated Upwork contract from proposal to client feedback.

Outcome
You'll be able to use Upwork end-to-end: position your profile, find suitable jobs, write stronger proposals, negotiate, manage contracts, deliver professionally, and plan growth.

Learning Goal
Use Freelancer.com professionally from profile setup and project selection through bidding, contests, milestones, delivery, reviews, and income growth.

You'll Learn
How to define your niche, core services, and income goal on Freelancer.com.
How to create and optimize a professional Freelancer.com profile safely.
How to understand project types, memberships, bidding, and when to bid or skip.
How to write personalized bids and set practical pricing.
How to evaluate and enter Freelancer.com contests strategically.
How to build portfolio evidence and follow a focused first-project routine.
How to communicate with clients, clarify scope, use milestones, deliver work, and handle revisions.
How to grow through repeat work, higher pricing, long-term clients, and platform expansion.

You'll Build
Create a complete Freelancer.com profile.
Analyze projects, write bids, and submit real applications.
Participate in 1 contest and submit at least 1 entry.
Create at least 2 portfolio projects
Complete a simulated client project, including delivery and revisions.

Outcome
You'll be able to use Freelancer.com end-to-end across projects and contests while managing bids, client communication, milestones, delivery, and long-term growth.

Landing Page Wireframe

Create low-, mid-, and high-fidelity landing page structures with a hero section.

Technologies

Responsive Chat App

Adapt a website across desktop, tablet, and mobile breakpoints and complete responsive QA.

Technologies

Team Project App Design

Design the website in Figma, then build it in Webflow and make it fully responsive across different screen sizes.

Technologies

UX/UI Client Case Study

Follow a client brief through research, mood board, wireframes, high-fidelity design, feedback, and presentation.

Technologies

Website Redesign

Transform a weak website using contrast, whitespace, consistency, and stronger hierarchy.

Technologies

SaaS Landing Page

Design a SaaS landing page in Figma, then develop it in Webflow with a clean and functional layout.

Technologies

Samples of the technical projects you would have built by the end of the bootcamp:

Landing Page Wireframe

Create low-, mid-, and high-fidelity landing page structures with a hero section.

Technologies

Responsive Chat App

Adapt a website across desktop, tablet, and mobile breakpoints and complete responsive QA.

Technologies

Team Project App Design

Design the website in Figma, then build it in Webflow and make it fully responsive across different screen sizes.

Technologies

UX/UI Client Case Study

Follow a client brief through research, mood board, wireframes, high-fidelity design, feedback, and presentation.

Technologies

Website Redesign

Transform a weak website using contrast, whitespace, consistency, and stronger hierarchy.

Technologies

SaaS Landing Page

Design a SaaS landing page in Figma, then develop it in Webflow with a clean and functional layout.

Technologies

Samples of the Freelance projects you would have built by the end of the bootcamp:

Skill, Niche & Income Goal Setup

Choose your niche, define your main skill, and set a realistic income goal.

Technologies

First-Project Application Tracker

Apply to 5–10 projects and track the responses.

Technologies

Job/Project/Service Analysis Exercise

Analyze 3 real freelancing projects and decide whether to apply or skip.

Technologies

Customized Proposal
Practice

Write 3 customized proposals and apply them to 3 real projects. Also, create one ready-to-publish service for Khamsat.

Technologies

Build your Freelance Profile& Portfolio

Complete your freelancing profile, prepare a bio, & create 2 portfolio projects to add to your profile.

Technologies

Practice A Full Client Simulation

Practice the client workflow from brief and proposal through planning, delivery, and revisions.

Technologies

Samples of the Freelance projects you would have built by the end of the bootcamp:

Skill, Niche & Income Goal Setup

Choose your niche, define your main skill, and set a realistic income goal.

Technologies

First-Project Application Tracker

Apply to 5–10 projects and track the responses.

Technologies

Job/Project/Service Analysis Exercise

Analyze 3 real freelancing projects and decide whether to apply or skip.

Technologies

Customized Proposal Practice

Write 3 customized proposals and apply them to 3 real projects. Also, create one ready-to-publish service for Khamsat.

Technologies

Build your Freelance Profile & Portfolio

Complete your freelancing profile, prepare a bio, & create 2 portfolio projects to add to your profile.

Technologies

Practice A Full Client Simulation

Practice the client workflow from brief and proposal through planning, delivery, and revisions.

Technologies

Samples of the project you would have built by the end of the bootcamp:

Samples of the Freelance projects you would have built by the end of the bootcamp:

Skill, Niche & Income Goal Setup

Choose your niche, define your main skill, and set a realistic income goal.

Freelancing Platforms
Khamsat Mostaql
Upwork Freelancer.com

First-Project Application Tracker

Apply to 5–10 projects and track the responses.

Freelancing Platforms
Khamsat Mostaql
Upwork Freelancer.com

Job/Project/Service Analysis Exercise

Analyze 3 real freelancing projects and decide whether to apply or skip.

Freelancing Platforms
Mostaql
Upwork Freelancer.com

Customized Proposal Practice

Write 3 customized proposals and apply to 3 real projects. Also, create one ready-to-publish service for Khamsat.

Freelancing Platforms
Khamsat Mostaql
Upwork Freelancer.com

Build your Freelance Profile & Portfolio

Complete your freelancing profile, prepare a bio, & create 2 portfolio projects to add to your profile.

Freelancing Platforms
Khamsat Mostaql
Upwork Freelancer.com

Practice A Full Client Simulation

Practice the client workflow from brief and proposal through planning, delivery, and revisions.

Freelancing Platforms
Khamsat Mostaql
Upwork Freelancer.com

Samples of the technical projects you would have built by the end of the bootcamp:

Samples of the Freelance projects you would have built by the end of the bootcamp:

Job/Project/Service Analysis Exercise

Analyze 3 real freelancing projects and decide whether to apply or skip.

Freelancing Platforms
Mostaql
Upwork Freelancer.com

Customized Proposal Practice

Write 3 customized proposals and apply to 3 real projects.
For Khamsat: Create one ready-to-publish service, including pricing and extras.

Freelancing Platforms
Khamsat Mostaql
Upwork Freelancer.com

Empathy-Driven Thinkers

They enjoy understanding users and their problems.

Creative Problem Solvers

They combine creativity with functionality.

Visual Thinkers

They naturally think about layouts and experiences.

Detail Lovers

They notice small design differences.

People-Oriented Individuals

They care about how others interact with products.

Creative Professionals

They enjoy designing meaningful experiences.

Communication-Focused People

They like explaining ideas visually.

Quality-Focused Individuals

They want polished professional results.

Curious Observers

They study how people use products.

Brand-Conscious Creators

They understand the value of good design.

Empathy-Driven Thinkers

They enjoy understanding users and their problems.

Creative Problem Solvers

They combine creativity with functionality.

Visual Thinkers

They naturally think about layouts and experiences.

Detail Lovers

They notice small design differences.

People-Oriented Individuals

They care about how others interact with products.

Creative Professionals

They enjoy designing meaningful experiences.

Communication-Focused People

They like explaining ideas visually.

Quality-Focused Individuals

They want polished professional results.

Curious Observers

They study how people use products.

Brand-Conscious Creators

They understand the value of good design.

Write your awesome label here.

Resource Readiness

You will need:
1. A reliable laptop/PC
2. A fast and steady internet connection

Technical Skills

1. No Programming or extra technical skills are needed

2. Basic Computer skills are needed

Language Skills

The Bootcamp is mainly in Arabic, using some technical English terms (will be explained if needed)

Tools

No paid tools are required to complete this bootcamp

Do not miss!

Your UI/UX & Webflow Career Starts With One Decision.

Businesses need designers who can create attractive,
usable, responsive, and conversion-focused digital experiences.

Start learning Figma and Webflow, build portfolio-ready projects, and prepare
to offer UI/UX and no-code development services online.

Samples of the project you would have built by the end of the bootcamp:

Samples of the technical projects you would have built by the end of the bootcamp:

Landing Page Wireframe

Create a low-, mid-, and high-fidelity landing-page structure with a hero section.

Technologies
Figma
Wireframing

Responsive Chat App

Adapt a website across desktop, tablet, and mobile breakpoints and complete responsive QA.

Technologies
Webflow
Responsive Design

Team Project App Design

Design the website in Figma, then build it in Webflow and make it fully responsive across different screen sizes.

Technologies
Figma
Webflow

UX/UI Client Case Study

Follow a client brief through research, mood board, wireframes, high-fidelity design, feedback, and presentation.

Technologies
Figma Prototyping
Behance

Website Redesign

Transform a weak website using contrast, whitespace, consistency, and stronger hierarchy.

Technologies
Figma
UI Design

SaaS Landing Page

Design a SaaS landing page in Figma, then develop it in Webflow with a clean and functional layout.

Technologies
Figma
Webflow

A new generation of Live Freelancing Bootcamps designed to help ambitious individuals build real freelancing careers, work with clients globally, and create opportunities to earn income in USD.

Modern UI/UX & Webflow Freelancing Bootcamp

33+ hours

21+ hours

23 Projects

Modern UI/UX & Webflow Freelancing Bootcamp

33+ hours

21+ hours

23 Projects

Become a UI/UX and Webflow FreelancerDesign Websites People Love. Build Experiences Businesses Pay For.

From Professional designs → Live websites → Work with clients → Create income

UI/UX Design & Webflow

Businesses Need Designers Who Can Think Beyond Visuals

Modern businesses don't only need attractive websites.

UI/UX Design & Webflow

Businesses Need Designers Who Can Think Beyond Visuals

Modern businesses don't only need attractive websites.

Your Journey From Beginner to o UI/UX & Webflow Freelancer

Stage 1Discover Your Opportunity

Stage 2Build Real UI/UX Designs and Webflow Websites

Stage 3Become Client Ready

Stage 4Create portfolio-ready UI/UX designs, Webflow websites, case studies, redesigns, and responsive projects.

Stage 5 Start Your Freelancing Career

What You Will Do

What You Will Do

Master Tools

Design Professional User Experiences

Figma For Professional Design

Build Websites In Webflow

Design Websites That Convert

Work As A Freelance UI/UX Designer

What's included?

12 HoursLive Sessions

21 HoursVideos

22Core Topics

23Total Projects

What's included?

12 Hours Live Sessions

21 Hours Videos

22 Core Topics

23 Total Projects

Technical Learning Program Contents

UI/UX Design Fundamentals

Visual & Brand Design Systems

Figma UI Design & Prototyping

Webflow Development & CMS

Client Work & Conversion

Freelancing Learning Program Contents

Freelancing Platforms Guide

Mostaql

Khamsat

Upwork

Freelancer.com

Graduate With Proof,Not Just Knowledge

Landing Page Wireframe

Responsive Chat App

Team Project App Design

UX/UI Client Case Study

Website Redesign

SaaS Landing Page

Graduate With Proof, Not Just Knowledge

Landing Page Wireframe

Responsive Chat App

Team Project App Design

UX/UI Client Case Study

Website Redesign

SaaS Landing Page

Kick Start Your Freelancing Career with Real Work Experience

Kick Start Your Freelancing Career with Real Work Experience

Skill, Niche & Income Goal Setup

First-Project Application Tracker

Job/Project/Service Analysis Exercise

Customized Proposal Practice

Build your Freelance Profile& Portfolio

Practice A Full Client Simulation

Kick Start Your Freelancing Career with Real Work Experience

Skill, Niche & Income Goal Setup

First-Project Application Tracker

Job/Project/Service Analysis Exercise

Customized Proposal Practice

Build your Freelance Profile & Portfolio

Become a UI/UX and Webflow Freelancer

Design Websites People Love.
Build Experiences Businesses Pay For.

From Professional designs → Live websites
→ Work with clients → Create income

Stage 1
Discover Your Opportunity

Stage 2
Build Real UI/UX Designs and Webflow Websites

Stage 3
Become Client Ready

Stage 4
Create portfolio-ready UI/UX designs, Webflow websites, case studies, redesigns, and responsive projects.

Stage 5
Start Your Freelancing Career

12 Hours
Live Sessions

21 Hours
Videos

22
Core Topics

23
Total Projects

Graduate With Proof,
Not Just Knowledge

Customized Proposal
Practice

Graduate With Proof,
Not Just Knowledge

Graduate With Proof,
Not Just Knowledge

Kick Start Your Freelancing Career
with Real Work Experience

Graduate With Proof,
Not Just Knowledge

Graduate With Proof,
Not Just Knowledge