Menu

Reminders

Remember the syllibi with general schedules and assignment descriptions is on the share HAL folder.

I'm typically in the building at these times, I may be in the computer lab instead of my office.

Mon: 05:00-06:00

Tue: 03:50-05:00

Wed: 04:00-06:00

Thu: 03:50-05:00

Fri: hahahaha

About this page

Please be aware some of these pages are under construction. Some passages have much to be added. There might even be a few sentences that abruptly Get it? Hahaha!

These pages started as an online version of slides used during class and over time expanded to more in-depth explanations and answers to frequently asked questions. As such please keep in mind they are not meant to be all encompassing and the official documentation for any given program will always have the most detailed instructions for operation.

These pages will mainly be low level discussions on visual art. It will not go so far to describe the exact wavelengths of a color spectrums and so on. I've tried to keep the wording basic and the beginning of each section understandable to someone new to the subject.

All tutorials presume you are working with the default layout and key shortcuts of the relevent programs.

Icons like these are links you can click that go to pages that describe the software-specific steps to the subject they appear under.

3D Graphics

This section will focus on the principles common to different 3d software packages. Unfortunately, unlike image or text editors, different 3d programs often have completely different ways of doing things. As such, this is more of a survey to 3d imaging then a detailed tutorial for a specific program. Modeling and texturing principles are similar enough, but physics simulations or high-poly sculpting are beyond the scope of this section.

  1. Common Interfaces & FAQ
    • Translation, Rotation, Scale
    • Camera Controls
    • Camera & Viewport Types
    • Object Organization
  2. Basics of 3d Structures
    • Points, Edges, Polys & Objects
    • Object VS. World Space
  3. Common Modeling Tools
    • Tools
    • Modeling with Selections
    • Modeling Exact Coordinates
  4. The Modeling Process
    • Box Modeling
    • Point by Point Modeling
  5. Modeling Helpers, Compounds & Deformers
    • Symmetry
    • Instances
    • Deformers
    • Subdivision Surfaces
  6. Paths in 3d Space
    • Kinds of Paths
    • Path Modifiers
    • Path Interpolation
    • Common Uses
  7. Modeling Tips (Structure)
    • The Visibility Principle
    • Wasted Polygons
    • Breaking Surfaces
    • Rounded / Beveled Edges
    • Moving the Axis
  8. Modeling Tips (Flow)
    • Mesh flow
    • Subdivision Problems
    • Edge looping and pathing
    • Convergence Points
  9. Organizing Objects (Parents & Children)
    • Groups
    • Hierarchies
  10. Texturing
    • 2d Images on 3d Objects
    • Terminology
    • Texturing Workflow
  11. Texture types
    • Surface Textures
    • Procedural Textures
    • Changing Geometry With Textures
  12. Texturing Tips & Hints
    • The Hierarchy of Detail
    • Differently Sized Maps
    • Overlapping Islands
    • Spheres
    • Anthropomorphics
  13. Lighting
    • Types of Lights
    • Light Properties
    • Types of Shadows
  14. Lighting, Advanced
    • Radiosity / Global Illumination
    • Faking Advanced Lighting
    • Baking Lighting Effects
    • Shadow Catchers
  15. Image-Based Lighting
    • Light Domes & Environment Maps
    • Rendering with HDR Images
    • Baking Lighting Effects
  16. Rendering and Compositing
    • Basic Rendering Properties
    • Splitting Channels
    • Motion Tracking
  17. Animation Basics
    • Frames & Key Frames
    • Hierarchical Animation
    • Motion Control
  18. Animating with Skeletons
    • What is a Skeleton?
    • Skeletal Weighting
    • Bone Positioning
  19. Animation Rigging
    • Constraints
    • Controllers
    • Solvers & Kinematics
    • Morphs
  20. Sculpting
    • Basic Mechanics
    • Low to High Process
    • High to Low Process
  21. Sculpting Tips & Techniques
    • Sculpting Techniques
    • Preparing Baked Textures
  22. Physics
    • Rigid & Soft Bodies
    • Collision Meshes
    • Cloth
    • Liquid

