Interactive Design – week 8

Classroom

Tuesday

  • Look at animatics Project 2
  • Work on first draft of animation for Project 2
  • Learn how to incorporate Mailchimp code into ad
  • Project 2 due on Thursday, March 12th

Thursday

  • Look at first draft of animations for Project 2
  • Demo for download. Sound tutorial
  • Work on suggested changes

Assignments

  • Project 2: work towards finishing the animation

Mobile App Design – week 8

Classroom

Tuesday

  • Go to this page to get the PhoneGap software
  • We will install PhoneGap and look at the Hello World app and talk about how it works. I suggest using Chrome as your browser.
  • We will watch the Pluralsight videos about JQuery Mobile

Thursday

  • Discuss this article
  • Look at Skyrose XD mockup
  • Continue PhoneGap tutorial
  • Work on apps

Assignments

  • Work on building a template for your app in Dreamweaver

Animation – week 8

Classroom

 Tuesday

  1. Presentation: Zach Ellingson
  2. Cognitive drawing exercise is here
  3. Look at animated exercises from last week (Follow Through and Overlapping Action)
  4. Look at complete scripts – finish your script, if you haven’t, then work on your storyboard. Look at finished storyboards
  5. Watch a DisneyPlus experimental animation Wind

Thursday

  1. Presentation: Rafael
  2. Cognitive drawing exercise is here
  3. Look at any finished scripts, animatics
  4. 12 Principles of Animation:  6. Slow In and Slow Out
  5. Do a Slow In and Slow Out animation exercise: animate a head moving from left-facing profile to straight ahead to right-facing profile using Slow In and Slow Out (like in the video). Use “arcs” to trace the movements of the body parts, like the nose
  6. Next week: talk about hand-drawn animation tutorial

Assignments

  1. Write a short script for an animated scene
  2. Start working on the storyboard for your scene in Storyboard Pro

After Effects – week 8

Classroom

Monday

  1. Presentation:  Sofi, Cole
  2. In-class exercise: write a one-paragraph description of what you’ll do for Project 2, now, in class. Write it and upload it to your Google Drive. You can change it later, but this will get you started
  3. Deadline for Project 2: March 25th

Wednesday

  1. Presentation:  Zach
  2.  Complete Flying saucer tutorial
  3. Work on Project 2 and book chapters

Assignment

  • Work on Project 2
  • Do chapter 7 in the book, and upload the rendered movie file to your Google Folder

Web Design – week 8

Classroom

Monday

    1. Presentation:  n/a
    2. How to create custom CSS
    3. How to use Browser tools
    4. Web page deadline:  Wednesday, March 25th.

Wednesday

    1. Presentation: Ariana, Delikio
    2. Study your CSS! In a few weeks, we will have the CSS Olympics!
    3. CSS cheat sheet
    4. Continue to look at CSS styles

Assignments  


Beginning

  1. Work towards finishing your website after spring break

Advanced

  1. Work on website. Talk to me about your needs and concerns

 

 

Game Design – week 7

Classroom

Monday

  • 1st Quarter Grades have been posted in D2L. This is for your work on the quiz
  • Your games will need to be uploaded and ready to order in one month (at end of March)
  • Your games will be displayed to the public and playable at the Digital Arts Expo and Showcase at the end of the semester
  • Presentation: Brock
  • Snag-a-normie article
  • Exergaming article
  • Discuss the Gamecrafter’s Crowd Sale Creator
  • A resource for play testing your games online: https://playtest-coop.com/
  • Game lecture: how to create an elevator pitch
  • For Wednesday – have someone on your team create an elevator pitch for your game, using the template above

