Introduction 101 to UX Design

  • UX Designers put the user experience first and make technology easier to understand. We specialize in apps or website motion, visual design, and how people interact with tech products.

UX Designers put the user experience first and make technology easier to understand and navigate; we specialize in apps or website motion, visual design, and how people interact with tech products. Remember: UX designers put the user experience first and make technology easier to understand.

What is User Experience?

A user experience is how the user feels interacting with a product, service, goods, item, or feature. For a good user experience, a UX product must be:

  • Enjoyable – The design must be created thinking about a positive connection between the user and the product. That positive connection is made with feedback about the product’s design.
  • Equitable – When the design is equally accessible for users with diverse abilities, some users are more visually connected with the design, others are better at reading, and others with sounds or hearing the stories.
  • Usable – When the design is clear to everyone because everyone was considered to use the product, including people with disabilities.
  • Useful – We also need to create a design that solves a problem quickly, for example, a search icon to help find the information you are looking for or a map location to help find an address.

Research About User Experience

UX researchers discovered that businesses focusing on usability and design perform better than competitors; for example, think about any app you loved so much that you shared it with a friend and asked them to join; that translates to the user having a good user experience with the whole design concept. And both sides benefited from the interaction—the company that created the product and the user who enjoys the product. But unfortunately, businesses still don’t grasp the role of UX design in improving a product or business. So now you know why UX design is vital for companies and the development of new products in the future.

UX Designers

UX designers come from different backgrounds; for example, I went to college to study Business Management, and after that, I worked in construction, healthcare, and transportation for several years. Then, ten years ago, I decided to follow my growing interest in technology, changed my career, and took web development classes that eventually taught me about website development and UX design. And now, I’m a UX Designer with a background in both business and coding.

Different Backgrounds are Welcome

UX designers might come from different backgrounds and have professional experience in other industries, but we all share something in common. For example, we have similar interests and visual skills, such as recognizing when an image fits or not and what colors are better for designing an app or website, to name a few skills.

What Does a UX Designer Do?

I must remember how often I have answered this question; some people outside of technology have never heard about UX design. Okay, here is a summary:

Types of UX Designers:

  • Interaction Designers – These designers focus on the experience and function of a product; these UX designers try to connect what the user needs and the business goals—for example, designing the user experience emphasizing privacy and security in an app or what happens when a user clicks a button. The job of interaction designers is all about easy navigation.
  • Motion Designers – These UX designers try to imagine a user as it moves between pages and create the perfect transition for an app or website; for example, motion designers use the correct animation to tell a story; their job is to work with elements that move inside the app or website.
  • Visual Designers: These UX designers are all about the visual aspect, concentrating on the product’s aesthetic; for example, visual designers might design icons, illustrations, logos, font colors, and layouts and provide the right colors for a button. The job of a virtual designer is to engage users with the design.
  • Conversation Designers – Think of Siri or Alexa; designers try to incorporate real-world conversation between the app and the user. The job of a conversation designer is to make it possible for a user to get things done through an exchange of questions while using the app.
  • UX Engineers – These designers translate and bring to life the functioning part of the user experience of an app or website. The job of a UX engineer is to build and provide the best experience.
  • Production Designers – These designers are a mix of engineers and interaction designers. Production designers ensure the final design matches the finished product— text, images, and spacing inside an app must be correct.
  • UX Program Managers – UX Managers ensure the design and building process moves according to plan from start to finish a product.
  • UX Researchers – Researchers conduct studies to evaluate how people use a product; their job is to explore how a product can resolve a user’s problem.
  • UX Writers – UX writers create the language inside an app to make it easy to understand, for example, by writing labels for buttons in an app; their job is to help with a brand’s personality or voice and what the right words to communicate an action or an idea. Note: A graphic designer is NOT a UX designer; graphic designers work with a physical product; in contrast, UX designers work with interaction and motion while using a tech product.

The Life Cycle of a UX Design Project

AUX designer’s goal is to move a product’s design from an idea into something tangible; this usually involves working with all the different UX designers to provide the best user experience.