Audio Editing

This section won't be focusing on musical theory, the creative process or traditional instruments so much as it will on how music is created and processed by digital means.

  1. What is Sound
    • Frequency
    • Amplitude
    • Phase
  2. How Sound is Stored
    • Bit Depth & Rate
    • File Formats
    • MIDI
    • Tempo, BPM, Spacing
  3. Common DAW Interfaces
    • Non-Destructive Editing
    • Instruments / Channels
    • Mixers, Playlists & Piano Rolls
    • Input VS Send
    • Common Troubleshooting
  4. Basic Sound Modification
    • Mono VS. Stereo
    • Panning
    • ADSR Envelopes
    • What is Gain?
    • Pitch Stretching
  5. Engineering / Creation Techniques
    • VST, VSTi, Dx, RTAS
    • Plug-ins (VSTi) In-depth
    • Property Automation
  6. Processing & Filter Effects
    • Common traits
    • Pass Filters
    • Equalizers
    • Limiters & Gates
  7. Additive Effects
    • Reverb
    • Delay
    • Flanger
    • Phasing
    • Vocoder
    • Low Frequency Oscilation
  8. Recording & Processing
    • Environment
    • Noise Removal
    • Normalization
  9. Mastering
    • Order of Approach
    • Compression
    • The Great Loudness Wars
    • Listening Fatigue
    • Stereo Separation
    • Frequency Seperation
  10. Digital Audio for Foley Work
    • Locational Consideration
    • How Sound Travels
  11. Hardware
    • Connectors & Cables
    • Microphones
    • Hardware Mixers
    • MIDI Controllers

Game Oriented Programming

This page is more of a small reference for code snippets and for some quick summaries of game development software that might be helpful to aspiring game developmers / students. This wasn't my primary focus at school so a lot of this is even less undeveloped then the previous pages...

Most of these examples are all written in JavaScript so that any visual samples can run in your browser. At the same time I've tried to adhere to common rules of object oriented programming to make them adaptable to other languages. Variables will not change type, arrays will be of a specific type, etc.

If you're not familiar with JavaScript, please see the JavaScript section within the Web Development category for a primer.

I've also included a few sections on working with unity to address some of the commonly asked questions for new users.

  1. Coding Software
    • Common Concepts
    • Notepad++
    • Sublime
    • Visual Studio
  2. Unity 3D
    • Interface and Engine Architecture
    • Notes for Programmers
    • Miscellaneous Notes and Common Questions
  3. Prevelent Numbers & Concepts
    • Constants
    • Types of Rotation
  4. Basic Foundations
    • Finding Slope of 2 Points
    • Finding a Square Root
    • Area of Primitive Shapes
    • Area of Polygons
  5. Measurements (Distance)
    • Finding Distance in 2 Dimensions
    • Finding Distance in 3 Dimensions
  6. Orientation
    • Turn to Point at Target
    • Turn to Point at Target (Smooth)
    • Rotated Movement
  7. Proximity Functions
    • Crossing Lines
    • Normal Direction
    • Vector Normalization
    • Insetting polygons
  8. Detecting Intersections (2D)
    • Lines
    • Squares
    • Circles
    • Polygons
  9. Collision / Intersection Reaction (2D)
    • Lines
    • Squares
    • Circles
    • Polygons
  10. Matrix Transformations
    • The Matrix Layout
    • Translation
    • Scale
    • Rotation
  11. Helpers
    • Look at Point
    • Dimetric Rendering Order
  12. Sorting
    • Bubble
  13. Screen Space to Orthogonal Views
    • Square Grid
    • Dimetric
    • Trimetric Views
    • Hexagonal Grids
  14. Pathfinding
    • Possible Movement (Squares)
    • Possible Movement (Hexes)
    • Polygonal Maps
    • Dimetric Line of Sight
  15. GUI helpers
    • Amorphous Menus
  16. Raycasting
    • Simple 2D
    • Spreading the Rays
    • Rendering Results
  17. Miscellaneous Helpers
    • Selecting a Range Within an Array
    • Constrain Point to Line
    • Connected-Component Labeling

