Learn to design websites for mobile phones, tablets, and desktops using the visual design principles of color, layout, and typography.

Visual conventions, standards, industry trends, web typography, grid systems, calls to actions, appropriate use of color, and much more will be covered through lectures and hands-on practice, giving you experience with the process and principles for designing responsive websites.

You will design and produce one or more projects in class to come out with portfolio material. Your work will be critiqued and you’ll get feedback to help improve your designs.

This is a design class in which you’ll use Sketch, Adobe XD, or Photoshop, so you’ll need to feel comfortable using one of those apps.

This course has a prerequisite

Students should have strong working knowledge in either Sketch, Adobe XD, or Photoshop for Web Design.

Take this class as part of a certificate program and save:

What You’ll Learn

Learn to design websites for mobile, tablet, and desktop
Apply design principles such as color, layout, and typography to webpages
Learn about visual conventions, standards, and trends

Learn with Hands-on Projects

Learn practical skills by working on real projects with instructor guidance and lectures to strengthen and improve your skill.

Course Syllabus

Download Syllabus PDF

Design Overview

User Experience (UX) Design
Visual Design
UX Is Not UI

Learning from Existing Websites

What Works & What Does Not?

Color

Color Harmonies
Creating Contrast with Color
Guidelines for Proper Color Usage

Typography & Fonts

Display Text (Such as Headings) versus Body Text
Legibility
Type Trends
Typeface Selection & Pairing
Where to Get Web Fonts
Ideal Line Height
Column Width (Line Length)
Hyphenation & Justification

Design Elements

Proximity
Similarity
Continuity

Trends in Web Design

Analysis of Example Websites

Design Patterns

Example Design Patterns

Multiple Screen Sizes

Responsive Web Design
Mobile Considerations & Limitations
Discoverability Challenges
Mobile Navigation

Workflow: Idea to Design

Example Web Design Workflows

Getting to Know a Project: Creative Briefs

What is a Creative Brief?
What to Include in a Creative Brief

Wireframing

Issues to Solve
Steps in Creating a Wireframe
Designing on a Grid System (like Bootstrap)

Wireframe to Refined Design

Iterate & Refine
Understanding the Mobile Experience

Time for You to Design

Project Work

Create Wireframes
Turn Your Wireframes into Refined Designs
Get Critiques
Incorporate Feedback & Improve Your Designs

Schedule & Enrollment

$975
18 Hours
NYC or Live Online
Full setup assistance provided

Discounts
Discounts
- 10% Alumni Discount: Get 10% off this course if you’ve previously taken any 12+ hour course.
- $100 Individuals Discount: Take $100 off this course if you’re an individual paying for yourself (you’re not being reimbursed by a company).
Discounts are applied at checkout (no promo code required) and will be verified after you place your order. Discounts are subject to change. Read our discount policies for more details.

Payment Plans

This course is not eligible for a payment plan, which is only available for programs priced at $2,495 and above. Read our Payment Plan FAQ for more details.
• Policies

October 26–28

Monday to Wednesday, 10–5pm
- Mon
- Tue
- Wed
- Thu
- Fri
- Sat
- Sun
Enroll in this section

This Course is Available Live Online

You can attend this training live online at the scheduled time the course is offered (New York, Eastern Time) through screen-sharing software Zoom (free for you).
Our live online training is interactive and hands-on, just like our in-person classes. There are no extra fees and we’ll work with you to ensure your setup is perfect

Classes are activity-based and taught by a live instructor.
You can hear the instruction, ask questions, and share your screen—all in real-time.
Retake the course for free (in-person or live online) within one year.

See What Students Are Saying About Live Online

“Overall experience on Zoom was maybe even better than in IRL classroom because the instruction takes place right on your own screen, with less distraction. Great overall experience.”
“Given the fact that we had to do this entire class remotely due to Covid-19, I didn’t have very high expectations it would run so smoothly. However, I don’t think it could’ve gone any better. Not only do I feel very comfortable with the program now, but I’m actually excited to use it!”
“This was the first online class I’ve taken with ND and it was a great experience. Looking forward to the other classes I’ve signed up for!”

Learn more about how our live online training works

Online Training Demo

1-Minute Overview

Frequently Asked Questions

Do I need to bring anything to the class?

We provide computers (Mac or PC) equipped with Sketch (Mac only), Adobe XD, and Photoshop. Choose your operating system at checkout.

In class you will be designing a website, so we encourage you to come with a concept (or real-life project) in mind. If you do not have one, the instructor will help you brainstorm ideas or will provide you with project ideas you can choose from. If you want to work on your own website design project, please collect as much content (text, images, logos, etc.) as you can ahead of time, and bring that to class so you’ll be ready to work!
What is the focus or goal of this course?

This course covers visual design theory and techniques and helps participants develop and apply skills to projects. This course does not focus on how to use any particular design application.

If you are interested in learning professional design apps (Sketch, Photoshop, and Illustrator) in addition to developing portfolio projects (which you do in this class), we recommend our Visual Design Certificate Program.
Is there mandatory work outside of the classroom?
- If taken during the day, no work outside of class is required.
- If taken at night or on weekends, some work outside of class could be required.
Does this course require any prior knowledge or experience?

Students should have strong working knowledge in either Sketch, Adobe XD, or Photoshop for Web Design.
Do you offer discounts or a payment plan for this course?
Discounts
- 10% Alumni Discount: Get 10% off this course if you’ve previously taken any 12+ hour course.
- $100 Individuals Discount: Take $100 off this course if you’re an individual paying for yourself (you’re not being reimbursed by a company).
Discounts are applied at checkout (no promo code required) and will be verified after you place your order. Discounts are subject to change. Read our discount policies for more details.

