User Experience Design Guide

user design diagram

 

User Experience Design deals with making and organizing items and elements so as to affect the experience that users get from a company. The goal of User Experience Design is to influence the direction of thought, perception and behaviour of the user. In this guide, we will focus on the core components and terminology of user experience design for digital interfaces (websites and software applications). This guide will introduce you to the field.

TABLE OF CONTENTS

Project Types
Multiple Roles
Contracts
Project Approaches
Business Requirements
User Research
Personas
Prioritization
Design
Wireframes
Prototyping
Usability Testing
Analysis
Analytics

PROJECT TYPES

Different types of websites have different characteristics.

  • Brand Type – Brand deals with the sequence of impressions which the site or application leaves on the customer.
  • Marketing Type – Marketing deals with generating interest for the product or service.
    Task Type – Task applications require a great deal of requirements gathering, design and implementation.
  • Content Type – Content deals with a database of information that is meant to inform.
    E-Commerce Type – This is a hybrid type that combines the brand type, content type, and task type.

MULTIPLE ROLES

As a UX designer, it is likely that you will have to end up doing multiple roles on a project. The three main roles are: information architect, interaction designer and user researcher.

In the information architect role, the designer focuses on the structure of the information. This may involve the design of site maps and the categorization of information.

In the interaction designer role, the designer focuses on the behaviour of the app or website. This may involve the creation of task flows and wireframes.

In the user researcher role, the designer gathers research from users and presents the best insights as to their requirements.

CONTRACTS

When conducting business with another party, it is professional to put together an agreement that outlines the specifics of the relationship, the endeavour, and the payment expectations. This type of agreement helps to protect the business and the client from any financial or legal situations which may arise when parties don’t have contracts in place. Though it may take some time to draw up such a contract, the benefits outweigh the costs. Contracts are necessary.

PROJECT APPROACHES

The approach to a project can be of a formal type such as Waterfall Approach, or it can be less formal such as the Agile Approach. Understanding which approach to take can help guide you in knowing how to interact with and how to integrate others within the project.

  • Waterfall Approach – This approach is formal in that every phase requires approval before continuing on to the next phase. For example, after requirements are signed off on, then the project can continue to the design phase. One of the problems with this approach is that it is not very nimble. When a change is required, then it can not be done on the spot, but the project may need to revert to an earlier phase to implement the change.
  • Agile Approach – In the Agile Approach, there is not much focus on “heavy documentation”, “formal roles”, and “phase approvals” commonly found in the Waterfall approach. Instead, teams work closely to solve problems and implement solution in less formal meetings. This helps avoid the typical delays associated with formal documentation and approval steps. Iterations are released, the feedback is considered, and then the next iteration is planned.

BUSINESS REQUIREMENTS

Requirements outline what a website or an application needs to address.

The process of getting requirements involves a few different steps. First, stakeholder interviews can help the designer to understand the competition and the present situation. Second, ideas can be formulated based on the interviews with the stakeholders. Third, ideas can be arranged into different functional groups. Some of the ideas will repeat and this is where the list can be optimized and filtered such that an efficient and non duplicated list of requirements is generated. Fourth, the requirements will need to be ordered according to importance in a prioritized list.

USER RESEARCH

User research involves defining the user groups and researching.

Defining Groups – In order to be able to make a research plan, the designer needs to first create a schema or model of the type of users which will need to use the app or the site. Example user groups for a .com site might include: investors, members, partners, customers and employment candidates.

Researching – After figuring out the user types, the next step is to figure out the kinds of research to perform throughout the project. There are various types, such as: user interviews, contextual interviews, focus groups, usability testing, surveys and card sorting.

  • User Interviews – User interviews are conversations with a sample of users. The goal is to figure out their likes/dislikes, opinions and attitudes.
  • Contextual Inquiry – Contextual interview goes one step above the user interview process. An interview takes place on location. The designer has a chance to experience the actual environment in which the app or site is used. Also, the designer can observe the user.
  • Focus Groups – The focus group is a conversation between a more diverse set of people.
  • Usability Testing – In Usability Testing, the users follow directions to perform specific tasks on an app or a site, and the designer then writes down the relevant observations about usability.
  • Surveys – Surveys are a set of questions that can be provided to a larger sample of users. Survey’s can be collected efficiently with the multiple choice format on either paper or online data collection methods.
  • Card Sorting – Under the card sorting method, sample users will either arrange cards into groups they find logical. The users can be provided the groups to begin with, or they can be asked to make up their own groups.

PERSONAS

When making design decisions, it can be helpful to the designer to have in mind a “mental user model” of the type of individuals who are likely to use the system. Without a “mental user model” or a “lifelike user concept”, the designer may occasionally get stuck. Design decisions require a lot of information, and in the absence of the required information, designers may not be able to resolve some design conflicts. For this reason, many designers create these models, which are commonly referred to as Personas.