Game Design

Just a few thoughts about game design I felt the need to put into written words. This includes both my opinions on what makes a good game and also some "mechanical" tricks for game design that aren't opinion but aren't necessairly the domain of coding or traditional art disciplines (especially special effects).

  1. Interactive Design
    • Explosion Cloud Color Ramps
  2. Techniques for Visual Effects
    • Explosion Cloud Color Ramps

Digital Concepts

There are a few key concepts that can be applied to multiple disciplines when it comes to working with computers.

Any subject that deals in the creation or manipulation of digital images will require a familiarity with the way computers store and represent visual imagery. It doesn't matter whether or not you are texturing 3D models, painting on a 2D canvas, manipulating photographs in an image editor or even just modifying the background color of a web page. Each of these fields will use similar terminology, measurements, and functions to achieve a desired goal.

This is not an entirely comprehensive section. These are the basics that will be expanded upon in each section they pertain to.

  1. Miscellaneous Tips
    • Miscellaneous Tips and Computer Usage
    • Showing File Extensions
    • Driver installation
    • Using Tablets in Windows
  2. Basics of Color
    • Color Mixing Systems
    • Color Labels
    • "Color", Hue, Saturation, & Brightness
  3. Measuring Color (Raster Images)
    • Storing Colors as Numbers
    • Color Models
    • Channels
    • Color Blending Modes
  4. Universal Color Techniques
    • Perception of Contrast
    • Color Coordination
    • Gradients
  5. Vector Based Images
    • Raster vs. Vector
    • Editing Vector Images
    • Best Practices
  6. Aliasing
    • What is Aliasing
    • Anti-Aliasing Techniques
  7. Layering
    • Layer Representation
    • Common Layer Interface Signs
  8. Transparency
    • Layer Transparency
    • Alpha channels
    • Masks
  9. Image File Formats
    • Format Comparison
    • Program Compatibility
    • Bit Depth
  10. Transitioning programs
    • Can I Use...?
    • Photoshop to Krita
    • Autodesk to Blender
    • FL Studio to LMMS

Drawing & Painting

These pages are primarily concerned with either replicating pre-existing images or discussing how to create an image from scratch using reusable procedures and methods. The exercises are mostly program indipendent and involve techniques that can be used in an medium, traditional or digital.

It still may be beneficial to review the graphic design section as that is where pages on color theory and color correction can be found.

  1. Basic Tools & Planning
    • Expectations
    • Brushes
    • Planning
    • Digital Imaging
  2. Transposing Images
    • Copying Images with Grids
    • Keeping Proportions
  3. Geometry & Perspective 1
    • 0 Point and Orthographic Views
    • 1 Point Perspective
    • 2 Point Perspective
    • 3 Point Perspective
  4. Geometry & Perspective 2
    • "4" Point Perspective
    • Perspective for Distortion.
    • Perspective for Organic Shapes
  5. Shadows Using Point Perspective
    • Shadows in 2 Point Perspective
  6. Process, sketching
    • Outline vs. Block Sketching
    • Layers for Sketching
    • Mortal Sketches
  7. Brush Control
    • Digital Color Blending
    • Surface Texturing Techniques
  8. Painting process
    • The Painter's Algorithm
    • Spreading Attention
    • Hierarchy of Detail
  9. Working with Comic Styles
    • Binary Line Work
    • Setting Up Layers & Masks
    • Colored Line Work
    • Highlight & Shadow Layers
  10. Light (and Shadows)
    • Seeing the POV of a Light
    • Direct / Indirect Light
    • Guessing Shadows Exercise
  11. Light (and Color)
    • Diffusion
    • Colored Lighting
  12. Design
    • Color Choice
    • Composition
  13. Pixel Art
    • Why Pixel Art?
    • Linework in Pixel Art
    • Color and Shading
    • Tiled Images
    • Animation
  14. Animation
    • WIP

