Uid: Lesson 05 - Information Architecture & Content Organization

  • November 2019
  • PDF

This document was uploaded by user and they confirmed that they have the permission to share it. If you are author or own the copyright of this book, please report to us by using this DMCA report form. Report DMCA


Overview

Download & View Uid: Lesson 05 - Information Architecture & Content Organization as PDF for free.

More details

  • Words: 2,106
  • Pages: 56
Lecturer Itamar Medeiros (Brazil) BA in Industrial Design; PgDip in Information Design;

INFORMATION ARCHITECTURE & CONTENT ORGANIZATION

welcome to USER INTERACTION DESIGN

Expertise Multimedia/Web Design, Photography, Information Design and Human-Computer Interaction.

USER INTERACTION DESIGN

1 /56

No food, no drinks, no games in class; Always keep your mobile in silent mode; No electronic devices during class-time; Bring only class related material to class;

INFORMATION ARCHITECTURE & CONTENT ORGANIZATION

Answer to commands promptly;

2 /56

USER INTERACTION DESIGN

CLASSROOM RULES itamar medeiros

INFORMATION ARCHITECTURE & CONTENT ORGANIZATION

Students will understand principles of creating sensible, comprehensible, memorable, and convenient organization of the content and the tasks to be performed on their interactive product.

3 /56

USER INTERACTION DESIGN

LESSON 05: INFORMATION ARCHITECTURE & CONTENT ORGANIZATION learning outcome

Introduction to Content Organization techniques;

INFORMATION ARCHITECTURE & CONTENT ORGANIZATION

Introduction to Information Architecture principles;

4 /56

USER INTERACTION DESIGN

LESSON 05: INFORMATION ARCHITECTURE & CONTENT ORGANIZATION content

Organizing functionality and content into a structure that people are able to navigate intuitively doesn’t happen by chance.

INFORMATION ARCHITECTURE & CONTENT ORGANIZATION

INFORMATION ARCHITECTURE & CONTENT ORGANIZATION

Organizations must recognize the importance of information architecture* or else they run the risk of creating great content and functionality that no one can ever find.

USER INTERACTION DESIGN

5 /56

一个交互系统或者产品的设计和结 构。

INFORMATION ARCHITECTURE & CONTENT ORGANIZATION

The design and structure of an interactive system/product.

6 /56

USER INTERACTION DESIGN

INFORMATION ARCHITECTURE & CONTENT ORGANIZATION information architecture | 信息构架

好的信息构架

保数据结构化,致使

用户可以轻易地找到信息。

INFORMATION ARCHITECTURE & CONTENT ORGANIZATION

Good information architecture ensures that data is structured so that information can be easily found by the user.

7 /56

USER INTERACTION DESIGN

INFORMATION ARCHITECTURE & CONTENT ORGANIZATION information architecture | 信息构架

INFORMATION ARCHITECTURE & CONTENT ORGANIZATION

The incredible amount of functionality and information has become the new problem: the challenge facing organizations is how to guide people through the vast amount of information on offer, so they can successfully find the information they want and thus find value in the system?

8 /56

USER INTERACTION DESIGN

INFORMATION ARCHITECTURE & CONTENT ORGANIZATION

The way information is grouped; Its navigation system; The terminology* used within the system.

INFORMATION ARCHITECTURE & CONTENT ORGANIZATION

Information architecture helps us describe the structure of a system:

9 /56

USER INTERACTION DESIGN

INFORMATION ARCHITECTURE what is it?

一门学科或者系统的技术或者专业单 词和表达。

INFORMATION ARCHITECTURE & CONTENT ORGANIZATION

The technical or specialized words and expressions of a subject or system.

10/56

USER INTERACTION DESIGN

INFORMATION ARCHITECTURE terminology | 术语

INFORMATION ARCHITECTURE & CONTENT ORGANIZATION

Information architecture take into account the information itself -- content --, the people using the information -- users --, and the business issues -- context* -- in which the information is being presented.

11/56

USER INTERACTION DESIGN

INFORMATION ARCHITECTURE what is it?

围绕某一情况或者事件的一系列情况 或者环境。

