Hands-on UX design for developers : design, prototype, and implement compelling user experiences from scratch / Elvis Canziba.

Format:

Book

Author/Creator:

Canziba, Elvis, author.

Language:

English

Subjects (All):

User-centered system design.

Web site development.

Web sites--Design.

Web sites.

Physical Description:

1 online resource (341 pages)

Edition:

1st edition

Other Title:

Hands-on user experience design for developers

Place of Publication:

Birmingham, England : Packt, 2018.

System Details:

text file

Summary:

Learn every step you need for product design and development Key Features Explore all the tools that you need to be a complete UX designer Code the product designs you've created to become a full-stack designer Build an amazing portfolio with real-world projects Book Description Designing user experience (UX) is one of the most important aspects of a project, as it has a direct effect on how customers think of your company. The process of designing a user experience is one of the most challenging yet rewarding aspects of product development. Hands-On UX Design for Developers will teach you how to create amazing user experiences for products from scratch. This book starts with helping you understand the importance of a good UX design and the role of a UX designer. It will take you through the different stages of designing a UX and the application of various principles of psychology in UX design. Next, you will learn how to conduct user research and market research, which is crucial to creating a great UX. You will also learn how to create user personas and use it for testing. This book will help you gain the ability to think like a UX designer and understand both sides of product development: design and coding. You will explore the latest tools, such as Sketch, Balsamiq, and Framer.js, to create wireframes and prototypes. The concluding chapters will take you through designing your UI, dealing with big data while designing a UX, and the fundamentals of frontend. Finally, you'll prepare your portfolio and become job ready in the UX arena. What you will learn What UX is and what a UX designer does Explore the UX Process and science of making products user-friendly Create user interfaces and learn which tools to use Understand how your design works in the real world Create UI interaction, animation, wireframes, and prototypes Design a product with users in mind Develop a personal portfolio and be well-prepared to join the UX world Who this book is for Hands-On UX/UI Design for Developers is for web designers who have knowledge of basic UX design principles.

Contents:

Cover

Title Page

Copyright and Credits

www.packtpub.com

Contributors

Table of Contents

Preface

Chapter 1: What is UX?

What is UX design?

UX Design versus UI Design

Why is UX so important?

Who is a UX designer?

UX design process

Full stack design

Who is a full stack designer?

A roadmap to becoming a successful full stack designer

Summary

Chapter 2: UX Design Process

Discovery and planning

The planning phase

Project proposals

Project objectives and methodologies

The UX strategy

Understanding the client's business

Understanding our competitors

Understanding our customers

Discovering your own UX strategy framework

UX research

The discover stage

Field study

Diary study

User interviews

Stakeholder interviews

The explore stage

Competitive analysis

Design review

Persona-building

Task analysis

Journey-mapping

Prototype feedback and testing

Writing user stories

Card-sorting

The test stage

Qualitative usability testing

Benchmark testing

Accessibility evaluation

The listening stage

Surveys

Search-log analysis

Usability-bug review

UX analysis

User analysis

Design

Concept, sketching, and flows

Wireframes and prototyping

Visual design and interactions

Documentation

Development

Production

Chapter 3: User Behavior Basics and User Research

User behavior basics

The Gestalt theory

The Proximity law

The Similarity law

The Closure law

The Figure-Ground law

The Common Region law

Things you should know about psychology in UX

Understanding the user's motivation

Extrinsic motivation

Intrinsic motivation

Understanding the user's ability

Understanding what triggers our users

A quick summary of this section

User research.

Setting objectives and a brief

Defining the audience

Selecting our research method

Designing and validating your research

Organizing interview

Conducting the research

Analyzing and validating the results

Defining the problems

Market research is not user research

The benefits of user research

Helping to create the right product from the beginning

Increasing conversions and revenues

Avoiding surprises saves time and money

Improving SEO and marketing

Customer retention and loyalty

Providing competitor insights

Development resources

Early design guide

Chapter 4: Getting to Know Your Users

User Research

Grouping customer information

How to conduct user interviews

Preparing for the interview session

Identifying who we want to talk to

Setting up screener surveys for filtering the participants

Conducting the interview

Chapter 5: User Personas

What are user personas?

Creating a persona

Four different perspectives on personas

Goal-directed personas

Role-based personas

Engaging personas

Fictional personas

Benefits of personas

Chapter 6: Designing Behavior

Designing behavior

Five factors/preconditions for users to take actions

Models of behavior change

Behavioral approach for product design

Chapter 7: Visual Design Principles and Processes

Introducing visual design principles and processes

Basics of visual design

Using lines

Using shapes

Types of shapes

Shape usage in visual design

Using colors

Color theory

Color systems

Using the color wheel to understand the meaning of colors

The meaning of each color

Using the appropriate font/typography

Textures

Forms

Design principles

Alignment

Hierarchy

Contrast

Repetition

Proximity

Balance

Space.

Visual design tools

Chapter 8: Wireframes and Prototyping

What is a wireframe?

How to create wireframes?

Types of wireframes

Low-fidelity wireframes

Medium-fidelity wireframes

High-fidelity wireframes

Wireframing tools

Sketch wireframes

Stenciling and paper cutouts

Wireframing software

Balsamiq mockups

Wireframe.cc

Moqups

InVision

UXPin

Axure

Other wireframing tools

Creating wireframes using graphic design software

What is prototyping?

Prototyping methods

Paper prototyping

Digital prototypes

Coding prototypes

The process of creating prototypes

Planning

Drawing and sketching

Mockup and design

Animations and interactions

Exporting and testing

Prototyping tools

MarvelApp

Origami.Design

Justinmind

Flinto

Principle

Other prototyping tools

Chapter 9: UI Design and Implementation

User interface design

UI design tools

Designing the UI with Sketch

The toolbar

Artboards

Pages

UI components templates

Colors

Typography

Icons and symbols

Exportation

Preview of the UI design

Sketch plugins

Creating the Design System in Sketch

Creating a structure for files and folders

Following the proper naming convention

Choosing the colors and creating the palettes

Choosing fonts/typefaces

Creating and configuring the grid

Designing the UI components

Chapter 10: Frontend UI Implementation and Process

UI Design handover

Communicating with the frontend team on the early stages of design

Explaining to the developer how you expect the design to work

Sharing the mock-up/user interface designs

Sharing the prototype

Sharing the design specification, assets, and the design system

Status checklist

Using a handover design tool.

Handing-off UI design using Zeplin

Handing over design using Sympli

Frontend development/UI development

CSS layouts

Float-based layout

Flexbox-based layout

Grid-based layout

CSS preprocessors

Sass

Less

Stylus

CSS postprocessors

CSS methodologies

Object-Oriented CSS (OOCSS)

Scalable and Modular Architecture for CSS (SMACSS)

Block, Element, Modifier (BEM)

Atomic CSS (ACSS)

CSS frameworks

Chapter 11: Post-launching UX Activities

Post-launch UX activities

Collecting the correct user feedback

Customer feedback surveys

Emails and contact forms

Feedback through social media

User accessibility testing (UI testing)

A/B testing

Tracking and recording user UI sessions

Creating and analyzing conversion funnels

Chapter 12: Designing for Big Data

UX Design with big data

The role of big data in UX design

Data visualization

Other Books You May Enjoy

Index.

Notes:

Includes index.

Description based on print version record.

ISBN:

9781788624299

1788624297

OCLC:

1048772107