Wednesday

  • Presentation: Aiden
  • Share your team’s elevator pitches
  • Review the end of chapter one in the book
  • Review the first part of chapter two
  • Discuss these game design concepts:
    • Ludology – the study of game rules and mechanisms
    • Narratology – the study of player story lines and experiences
    • Marc LeBlanc, a game developer, wrote about the “Eight Kinds of Fun,” which are listed on Wikipedia as:
      1. Sensation: Game as sense-pleasure. Games that evoke emotion in the player, be it through sound, visuals, controller rumble or physical effort. Examples: Dead Space, Dance Dance Revolution, Candy Crush Saga
      2. Fantasy: Game as make-believe. Game as a mean to take the player to another world, some call it escapism. Examples: Final Fantasy, Nier: Automata, The Legend of Zelda
      3. Narrative: Game as drama. Game as a mean to tell a story or narrative to the player. Examples: The Walking Dead, Persona 3, Dear Esther
      4. Challenge: Game as obstacle course. Game that provide the player(s) with highly competitive value or with increasingly difficult challenges. Examples: Dark Souls, Tetris, X-COM
      5. Fellowship: Game as social framework. Games that have social interactions as its core or as a big feature.[3] Examples: Mario Kart, Destiny, World of Warcraft
      6. Discovery: Game as uncharted territory. Games in which the player explores the world he/she finds himself/herself in. Examples: Uncharted, Tomb Raider, Assassin’s Creed
      7. Expression: Game as self-discovery. Games that allow for self-expression from the player through gameplay. Examples: Minecraft, Garry’s Mod, Roblox
      8. Submission: Game as pastime. Games that have “farming” or “grinding” as a core element. Examples: FarmVille, Hyperdimension Neptunia, Disgaea

      A game does not need to have only one of the above, nor all of them. Just because these are different kinds of fun does not mean that everyone finds all eight of these things fun at all. Not only do different games provide different combinations and relative quantities of the various kinds of fun, but different players find different combinations more or less fun than others.[4]

  • How many kinds of fun are in your game?
  • Work with your team on developing a playable prototype for your game. We’ll start play testing your game with other teams soon. Get someone from your team to start working on the following:
    • Game box
    • Game board
    • Cards
    • Rule book
    • Elevator pitch for your game
    • Tokens, dice, etc. – what will be ordered and how does it fit your budget ($45)?

Assignments

  • Work with team on your game

 

Interactive Design – week 7

Classroom

Tuesday

  • Grades – I’ll put your first quarter grades into D2L this week
  • Look at storyboard for Project 2
  • Demo how to set up the dynamic text box so it will e-mail the information and go to the next frame
  • Work on an animatic for Project 2

Thursday

  • Look at animatic for Project 2
  • Work on suggested changes

Assignments

  • Make a storyboard for Project 2 and work on the animation

Web Design – week 7

Classroom

Monday

    1. 1st Quarter Grades have been posted. These include your work in the class and on the quiz
    2. Presentation: Joseph
    3. Please be careful with uploads to class websites. Delete any extra files you have in there, as the server is filling up (currently at 90% full). I will eventually get more space
    4. We will make 2 web pages this semester
    5. Demo how to use Elementor to make web pages

Wednesday

    1. Presentation: Heather
    2. Website basics – creating contact forms, lists, links, adding images and other media, using the custom CSS area to make changes, learning to work within the limitations of the theme

Assignments

Beginning

  1. Begin builidng your website in WordPress, based on your XD mockups

Advanced

  1. Work on website. Talk to me about your needs and concerns

 

 

After Effects – week 7

Classroom

Monday

  1. 1st Quarter Grades have been posted. These include your work in the class and on Project 1.
  2. Presentation: Sam Decker
  3. Play the three card game:
    1. Blue card: write the name of a living entity/being (examples: human, pig, alien, etc.)
    2. Yellow card: write the name of a physical activity that involves movement (examples: running, jumping, walking, etc.)
    3. Pink card: write the name of a commercial product or service (examples: Nike, Uber, Domino’s Pizza, etc.)
  4. Write a one-paragraph description of what you’ll do for Project 2, now, in class. You can change it, but this will get you started
  5.  Begin Flying saucer tutorial

Wednesday

  1. Presentation:  Sofi
  2. Complete Flying saucer tutorial
  3. Work on Project 2 and book chapters

Assignment

  • Work on Project 2
  • Do chapter 6 in the book, and upload the rendered movie file to your Google Folder

Animation – week 7