Graphic Design

Graphic Design concentrates less on "painterly" subjects and on more basic concepts of art in general. These exercises use a more strict process and are include more software specific examples (primarily photoshop).

  1. Basics of Digital Imaging for Design
    • Software Interfaces
    • Setting Up New Documents
    • Rulers, Grids, & Guides
    • Placeholder Images
    • Non-destructive Editing
    • Moving Elements
  2. Raster and Vector Images
    • See the "Digital Concepts" category for the basics of these subjects. Below are the program specific pages for how to use their respective vector tools.
  3. Selection Tools
    • Selection Tool Types
    • Selection Tool Options
    • Selection Operations
  4. Layers & Masks
    • Layers
    • Blending Modes
    • Masks
    • Alpha Channels
  5. Using Color
    • Color & Contrast
    • Color Coordination
    • Gradients
  6. Logos and Simplified Images
    • Monolithic Design
    • Pre-Visualization
    • Process
  7. Typography
    • Fonts & Typefaces
    • Tracking & Kerning
    • Working with Text
    • Typographic Color
  8. Font Creation
    • Readability & Clarity
    • Personality in Design
    • Creating Fonts
    • Font Programs
  9. Image File Preparation
    • About Bit Depth
    • HDRI Images
    • Panorama Images
  10. Image Color Correction & Adjustments
    • White balance
    • Curves & Histograms
    • Brightness & Contrast
    • Exposure / Gamma
    • The Channel Mixer
  11. Placing Elements Within Images
    • Isolating Elements
    • Inserting Single Elements
    • Matching Element Qualities
  12. Image Manipulation Advanced
    • Healing & Cloning Tools
    • Element Distortion
    • Modifying an Element Within a Single Picture
    • Blending Multiple Elements into One
  13. Layout
    • Separating Elements
    • Guiding Attention
    • Publication Terminology
    • General Guidelines
  14. Advertising as an Art
    • The Origins
    • Introducing Simplicity
    • Humor
    • Considering Demographics
  15. Branding (Previsualization)
    • Consistent Imagery
    • 3D Mockups

Video Editing

We'll only use this section sporadically.

  1. Overview
    • Popular Uses
    • Limitations
  2. Common Interfaces & Tools
    • Layout
    • Project Structure
    • Common Tools
    • Effects
    • Rendering / Output
  3. Animating With Keyframes
    • Adobe Specific Keyframes
    • Effects
    • Curves
  4. Timecodes & Clip Speeds
    • Timecode
    • Adjusting Clip Speed
  5. Titles & Text
    • Text Objects
    • Placing (and Moving) Text Along a Path
    • Animated Strokes
    • Animated Typewriter Effect
  6. Masks
    • Basic Masks
    • Layered Masks
    • Rotoscoping
  7. Basic Effects
    • Color Correction
    • Blurring / Flaring
    • Camera Shake
    • Animating Strokes
  8. Chroma Keying (Green Screens)
    • Basic Premise
    • Types of Key Isolation
    • Filming Conditions
  9. Motion Tracking
    • Basic Premise
    • Reference Points
  10. Rendering & Encoding
    • Video Specific Properties
    • Adobe Media Encoder
    • XMedia Recode
  11. Puppetry
    • Hierarchical Objects
    • xxxxxxxxxxxx
  12. Footage Correction
    • Flicker Problems
  13. Software FAQ & Popular Bugs
    • Premiere Pro

Web Design

