DESIGN IIIA
Design for the Digital Realm
Download syllabus in PDF format
Moby
First week readings:
Made to Measure
Default Systems in Graphic Design

Resources for information architecture
on Information Architecture

Tools for presenting information architecture:
A visual vocabulary for describing information architecture and interaction design
Graffle, diagramming tool
Lucid Chart, diagramming tool

Examples for wireframing
I Love Wireframes

Tools for wireframing
UXpin
wireframe.cc
HotGloo
QuirkTools
Moqups
Some examples to review together in class:
http://www.usatoday.com
http://www.gifmemoreparty.com
http://www.saltonline.org/tr/anasayfa
http://christianlouboutin.com
http://www.blacknegative.com
http://gubbandmackie.com
https://lowdi.com
http://www.typeconnection.com
http://www.squarespace.com
http://www.projectprometheus.com
http://www.weareacademy.com
http://www.steffen-s.com
http://dansuncoinsidense.fr/projet/verslebas/
http://www.wkamst.com
http://diehlgroup.com/
http://www.studiovonbirken.com
http://www.sequence.com/
http://www.flandriatype.com

Showcases for you to review:
http://www.awwwards.com
http://siteinspire.com
http://www.thebestdesigns.com
http://www.minimalsites.com

Experiments on browsers and capabilities:
http://mrdoob.com
http://www.nytimes.com/2012/04/08/magazine/angry-birds-farmville-and-other-hyperaddictive-stupid-games.html?_r=1
Please check this article out on importance of UX over UI:
http://insideintercom.io/the-dribbblisation-of-design/
Here are some handy tools to set the canvas and grid before designing the front end in photoshop:
960.gs
Cedvel
Some web font services

Edge Web Fonts gives you access to a vast web font library made possible by contributions from Adobe, Google, and designers around the world. The fonts are served by Typekit, so you can be sure of high performance and stability. Plus, it's free.
Adobe Edge Web Fonts
Google Fonts
Type Kit
Web Type
Font Spring

Also keep in mind that you can embed all fonts by embedding it by using @font-face rule with CSS3. Firefox, Chrome, Safari, and Opera support fonts of type TTF (True Type Fonts) and OTF (OpenType Fonts). You can read more on this: CSS3 Fonts

Miscellaneous tips and tutorials for coding HTML/CSS3

The toolbox is a collection of the best time-saving apps, tools, and widgets from around the web.
Toolbox

General HTML/CSS reference
W3C Schools

A tutorial on dropdown navigation menu using CSS
Bulletproof CSS3 Dropdown Navigation Menu

jQuery is a fast and concise JavaScript Library that simplifies HTML document traversing, event handling, animating, and Ajax interactions for rapid web development. jQuery is designed to change the way that you write JavaScript.
jQuery

Lightbox is a simple, unobtrusive script used to overlay images on top of the current page. It’s a snap to setup and works on all modern browsers.
Lightbox 2

CSS Hat turns Photoshop layer styles to CSS3. Instantly.
CSS Hat

Full Width html Video Background Tutorial
Fullscreen Video Background