© Coding4Youth.org. All rights reserved.
SPEC202: Intro to Graphic Design for Websites - Part 2
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.