INFORMATION ARCHITECTURE & CONTENT ORGANIZATION

The set of facts or circumstances that surround a situation or event.

12/56

USER INTERACTION DESIGN

INFORMATION ARCHITECTURE context | 背景

在设计信息构架时,指让用户知晓他 们在

里,去过

去何处的信息。

里和何时、他们

INFORMATION ARCHITECTURE & CONTENT ORGANIZATION

While designing the information architecture, the context is the information that lets the user know where they are, where have they just been, when where can they go to.

13/56

USER INTERACTION DESIGN

INFORMATION ARCHITECTURE context | 背景

INFORMATION ARCHITECTURE & CONTENT ORGANIZATION

Information architecture organize content and design navigation systems* to help people find and manage information, based in the context of use of the system/product.

15/56

USER INTERACTION DESIGN

INFORMATION ARCHITECTURE helping people find information

The navigation system is the physical manifestation of an organizational structure. It determines how information is actually going to be interconnected.

INFORMATION ARCHITECTURE & CONTENT ORGANIZATION

INFORMATION ARCHITECTURE navigation systems | 导航系统

一个组织结构的物理性表述。它决定 了信息究竟是如何相互链接的。

USER INTERACTION DESIGN

16/56

INFORMATION ARCHITECTURE & CONTENT ORGANIZATION

A well designed navigation system is critical to a good interactive product. Whether or not people can find their way around is what will most commonly make or break a Web site, for example.

17/56

USER INTERACTION DESIGN

NAVIGATION SYSTEMS

INFORMATION ARCHITECTURE & CONTENT ORGANIZATION

The most common navigation element is a menu* of some kind, but navigation elements can also be include inline links*, tables of contents*, search engines*, site maps*, and most any way of organizing connections between documents that can be though of.

18/56

USER INTERACTION DESIGN

NAVIGATION SYSTEMS most common elements

允许用户从预先设置列单中选择的用 户界面的一个组成部分,其中每一 项执行一个期望的命令,例如选择 一个命令,或者在一个系统或者产 品内导航等。

INFORMATION ARCHITECTURE & CONTENT ORGANIZATION

A component of a user interface that allows the user to make choices from a preset list, each of which performs a desired action such as choosing a command or to navigate within a system/product.

19/56

USER INTERACTION DESIGN

NAVIGATION SYSTEMS menu | 菜单

USER INTERACTION DESIGN

20/56

INFORMATION ARCHITECTURE & CONTENT ORGANIZATION

A graphic, line of text, or both on a webpage that connects to another page on the same website or to one in another website located anywhere in the world.

INFORMATION ARCHITECTURE & CONTENT ORGANIZATION

NAVIGATION SYSTEMS links | 链接

在网页上一个图片、文字行或

者与

同一网站上的另一页网页链接,或 与位于其他网站上的网页链接。

USER INTERACTION DESIGN

21/56

一个有条理性的主题列单,提供书本 或文件内容的快速检索及向读者或 者用户引导文件中的任何主题或者 部分。

INFORMATION ARCHITECTURE & CONTENT ORGANIZATION

An organized list of titles for quick information on the summary of a book or document and quickly directing the reader/user to any topic or part of the document.

23/56

USER INTERACTION DESIGN

NAVIGATION SYSTEMS table of contents | 目录

Web services which help search through Internet addresses for user-defined terms or topics in which users are interested.

INFORMATION ARCHITECTURE & CONTENT ORGANIZATION

NAVIGATION SYSTEMS search engines | 搜索引擎

通过互联网地址针对用户感

趣的用

户定义的术语或者主题,提供的网 络搜索服务。

USER INTERACTION DESIGN

26/56

Overview of the navigational structure of a website, acting like a Table of Contents, and used to orient users and show them the scope of the site.

INFORMATION ARCHITECTURE & CONTENT ORGANIZATION

NAVIGATION SYSTEMS site map | 网站地图

网站的导航结构的概况,好比一个目 录,用来导向用户,展示网站范 围。

USER INTERACTION DESIGN

29/56

• Structure • Flexibility • Context

