GD422 Web Design II


Georgian Court University
Department of Communication, Graphic Design Multimedia, Fall 2020
Instructor: Robin Cameron rcameron@georgian.edu
Times: Mondays and Wednesdays, from 4:00 – 5:40pm
Duration: August 24th — December 7th, 2020
Office Hours: By appointment only


Schedule
Week 1
Week 2
Week 3
Week 4
Week 5
Week 6
Week 7
Week 8
Week 9
Week 10
Week 11
Week 12
Week 13
Week 14
Week 15
Week 16
Description
Projects
Are.na
Presentation Template
Software / Hardware
Objectives
Policies
This course focuses on techniques of designing for the web. We will utilize problem solving as a way of creating design and content that serves in both form and function in order to develop web based projects. Students will have readings and discussions as well as learn practical knowledge about how digital design functions. We will look at topics concerning the history of coding and the internet, futurism, storytelling and related contemporary digital theory. In practical terms the course will teach students how to create digital content either as audio or image based media. The student will also understand user journeys and basic UX, basic brand anatomy, social media campaigns and responsive typography for the web. The final project will be to use Figma to design a website and implement that website with a CMS as portfolio showcasing their work.

Projects

1. Are.na Sketchbook
2. Social Media Campaign (+ Animation)
3. Short Audio / Podcast Radio Program
4. Website Portfolio Design (+ Mobile version)

Software

Content Management Systems (Wordpress, Squarespace, Cargo Collective + others)
Adobe Photoshop, Adobe Illustrator, Adobe Audition
Figma
Later
Are.na

Hardware

A Mic to record Audio, either a USB Mic, or your phone

Objectives

— Students will be fluent and flexible in designing for electronic media and the related professional practice skills to join the graphic and multimedia design communities
— Learn the history of coding and explore contemporary theories about the web
— Develop an understanding of the web design process, user journeys, mapping and UX
— Utilize design thinking to create a functional website (that also works on mobile)
— Apply a technical proficiency for uploading and organizing web based content
— Record and edit a short podcast using music or audio that contains a theme
— Create a concise social media campaign to promote a project (with some simple animation)
— Learn a global view of design theory and practice
— Develop effective oral communication and presentation skills


Readings

Each week there will be readings that will expand on the ideas discussed in the course. The readings are design writings taken from many vantage points and from varying moments of design and art history. These readings will broaden your scope and allow you to be open minded about concepts that you may be able to utilize in your own work. We will have a brief discussion as a class each week about what we have read.

Presentations

Each week one student will be selected to give a brief presentation of a digital project that they have found that inspires them and to expose the class to something new. This digital project will showcase good design on the web and the student should be able to explain why this example represents good design in terms of functionality or visual interest. There will be a google slides template that you can use to fill in the information for your presentation. The student that is chosen that week will be at random and after you have presented once you should continue to create a new presentation of something that you’ve found to share with the class when you are called upon again to present.

Are.na sketchbook

In order to keep your ideas organized we will utilize the website Are.na. This will be a sort of ‘digital sketchbook’ for what you come across in your research. As part of your grade you will be expected to have an Are.na channel with at least 20 blocks of inspiration / images / digital content that you’ve been gathering for the course and your projects, there is a chrome extension that might come in handy. You can also take notes directly in Are.na if you like. At the end of the course there will be an option to print a PDF or a book of your findings

Inclusive Learning Statement

Your success in this class is important to me. We will all need accommodations because we all learn differently. If there are aspects of this course that prevent you from learning or exclude you, please let me know as soon as possible. Together we’ll develop strategies to meet both your needs and the requirements of the course. I encourage you to visit the Academic Development & Support Center to determine how you could improve your learning as well. If you need official accommodations, you have a right to have these met.

Attendance Policy

For virtual meetings, class attendance is mandatory. Circumstances beyond your control will be evaluated on a case-by-case basis. It is your responsibility to catch up with class announcements, assignments, and materials on Blackboard. You may not receive credit for a course in which you fail to be present 80% of the time, as determined by the Attendance records. Students should not disrupt class by conducting any activities that interrupt.

Course Usage of Blackboard Learn

Copies of the course syllabus and major assignments may be found on Blackboard Learn. You are responsible for regularly checking the online resources, which is accessed through the Georgian Court Blackboard Site. Additional support is found on the GCU Blackboard landing page.

More Georgian Court Policies


Week 1


Monday August 24th


— Introductions
— Syllabus Overview
— Tools Overview
— Download Figma
— Sign up for Are.na to create your sketchbook
— Consider which CMS system you’d like to use
— Buy hosting and URL for your portfolio site
— Go over Readings and Homework

Wednesday August 26th


— Presentation
— Reading discussion,
History of Code by Paul Ford

— Go over digital principles 101, digital mindset, interaction, basics of UX
— Work for the rest of class on gathering inspiration and adding to Are.na sketchbook

Week 2


Monday August 31st


—Figma Tutorial
— Simple animation with frames in Adobe Photoshop
— Resizing images for the web review
— Go over file management and save for web

Wednesday September 2nd


— Presentation
— Reading discussion,
A Primer of Visual Literacy by Donis A. Dondis

— Individual check in meetings
— Class time to begin to work on concepting your social media campaign
— Use
Paul Thek’s teaching notes
as a starting point for your campaign (What do you want to say?)
— Sign up for Later (it’s free) to organize your Social Media Campaign