PRIORITIZATION

The requirements will need to be prioritized. There will need to be a meeting with the following individuals; designer, business associate, development associate and the project manager. First, the designer will need to represent the opinions of the users. Second, the business associate will need to represent the needs of the business by promoting and outlining the strategy of the business. Third, the development associate will often need to bring up the technological constraints, which will be based on the capabilities of the company. Lastly, the project manager will discuss project fundamentals.

DESIGN

Visual Design – A product with a good visual design will affect user perceptions. Users may perceive a well designed product to be more trustworthy, more valuable and more relevant than one with a less professional visual design.

Psychology – Upon visiting a site or an application, the typical user will quickly form a preliminary impression. This impression could be either positive or negative. Either the user is pleasantly surprised that the program works as they expect it to or better than they expect it to, or perhaps the program doesn’t work effectively at all. But what do we mean by the word “effective”. Effective programs respond to the user input in a way that fits the mental model of users and matches the user’s expectations. The design of effective programs require a good understanding of psychology.

Site Maps – Site maps are diagrams which are used to represent the different “pages” or “views” of apps or sites. The site maps often look similar to the charts that organizations use to display the structure of human resources.

Task Flows – Task flows are similar to site maps, and can be easily confused with them. Whereas a site map shows the layout of the “pages” or “views” of the site or application, the task flow shows you the options presented to the users and the paths which the users can take to navigate through the system.

WIREFRAMES

Wireframes are an early design schematic which is used to represent the thoughts of the designer to clients and team members. Since wireframes are quick and efficient form of design, it is possible to try out a few different variants without taking up too much project time, before the later time consuming stages of development start. Examples of wireframe components can include; content sections, images, videos, forms, and navigation.

There are different expectations that clients and team members can have in the area of wireframes. Some team members may have a lot of experience with them and may expect a high level of quality or to have a particular style and format. On the other hand, some clients may have never seen a wireframe before and may not understand that the wireframe is not how the system will look in the final form. To these clients, it can be explained that the wireframe is a draft similar to an architectural drawing or schematic used for the design of homes. The design can be changed a lot easier than the home can be changed during the construction phase, therefore the design documents are critical to go over.

PROTOTYPING

Building a prototype of a system, instead of building the system itself, can sometimes seem like a very involved and resource consuming endeavour. This problem can be mitigated by realizing that prototypes don’t really usually need to simulate the entire system. Often limiting the prototype to only simulating the more critical or complex areas of the system are all that is required to test out core concepts. Prototyping can be done on paper or it can be done digitally with an editor.

USABILITY TESTING

Once the design choices have been made and implemented, it needs to be tested with users.

There are a few key things to keep in mind about Usability Testing. The first thing to know is that usability testing is that it is the most common of the methods used by UX designers to test. It simply involves coming up with a set of directions for the user, asking them to perform the tasks assigned, and writing down all of the observations and insights gained from their experiences in their attempt to follow and perform the required tasks. The second thing to know, is that this type of testing must be performed numerous times to be reliable. If the focus is on quality metrics, then four to seven users are sufficient. If the focus is on quantitative metrics, then as many as fifteen to eighteen users may be required. The third thing to know is that users expect something in return for their time for being a participant. The level of compensation required will vary by user. This means that it will be costly to perform this kind of testing, and the designer will need to justify their testing strategies.

ANALYSIS

The test will provide numerous insights and issues. Avoid making recommendations before all of the issues are ranked and prioritized in a sequence of most critical to least critical. Avoid making recommendations before you have time to analyze the issues and generate good ideas and insights that can benefit the project.

ANALYTICS

After an app or site is deployed, gather statistics and analytics as to the usage data from the clients.

To see our Donate Page, click https://skillsgaptrainer.com/donate

Support the future. Support Skills Gap Trainer.

To go back to our Home Page, click https://skillsgaptrainer.com

To see our Instagram Channel, click https://www.instagram.com/skillsgaptrainer/

To see our Twitter / X Channel, click https://twitter.com/SkillsGapTrain

To see our YouTube Channel, click https://www.youtube.com/@skillsgaptrainer

To see some of our Udemy Courses, click Udemy SGT Page

 

Discover the future of learning with Skills Gap Trainer, where technology meets art, and education transcends boundaries. Our innovative curriculum in AI, blockchain, user experience, digital marketing, and more, isn’t just about acquiring skills — it’s about mastering the art of possibility in a digitalized world. By linking to us, you’re not just sharing a resource; you’re igniting a beacon of knowledge that enlightens paths in technology, leadership, and beyond, for a global community of learners. Join us in our mission to bridge the skills gap and shape the future of education. Together, let’s empower minds across Canada, America, Europe, Britain, India, and beyond. Link to Skills Gap Trainer – where learning meets innovation, and every click opens a door to endless possibilities.