|
|
| |
EVENT DETAILS |
Learn to design websites for mobile phones, tablets, and desktops using timeless principles such as color, layout, and typography. Well teach you about visual conventions, standards, and industry trends.
Learn and experience the process and principles for designing responsive websites through lectures and hands-on exercises.
You will design and produce multiple projects in this class and come out with portfolio material. Your work will be critiqued and youll get feedback to help you improve your designs.
This is design class, not a programming class. Knowledge of a design app is required: Photoshop or Sketch are best, although you could use Illustrator or InDesign.
What Youll Learn
Section 1
The Process - Overview
Topics
Site definition and planning
Information architecture
Site design
Site development
Site marketing
Tracking, evaluation and maintenance
Define Your Goals
Topics
Reading a Creative Brief
Content inventory
Workshop #1
Topics
Review assigned creative brief
Discuss content
Review a website
Write a creative brief on what the site reflects
Section 2
What is Visual Design?
Topics
Introduction to Visual Design
Introduction to Universal Usability
Anatomy of a Website
Working With Color
Topics
Color Psychology
Color Associations
Color Schemes (Monochromatic, Analogous, Complementary)
Creating a palette
Typography Overview
Topics
Type Distinctions and Categories
Finding Typefaces
Best Practices for Web and Mobile Typography
Combining and Pairing Typefaces
Mood Boards
Topics
The role of mood boards
Creating mood boards
Workshop #2
Topics
Design two unique mood boards, one for each of the companies you will be provided with.
Use the mood board template provided, either by opening it in Photoshop or remaking it in another program.
Your mood board will communicate an over all look-and-feel for the companies new websites by giving them color, type, and imagery recommendations that will get them excited for your vision.
Section 3
Web Design Principles
Topics
Grid Based Web Design
General Design Principles
How to Create a Balanced Layout
Page structure
The homepage
Section 4
Working With Content
Topics
Working with images
Editorial style
Headline styles
Page titles
Linking styles
Workshop #3
Topics
Rewrite headlines
Create page titles
Organize hierarchy
Designing Forms
Topics
Understanding forms
Designing forms
Workshop #4
Topics
Redesign the US Census
Section 5
Visual Design for the Mobile Environment
Topics
Mobile Sites versus Responsive Design Sites
Understanding the Mobile Experience
How to Design for Mobile
Tablet/Mobile Web Design Trends
Style Guides
Section 6
Workshop #5
Topics
Utilize your knowledge of layout, color, typography, and texture to create one homepage design based on a general wireframe.
Secondly, show your thought process and how you would adapt that web page to a responsive vertical smartphone layout with an open or closed navigation. (This is not about being 100% pixel-perfect, but to show that you understand the concepts and various platforms and how to think through and execute the assignment.)
|
|
|
|
|
|