Resources
Interactive Web Design I · DM2280B spring 2013 · Corcoran College of Art + Design
Instructor: David Ramos
alberto_ramos@corcoran.edu
Technique
Prototyping
Design documentation
- Wireframes (mostly, a collection of tools)
- Interactive Sketching Notation
- Wireframes > sketch resources
- EightShapes Unify
- Visual vocabulary for IA and IxD
- UX sketching
- Close Photoshop and Grab a Pencil: The Lost Art of Thumbnail Sketches
- PDF templates
Official UI/UX guidance
- Apple iOS Human Interface Guidelines (the gold standard in UI guidelines)
- Types of views natively provided by iOS
- Microsoft Windows mobile (a more typographic, assertively digital approach)
- Summary of touch target sizes
Mobile
General HTML/CSS
- Don't Fear the Internet – video lectures by Jessica Hische and Russ Maschmeyer
- WebPlatform.org docs – new, well-written, sleek, but still in alpha
- SitePoint CSS Reference and HTML Reference – great general references
- Mozilla Developer Network for HTML and CSS
- HTML5 Draft Specification
- CSS3 Draft Specification – newest CSS version
- HTML entities (special characters)
- Can I Use – browser compatibility tables
- QuirksMode – browser compatibility tables
Responsive design and HTML/CSS media queries
- Ethan Marcotte: Responsive Web Design (the seminal article)
- Sitepoint on media queries
- Smashing Magazine on media queries
- Responsive navigation patterns
- Responsive navigation
- This is responsive (“Patterns, resources and news for creating responsive web experiences”)
- Gridpak (graphical tool for building responsive grids)
Digital Publishing Suite
- Adobe DPS documentation hub
- Adobe DPS articles
- Concise explanation of fees/versions
- DPS interactivity examples (iPad app, free)
- What file format for overlays?
- Which InDesign interactive features work in DPS?
- DPS manual (PDF)
- Capture spurious taps with an overlay
Examples
Apps
Free or low-cost.
- Fish (iOS)
- McSweeney’s app (iOS)
- Yahoo weather iOS, Android
- MeatText (iOS, Android)
DPS publications
There are free preview issues available for all of these.
- Wired
- Martha Stewart Living
- National Geographic
Publication and interpretive work
- Pae White: After the City, This
- Martin Venezky/Appetite Engineers
- Francesco Franchi
- Emigre Magazine 38, 41, 44
- Rudy VanderLans/Emigre, Bagdad, Californie
Documentation and interface
- Design documentation for voting machines (PDF) through AIGA Design for Democracy (more)
- EightShapes makes and teaches about their Unify documentation system
UI design patterns/precedents
- Little Big Details (all kinds)
- iOS UI Patterns (apps)
- Mobile UI Patterns
- Andorid Patterns (apps)
- Media Queries (web)
Tools, images, and media sources
- Noun Project (icons)
- Iconic (icons)
- Fontello (font icon creator)
- Maki (map icons from MapBox)