Course Overview

This is an online course. The material was initially developed by Artie Kuhn and has been modified for this spring (2015) by me, Kirk Hopkins. The course is subject to change as we go. This is a learning process for all of us. This is the first time I have taught a course online so there will be a bit of a learning curve for me while I figure out what works and what doesn't. We should be able to take advantage of having a small class with more individualized attention than we may have seen otherwise. I plan to use a mixture of email, Google Hangouts, and this course website for communication with each of you.

About Kirk

We'll get started by watching some videos that walk you through what this class is all about. There will be a brief "everything you need to know about HTML and CSS to do this class" video that should be a refresher for everyone. Then, we'll look at how HTML forms work and you'll do a reading. This week, you'll read two articles, one classic, one contemporary and respond to both in one discussion. You'll also do a simple HTML exercise that proves you can handle HTML and forms.

Introduction

Overview

This course covers both the conceptual underpinnings and contemporary technical implementation of advanced web design. Technology covered include advanced HTML5, CSS3, JavaScript as well as cursory overview of server-side development using PHP and MySQL as well as technology used for rapid development for mobile devices.

Learning Goals

To learn advanced interactive design theory including use of visual and conceptual metaphors, Tog’s Laws and progressive disclosure.
To be introduced to and use advanced features of HTML5 and CSS3.
Understand server/client and build basic serverside scripts and database calls.
Understand and be able to leverage APIs using PHP and JavaScript.
To know and understand where we fit into history of interaction design, specifically WIMP and postWIMP interfaces.
Become comfortable with designing and developing for mobile.
Develop an HTML-based mobile app.
To be able to think critically about and provide feedback on interaction design pieces.

Structure

Prep

You are expected to have done the activities before the start of class (or in our case by Wednesday). You are expected to be familiar with Niihka (we will use it primarily for grades) and are responsible for dealing with any technical problems you run into.

Materials

Computer with internet access
Photoshop and Illustrator
xAMP
Access to lib.muohio.edu for etextbooks
Quicktime (for screen recordings)
Text editor like TextWrangler or TextMate license.macromates.com
FTP client like Transmit www.panic.com/transmit
Smart phone and tablet (these can be borrowed from the AIMS office or King Library) and/or XCode (free from the Apple App Store)

Projects

Project One: ToDo List Manager 25% (plus the weekly assignments add up to 20%)
- Build a simple ToDo list manager that leverages HTML forms and server-side scripting to store and update ToDo list items.
- Weekly assignments (each representing assignments for your participation grade) for this first project will ensure that you
  - know how to do an HTML form
  - learn some PHP basics & setup xAMP (i.e. your server)
  - learn some basic database manipulation using phpMyAdmin
  - learn some basic database reading, writing, and updating (CRUD) from a web page (i.e. how to do database stuff on the web)
Project Two: Location-based web solution (formerly known as "Local Area Highlights Site") 25%
- A mobile-optimized site developed in HTML, CSS and JavaScript that uses location information to achieve a goal (one example would be to display recommendations for locations and events around Oxford or your local area, which leverages PHP to tie into an external API for more information). All content should be stored in a MySQL database with a simple CMS backend.
Project Three: Phone/Tablet Web App 25%
- Work in teams (selected by Kirk) to engage in research and implement a fully-functional prototype of an innovative HTML-based phone or tablet app which leverages at least one device API as well as using PHP, CSS, and a MySQL database (when appropriate).
- Grading Rubric for Project Three
  - Project Evaluation (72% (or 18 points) of this total grade)
    Instructor will grade the entire group's solution using the standard grading rubric. Every member of the group will receive an identical grade in this component.
  - Peer Evaluations (28% (or 7 points) of this total grade)
    Each group member will evaluate each other group member. Instructor will use these evaluations, as well as what the instructor has observed to assign an individual grade. Peers will evaluate group members on attendance/engagement in meetings, volume of contribution to the final deliverables and quality of contribution to the final deliverables using the method/criteria shown below.
    
    Use this email link to email your peer evaluation to Kirk for the people in your group. The link has the evaluation criteria (which is also shown below) in the email body.
    Rank peer 1-4 points (4 being exceptional)
    1) Attendance at meetings held outside of class by the team:
    2) Quality of contribution during team meetings:
    3) Amount of contribution outside of team meetings to the team's sprint tasks:
    4) Quality of contribution outside of team meetings to the team's sprint tasks:
    5) Effectiveness in working collaboratively (e.g. sharing decision-making with others, soliciting other's ideas, encouraging, energizing):
    
    Short answers
    1) Relative to other team members, how would you describe this person's contribution?
    2) What are this person's major strengths? What have they brought to the table for your team?
    3) How could this person have improved their effectiveness as a member of your team?
    4) 1-7 (7 being highest), what overall grade would you give them?

