MII7134 Interface and
Interaction Design
Hans Põldoja
Tallinn University

Focus of the course
• Focus on web-based user interfaces
• Topics: scenarios, personas, user stories,
information architecture diagrams, prototypes,
XHTML, CSS, accessibility, evaluation

Structure of the course
• 5 day workshop
• Online blogging seminar and independent work
• Presentation of course projects
• Graded assessment

Learning environment
• Course blog: http://www.hanspoldoja.net/mii7134/
• Del.icio.us: http://del.icio.us
• Slideshare: http://www.slideshare.net
• Flickr: http://www.flickr.com
• Tag: mii7134

Understanding design

“Design is not just what it looks like and
feels like. Design is how it works.” (Steve
Jobs)

“Form follows function” (Louis Sullivan)

Design as a process

The Pervasive Usability Process
Requirements Conceptual Mockups and
Production Launch
analysis design prototypes
Evaluation

Requirements analysis
• Requirements specification
• User Interviews
• User Surveys
• Competitive Analysis

Requirements analysis
• Requirements specification > Personas, Scenarios
• User interviews > Participatory design sessions
• User surveys
• Competitive analysis

Personas

Personas
• Photo
• Background info (age, gender, computer, tech skills,
disabilities, ...)
• Goals with the web site (experience goals, end
goals)
• Information seeking styles
• Usability needs

Scenarios

Participatory design
sessions

Participatory design sessions
• Write guidelines for arranging the design session
• Find 2...4 users for the design session
• Present scenarios and ask feedback
• Take notes, record the session and make a
summary

Competitive analysis

Competitive analysis
• Title and URL
• Screenshot
• Pros
• Cons
• Usability Issues

Project ideas

Your idea comes
here....

References
• Brinck, T., Gergle, D., Wood, S.D. (2002). Usability for the web: designing web
sites that work. Morgan Kaufmann Publishers.

Photos
• http://www.flickr.com/photos/delgoff/435077003/
• http://www.flickr.com/photos/kk/57090119/
• http://www.flickr.com/photos/hanspoldoja/1762379848/
• http://www.flickr.com/photos/cybertaur1/463401444/
• http://www.flickr.com/photos/enzomolinari/1306012480/
• http://www.flickr.com/photos/robandstephanielevy/234434882/