Skip to main content

Watch Trailer

Modern Web Design Demystified

with Jesse Arnold and Andy Pratt

Log in or Sign up for FREE and get full access to these and thousands of other Open Lessons in our catalog! Watch 2 Lessons For Free

  •   Trailer

  •   01 Class Introduction

    09:10
  •   08 Collaborating with Your Clients

    13:52

Class duration: 10h 20m

See all 37 lessons
  • 13K students

    100% satisfaction guaranteed

  • 88% recommended

    9 student reviews

  • Access anytime

    OFFLINE SYNC WITH iOS APPS

Get the Pass

starting at $25/month*

$299/year or $39/month

Watch Now

You already have access!

Buy Class

$49

About The Class

learn how to communicate effectively and design engaging experiences.

Online web design is not just about choosing fonts, colors, and layouts. The days of throwing a static visual comp over the wall are ending. Designers are now encouraged to work side by side with clients and developers. In Modern Web Design Demystified you’ll learn how to communicate with developers and collaborate with your clients in order to design websites that function as well as they look. You’ll learn about: 


  • The fundamentals of responsive web design
  • Working with Clients to identify and prioritize goals
  • How to communicate with Developers
  • Best practices for project workflow
 
In this online web design course, Andy and Jesse will share real world case studies to help you understand exactly what goes into creating and launching a website from the ground up. They’ll tell you about the tools they use and offer tips on working with everyone from the coder to the client.

High-quality web design is complex, but it gives businesses and orgs the opportunity to really connect with their users. Learn the ins and outs of the entire web design workflow process in the Modern Web Design Demystified course.


Bonus materials include: 
  • Sample Dev Tickets
  • Responsive HTML Wireframes
  • HTML Pattern Library
  • Sample High Resolution Visual Comps
  • and more! 

Topics Covered


Lesson Plan

  1. 01

    Class Introduction

    09:10
  2. 02

    The Design Flow Basics

    18:27
  3. 03

    The Designer as Co-Creators

    06:48
  4. 04

    Get to Know Your Material

    17:07
  5. 05

    Responsive Vocab: Floats, Flows, & Images

    11:58
  6. 06

    Mobile First: Working Small

    09:46
  7. 07

    Future Friendly: Embrace Unpredictability

    14:17
  8. 08

    Collaborating with Your Clients

    13:52
  9. 09

    Prioritize Your Users

    39:42
  10. 10

    Best Practices for Defining Success

    08:58
  11. 11

    Intro to Scrum

    04:24
  12. 12

    User Stories & Epics

    35:53
  13. 13

    Content Basics

    27:40
  14. 14

    Defining the Visual Language

    22:31
  15. 15

    Starting with Type

    35:31
  16. 16

    Starting with Grids

    15:40
  17. 17

    Gutcheck & The Product Brief

    22:03
  18. 18

    Working With Developers

    12:33
  19. 19

    Communicating with Developers

    16:25
  20. 20

    Finding a Common Language with Developers

    06:28
  21. 21

    Code Literacy

    04:37
  22. 22

    Sitemap & Wireframe Basics

    33:48
  23. 23

    Prototyping Basics

    12:02
  24. 24

    HTML Prototypes

    13:28
  25. 25

    Code Literacy & Developer Tools

    11:46
  26. 26

    Developer Lingo

    07:23
  27. 27

    Interface Personality & Behavior Galleries

    17:27
  28. 28

    Designing for Performance

    18:19
  29. 29

    Progressive Enhancements

    07:00
  30. 30

    Designing a System: Discovery to Pattern Library

    12:25
  31. 31

    Workflow Examples

    20:25
  32. 32

    Applying the Style Guide to the Pattern Library

    09:08
  33. 33

    Alternative Workflow

    23:04
  34. 34

    Alternative Workflow Part 2

    21:52
  35. 35

    Tech Requirements

    21:53
  36. 36

    Retrofitting an Existing Site

    12:15
  37. 37

    Project Cupcake: Building a Site from Scratch

    24:08

Meet Your Experts

Jesse Arnold