Classroom

 Tuesday

  1. Grades – I’ll put your first quarter grades into D2L this week
  2. Presentations: Sofi, Jesus
  3. Cognitive drawing exercise is here and here
  4. Masstransitscope article
  5. Watch a DisneyPlus experimental animation ( Float). Talk about how important the story is to the animation
  6. Look at finished walk cycles, exercise animations, and scripts
  7. Introduce Toon Boom and Storyboard Pro
  8. Continue to work on walk cycles. If you are done with your walk cycle, start working on a script for a short animated scene

Thursday

  1. Presentation: JD, Nick
  2. Cognitive drawing exercise is here and here
  3. Look at any finished walk cycles, animation scripts
  4. 12 Principles of Animation:  5. Follow-Through and Overlapping Action
  5. Do a Follow-Through and Overlapping Action animation exercise (animate a moving character who’s appendage – hair, feathered hat, tail, etc. – displays the properties of this exercise. Animate the appendage on a separate layer )

Assignments

  1. Finish walk cycle for your character and add in their personality via clothing, appendages, the way they move, etc.
  2. Write a short script for an animated scene

Mobile App Design – week 7

Classroom

Tuesday

  • Grades – Your first quarter grades are in D2L
  • Pictionary logo game
  • We are going to start working with the app design program. We’re going to use Dreamweaver, XD, and PhoneGap (you won’t need to install PhoneGap for a little while. I’ll tell you when). When  Here’s what you need to do:
    1. Put Adobe XD and Dreamweaver on your laptops (via creative cloud), add the Web Export plugin (in XD, go to Plugins/Discover Plugins/ then search for Web Export)
    2. I will show you what to do from there to export your XD pages to HTML
    3. When I tell you we’re going to start the next phase of this, please download the PhoneGap (Cordova) desktop app and mobile app (the one for Android, so this is 2 programs total) to your laptop
    4. We will have 1 Android phone we can use for testing, so we’ll have to share it. We will also work on the HTML/CSS pages in Dreamweaver.

Thursday

  • We will discuss how to clean up the HTML pages exported from XD (remove javascript, see if HTML and CSS can be cleaned up)
  • Config.xml

Assignments

  • Export your XD artboards to HTML pages with internal CSS
  • We will try installing QR code reader apps on our phones and see if we can preview our apps from Dreamweaver

After Effects – week 6

Classroom

Monday

  1. Animated text project is due today – look at it
  2. Assign Project 2: Fantastic Journey Travel Ad
    1. Make it at least one minute long
    2. Use text, animation, graphics, video, music
    3. Show the most outrageous location people could travel to (the idea is to make up something fantastic). For example, your project could be an ad to travel to the Moon or Mars. Or you could advertise an African safari which teaches you how to talk to animals like lions and elephants. The sky is the limit! (I don’t have examples to show you of previous student work because this is a new assignment).
  3. Adobe tutorials – start working on these tutorials. The videos are here. Download these files. Do 1 and 2.
  4. Take a brief look at chapter 4 in the book

Wednesday

  1. Presentation: Jordy
  2. Look at remaining Project 1 files
  3. Adobe tutorials – finish working on these tutorials. The videos are here. Download these files. Do 3-5.
  4. Work on Project 2 and book chapters

Assignment

  • Work on Project 2
  • Do chapter 5 in the book, and upload the rendered movie file to your Google Folder

Mobile App Design – week 6

Classroom

Tuesday

  • Use iPads and paper to discuss ideas for mobile apps
  • Play “Pictionary for logos”
  • Use this week to polish up the design of your apps in XD. Next week, we’ll start coding the apps
  • Here is the Phonegap software

Thursday

  • No class today due to Rodeo Vacation, so we will do the following next week
  • Start looking at how the programs/process we’ll use to create and test apps

Assignments

  • Work on your app in XD
  • Prepare to jump into coding world

Web design – week 6

Classroom

Monday

    1. Look at these examples of colorblindness (created with Color Oracle)

    2. Discuss quiz
    3. Quiz will be open-book. Here are the requirements:
      1. Build your HTML page in Dreamweaver. Make a new page and delete everything, then code it from scratch from your notes
      2. Include everything on my quiz notes (see .pdf above) plus the following three things:
        1. A style you create (like changing the font for the page)
        2. An HTML element you create (like a list)
        3. A working link you create (like to yahoo.com)