UX Life Cycle

  • Brainstorm: Working as a team about ideas for the potential need of a UX product, researching competitors, and identifying ways to upgrade and improvise what is already on the market with new ideas and develop a better product.
  • Define: Gathering knowledge and finding a way to impact the user—for example, helping to identify who will be using the product or what type of problems will the new product resolve for the user.
  • Design: Analyzing realistic ideas while creating storyboards or sketches at the same time, designing prototypes that will allow a UX designer to perform testing is the step when UX designers are more involved in the process, so first, we start working on the specifications of a project design appearance then follows the implementation, ensuring everything is easy, like the screen app, button, navigation, the home page, cart, etc.
  • Test: The design is now ready to begin all functional testing and is evaluated based on user feedback; this step involves a joined interaction between UX designers and UX engineers. Next, we start experimenting with a functioning prototype and need to run three types of UX testing.

Three Types of UX Testing:

  • A test within the company called alpha testing looks for glitches in the product.
  • Reports from management make sure the product follows the company standard and government rules for privacy.
  • This step is crucial for an external test with potential users and is called beta testing. This testing determines if the product genuinely provides the required user experience standards; if something goes wrong, the design is tested repeatedly until everything is fixed and the product works correctly. The designing and testing might be back and forth among designers until the product is finally ready to be launched.

Launch:

The product is now ready for the world and might require other steps, for example, building a website to go live, listing an app at Google or Apple Store, or making a physical product available in stores; this step is also when the marketing and advertising team start promoting the new UX design product after launch, there is always room for growth. New challenges and opportunities may improve the design. In addition, upgrades must be implemented after the product is on the market.

Designing and Understanding a Good User Experience – UX Design

Let’s talk about a good UX user experience; imagine creating a new account on a new social media app; you know where that button takes you. When you try to press a button, your guess is usually correct because buttons must be predictable for the user to feel comfortable utilizing the app. Imagine clicking an app button and not doing what’s expected or taking you to a different function or page. The app will not be helpful to you. After all, if it’s not working according to your needs and expectations, these instances are called the roadblocks of UX design. If the design doesn’t reflect the user’s needs, it’s poor. For example, think about a door. If the door says pull but keeps pushing, you’ll have a problem opening the door. The same idea is used for poor UX design and is called Norman doors. A UX design needs comprehensible buttons, icons, and language to move the user around the app.

Responsibilities of a UX Designer:

  • Researching: Always start a research project to learn more about the user’s age, demographic, and location; it essential as well is to know about the user’s motivation, life goals, or interests; the main job is to discover as much information as about the users before initiating a new product design.
  • Wireframing: A wireframe is a sketch of a screen or a product; this is the first step after research to start designing. It could be done digitally on a computer or manually drawn on paper; a wireframe helps the UX designer outline how to arrange the pages on an app or website.
  • Prototyping: A prototype is similar to wireframing but more advanced. A prototype is an initial product model demonstrating functionality; wireframing is just the idea of the product. Meanwhile, prototyping is a sequence from one screen to another; different prototypes could be created: digital, physical, or drawing prototypes. The primary purpose of working with wireframing or a prototype is to start designing quickly and inexpensively.
  • Information Architecture: Information architecture is the framework of a website; you can find an example here on my website. On the top screen in the center, you can find a category called technology; inside technology, you can find a drop-down menu with several sub-categories called information architecture. It tells you how a website or an app is organized and where you could go next.
  • Communication: Designing a UX product requires working as a team and sharing information as the design improves among all the UX designers.
  • UX Designers at Big Companies Versus Small Companies
  • Big Companies UX Designers: Big companies can hire several specialist UX designers in different areas of UX design during the creation or completion of a project; there might be another UX designer for each project’s life cycle step. A specialist UX designer is highly skilled in one part of the design process; for example, a Visual Designer at a big company has the space to concentrate on just visual design.
  • Small Companies UX designers: A small company might hire a Generalist UX Designer. These designers wear many hats sometimes; they work doing research, interaction, visual, branding, wireframing, prototyping, UX writing, production design, testing, information architecture, and many other skills.
  • Another Type of Designer is the T-Shaped Designer: A T-shaped designer has all the experience and skills of UX design; they probably started as a Generalist and then turned into a Specialist; aT-shaped is someone working as a UX specialist but has several other skills like coding, prototyping, and writing, for example, I’m a T-shaped designer I’m a web developer and web designer, and now I’m working on Visual UX design projects.