The language of the internet is the product of a thousand geniuses who all hate each other, and it shows.

  1. IDEs, Editors and Software
    • Adobe Dreamweaver
    • Sublime Text Editor
    • Notepad++
  2. HTML
    • Basic Page Parts
    • Syntax & Rules
    • Elements
    • Attributes
    • Images
    • Inline Styles
  3. HTML, Links & Embedded Objects
    • Parts of a Link
    • Link Attributes
    • Embedded Documents
    • Flash & Java
  4. HTML, Lists & Tables
    • Organizing Information
    • Lists
    • Tables
  5. CSS
    • Syntax
    • Selectors
    • Selectors (Conditional)
    • Basic Properties
  6. CSS, Coloring & Images
    • Color Formats
    • Background & Text
    • Outline vs Border
    • Images
  7. CSS, Positioning & Moving Elements
    • Relative VS Absolute
    • Floating Elements
    • Display
    • Exact Positioning
    • Margin & Padding
    • z-index
  8. CSS, Text Adjustments
    • Changing Fonts
    • Text Size
    • Text Position
    • Link Styles
  9. CSS Techniques
    • Organizing Properties
    • Centering Elements
    • The "Reset" Class
  10. CSS Shapes & Patterns
    • Simple Shapes
    • Angled Sides
    • Transformations
    • Compound Shapes
    • Patterns
  11. CSS Animations
    • Basic Animations
    • Transition "Easing"
    • Transition Puzzles
  12. CSS, Conditional Selectors
    • Child Selectors
    • Parent Selectors
    • Sibling Selectors
    • Pseudo Classes
    • Text [Pseudo] Selectors
    • Combining Selectors
  13. Decoupling
    • CSS & JavaScript
    • Folder Structures
    • Good Practices
  14. Device Adaptation
    • Responsive Design
    • CSS Media Queries
    • Browser Preview Modes
    • Query Types

Web Design Advanced

This section will deal mostly with front-end development. This means it is primarily about JavaScript development. This will include everything from basic element property changing using JavaScript to HTML5 game frameworks.

PHP development basics can be found in a minor section at the bottom.

  1. JavaScript Basics
    • Summary
    • Syntax & Structure
    • "if" Statements
    • Functions
  2. JavaScript Workflow
    • The Console
    • Console Commands
    • Error Catching
    • Detecting Disabled JavaScript
    • Waiting for Page Loading
  3. JavaScript Styling
    • Common Styling Table
  4. JavaScript Conditionals and Comparisons
    • Conditional Code
    • Making Comparisons
    • Switch / Case
  5. Functions
    • Encapsulation
    • What it means to "return"
    • Arguments & Parameters
    • Unknown arguments
  6. JavaScript with DOM Events
    • DOM Events
    • Mouse Events
    • Keyboard Events
  7. JavaScript Lists & Arrays
    • JavaScript Arrays
    • JavaScript Specific Commands
  8. JavaScript Loops
    • Loop Syntax
    • Traversing Loops
    • Loop Breaking
  9. JavaScript Objects
    • Creating Objects
    • Parsing Objects
  10. JavaScript and Instantiating Code
    • JS as an Object Oriented Language
    • Functions as Objects
    • Objects as Objects
    • Classes as Objects
  11. JavaScript & Continuous Updating
    • Constant Updating
    • setTimeout & setInterval
    • Update Architecture
  12. JavaScript & Canvas
    • Basic Shapes
    • Bitmap Control
    • Update Functions
    • Animation
  13. JavaScript Libraries
    • 3rd party Libraries
    • jQuery
    • React
  14. Some other areas of web dev to go over, time permitting.

  15. Plug-in objects, Java, Flash
  16. PHP
  17. Forms
    • Basic form Elements
  18. Saving Data Locally
    • Web Storage
    • Cookies

Writing

A quick reference for those with outstanding writing assignments.

  1. Organized Writing (for Essays and Reports)
    • MLA Format
    • Structure & Order
  2. Writing style
    • Types of Papers
    • Tone & Voice