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.
wendy-reyes-ux-designer-nyc- Introduction-101-to-UX-Design-wendycecilia.com-wendyreyes

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:

  • EnjoyableThe design must create a positive connection between the user and the product. Feedback about the product’s design can help create that positive connection.
  • 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.
  • UsableWhen the design is clear to everyone because everyone, including people with disabilities, is considered to use the product.
  • UsefulWe also need to create a design that solves a problem quickly, such as a search icon to help you find the information you are looking for or a map location to help you 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. 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 focus on the experience and function of a product. These UX designers try to connect what the user needs with 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 DesignersThese 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 EngineersThese designers translate and bring the functioning part of an app or website’s user experience to life. Their job 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

A UX designer aims to transform a product’s idea into a tangible reality. This usually involves collaborating with other 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 problems the new product will 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 design and testing might go 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, so the user feels comfortable utilizing the app. Imagine clicking an app button and not doing what’s expected or being taken 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. Knowing the user’s motivation, goals, or interests is also essential. The main job is discovering as much information as possible about the users before initiating a new product design.
  • Wireframing: A wireframe is a sketch of a screen or a product. It 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. A T-shaped designer works 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? It’s 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 for the end-user to solve? 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 business objectives.
  • 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. To create a good prototype, the goal and idea must be clear.
  • Test: Once we create the prototype, we test it 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 input from stakeholders; then adjust the layout 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 it is 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 stages: discovery and definition, and design requires development and delivery.

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, and 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 visually in a way 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 improve 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: Explain the problem in a friendly way.

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.

Conclusion:

The text explains User Experience (UX) and its importance in product design. UX designers prioritize the user experience, making technology accessible to navigate and understand. A good UX product must be enjoyable, equitable, usable, and valuable. Businesses that focus on usability and design perform better than their competitors. UX designers come from diverse backgrounds and have different specializations, such as interaction designers, motion designers, visual designers, conversation designers, UX engineers, production designers, UX program managers, UX researchers, and UX writers.

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

See Also
wendy-reyes-ux-designer-nyc-wendyceciliacom-wendyreyes-uxdesigner-nyc-wendycecilia.com - Wendy Reyes UX Designer NYC

  • 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: Explain the problem in a friendly way.

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 Reyes

Recommended UX Books


If you found this post helpful, please share it on your social media or email it to a friend. I appreciate your support. 

Follow me or send me a message on social media. 

Instagram: @Wendy_UXDesigner 

Pinterest: @Wendy_UXDesigner

Wendy Reyes


Read More

The 60-30-10 Color Rule in UX Design

How Micro-Moments Are Changing UX Design

The Design Thinking Process Explained

Wireframing in UX Design

Embracing Writing as a Product Designer

Essential Tips Using UX Microcopy and Navigation Menus

My UX Reading List – Favorite Books About Design and User Experience

Introduction 101 to UX Design

How Important is Search Engine Optimization (SEO) for your Website?

How To Create An XML Sitemap And Submit It To Google

Tips for Building Your First Small Business Website

Things I Wish I Knew Before Creating My Website

Meet Wendy Reyes

HOME | ABOUT | DESIGN | WENDYALL POSTS

 

Copyright ©2020 - 2024.  All rights reserved for wendycecilia.com | All customization and content created by Wendy Reyes.

Scroll To Top