Archive | Author: Dr. V RSS feed for this section

Final exam study guide

1 May

Please find below the learning objectives for the topics covered in the final exam.

UCD process – major steps

Heuristic evaluation

  1. Apply Nielsen’s 10 heuristics to critique interfaces.
  2. Conduct heuristic evaluation.

Wireframing

  1. Differentiate between: sketch, wireframe, mockup, and prototype
  2. Explain the utility of each one
  3. Create sketches by hand and wireframes in Balsamiq

Navigation, Information Architecture

  1. Explain the 3 questions that navigation must answer at all times
  2. Apply the 3 questions to critique existing interfaces
  3. Define “Information Architecture” (IA)
  4. Recognize and create IAs using different organization logics (task-based, audience-based, topica, life-event, etc.)
  5. Solve IA problems using card sorting

Homepage design

  1. Explain the purposes a good homepage needs to fulfill
  2. Analyze homepages and evaluate how they fulfill these purposes

Writing for the Web, Excise

  1. Apply principles for writing for the web
  2. Define excise
  3. Identify examples of excise and propose solutions for removing excise

Typography, branding, color

  1. Define “style tile” and “mood board” and explain the difference between the two
  2. Integrate color and typography insights into creating a style tile

Responsive Web Design

  1. Explain the basics of what CSS is and what can be done with CSS.
  2. Define responsive design
  3. Explain the main things to take into consideration when designing responsive UX: layout (number of columns) content hierarchy, navigation; mobile first
  4. Sketch solutions for responsive design of a site

Mobile UX

  1. Connect already learned material to Mobile UX
  2. Define important concepts related to Mobile UX, such as: Fitts’ Law, Chrome, Nav and Status bar
  3. Summarize Mobile UX guidelines
  4. Apply Mobile UX guidelines

Social UX

  1. Go through the UCD process in order to plan social UX

Cross-channel UX

  1. Define cross channel UX and distinguish it from multi-channel UX
  2. Define pervasive information architecture
  3. Explain principles (heuristics) for pervasive information architecture
  4. Apply the principles of pervasive information architecture to outline a cross channel user experience

Evaluation

  1. List various methods for evaluating UX solutions
  2. Explain the difference between review/inspection methods and testing methods
  3. Define cognitive walkthrough and explain how it is conducted
  4. Explain the difference between cognitive walkthrough and heuristic evaluation
  5. Conduct cognitive walkthrough

Usability testing – planning & conducting

  1. Define objectives for usability evaluation
  2. Plan a usability evaluation session (steps, procedures, measures to take)

Usability testing – reporting results

  1. Write the various sections of a usability report
  2. Create appropriate graphs and charts for representing usability reports

CGT 256 – Course Review & Final Advice

1 May

Thank you all for a good semester!

Emma and I will miss you.

Information Architecture & Navigation

11 Mar

Learning Objectives:

At the end of class, students will be able to:

  1. Explain the 3 questions that navigation must answer at all times

  2. Apply the 3 questions to critique existing interfaces

  3. Define “Information Architecture” (IA)

  4. Recognize and create IAs using different organization logics (task-based, audience-based, topica, life-event, etc.)

  5. Solve IA problems using card sorting

The mini lecture used the slides below. You then engaged in one lab exercise that identified how some major sites answer the 3 main navigation questions, and in a lab activity that used card sorting to propose a better IA for this course.

Sketches, Wireframes, Mockups, Prototypes

11 Mar

The objectives were that at the end of the class, students would be able to:

  1. Differentiate between: sketch, wireframe, mockup, and prototype

  2. Explain the utility of each one

  3. Create sketches by hand and wireframes in Balsamiq

We discussed the differences between terms using the white board, but here are some slides that capture the same ideas:

Class summary: Attention, Information scent, memory

25 Feb

The learning objectives for this class were:

  1. Explain how attention works and its design implications.

  2. Explain the concept of information scent and its design implications.

  3. Explain the principle “Recognition rather than Recall” and its design implications.

We (I?) talked through the slides below and you synthesized Design Implications in your reflection.

Class summary: Visual hierarchy & structure; Grids

25 Feb

The learning objectives for this class were:

  1. Identify the principles used to create visual hierarchy in existing designs

  2. Use visual salience to create visual hierarchy

  3. Identify grid systems on existing designs

  4. Use the 960 grid system to create different Web layouts

You first look at some examples and identified how they create visual hierarchy:

Then, we talked a bit about techniques for creating visual hierarchy using these slides:

You then did an exercise where you redesigned the way flight ticket information would be presented in an iPhone travel app.

Then, we moved on to grid layouts. We started by counting columns in the following examples:

We then discussed the difference between columns and grid units (they might be much smaller than columns). I showed some slides from this deck:

You then sketched 3-4 different website layouts on thumbnail print-outs of browser windows with the 960 grid system.

Class summary: Gestalt principles of visual perception

18 Feb

The objectives of this class were:

  1. Identify Gestalt principles in existing designs.
    You reviewed the slides below and identified the principles in each example.

  2. Apply Gestalt principles to create a new design.
    You created a layout for a course home page using only text, which forced you to employ the principles of similarity and proximity.

The resources we used in class are embedded here:

 

Class summary: Conceptual Design

18 Feb

On day 10 we moved to the second step of the UCD process, conceptual design.

We continued the lab exercise from the previous class and used the personas to derive design requirements for an app that would help motivate students to learn. You engaged in several creativity exercises in order to generate ideas:

  • brainstorming using design probes (the cards I gave you)
  • quick thumbnail sketches
  • sketching a general concept

The purpose was to experience what it is like to be creative on demand, and to see how you can use some activities to stimulate idea generation. Remember that at this stage, the quantity of ideas is more important than quality. Here is the sheet with instructions you got in class, in case you don’t remember.

Class summary: Affinity diagramming

11 Feb

After clarifying some questions about how many personas we should create in relation to user groups, we moved on to affinity diagramming.

First, you extracted from the readings a list of DOs and DON’Ts to keep in mind when doing affinity diagramming. Here are the most important ones:

About making note cards:

DO:

  • put only one concept on each note

  • make each note complete and self standing

  • use color

DON’T:

  • feel restricted

  • limit number of notes

  • be verbose

About working with the team:

DO:

  • ake advantage of strengths

  • be open to criticism

  • be organized

  • generate discussion

  • be flexible

DON’T:

  • work alone

  • get stuck on ownership and I’m right

  • get distracted

About grouping notes into clusters:

DO:

  • let the data define the groups

  • divide large groups

  • label your clusters

DON’T:

  • give out too many notes out at once

  • be redundant

  • don’t treat labels as fact

After making sense of the data and putting it into clusters, the next step is to see the bigger patterns that result in personas. This is difficult, but I think most groups did a nice job, even with the limited amount of time. Please make sure to read other groups’ personas that were posted on the CN.

Class notes: Personas, Scenarios, Use cases

10 Feb

In this class, we:

  • discussed the differences between the concepts of persona, scenario, and use case
  • shared the data you had previously collected during the GUI history user research exercise
  • used that data for you to create personas and scenarios