Visual Design Portfolio Courses NYC | Learn UI Design for Web & Mobile

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:

Learn the Skills Guarantee™

Hands-on training in small groups

Work on projects proven to boost retention
Time-tested curriculum and supporting materials

Refined over many cohorts for an optimal learning experience
Learn from industry experts with teaching experience

Experienced educators who are driven to help you succeed
Retake the course for free within one year

Refresh the materials and gain additional practice

Learn the concepts and skills covered in this course or your tuition is on us. See details and terms & conditions.

The teaching method at Noble Desktop is perfect and the classes provide you with infinite knowledge that makes you eager to take everything they offer. I love Noble!
—Ivonne Ackerman

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: Visual Design Portfolio Bootcamp

$975
18 Hours

NYC or Live Online
Free retake
Setup assistance
Expert instructors
Small classes

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.
Policies

Course times are listed in Eastern Time.

Filter

November 1–3

Monday to Wednesday, 10–5pm
- Mon
- Tue
- Wed
- Thu
- Fri
- Sat
- Sun
Enroll in this class
January 28–February 25

Fridays, 2–5pm
- Mon
- Tue
- Wed
- Thu
- Fri
- Sat
- Sun
Enroll in this class
March 25–April 29

Fridays, 2–5pm
- Mon
- Tue
- Wed
- Thu
- Fri
- Sat
- Sun
Enroll in this class
May 17–June 2

Tuesdays & Thursdays, 6–9pm
- Mon
- Tue
- Wed
- Thu
- Fri
- Sat
- Sun
Enroll in this class

Tuition

As one of our smaller courses, tuition for this course is due in full before the start date. The best way to save on this course is to take it as part of a certificate program.

Full Tuition

$975
Due before the class starts

What’s Included

18 hours of hands-on instruction
Live, project-based training from experts
Retake for free within 1 year
Verified digital certificate of completion

What’s included with my tuition?
- A hands-on learning experience working on projects and exercises, which is proven to boost comprehension, retention, and engagement
- Expert instructors who are industry professionals and experienced educators that are driven to help you succeed
- Top-notch curricula that have been tried and tested over many cohorts and are consistently improved for an optimal learning experience
- Supplemental materials to assist both during and after the course - please refer to specific course pages to see what supplemental materials are offered
- A 1-year free retake policy which allows students to retake any part of the course or program for free to refresh the materials and gain additional practice
- A certificate of completion to verify your accomplishment
Are there any additional fees or expenses?

There are no extra fees or taxes for our courses. The price you see on this page is the maximum you’ll pay us.

However, if you plan to take the course live online, you may need to obtain required software. We’ll help you get set up with a free trial of paid software prior to the class. Most of our coding classes utilize freely-available open-source software. For most of our design and motion graphics courses, we will help you get set up with a free trial of Adobe Creative Cloud. If you attend the course in-person, we will have a computer already set up for you with all of the required software for no additional cost.
Do you offer any discounts 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.

Take this course as part of a certificate program and save:
- Digital Design Certificate
  
  Price: $3,995 | Hours: 102 Hours
- Web & Visual Design Certificate
  
  Price: $4,995 | Hours: 120 Hours
- UX & UI Design Certificate
  
  Price: $2,995 | Hours: 72 Hours
- Visual Design Certificate
  
  Price: $3,495 | Hours: 84 Hours

This Course is Available in NYC or Live Online

On Campus in NYC

185 Madison Ave, NYC

Get face-to-face interaction with an instructor and other students when you learn at our NYC campus. Courses are hands-on with a computer and software provided.

Live, interactive class
Experienced instructor in the room with you
Computer and software provided
Free retake within one year

Instructor writing on markerboard in a classroom, while displaying code sample on screen

Students seated in computer classroom with workbooks, paying attention to instructor

Live Online

Remote, from anywhere

Get the same interactivity and access to the instructor as in-person students. There are no extra fees and we’ll work with you to ensure your remote setup is perfect.

Live, interactive class
Experienced instructor teaching over Zoom
Remote setup assistance provided
Free retake within one year

Online Training Demo

1-Minute Overview

Testimonials for Live Online Training

“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!”

More about live online training

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 payment plans or student financing for this course?

This course does not qualify for payments plans or student financing. See our Payment Plan FAQ to find related programs that qualify.
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!
- You will need your own computer and copy of any required software. If you don’t have the software, you can usually do a free trial or purchase your own license. If you need assistance, contact us at hello@nobledesktop.com

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

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.

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.

7 Students Rated Our Visual Design Portfolio 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

Learned so much through the bootcamp! Now I feel more confident in creating projects on my own from start to finish.

Ashley

Design websites for mobile phones, tablets, and desktops

Visual Design

Visual design is the look and feel of a website, app, etc.
Visual design incorporates color, composition, typograph, photography, illustraton, and more to create attrictive and usable layouts.
Visual designers, also called User Interface (UI) designers, craft a visual language and hierarchy that combines UX (user experience), information architecture, and interaction.

Visual Design Applications

Sketch is a Mac only app used by many web and app designers. Not only can you create your designs (for website, apps, etc.), but you can even turn them into working protoypes to show clients and do user testing with.
Adobe XD is an Adobe app that’s similar to Sketch. It’s an easy to use app that enables you do design and protype your ideas. Unlike Sketch though, it works on Mac and PC. It has very good prototyping features (better than Sketch) and you can even design some basic animations with it.
Photoshop is a photo editor with design features. Web designers who use Photoshop are now turning to other apps such as Adobe XD or Sketch which were created solely for the purpose of visual and UX design. They still use Photoshop though for editing photos used in their designs.

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

Earn a Certificate of Completion

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: Visual Design Portfolio Bootcamp

Discounts

November 1–3

Monday to Wednesday, 10–5pm

January 28–February 25

Fridays, 2–5pm

March 25–April 29

Fridays, 2–5pm

May 17–June 2

Tuesdays & Thursdays, 6–9pm

November 1–3

Monday to Wednesday, 10–5pm

January 28–February 25

Fridays, 2–5pm

March 25–April 29

Fridays, 2–5pm

May 17–June 2

Tuesdays & Thursdays, 6–9pm

Tuition

Full Tuition

What’s Included

What’s included with my tuition?

Are there any additional fees or expenses?

Do you offer any discounts for this course?

Discounts

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

This Course is Available in NYC or Live Online

On Campus in NYC

Live Online

Online Training Demo

Testimonials for Live Online Training

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 payment plans or student financing for this course?

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

7 Students Rated Our Visual Design Portfolio Bootcamp 5 Stars

Design websites for mobile phones, tablets, and desktops

Compare Visual Design Portfolio Bootcamp to Similar Courses

Digital Design Certificate

Web & Visual Design Certificate

Adobe XD Bootcamp

Adobe Photoshop Bootcamp