SPEC202: Intro to Graphic Design for Websites - Part 2

  • Specialty Programs
  • Hardware/Software/Books Required?

    None

Course Description

In this course, students will continue building skills and learn how to create a wireframe and turn it into a digital concept. This is a continuation from part 1 and it is recommended that students take part-1 before enrolling in part 2 as we will continue developing our website concept in a wireframe that will eventually be turned into digital artwork.

Supplies:
Pen or pencil for note taking
Notebook for taking lots of notes they will refer back to in the future
Sketchbook
Pencils
Colored Pencils
Markers
Digital Software: Recommended, Adobe Photoshop or Illustrator; Affinity Designer or Photo

Day 1 – Website Layouts

We’re going to look at various website layouts and see when to use each one. Remember, your web-
site has to be compatible for both mobile and desktop devices. In addition, there are certain places

you should put things like your logo, contact info and even call-to-action (CTA) on your site, we’re
going to discuss these as well.
Homework: Decide which website layout you want to use for your website.
Day 2 – Creating your Wireframes
You can’t build a website if you don’t know where you’re going just like on a cross-country trip from
NY to LA, you have to follow a map to get you there. This day we’re going to learn what a wireframe
is, why we need to create one and how to do it. Fail to plan, plan to fail. It is vital that you sit down and
work out your website ideas on paper, BEFORE you start building your site. It costs more money and
wastes plenty of time by trying to “figure out” what your website will look like and how it will function
without having a plan to follow. UX/UI design has become very important when it comes to designing
building a website and we will be using those standards in order to figure out how to create a website
concept on paper first, before going digital.
Homework: Start creating your own wireframes for your website. Bring your concepts to our next
class.
Day 3 – Class Feedback and Critique
A HUGE part of design is giving and receiving feedback on the status of a design concept. Unless
you’re building a portfolio website for yourself, you’ll always need to seek out feedback and approvals
from colleagues, art and creative directors, management, etc. so now we’re going to discuss every

student’s website concept and provide helpful feedback on how the design could be better, if neces-
sary. This process will occur over several days.

Homework: Make adjustments to your concept per feedback, include a version with color and bring it
our next class for review.
Day 4 – Continuation on Class Feedback and Critique
We will finish up with the students that did not get to present the day before.
Homework: Make adjustments to your concept per feedback, include a version with color and bring it
our next class for review.back. We’re also going to recap what we covered over the past seven days
in class and answer any questions that students might still have. In addition, we’ll cover where to go
next in our career as in what software we should learn, coding languages, etc. Class participation will
be required during this lesson.
Day 5 – We’ll Finish with the Critiques
This is your last chance to share and get feedback on your wireframes before moving to digital.
Day 6 – Where You Can Create Your Digital Concepts
In today’s lesson, we’ll talk about the different software platforms you can use to create your digital
concepts and how to go about transitioning from print to digital.
Homework: Start building your digital concepts and bring the homepage and one subpage to class for
review. You will need to send me your digital file prior to class.

Day 7 – Digital Concept Discussion
In the next several classes, we’re going to discuss everyone’s homepage and subpage for feedback
on how the designer can make improvements to their design.
Homework: If you’re website was reviewed, please make appropriate changes.
Day 8 – The Importance of Feedback and Making Changes
Our designs are like are babies and we don’t want anyone to tell us how they should look or what
changes we need to make to them. I get it, but that attitude won’t get you anywhere AND you won’t

be able to keep your job. So, we’re going to learn why it’s vital to take feedback and making adjust-
ments to our work because in reality, it’s about it you, but comes down to one thing: money.

Day 9 – How to Create Your Web Graphics
In this lesson, we’re going to learn how to create your website graphics for the site and which one
should be graphics, and why.
Day 10 – Make your Web Graphics Web-Ready

It’s super important to understand what colors and file format your graphics should be for your web-
site. We’ll learn and see what happens if we don’t size graphics appropriately.