UX for the Web电子书

Title Page

Copyright

UX for the Web

Credits

About the Authors

About the Authors

About the Reviewer

www.PacktPub.com

Why subscribe?

Customer Feedback

Preface

What this book covers

What you need for this book

Who this book is for

Conventions

Reader feedback

Customer support

Downloading the color images of this book

Errata

Piracy

Questions

The Fundamentals of UX

UX from the early 20th century

360° of UX

Design thinking and human-centered design (HCD)

User-centered design (UCD)

Software development methodologies

Lean UX versus Agile UX

UX and design disciplines

The unique attributes of UX and UI

Summary

Stand Out from Your Competitors

Branding in modern times

Case study - brand identity versus brand image - Jeep

Branding - visuals

Branding - personality

Branding - relationship

How UX differentiates a brand from competitors

Conducting a competitor UX analysis

Case study - competitor UX analysis of fast food brands

B2B versus B2C

Case study - B2C and UX

Case study - B2B and UX

Summary

Creating an Emotional Connection with the User

Creating a digital personality the user can relate to

Speaking a clear language

Keeping the tone relevant

Being as human as possible

Giving visual rewards

Incorporating micro-interactions in the UI

Making the UI discoverable and giving incentives

Giving guidance through anticipation design

Entertaining by providing useful information

Establishing trust and credibility

Summary

Best Practices for Usability Within the User Interface (UI)

Introduction to UI

Color psychology

The color wheel

Warm and cool colors

Color symbolism

Case study 1 - blue street lighting in Glasgow, Scotland

Case study 2 - blue lighting in railway stations in Japan

Color and web accessibility

Best design practices

Google's Material Design guidelines

iOS Human Interface Guidelines

Case Study - UI design for websites

Brief for the MTH website

UI design

Language and semiotics

Best practices for effective iconography

Case study: languages versus flags

Summary

Set a Solid Foundation - Research and Analyze

Defining and categorizing research

Understanding qualitative versus quantitative research

Deciding when to conduct research

Describing UX research methods

Setting up a research plan

Deciding on a problem statement

Exploring prior knowledge and literature

Planning research methods and logistics

Turning your problem statement into measurable metrics

Choosing a research method

Planning research logistics and creating checklists

Conducting a pilot test

Conducting the study

Analyzing data

Presenting results

Doing expert analyses

Heuristic analysis

Content audit

Using qualitative techniques

Interviews

Tips for interviewing

Observation

Tips for observation

Content analysis

Ethnography example - a financial services broker portal

Using quantitative techniques

Using statistics

Deciding which statistical test to use

Summary

Create a UX Strategy - Users and Content

Creating personas to guide your UX strategy

Characteristics of a useful persona

Building a solid information architecture

Card sorting

How to conduct a card sorting exercise

Case study - Leadtrekker footer evaluation

Constructing a sitemap

Steps to creating a solid sitemap

Creating user journeys

Key components of a user journey

Four steps in creating an effective user journey

Case study - Book Galaxy online book retailer

Creating task flows

Key components of a well-constructed task flow

Example of a task flow

Summary

Bring Your UX Strategy to Life with Wireframes and Prototypes

Setting up moodboards and storyboards

Defining moodboards

Creating a moodboard

Defining storyboards

Creating a storyboard

Case study - creating a storyboard

Deciding what, when, and how to prototype

Choosing what and when to prototype

Choosing how to prototype

Creating wireframes and interactive prototypes

Prototyping tools

Creating a wireframe

Designing the interface

Components of a wireframe

Components of a wireframing tool

An example website - Etsy

A note about responsiveness

A typical wireframing process

Best practices for wireframing

Creating an interactive prototype

Best practices for creating interactive prototypes

Version control

Setting up a pattern library

Designing for responsiveness and accessibility

Summary

Building Your Product - Devices, Browsers, and Assistive Technologies

Understanding the importance of responsive, accessible, and universal design

Designing for varied technologies

Designing for input and output

Designing responsively

Designing for different browsers and operating systems

Designing for accessibility and assistive technologies

Using universal design principles to guide design

Testing your designs on multiple technologies

Summary

Optimize your UX Strategy with Iterative User Testing

Maximizing the value of user testing

Planning, conducting, and analyzing usability tests

Planning usability tests

Designing the test - formulating goals and structure

Designing tasks and metrics

Planning questions and observation

Preparing the script

Securing a venue and inviting clients and team members

Recruiting participants

Setting up the hardware, software, and test materials

Conducting usability tests

Best practices for facilitating usability sessions

Analyzing and reporting on usability tests

Reporting the results of a usability test

Variations on usability testing

Applying analytics effectively-constructing a useful A/B test

Using analytics with A/B testing

Summary

The Basics and Benefits of Web Accessibility

Defining web accessibility

Catering for different types of temporary and permanent special needs

Catering for visual disabilities

Catering for auditory disabilities

Catering for motor/mobility disabilities

Catering for cognitive/intellectual disabilities

Catering for neurological disabilities

Benefits of ensuring your product is accessible

Legal implications for non-accessible products

Assistive technology and the role it plays in developing for accessibility

Testing for accessibility

Summary

A Practical Guide to Web Accessibility

Where to start with web accessibility?

Practical guidelines for analyzing a website's web accessibility status

An overview of the WCAG 2.0

Perceivable

Operable

Understandable

Robust

An overview of WAI-ARIA

Roles

Properties and states

Web accessibility requirements from a design perspective

Case Study - Booking.com analysis of design requirements for WCAG 2.0

Before we part ways

Summary