Wednesday

    1. Presentation: Grady
    2. Turn in quiz
    3. Introduce Elementor

Assignments

Beginning

  1. Study for quiz
  2. Finish up website mockups in XD

Advanced

  1. Finish up website mockups in XD
  2. Start work on actual websites

 

 

Interactive Design II – week 6

Classroom

Tuesday

  • Look at any finished infographics we haven’t seen yet
  • Import audio tutorial
  • Go into more detail about Project 2 – ad with input text box and downloadable .pdf content. Show demo ad.
    • Make an ad using Animate’s Templates/ Advertising/Large Rectangle template (336x280px )
    • Make the ad 100k or less (not including downloadable pdf). I’ll show you how to check how large it is
    • Create a section for “input text” (an e-mail address), where the user can input text and click a button to submit it
    • Create a section where, after the user has submitted their e-mail, they get access to download a .pdf file
    • Start by creating a storyboard for the ad

Thursday

  • No class today due to Rodeo Vacation, so we will do the following next week
  • Look at storyboard for Project 2
  • Work on suggested changes

Assignments

  • Make a storyboard for Project 2

Animation – week 6

Classroom

 Tuesday

  1. Presentations: Natalia
  2. Cognitive drawing exercise is here
  3. Pass around The Animator’s Survival Kit book
  4. Watch a DisneyPlus experimental animation (Short Circuit)
  5. Look at finished walk cycles and Straight Ahead and Pose to Pose animations
  6. Look at characters and sample of animation script
  7. Continue to work on walk cycles. If you are done with your walk cycle, start working on a script for a short animated scene.

Thursday

  1. No class today due to Rodeo Vacation, so we will do the following next week
  2. Presentation: Jesus
  3. Cognitive drawing exercise is here
  4. Look at any finished walk cycles, animation scripts
  5. 12 Principles of Animation:  5. Follow-Through and Overlapping Action
  6. Do a Follow-Through and Overlapping Action animation exercise (animate a moving character who’s appendage – hair, feathered hat, tail, etc. – displays the properties of this exercise. Animate the appendage on a separate layer )
  7. Introduction to ToonBoom

Assignments

  1. Work on walk cycle for your character and add in their personality via clothing, appendages, the way they move, etc.
  2. Write a short script for an animated scene

Game Design – week 6

Classroom

Monday

  • Discuss this post about color blindness and board games
  • Review information for game design quiz, which will be Wednesday
    • The quiz will be over the information which is highlighted in yellow on my notes
  • Discuss Gloom card game
    • Clever core theme – hurt your family (mechanic)
    • Good artwork, intriguing cards -transparent (aesthetic)
    • Players tell stories (dynamic)

Wednesday

  • Presentation: Emilio
  • Take game design quiz
  • Snag-a-normie article
  • Exergaming article
  • A resource for play testing your games online: https://playtest-coop.com/
  • We ran out of time today, so we’ll cover everything below next week…
  • Game lecture: how to create elevator pitch
  • Work with your team on developing a playable prototype for your game. We’ll start play testing your game with other teams next week. Get someone from your team to start working on the following:
    • Game box
    • Game board
    • Cards
    • Rule book
    • Create a pitch for your game using the template above
    • Develop a playable prototype that others can play
    • Any additional items needed for your game

Assignments

  • Continue looking at the first chapter in the textbook (above)
  • Work with team on your game

 

Animation – week 5

Classroom

 Tuesday

  1. Presentations: Weston, Luke
  2. Cognitive drawing exercise is here
  3. Watch a DisneyPlus experimental animation (Short Circuit)
  4. Deadline for character walk cycle – extended – let’s check in next week and see how people are doing on this
  5. Continue to work on walk cycles. Demo how to animate on twos and pause a character at the top and bottom of their walk cycle

Assignment

  1. Work on walk cycle for your character

Thursday

  1. No presentation today
  2. Cognitive drawing exercise is here
  3. Look at any finished walk cycles
  4. 12 Principles of Animation: 4. Straight Ahead and Pose to Pose
  5. Do a Straight Ahead and Pose to Pose animation exercise (little wizard shooting wand an another, who’s freaking out)
  6. Adding sound using Luke’s animation as a demo
  7. Next week: Introduction to ToonBoom
  8. Next week: Look at sample of animation script