INFORMATION ARCHITECTURE & CONTENT ORGANIZATION

The purpose of a good navigation system goes beyond just getting people from one place to another. They should provide three elements to assist in moving around within a interactive system:

30/56

USER INTERACTION DESIGN

NAVIGATION SYSTEMS purpose

Interactive products with a good navigation system allows the user to understand its structure in a way that facilitates navigation.

INFORMATION ARCHITECTURE & CONTENT ORGANIZATION

NAVIGATION SYSTEMS structure

This is why the navigation system should grow out of the scheme and structure of the product. If it grows out of the underlying structure then it will fit that structure and reflect it in what is hopefully a comprehensible way.

USER INTERACTION DESIGN

31/56

USER INTERACTION DESIGN

32/56

INFORMATION ARCHITECTURE & CONTENT ORGANIZATION

INFORMATION ARCHITECTURE & CONTENT ORGANIZATION

As well as having structure, navigation systems should also be flexible. They should allow different people to use them in different ways to get to the same information.

33/56

USER INTERACTION DESIGN

NAVIGATION SYSTEMS flexibility

INFORMATION ARCHITECTURE & CONTENT ORGANIZATION

The information structure the site is built upon should be rigidly structured. The navigation system is where you put in the exceptions and the additional tools to facilitate navigating around. A well designed navigation system can actually reinforce the site structure by effectively working around it.

34/56

USER INTERACTION DESIGN

NAVIGATION SYSTEMS flexibility

For instance, page and section titles tell the user where they are, links such as previous or next.

INFORMATION ARCHITECTURE & CONTENT ORGANIZATION

Context is information that lets the user know where they are, where have they just been, when where can they go to. Any element that provides context can be seen as part of the navigation system.

35/56

USER INTERACTION DESIGN

NAVIGATION SYSTEMS context

INFORMATION ARCHITECTURE & CONTENT ORGANIZATION

Also, organizing links into menus of like topics allows people to see relationships between links and the information behind them, such as breadcrumb navigation* menus.

36/56

USER INTERACTION DESIGN

NAVIGATION SYSTEMS context

于网站内部信息定位位置和方式的 有 描述;它展示了各 主要类型 的信息是如何通过一个连续顺序而 链接起来的。

INFORMATION ARCHITECTURE & CONTENT ORGANIZATION

A textual representation of where and how information is located within a system/ product. It displays how major categories of information are linked along a sequential order.

37/56

USER INTERACTION DESIGN

NAVIGATION SYSTEMS breadcrumb navigation | 面包屑导航

INFORMATION ARCHITECTURE & CONTENT ORGANIZATION

A very important step of thinking through the structure of your interactive product are the labels* used in the navigation system.

40/56

USER INTERACTION DESIGN

INFORMATION ARCHITECTURE

In information architecture, labels are the names used to identify the links, the names of the pages and section headings, or the names of the features of a system.

INFORMATION ARCHITECTURE & CONTENT ORGANIZATION

INFORMATION ARCHITECTURE labels | 标签

在信息构架中,指用来识

链接的名

称、页面的名字和章节的标题,或 者某一系统各特征的名称。

USER INTERACTION DESIGN

41/56

它们可帮助用户定位,使其保持在正 常状态,通告他们所在章节的内 容。

INFORMATION ARCHITECTURE & CONTENT ORGANIZATION

They help to orient the user and keep them on track, as well as to inform them about the contents of the section they are in.

42/56

USER INTERACTION DESIGN

INFORMATION ARCHITECTURE labels | 标签

If your Website is designed for the end user, do not include engineering or marketing jargon in the copy -- this will only serve to alienate your users (at best). Labeling must also be clear and consistent throughout the site.

INFORMATION ARCHITECTURE & CONTENT ORGANIZATION

The most important rule of building a good labeling system is to think like a user.

43/56

USER INTERACTION DESIGN

INFORMATION ARCHITECTURE building a good labeling system

Comparable & Competitive Sites Find the labeling pattern that is already in place in the industry/competition; Controlled vocabularies and thesauri Seek out focused vocabularies that help specific audience (e.g.. medical, engineering)