Payment Plan

This course is not eligible for a payment plan, which is only available for programs priced at $2,495 and above. Read our Payment Plan FAQ for more details.

Take this course as part of a certificate program and save:
Can I take this course online (remote learning)?
You may attend this training virtually (online) at the scheduled time the course is offered (New York, Eastern Time).

How does attending “live online” work?
- Students can attend this training remotely through screen sharing software (we use Zoom).
- Participants can hear the instruction, ask questions, and even share their screen with the instructor.
- For audio you can use your computer’s microphone/speakers or call a phone number that we’ll provide.
- Classes are activity-based and taught by a live instructor, so we strongly encourage students who are local to the area to attend in person!

Corporate & Onsite Visual Design Training

Purchase group class vouchers at a discount for our regularly-scheduled group classes in NYC, or create a custom training program at your offices.

Private Training

Available onsite at your location
Modern computer labs available at our offices
Customize or choose from our existing courses
Free instructor consultations to finalize content

Group Class Vouchers

Send employees to our group classes
Extensive offerings and flexible scheduling
Simple billing and logistics
Computers and training resources provided

We’ve trained thousands of companies!
Let us create the perfect program for your team.

212-226-4149

Become a Visual Designer

In this hands-on course you’ll work on real-life designs such as logos, digital graphics, responsive web designs, and more. Classes are led by a professsional web and visual designer. Small class sizes and personalized feedback will ensure you come away with great design skills and portfolio material.

Student getting feedback from a professional web designer

Personalized Design Feedback

“Great class. I was able to relate to Dan's helpful and insightful feedback while working through the class website project. He provided suggestions covering a wide range of design elements - content, gestalt principles, typography, color, photo elements, the overall feel, etc.”
Harteg Wariyar, Software Developer, Feb 15, 2018

Create Portfolio Projects

Create wireframes and web designs that can be added to your portfoio. Throughout the class, your work will be critiqued and you’ll get feedback to help you improve your designs.

Part of a Certificate Program

This class is included in the Visual Design and Graphic Design certificate programs. Take the other courses to earn a certificate!

Highly Reviewed by Our Alumni

From our hands-on training style to world-class instructors and proprietary curriculum, we deliver a learning experience our alumni can be proud of.

6 Students Rated Our Visual Design Bootcamp 5 Stars

Great class. Coming from a development background with knowledge of Sketch and some basic graphic design concepts, I was able to relate to Dan's helpful and insightful feedback while working through the class website project. He provided suggestions covering a wide range of design elements - content, gestalt principles, typography, color, photo elements, the overall feel, etc.

Harteg Wariyar

Having some knowledge in visual design, I wasn't sure if I needed this course but decided to take the leap. It was a fantastic course than gave me more insight toward visual guidelines, ideas and strategies that I have already put into place the day after class. I recommend this class to anyone looking to gain more knowledge in this field.

Jemal McClary

My professional experience up to this point has been primarily print based so when I learned Noble Desktop had a web and mobile class geared toward visual designers, such as myself, I immediately signed up and was very pleased with the results. The three day course offered an in-depth overview of visual theory, communication design, technical processes, industry practices and standards as it relates to cross platform web design. The assignments were pertinent, engaging and offered an opportunity to learn from fellow classmates. The course instructor was a highly effective instructor, attentive to each student and extremely knowledgeable. I would recommend this class to others seeking to make a positive career change.

James Massey

Classes content is very wide, full of import tips and details that help you improve your work. It's totally worth it!

Lorenna Maia

If you want to break into web / digital design, this is a great way to break the ice and dive in.

Mark Maltais

The Visual Design bootcamp is a must for anyone getting into the UI field. Dan Rodney is a great instructor with lots of knowledge and enthusiasm. I learned a great deal in a short period of time. Very happy I decided to go with Noble Desktop.

Paul Lafreniere

This course has a prerequisite

Take this class as part of a certificate program and save:

Learn the Skills Guarantee™

Hands-on training in small groups

Time-tested curriculum and supporting materials

Learn from industry experts with teaching experience

Retake the course for free within one year

What You’ll Learn

Learn with Hands-on Projects

Course Syllabus

Design Overview

Learning from Existing Websites

Color

Typography & Fonts

Design Elements

Trends in Web Design

Design Patterns

Multiple Screen Sizes

Workflow: Idea to Design

Getting to Know a Project: Creative Briefs

Wireframing

Wireframe to Refined Design

Time for You to Design

Project Work

Schedule & Enrollment

Discounts

Payment Plans

October 26–28

Monday to Wednesday, 10–5pm

This Course is Available Live Online

See What Students Are Saying About Live Online

Online Training Demo

Frequently Asked Questions

Do I need to bring anything to the class?

What is the focus or goal of this course?

Is there mandatory work outside of the classroom?

Does this course require any prior knowledge or experience?

Do you offer discounts or a payment plan for this course?

Discounts

Payment Plan

Take this course as part of a certificate program and save:

Can I take this course online (remote learning)?

How does attending “live online” work?

Corporate & Onsite Visual Design Training

Private Training

Group Class Vouchers

Become a Visual Designer

Personalized Design Feedback

Create Portfolio Projects

Part of a Certificate Program

Highly Reviewed by Our Alumni

6 Students Rated Our Visual Design Bootcamp 5 Stars

Related Classes & Certificates

Sketch Bootcamp

Photoshop for Web Design & UI

UX & UI Design Certificate

Visual Design Certificate