Assignments

  1. Work on walk cycle for your character and add in their personality

Mobile App Design – week 5

Classroom Tuesday

  • Discuss the article here
  • Use iPads and paper to discuss ideas for mobile apps
  • Some of the issues with the Iowa Caucus App
  • Deadline for mobile app prototype in XD – Feb. 13th
  • Work on the next draft of your app idea, based on the feedback you received

Thursday

  • Sales Sheet for board games (I mentioned this on Tuesday)
  • Discuss the article here
  • Discuss this article here as well
  • Look at logos/names of mobile apps
  • First draft of mobile app due next Tuesday

Assignments

  • Work on your app in XD

Game Design – week 5

Classroom

Monday

  • Guest lecturer Brandon Yongbanthom
  • The game design quiz will not be this week. We will review the material before I give you the quiz
  • Work with your team on developing a prototype for your game

Wednesday

  • The presentation schedule has been posted here
    • Please note: don’t just show us video of you playing a video game for 10 minutes
    • Don’t just spend 10 minutes talking about your favorite game. Pick a topic, like game art, the history of games, etc. You can talk about your favorite game, along with others, in the context of your topic
  • No apps for board games – will take too much time away from the game design process
  • Discuss Monkey-tower game evolution
  • Check out this article about ancient board games
  • See this article about how to make a diverse game studio
  • Sales Sheet for board games
  • Work on game with your team

Assignments

  • Continue looking at the first chapter in the textbook (above)
  • Play some board games with friends and family. The library has a board game session from 3-5pm on Wednesdays (3rd floor every other week, in the hallway on the way to the cafeteria every other week), and you can also reserve a study room, and check out some games ,and play with your teammates anytime they are open
  • Work with team on your game

 

After Effects – week 5

Classroom

Monday

  1. Guest lecturer Neal O’Hara
  2. Animated text project is due on the 17th. Please work on this, if you’re not done
  3. Work on the book chapters

Wednesday

  1. The dates of your scheduled presentations have been posted here
  2. Tutorial 1
  3. Tutorial 2
  4. Look at chapter 3 in the book
  5. Project 1 is due on Monday

Assignment

  • Work on Project 1 – 30 seconds long, animate a quote, song lyric or saying, add music. You may also add video and other extras if you like
  • Do chapter 4 in the book, and upload the rendered movie file to your Google Folder

Web Design – week 5

Classroom

Monday

    1. Guest lecturer Neal O’Hara
    2. The HTML/CSS quiz will not happen until next week. We will review the material before I give you the quiz
    3. Please work on finishing your mock ups of your websites in XD

Wednesday

    1. I have posted your presentation schedules here
    2. Go over material that will be on the test – build an HTML page with an internal style sheet

Assignments

Beginning

  1. Use XD to mockup your website (at least 5 pages – home, contact, about, services, products) in XD, using the layout from your favorite theme as a starting point). We’ll look at these on Wednesday

Advanced

  1. Use XD to mockup your website. We’ll look at these on Wednesday

 

 

Mobile App Design – week 4

Classroom

Tuesday

  • Article to discuss next week is here
  • Use iPads and paper to discuss ideas for mobile apps
  • People who are graduating must talk to Adrian (advisor) to fill out the graduation form before Feb. 26th
  • Why is app design and testing important? Because things like this can happen
  • Deadline for mobile app prototype in XD – Feb. 13th
  • XD tutorials:
  • People who are graduating must talk to Adrian (advisor) to fill out the graduation form before Feb. 26th
  • Work on the next draft of your app idea, based on the feedback you received

Thursday

  • More information on the Iowa chaos app
  • PhoneGap on PC – try install
  • Use iPads and paper to discuss ideas for mobile apps
  • Idea: Portshare icon
  • Discuss exporting to HTML and CSS
  • Look at Linked in tutorial about prototyping a mobile app
  • Refine your app idea and work on the mockup in XD

Assignments

  • Work on your app in XD

Instructor: Greg Loumeau