INFORMATION ARCHITECTURE & CONTENT ORGANIZATION

Your Site Create a table of the existing labels and what they represent;

44/56

USER INTERACTION DESIGN

BUILDING A GOOD LABELING SYSTEM sources of labeling

Content Authors Make their own suggestions; User Advocates and Subject Matter Experts Work with librarians and the like who can speak on behalf of the user - those who know what the users want;

INFORMATION ARCHITECTURE & CONTENT ORGANIZATION

Content Analysis Focus on things like titles, summaries, and abstracts;

45/56

USER INTERACTION DESIGN

BUILDING A GOOD LABELING SYSTEM sources of labeling

INFORMATION ARCHITECTURE & CONTENT ORGANIZATION

Users Learn how the site's users will use the information - card sorting* exercises where users are asked to cluster labels of existing content into their own categories and then label the categories or where they are given existing categories and asked to sort content into those categories

46/56

USER INTERACTION DESIGN

BUILDING A GOOD LABELING SYSTEM sources of labeling

A technique for exploring how people group items, so that you can develop structures that maximize the probability of users being able to find items.

INFORMATION ARCHITECTURE & CONTENT ORGANIZATION

BUILDING A GOOD LABELING SYSTEM card sorting | 卡片排序

拓展人们如何将项目成组的一 法,你可以设计各



结构,将用

户找到项目的概率最大化。

USER INTERACTION DESIGN

47/56

Enables you to understand how real people are likely to group items; Identifies items that are likely to be difficult to categorize and find; Identifies terminology that is likely to be misunderstood.

INFORMATION ARCHITECTURE & CONTENT ORGANIZATION

Is easy and cheap to conduct;

48/56

USER INTERACTION DESIGN

CARD SORTING benefits

2. Participants are asked to group items in a way that makes sense to them.

INFORMATION ARCHITECTURE & CONTENT ORGANIZATION

1. Names of items to be categorized are printed on individual cards: Cards should be large enough to accommodate the names in a font that participants can read easily when spread out on a desk or table–at least 14 point.

49/56

USER INTERACTION DESIGN

CARD SORTING how is it conducted?

USER INTERACTION DESIGN

50/56

INFORMATION ARCHITECTURE & CONTENT ORGANIZATION

2. Allow another team to group the features in a way to make sense to them; 3. Analyze the grouping and create a navigation system based on that organization;

INFORMATION ARCHITECTURE & CONTENT ORGANIZATION

1. Using post-it note cards, write down all the features (特征) of your interactive product (one feature per card);

51/56

USER INTERACTION DESIGN

ACTIVITY #06 card sorting

1. In your groups, analyze the grouping of information done during the card-sorting session and devise a complete navigation system.

INFORMATION ARCHITECTURE & CONTENT ORGANIZATION

HOMEWORK [ GROUPS ] navigation system

2. The navigation system must contemplate all issues of information architecture: -Flexibility, Structure & Context; -Good & Consistent Labeling System;

USER INTERACTION DESIGN

52/56

USER INTERACTION DESIGN

53/56

INFORMATION ARCHITECTURE & CONTENT ORGANIZATION

1. Choose 5 (five) words marked with asterisks (*) you’ve seen in this class and create 5 (five) posters -- one for each word -- on separate pages of your sketchbook;

INFORMATION ARCHITECTURE & CONTENT ORGANIZATION

HOMEWORK [ INDIVIDUAL ] sketchbook

2. Each poster must include: -The word chosen, with its English definition; -3 (three) pictures; -2 (two) websites; -Your comments/impressions of the definition.

USER INTERACTION DESIGN

55/56

UFSNJOPMPEZ

NFOVT

UBCMFPGDPOUFOUT

DPOUFYU

OBWJHBUJPOTZTUFNT TFBSDIFOHJOFT

DBSETPSUJOH

CSFBEDSVNCOBWJHBUJPO

MBCFMT

TJUFNBQT

INFORMATION ARCHITECTURE & CONTENT ORGANIZATION

MJOLT

56/56

USER INTERACTION DESIGN

HOMEWORK [ INDIVIDUAL ] tags

Related Documents