Jesse has spent ten years building web products for a growing community of clients. His education and professional history has included fine art, industrial design, graphic design and programming. Five years ago, he CoFounded Mister Machine where he served as Principal Designer. Most recently, Jesse joined the team Exygy, an agency dedicated to designing software for organizations focused on providing positive social impact. He's had the pleasure of working with early stage startups as well as New York University, Conde Nast and the Jim Henson Company. His job is to learn your language and to identify value of key user interactions. From block model to visual design, your application has personality. He draws that out and enhances the experience. ... read more

See instructor's Classes

Andy Pratt

Andy has over fifteen years of experience creating award winning interactive products and media. He has worked with some of the largest brands in the world including the Smithsonian Institution, Samsung, Cartoon Network, Nickelodeon, Wenner Media, Lego and Turner Broadcasting. He is currently an Executive Creative Director for Favorite Medium, a global design and technology agency with offices in Oakland, Seoul and Singapore. When Andy is not helping clients solve interesting problems, he loves speaking at conferences, teaching workshops and co-building Oaklean.com. Andy is also the co-author and co-designer of a book recently published by Rockport Press. Titled Interactive Design: An Introduction to the Theory and Application of User Centered Design, it’s available in six languages. ... read more

See instructor's Classes

Bonus Material

Access your course materials here!

Get access to exclusive bonus content when you purchase this class.

  • pdf Syllabus - Modern Web Design Demystified.pdf
  • pdf Froont.com 60 Day Free Trial Coupon Code.pdf
  • pdf Ministry of Space Sample Dev Tickets.pdf
  • pdf Ministry of Space-Sitemap.pdf
  • pdf Modern Web Design Demystified Resources.pdf
  • pdf invision.com 6 Month Free Trial Coupon Code.pdf
  • zip Ministry of Space Product Brief.pdf.zip
  • zip Ministry of Space-FONT for Use with PSD Files.zip
  • zip Ministry of Space-Layerd PSD-Desktop Version.zip
  • zip Ministry of Space-Layerd PSD-Mobile Version.zip
  • zip Ministry of Space-Layerd PSD-Style Guide.zip
  • zip Ministry of Space-Sample Site-HTML Wireframes.zip
  • zip Ministry of Space-Sample Site-Pattern Library.zip
  • zip Ministry of Space-Sample Site-Responsive Home Page.zip
  • zip Ministry of Space-Sample Site-Thumbnail Wireframes.zip

88% of students recommend this class.
See what some of them have to say.

  • CityGirl

    June 2015

    I've already taken several web design classes, but there were still some details that I found confusing. Andy and Jesse did a great job of explaining things like; programming languages and how they interact to form the structure of a site, work flow responsibilities between team members and the blurry lines between them; and agile methodologies applied to work flow. They used case studies to illustrate how this all happens, where variations crop up, and how to address them. If you're new to web design, or just want to understand the functions of other team members, this is a great real world look at the whole process. I haven't found this in any other class, either on-line or local. Andy and Jesse are both very experienced working designers with current knowledge. They're very responsive to questions and seem to really enjoy teaching. Having two instructors is a great benefit because you get double the perspective, knowledge, etc.

  • Junko Bridston

    Junko Bridston

    August 2016

    I worked with Andy when he was a Creative Director at Funny Garbage, a design studio in New York City. I found him to be knowledgeable​, articulate, and lovely to work with. I learned so much from him at the beginning of my career. In response to a previous comment: it seems silly to dismiss this class because Andy wears t-shirts with his blazers. If you think leaders only wear suits and ties, then maybe this class isn't for you. But if you want to learn from someone with loads of experience and a friendly manner, I really recommend it. You won’t be disappointed.

  • user-3d865b

    June 2015

    I was looking for a class that would not only address the web design basics but also their place and function as part of a workflow. This class did not disappoint and Andy's and Jesse's engaging presentation style made it easy for me to follow along during the 2-day live session. By using real life examples, the presenters provide plenty of tips and strategies how to best work with clients and developers alike — the many, often intangible ingredients that go beyond technical expertise and can make or break a project. Highly recommended.

    Similar classes you might like

    You know who’d love this class...?

    When gift-spiration strikes, grab it. Give this class to a friend who’d love it. For their birthday or just because. (Or just because you missed their birthday.)

    GIFT THIS CLASS