Foundations of UI/UX

Foundations of UI/UX

•Common terms, tools, frameworks • How to plan and participate in design sprints • Build professional presence online, including portfolio

I started a new course in UI/UX Design through Femcode Africa and I would like to share my little knowledge in what I have learned so far in the first week.

What is User Experience?

User experience is how a person, the user, feels about interacting with or experiencing a product (a product can be a good, service or feature).

For a product to have good user experience, it must be usable, enjoyable, equitable and useful. User experience is about improving usability. -The design and structure of a product should be easy to use by everyone.

Here's an illustration; When Ketchup bottles were designed, it was difficult to control the amount of ketchup that comes out of the bottle and one had to hit it so hard before enjoying your ketchup but it was later redesigned into squeezable plastic bottles, this way you can easily squeeze out any amount you desire, to enjoy your meal.

-Equitable means that the product is useful to people with diverse background and abilities -it's mostly enjoyable and produces exciting moments. Users should be happy using the product -A product solves user’s problems. Imagine you are lost; a map app should tell you how to get home but it's not useful when it cannot find your current location.

Major Characteristics of UX Designers

  1. UX designers have a good sense of visual. 2.They think about people and how they feel using a product. UX designers are empathetic 3.UX designers are resourceful.

Types of UX Designers

Interaction, Visual and Motion Designers

Interaction designers focus on designing the experience of a product and how it functions. They figure out how to connect the users needs and business goals. Visual designers focus on how a product looks;from the Logos, illustrations, the colors, the fonts and Icons. Motion designers think about was it feels like for a user to move through a product and how to create smooth transitions on an application or website. A key task for UX designers is to tie his specific emotion to the experience of using the product. Protecting user road blocks and potential mishaps is what good UX design is all about

USER versus END USER.

Anybody who uses a product is a USER while the END USER is the specific audience a UX designer creates something for. Our goal as UX designers is to think about problems and needs from the end users perspective and design the experience to meet those needs. Think of it like this; an animated movie about 'talking cars' is designed for kids of ages 4-7 (end users) but adults (users) could be in the audience too. Everyone in the theatre does not experience the movie the same way. Focus is the end users experience

when it comes to evaluating users experience, these key questions should be examined:

  1. Is the product easy to use?
  2. Is the product equitable?
  3. Does the product delight the user?
  4. Does the product solves the users problem? If the answer is YES, the goal of User Experience is achieved.

User-Centered Design

It is important that designs are centered on the user because the user buys and uses the product. It is also important to solve problems that users experience rather than solving personal problems that you (UX Designer) face. Focusing on real user problems reduces the impact of designer bias. Larry Page, one of Google's founders highlighted how important User center design is when he said “there is no substitute for personally watching and listening to real people”. Focus on the user and all else follow. User center design puts the user Front-And-Center, considers their feelings and emotions.

User Center Design Process Framework -Understand -Specify -Design -Evaluate.

  • Understand how the user experiences the product or similar ones
  • Specify the end users needs based on research
  • Design solutions to the end users problem and build on ideas.
  • Evaluate your design against their need by testing with real people.

Note: as you go through this process ITERATION is the key. Iteration is doing something again by building on previous versions and making tweaks

Other Common UX frameworks. A framework creates the basic structure that focuses and supports the problem you are trying to solve like outlines for a project.

The Five Element Frameworks And Design Thinking Process.

These are steps a designer takes to turn idea into a working product. -Strategy -scope -structure -skeleton -surface

  1. Strategy define users needs and business objectives
  2. Scope determines what you are building, you decide on features, contents to be included in the project.
  3. Structure is how to organize the design and how the user will interact with it
  4. Skeleton is like the skeleton of our bones, it helps to detail how the design works and just like the skeleton of our bones, the users do not see it but only sees the surface.
  5. Surface is how the product looks to the user.

Design Thinking Process

It is a way to create solutions that address a real user problem and is functional and affordable

The Five Actionable Steps Of Design Thinking

-Empathize -Define -Ideates -Prototype -Test

  1. You can use observation,interview or survey methods to discover what they really need. Then how to think and feel like them.
  2. Define a clear problem statement based on the results of the interview.
  3. Brainstorm solutions and focus on the quantity of the solutions and not the quality of ideas.
  4. PROTOTYPE is a scaled down version of a product that shows important functions
  5. Test prototype with users before the product is finally designed.

There are three more ways to put the user first;

  1. Universal Design 2.Inclusive Design and 3.Equity Focused Design

•Universal design is the process of creating one product for users with the widest range of abilities and in the widest range of situations. For an instance, designing a one-size-fits-all cap will be useful to many Yet it will not serve the larger population. •Inclusive design Involves making design choices that consider personal identities like ability, race, economic status, language and gender ~Universal design is one size fits all but inclusive design is solve for one extend to many~ •Equity focused design is designing for groups that have been historically underrepresented or ignored when building products.

Equality Versus Equity

Equality means providing the same amount of opportunity and support to all segments of society

Equity means providing different levels of opportunity and supports to each person inorder to achieve fair outcomes.

Looking at the tools a UX Designer should get familiar with

Design tools can change based on clients requirement but most design tools have similar features and having knowledge of one tool can help you around other tools. Tools like Adobe XD and Figma are used in UX designs.

Advantages of using design tools

•Tools allow designers to prototype ideas and iterate on them •UX designers used tools to create wire frames and prototypes •Tools make it easier for designers to test prototypes

Design sprints is how something go from a design challenge to actual User centered product A design sprint is a time-bound process with five Phases typically spread over five full eight- hour days The goal of design sprints is to solve a critical design challenge through designing, prototyping and testing ideas with Users.

FIVE PHASES OF DESIGN SPRINTS

Understand Ideate Decide Prototype Tests

Design sprints saves time and create an effective path to bring a product to market. Products can also be tested before launch.

WHEN TO SPRINT

  1. If there are many potential solutions to challenge.
  2. If cross functional teams are needed to weigh in.
  3. If the challenge scope his wide enough.

How to build professional presence

A portfolio is used to demonstrate your skill during application. A portfolio is a collection of work you have created that shows your skills in a certain area

Tools to help you build a portfolio on the website 1.WIX
2.SquareSpace

  1. web flow

Features of a UX design portfolio

•Establish your personal brand •Your personal brand is the way in which your personality, unique skills and values as a designer intersect with your public persona •It should clearly demonstrate who you are, what makes you interesting •Tell a story about your design process to engage your audience •Keep your navigation simple. navigation is the way users gets from page to page on a website •Go beyond the templates customize your website to align with your brand and story you want to tell. Edit some text and bring your designs skills into play •Register your own domain name •Make your website responsive that is to say it can be viewed in different platforms. it should be the same on a desktop and mobile phone •Test your website

Build a personal brand that showcases the type of work you want to do. your personal brand is your primary source of marketing.

To figure out your personal brand ask yourself the following questions;

  1. What am I naturally good at?
  2. what have I learned to do well?
  3. what do I enjoy?
  4. what do I value?
  5. how do other people describe me and my talents?
  6. what do I want people to recognize me for?

Your brand should be consistent everywhere you have presence online, on your resume and social media accounts. •Start with your personal statement, that is, a one or two sentence phrase that describes what you do and what you stand for •Include your personal statement on the about me page on portfolio. if you describe yourself as organized it should reflect in your designs

Popular UX design communities

DRIBBBLE BEHANCE MEDIUM

Polish your story and find your audience.

Thank you for reading