Basic Training

The fundamentals of UI design for new designers

• 
  1: Basic Button Tutorial

  A true introduction to Photoshop as a UI design tool. Covers basic tool use, vector shape layers, and the Layer Styles Panel. Introduction to realistic shading.

• 
  2: Basic Button Exercise

  Test your skill by recreating buttons based on a rasterized image. More complex techniques are displayed for you to puzzle through.

• 
  3: LED Tutorial

  Make a layered LED light with realistic shading and glow. Learn advanced use of the layer styles panel tools, practical applications of blend modes and opacity, and advanced shading and layering theory. Additionally, get a short introduction to the importance of working in vector layers for reusability.

• 
  4: Pull It All Together: Re-Create an Existing Interface

  Learn the ins and outs of creating a UI by recreating a set of existing mockups. Get a taste for how Photoshop files should be structured and organized, and see how the tools you've learned are used "in the wild".

• 
  5: Create and Save Options

  Create 3 style options based on a wireframe. Learn how to structure a file to easily create changes to the design, and use the Layer Comps functionality to quickly save out the options you create.

• 
  6: Format & Export Image Assets

  Use the Illustrator Export for Screens and Asset Export tools to generate icons properly formatted for use in websites.

• 
  7: File Formats

  Learn why different file formats are suited to different tasks and get a high level overview of the differences between file formats.

• 
  8: Image Quality Across Mediums & Devices

  Demystify the concepts of resolution, DPI, and PPI, and learn how they affect the day-to-day work of a designer. Get a quick overview of the image requirements of high resolution devices.