User-Centered Design and Frameworks in UX

The user-centered design puts the user front and center. Therefore, UX designers must consider the user’s emotions, story, and feedback while designing.

User Versus End-User? Easy, think this way: let’s pretend you are a children’s book writer. Children are the ‘end-users.’ but who will buy the book? the parent, who in this case is ‘the user.’ UX design is mapped to create for the end-user, but we must also consider other users.

User-Centered Design Process: The main goal of user-centered design is to resolve a user experience problem and not just design your personal experience so the user will consume or buy your product; the more you research users, the better the design the user experience goes first and everything else second regarding UX design once we do plenty of research on the users, we use the information gathered using the four steps for the user-centered design process: understand, specify, design, and evaluate.

Understand, Specify, Design, and Evaluate a User-Centered Design Process

  • Understand: How is the end-user experiencing the product?
  • Specify: Is there a problem to solve for the end-user? What needs does the end-user have?
  • Design: Answer the end-user problem with your design and use your ideas to build a product that will answer those needs.
  • Evaluate: Now, use your design and compare that design with the end-user needs. Finally, test it on real users and answer whether the design solves the problem.
  • The key is using iteration while designing, doing something again by building on previous versions, and making upgrades.

Frameworks in UX Design

A framework is a structure that supports the problem you are trying to solve; let’s talk about two frameworks: the five elements of the framework and the design thinking framework.

The Five Elements of Framework

The five elements of the framework transform an idea into a working product consisting of strategy, scope, structure, skeleton, and surface—each dependable on the other.

Strategy, Scope, Structure, Skeleton, and Surface of UX Framework

  • Strategy: specifying the user’s needs and objectives of a business.
  • Scope: Decide what you are building regarding features and content in the UX product.
  • Structure: Coordinating the design and how the user will interact.
  • Skeleton: This is the interior layout of the product design.
  • Surface: how the product looks and how the user experiences the product.

The Design Thinking Framework

It means conceiving solutions to a user’s problem in a functional, affordable design thinking involves five steps: empathize, define, ideate, prototype, and test.

Empathize, Define, Ideate, Prototype, and Test Design Thinking Framework

  • Empathize: Learning how to think and feel like the end-user and discovering its needs is obtained through interviews and surveys to view the end-user and their difficulties.
  • Define: Present a clear definition of the problem the end-user needs to resolve.
  • Ideate: In simple terms, it is brainstorming and developing as many ideas as possible and selecting what can be used as a prototype among those ideas.
  • Prototype: a scaled-down product version detailing essential functions, the goal, and the idea must be clear to create a good prototype.
  • Test: Once we create the prototype, we test the prototype with real users to obtain opinions before the product is built.

These frameworks are used depending on the company and the size of the team or project; depending on the feedback from the test, you might need to be back and forth with the design until all problems are solved and the product is ready to be shared with the world.

Lean UX and Double Diamond

Lean UX and Double Diamond are frameworks of UX design; lean UX reduces time and resources to produce a fast, usable product. This is an iterative process, meaning updates and revisions are constantly being changed and applied; there are three steps for Lean UX: think, make, and check.

Steps in Lean UX: Think, Make, and Check

  • Think: What type of problem is the user encountering? And how do we solve the problem with the design? It’s all about gathering research, who the product is for, and how it will help the user.
  • Make: Start creating sketches, wireframes, or prototypes; a minimum viable product (MVP) is a simple design prototype that can be tested with the target end-users; audience prototypes are updated as feedback is gathered.
  • Check: Discover how users respond to the design and obtain feedback from stakeholders; then adjust the design and repeat all necessary steps until perfection.
  • These are repetitive steps until the whole team reaches the final product; lean UX promotes collaboration and productivity and is cross-functional, working with engineers and UX researchers.

The Lean UX Process Has Six Principles:

Move forward, stay curious, test ideas in the Real World, externalize your thoughts, reframe deliverables as outcomes, and embrace radical transparency.

  • Move Forward: concentrate on design elements, moving the design towards a goal.
  • Stay Curious: use feedback to learn why a design works or doesn’t.
  • Test Ideas in The Real World: test the idea with real users utilizing a prototype.
  • Externalize Your Ideas: turn the idea into something physical while fresh in your mind to obtain feedback during the early stage.
  • Reframe Deliverables As Outcomes: create a pleasant product and always design for the user first.
  • Embrace Radical Transparency: be honest with everyone on the team about progress and avoid wasting time.
  • The Lean UX process design is all about feedback and constant updates.

Double Diamond

The Double Diamond design process has two main phases: research and design. Research involves two phases: discover and define, and design involves develop and deliver.

See Also
Wendy Cecilia Reyes - wendycecilia - wendycecilia.com

Research

  • Discover The Problem: gather information about the issues the users face.
  • Define The Problem: concentrate on the central point the product intends to solve.

Design

  • Develop Solutions for The Problem: Design a work in progress using wireframes and prototypes.
  • Deliver The Product: Test the product and have it ready for release.

Double Diamond is iterative; the process repeats itself several times; it requires teamwork and multiple responsibilities and roles.

Double Diamond Steps: focus on the user, communicate, collaborate, and iterate.

  • Focus on the user: the user is always the main priority.
  • Communicate visual communication that is also accessible and equitable.
  • Collaborate: Creativity is encouraged among team members.
  • Iterate: Make revisions several times. The UX design is a work in progress.

It all depends on your team to determine which steps to use. Learning these processes is essential to understanding the dynamics of building a UX product. In my next post, I’ll discuss the life cycle of a UX designer developing and working on a product.

Essential Tips Using UX Microcopy and Navigation Menus

UX Microcopy

Words can make a difference when it comes to improving user experience. Therefore, UX designers need to become familiar with UX writing. What is UX Microcopy? UX microcopy uses tiny words on a website that provide guidance and sometimes a call to action.

There Are Four Phases of UX Microcopy

  • Brevity: With microcopy, less is more —for example, a straightforward guide on a website, filling out a form, or finding information.
  • Context: It provides the user with enough information on a website to understand what might come next as it moves from one page to the next.
  • Action: When microcopy words motivate a user to make a move—for example, a click.
  • Authenticity: Authenticity is crucial in reassuring the users to trust the website providing their information, such as signing up for a newsletter with their email.

UX microcopy is the fastest way to enhance an interface. Here are some tips:

  • Personal Pronouns: Connect to the reader and use the word you; users enjoy being addressed directly.
  • Use Verbs: Specially verbs that are direct and inviting.
  • Avoid Concerns: Be transparent and ensure the user understands each step.
  • Natural Conversations: Write as if having a conversation, using user-friendly and familiar words.
  • Error Messages: In a friendly way, explain what the problem is.

Using UX Design for Navigation Menus

  • Placement: Menus usually have a clear pattern we all follow; we place them on the left side, at the very top, or the footer. This is important because navigation must feel familiar and clear to everyone.
  • Location: Show the user a clear idea of where they are while they navigate the website by reading the tab title and URL or changing the menu color. For instance, here on wendycecilia.com, if you click the category technology, you’ll notice a change of color compared to the rest of the menu; this is done to create easy visual navigation for the user.
  • Links: Correct link labeling is important because the link’s title should perfectly predict the location or item to the user before a click.
  • Space: Make sure the top content on the website and navigation menu don’t compete for space; enough space should be left between both sections, ensuring the navigation receives the most attention. If possible, use different colors to differentiate. Click “Scroll To Top” on your bottom right side to check the navigation menu on this page.
  • Navigation menus are essential to UX interface design, where traffic and movement are provided the most on a website. I prefer keeping my menu design minimalist and simple.

Wendy Cecilia Reyes

Please comment, share, or email this post to a friend. Thanks for your support!

Recommended UX Books


READ MORE:

Introduction 101 to UX Design

How To Create An XML Sitemap And Submit It To Google

SEO Search Engine Optimization Is Important for Your Website

Tips for Building Your First Small Business Website

Things I Wish I Knew Before Creating My Site

HOME | ABOUT | DESIGN | WENDY 

 

Copyright ©2023. All rights reserved for wendycecilia.com | All customization and content created by Wendy Cecilia Reyes.

Scroll To Top