Week 3


Monday September 7th (no class)


— Happy Labor Day!

Wednesday September 9th


— Presentation
— Reading Discussion,
The Woman Who Gave the Macintosh a Smile by Alexandra Lange
— Go over digital principles 102, responsive, grids, color systems, icons & basics of type

Week 4


Monday September 14th


— Social Media Campaign Due, 20 posts with captions on Instagram, either posted or screenshots from Later

Wednesday September 16th

— Presentation
— Reading Discussion,
The Web’s Grain by Frank Chimero

— UX overview
— Individual check in meetings look at Are.na sketchbook and first wireframes

Week 5


(Critical Concerns Week)
Monday September 21st


— Site Maps & User Flows, analyze sites to understand navigation
— Card sorting exercise
— Wireframing, how can it help us organize content?
— Class time to work on Wireframes
— Decide on the content / projects that will go in your portfolio

Wednesday September 23rd


— Presentation
— Reading discussion,
Excerpt from Infinite Jest by David Foster Wallace

— Have your wireframe complete for your Portfolio site in Figma
— Continue to progress on your Portfolio site for the rest of the semester

Week 6


Monday September 28th


— Wireframe review
— Workflow in Figma, working with symbols and type
— Headers, Body Copy, Type Styles, Color Styles
— Go over Material Design principles from Google


Wednesday September 30th


— Presentation
— Reading discussion,
Adam Why Arial by David Reinfurt
and
Digital Typography H&Co’s discover.typography

— Responsive Typography / Variable Fonts
— Type Pairing how to
— Go over What is a style tile?

Week 7


Monday October 5th

— Prototypes
— Partner up and share your work to try prototyping, tweak based on feedback
— Exercise Due, make a style tile for your portfolio site
— Partner up to critique and review, then present to the class final direction

Wednesday October 7th


— Presentation
— Reading discussion,
The Modernist Grid by Richard Hollis

— Go over style tiles to refine, have three more options ready

Week 8


Monday October 12th


— Check in for Portfolio Site, with direction and Are.na sketchbook
— Quiz on Figma's Learn Design Pilot
— 1st draft of Portfolio site designed due in Figma

Wednesday October 14th


— Presentation
— Reading discussion,
A Lawless Proposition by Paul Chan

— Go over mobile considerations for portfolio site
— Breakpoints
— Learn about Responsive Logos

Week 9


Monday October 19th


— Branding 101, Anatomy of a brand
— Personas
— Tone of Voice
— Examine Martine Syms’ ‘brand’
— Consider how to create your own ‘brand’ and how this could be applied to your portfolio

Wednesday October 21st


— Presentation
— Reading discussion,
The Mundane Afrofuturist Manifesto by Martine Syms
and
Octavia Butler’s
notes


Week 10


Monday October 26th


— Introduction to Audio / Podcast project
— Listen to
Robin’s Time Podcast before class

— In addition listen or watch one episode of the following: Scenes from the Studio, This American Life, Junior Asprin Records, S-Town or Serial
— Work on concepting your Audio / Podcast project

Wednesday October 28th


— Presentation
— Discussion, watch
The Gap by Ira Glass

— Go over the basics of Adobe Audition for Audio Editing

Week 11


Monday November 2nd


— Check in for Portfolio Site and Are.na
— 2nd draft of Portfolio site designed due in Figma
— Decide which CMS you will be using and begin to bring the site live, homepage only


Wednesday November 4th


— Presentation
— Reading discussion,
Screenshot it or it didn’t happen by Jacob Gaboury

— Have your podcast concepts + outlines ready for class, add info to Are.na channel
— Individual check in meetings

Week 12


Monday November 9th


— First draft of podcast project due, have some audio recorded and chosen
— Check in 3rd Draft of your portfolio project due, Two pages in a CMS program
— Any technical issues can be discussed here
— Individual check in meetings

Wednesday November 11th


— Presentation
— Reading discussion,
Excerpt from 24/7 by Jonathan Crary pages 8-15

— Continue to work on your podcast and portfolio projects
—Time to work in class (ask questions)


Week 13



Monday November 16th


— Second draft of podcast project due, edits made, pacing pauses
— Check in 4rd Draft of your portfolio project due, Four pages in a CMS program
— Any technical issues can be discussed here
— Individual check in meetings

Wednesday November 18th


— Presentation
— Reading discussion,
Excerpt from Uncanny Valley by Anna Weiner pages 1-20

— Continue to work on your podcast and portfolio projects
— Individual check in meetings

Week 14



Monday November 23rd


— Discussion, watch videos on
Jaron Lanier Fixes the Internet

— Continue to work on your podcast and portfolio projects
— Individual check in meetings


Wednesday November 25th (Thanksgiving Holiday no class)


Week 15


Monday November 30th


— Last Check in for Portfolio Site
— Final draft of Portfolio site all pages completely coded into a CMS program
— Continue to work on your podcast and portfolio projects / Any technical issues should be resolved here

Wednesday December 2nd


— Podcast project due as final, uploaded to this dropbox assignments link as an MP3 so we can listen in class


Week 16


Monday December 7th (Final Assessment)


— Portfolio site + Mobile due as final
— Are.na sketchbook due as final




END