Building A Website With Photoshop CC Premium class

Geoff Blake, Ten Ton Online

Play Speed
  • 0.5x
  • 1x (Normal)
  • 1.25x
  • 1.5x
  • 2x
50 Videos (4h 55m)
    • Hello And Welcome

      1:20
    • Here's What We'll Build

      2:12
    • The Workflow Process

      3:52
    • Setting Up Photoshop For Web Layout

      7:05
    • Saving Our Photoshop Customizations

      4:48
    • Introducing The 960 Grid System

      3:08
    • Setting Up Our 960 Grid Template

      5:47
    • Creating The First Wireframe Object

      4:31
    • Continuing To Wireframe Objects

      4:44
    • Additional Techniques For Wireframing

      11:36
    • Finishing Up The Base Wireframe

      2:57
    • Organizing The Layers & Resetting The Properties Panel

      6:00
    • Roughing In The Header Content

      5:34
    • Building Out The Hero Section

      8:01
    • Wireframing The Introducing Section

      5:36
    • Creating The Organize Section

      4:03
    • Building The Get It Now Section

      3:24
    • Finishing Up The Wireframe

      3:03
    • Organizing & Colour Coding The Layer Panel

      4:54
    • Adding Text Labels To The Wireframe

      3:47
    • Exporting The Wireframe For Approval

      6:17
    • Gathering The Design's Resources, Part One

      10:12
    • Gathering The Design's Resources, Part Two

      8:13
    • Creating The Site Logo With An Illustrator Smart Object

      6:37
    • Using Layer Styles To Format Buttons

      7:59
    • Saving & Using A Custom Style

      2:17
    • Finishing Up The Header

      2:25
    • Using Linked Smart Objects

      10:52
    • Using Layer Mask To Position Content

      5:25
    • Finishing Up The Hero Section

      3:50
    • Designing With Clipping Group & Linked Smart Objects

      12:44
    • Developing The Organize & Share Sections

      4:17
    • Finishing Up The Layout's Design

      3:34
    • Introducing Photoshop's Asset Generator

      8:07
    • Going Further With The Asset Generator

      12:48
    • Getting The Layout's Assets Organized

      5:05
    • Generating HTML With Photoshop

      12:34
    • Getting Set Up For The Coding Phase

      9:21
    • Adjusting The External Style Sheet

      4:47
    • Setting Up The Structural CSS

      6:54
    • Rebuilding The Header & Copying CSS Directly From Photoshop

      11:41
    • Creating The App Store Header Button

      4:59
    • Getting Started On The Hero Section

      4:47
    • Finishing Up The Hero Section

      4:57
    • Creating The Introducing Section

      6:57
    • Odd Behaviour With Photoshop's Copy CSS Command

      5:46
    • Recreating The Organize And Share Sections

      5:05
    • Building The Get Section & Footer

      3:08
    • Wrapping Up The Project

      2:43
    • Where To Go From Here

      4:05

About This Class

Looking to design websites, either professionally or for your own use? Award-winning veteran trainer Geoff Blake will guide you through the process of building an entire web page from scratch using Photoshop! You’ll learn how to best organize the Photoshop interface to streamline your workspace for web design, eliminating the clutter and making creating web pages fast and easy. Explore the various grid systems that can be used as templates to build professional looking web pages. Next, it’s on to wireframing and UI design, where you’ll learn how to create a mockup that can be sent to clients for approval, or simply kept for personal reference. You’ll also discover how to build upon a wireframe to design a beautiful, and functional web page. Once you’re satisfied with your design, this course will show you how to extract the HTML and CSS that will bring your design to life, and how to customize the code to suit your needs. So if you’re interested in web design for fun or profit, this course will set you up with everything you will need.

Download the project files here.

8de59e3c

3 of 3 students recommendSee All

Very nice! Thanks a lot!

168

Students

--

Projects

Geoff Blake

Ten Ton Online

Geoff Blake is an award-winning veteran software trainer, author, and designer. A professional public speaker since 1997, Geoff has taught desktop publishing, web design and graphics courses for a wide range of clients and organizations, from Fortune 500 companies and colleges, to small and medium-sized businesses; and to individuals just like  you. In 2009 he launched his video-based training site, Ten Ton Online, allowing him to reach learners worldwide. With his humorous, non-jargonny approach, Geoff's style of teaching revolves around dissolving learner's anxiety, and presenting otherwise technical subjects in a relaxed, easily understandable way. He regularly contributes to top industry magazines and web sites, and continues sharing his knowledge in his casual, off-beat style through his website, tentononline.com.