Engagement/Assignments 25%

Did student participate effectively?
Each of the 4 assignments will be worth 5% of the overall grade, the final 5% of the grade will be overall participation in the class (largely based on your peer evaluations for Project Three)

Grading

This is an overview of my grading standards.

A Superior execution; maximum originality; highly imaginative, original, and experimental; fantastic level of craft and attention to detail
B Strong execution and originality; imaginative and experimental; consistent in work ethic; above average level of craft and attention to detail
C Average execution; some imagination and originality; lacks some consistency in level of craft and attention to detail
D Poor execution; limited originality; poor level of craft and attention to detail
F Fails to execute to minimum standards

Course Evaluations

At the end of the course you will be asked a series of questions to evaluate me (Kirk). I will strive to ensure that you learn cool stuff in this course (at least I think it's cool). I hope that you are able to grade me with high marks. We're all learning and I have found that one of the best ways to learn is to get feedback as you go. With this in mind, read the questions that you will evaluate me on, and as we go through the course let me know if I'm missing the mark anywhere. I'm more concerned about you learning than I am with getting a bad evaluation; I would prefer to address your concerns during the class instead of finding out after the fact so that you are able to learn more effectively.

The objectives, expectations, requirements and content of this course were clearly stated.
The professor was interested in and enthusiastic about the subject.
This professor used class time in an effective manner.
The grading system was clearly explained and consistent with the objectives of the course.
The professor was available outside of class during scheduled times.
Students in the course were free to comment, ask questions, and express ideas.
The professor provided an inclusive and respectful learning environment.
This course has challenged me to think.
Overall, the professor effectively facilitated learning.
Overall, I would rate my own effort in this course as superior.
My instructor welcomed students' questions.
My instructor offered opportunities for active participation to understand course content.
My instructor demonstrated concern for student learning.
In this course I learned to analyze complex problems or think about complex issues.
My appreciation for this topic has increased as a result of this course.
I have gained an understanding of this material.

Expectations

Disrespect will not be tolerated. Treat each other well.
Learning is fun, even when it’s hard. So is helping others.
Do prep work.
Stay on top of the online materials, they will pile up fast if you fall behind.
It is your responsibility to seek out help if you begin to fall behind.
Enjoy your work.

Schedule (subject to change)

Week of	Topic	What's assigned
Week 01 01-28-2015	Overview/intro What you should already know HTML Forms Design as a Liberal Art	email me a screenshot of an HTML form (show me the HTML) as discussed in the video - due 02-04-2015
Week 02 02-04-2015	Interaction Design - What's the Problem Web Servers xAMP	Download/install xAMP PHP exercise email me a screenshot of a simple PHP page showing that you got it working as outlined in the videos - due 02-11-2015
Week 03 02-11-2015	Project One introduced Databases PHP	Start your Project One Research, Personas and the Big Idea email me a screenshot of phpMyAdmin browsing a table and a browser displaying the contents of the table showing that you got it working as outlined in the videos - due 02-18-2015
Week 04 02-18-2015	Tog’s Laws Wireframes and Mockups PHP & MySQL and CRUD	Work on Project One revisions email me a screenshot of PHP Forms and MySQL CRUD showing that you got it working as outlined in the videos - due 02-25-2015
Week 05 02-25-2015	Iteration HTML and CSS	Work on (and complete) Project One (due 03-04-2015)
Week 06 03-04-2015	Reality Distortion & Progressive Disclosure Project Two introduced Exporting tables	Project One (due 03-04-2015) - schedule a time with Kirk to demo your Project One (either in a Google Hangout or in person) Begin Project Two - Initial Concept/The Big Idea and wireframes
Week 07 03-11-2015	Mockups and Mobile CMS	Work on Project Two - Mockups and initial development
Week 08 03-18-2015	Documentation APIs	Work on Project Two - HTML, CSS and begin using an API - Try the "Hello World" API Exercise
Week 09 03-25-2015	Spring Break	Spring Break - no assignment
Week 10 04-01-2015	Project Two work week with 1:1 progress check	Project Two - Build static HTML + CSS then connect static HTML to APIs
Week 11 04-08-2015	Project Two work week with 1:1 progress check	Project Two (due 04-15-2015) - Finishing touches
Week 12 04-15-2015	Wireframes	Project Two (due 04-15-2015) - schedule a time with Kirk to demo your Project Two (either in a Google Hangout or in person)
Week 13 04-22-2015	Project Three introduced Design Thinking & Mobile DeviceOrientation API	Work on Project Three
Week 14 04-29-2015	Project Three work week with 1:1 progress check	Work on Project Three
Week 15 05-06-2015	Project Three (due 05-06-2015)	Project Three (due 05-06-2015)

Expectations & Rules

Online Expectations

Expect to spend three hours in addition to normal time working on homework per week for this class. This time will be a mixture of lectures recorded, posted, podcasts, videos, readings and the like. You are expected to view/read/listen to all of the assets posted. You will use this information for your projects.

Each "week" will begin on a Wednesday and run until a Tuesday. Projects/assignments are due on Tuesdays by 11:59pm.

Social Media

Regarding "friending" current students on Facebook, I’ve decided that it’s probably best to wait until graduation. At that time I would love to keep in touch with you through email and social media.

Computer Failures

No allowance is made for computer or network failures. Be sure to back up your work frequently, and do not wait until the last minute to complete the assignment. To back up a file, save it first to one computer drive such as your M drive (also called Universal Disk Space or UDS) or the hard drive of your home computer, and then save it again to a portable drive.

If you have a Mac, use Time Machine!

For offsite-backup, I highly recommend Dropbox (http://www.dropbox.com/)

Need a backup gameplan? Here’s a great start: http://tinyurl.com/ylljo8l

Academic Honesty

Assignments must be entirely your own work, unless they are specifically group projects. Evidence of plagarism can lead to dismissal from the class with a grade of F. For full information regarding academic integrity, go to: www.muohio.edu/integrity.

Use of Lab/Studio Equipment

All students should treat computer and studio equipment with respect and care, while following safety procedures set out by manufacturers and faculty. Unauthorized use of the lab is a violation of the student code of conduct.This includes equipment in any of the graphic design rooms (studio, computer lab or hand media room). Please review the technology chapter of the student handbook. Depending on the infraction, a student could be charged at the university level for a code of conduct or academic violation.

Classroom Climate

This course is designed to encourage active participation on the part of students. It is critical that classroom/online/email discussions (and the like) and critiques are conducted in an atmosphere of tolerance and respect for the ideas of others. We may use a variety of ways to engage in learning so please be open to trying (and even suggesting) new ways to work together. It is important to be mindful of differences – that is, we all come from a variety of experiences. All classroom discussion should be respectful of those differences so that our learning can be enhanced by all our contributions.

As your instructor and as an individual I believe in a supportive climate that is conducive to learning and I will make every effort to create an environment which encourages interaction and mutual respect for differing ideas.

Students who have any disability, either permanent or temporary, which might affect their ability to perform in this class, are encouraged to inform me immediately.

Communication

Contacting Me

I check email (hopkinks@MiamiOH.edu) constantly throughout the day. To ensure that I respond quickly, please include "IMS 422-522" in the beginning of your subject line in emails to me.

Because communication is key in online courses, I will schedule regular one on one review sessions. Students will choose a time slot that works for them and we will discuss via Google Hangouts (or in person if that works better for us).

We can try Google Hangouts if you encounter problems and would like help in real time.

Contacting You

Announcements for the class will be communicated through email. It is your responsibility to regularly check your email throughout the week.

Office Hours

My office is in Hoyt Hall (on Western) in 312p2

My office hours (or by appointment): Wednesdays: 1:30pm-3:30pm

Note, it’s in your best interest to schedule time with me during my office hours if you need help, they tend to fill up.