Transcript: 50% Who is Involved Recruiting users Screeners Demographics (location, age, gender, level of industry and/or technical expertise) Task failure/success Task completion time Number of errors Number of clicks Analysis Report Recommendations Other Tools 50% "I invented the term because I thought Human Interface and usability were too narrow: I wanted to cover all aspects of the person's experience with a system, including industrial design, graphics, the interface, the physical interaction, and the manual." - Don Norman Real scenarios/tasks Purchase a round-trip flight to Paris Find a gift for your niece and have it arrive on her birthdate Find college savings plans on a website :) Low-fidelity prototype High-fidelity prototype Paper, wireframe/visualization tool Photoshop, HTML/CSS Paper Prototypes Participant Moderator “Computer” Note-taker Observers A|B Multivariate Testing (MVT) Advantages User Experience 1993 1:10:100 Testing Labs # of Users % of Usability problems found UX definition DON NORMAN "User experience," often referred to as UX, encompasses all aspects of the end-user's interaction with the company, its services, and its products. - Nielson Norman Group UX in practice Measurable Metrics Task Examples Post-Test Prototyping Post-Development Visitors to your website How Many Users? Almost 50% 90% Diminishing returns with additional users. Inexpensive Fast Easy to iterate Avoid look-and-feel feedback Avoid design attachment What is it? Surveys Interviews Diary Studies Product Reaction Cards User Testing 80%
Transcript: ADD YOUR LOGO HERE BEST PORTFOLIO EVER! 2020-2021 Intro Introduction Welcome and thank you for coming to my Portfolio Myself as a Person Personal Statement Share the prompt Read your statement in its entirety Personal Statement Upload your personal statement here. Resume Upload your resume here Physical Health and Nutrition Upload your reflection here. Myself as a Learner Overview of Section Make a table of contents for the different academic sections. Make sure your committee clearly understands that you'll be sharing two pieces in depth, and they will be able to view the rest of your portfolio at the end. In these next few sections I will be sharing work from/about reader, writer, scientist, humanitarian, researcher, and artist. Reader Upload documents (or links) Literature response #1 Literature response #2 Literature response #3 Writer Link to document Link to humanitarian reflection Science Micro to Macro 4. 3. 2. Case Study #2: Genetics Reading Skills 1. Case Study #1: History of Race in US Humanitarian hhtps/://vimeo.com/509552788/e3f94b0a2c Link to math reflection Google doc Researcher "I never have liked math, and probably never will" Artist Click to edit text Myself in the World Service Learning and Expedition Culmination Electives Click to edit text Conclusion Conclusion • Wrap up the formal part of the presentation • Allow your committee to peruse your portfolio • Ask for additional questions or comments • Thank your committee for coming and for their time Evaluation • Committee members fill out evaluation • Teachers fill out rubric • Student fills out self-reflection
Transcript: some helpful content hard to find security 1024 x 768 search could be more helpful some products are not available on-line and it is not clearly indicated UX Review of IKEA.com website UX Best Practices appropriate help to eliminate extra time dealing with wrong turns help with planning weakness gallery of ideas pressed for time easy to navigate some products not available on-line - and not clearly indicated UX Heuristics Mapping upselling and cross selling posibilities commonalities inexpensive but high quality solutions easy and clear ordering process weakness small business owners Weaknesses young families 1268 x 768 strength weakness E-Commerce Best Practices IKEA - customer/user profile navigation within products clear path to product information IKEA.COM New and Improved search could be more helpful college student willing to deal with minor inconvenience to get best value gallery of ideas forms don't have example text in fields UX Site Review UX Site Review - how does it measure up? simple registration ease of product navigation support key user actions with minimum clicks weakness page layout is not liquid helpful content hard to find inspiration DIY'ers Strengths weakness optimize page layout more common resolution indicate on first product placement when not available for purchase on-line easy ordering process weakness strength page layout is not liquid, and doesn't indicate there is anything beneath fold add helpful hints to search, when no results found easy and clear ordering strength move link to design tools to top navigation
Transcript: Proto-personas Cindy With the help of "Adobe XD" Roboto is the typeface of choice The use of gradients underneath text Proper use of the Floating Action Button Shadows to imply layers of paper (Notice the subtle shadows under each section) Opposition Research No Breadcrumbs Breadcrumb Feature Proto-personas are quick way for designers and developers to focus on the user. They are developed in the initial brainstorming phase then are tweaked as we learn more about the user. In this case I have one stakeholder and I am bouncing off some ideas about his potential clients. Calculator Sketch Walks her dogs every night Active with teen daughter's school Shares on Facebook Avid music lover Goes to country concerts With the help of "Storyboard That" Storyboard Proto-personas are less time-consuming and inexpensive to create compared to the full-blown personas that require extensive research. This approach benefits smaller organizations or those businesses that might not focus on research. For that reason, this type of approach is more appropriate for my friends DJ website. Personas are created from initial research. I'm looking for patterns that feed in to a user's attributes, values and personality. Demographic info is important in development of a persona. In this case I am looking at people who work in a office setting and who are active outdoors. They also have a professional sports team that they follow religiously. User Feedback The next slide indicates the changes I would make. 35-40 Female Cal St. Bakersfield Grad White-Collar office job Degree in Economics Video Demo of "8 is Great" Office Pool App Meaningful Motion Basic Principles Sketch I will focus on three aspects of the design process and features: Creating Proto-personas Call to Action placement Breadcrumbs Material as a Metaphor Bold Graphic and Intentional Google has created design guidelines for websites and applications. It is meant to provide consistent look and feel through multiple platforms as users add digital devices to their personal and daily work lives. It also uses intricate visual cues and tactile interfaces similar to paper. It helps define the relationship between the user interface and the user, otherwise known as "affordance" In the following examples I took an app and applied some basic material design principles to demonstrate its use and benefits to the user. Website Upgrade Raymond Escobedo I received input from classmates, my instructor and students we grabbed from other classes and walking in the hallway. Although, the feedback was limited it provided significant insight to users cognitive process. Ultimately, it made a better use of the app which is why usability testing is important. I currently reside in Huntington Beach, Ca. I have a Bachelor's Degree in Psychology with a minor in Criminal Justice and a degree in Web design & Interactive Media. Both disciplines are heavily involved in User Experience. I spent years paying close attention to detail analyzing fingerprints as a Fingerprint & Forensic Specialist. Unfortunately, my creativity was limited working in law enforcement. I pursued a career in Web Design where I can release this creative lightning in a bottle inside me. Here is where I discovered UX Design. Attention to detail, digital creativity and the curiosity to examine human behavior all comes together in UX Design. Add some empathy to the process and you have everything that I have been searching for in a career. It is amazing to see my career transition and evolve into what it is today. I am ready to implement what I have learned as a UX Designer. The main concern expressed by my stakeholder is capturing lead generation info. By placing the "Call to Action" on the home page and making it easily visible provided an easy way to lead them to the "form" page. Storyboard Material Design Guidelines About Us & Service Personas Created with Sketch Wireframes Behaviors E-Commerce Checkout While researching for similar apps that already exist, none have the feature that allows for selecting only eight teams/winners. This is a unique feature that separates the app from the rest. Problems: Static Website Outdated Non-responsive Poor use of Typography Poor use of color theory with red menu buttons Organizational Chart Current Lotto Mobile App Engage socially, not online Buy a new home Maintain healthy relationship with husband Aims to cook healthier Action Button Activated (Material Design) My Story: The new revised home page is much cleaner, less clutter with an organized menu bar on the top. The typeface is an easier read for the user. The image and color scheme gives a sense personal and engaging feeling. It reflects the name "Grand Sound" properly and entices the user to engage by checking availability dates. Breadcrumbs is a way for users to find their way around and to always be aware of where they are. Notice the "About" is highlighted pink indicating the current page. Every page scrolls to provide additional info
Transcript: UX Presentation HARRY'S Consistency Learnability Interactive, Functional, and Visual Design that meets the consumers needs of making their final purchasing decisions. Perceivability / Visibility Added Designs Predictability Feedback
Transcript: UX Development Services User Experience Introduction The UX Professionals Dave Shaykewich | Team Lead, UX & Front End Web Andrew Jung ('drew) | Information Architect Faye Hoffman | Sr. Information Architect Maria-Elena Froese (Maleh) | Information Architect Selina McGinnis | Functional Analyst Overview The Developers Craig McNaughton | Programmer Analyst Olivia Prior | Programmer Analyst Ray Choo | Sr. Software Developer Who we are The UX/Dev team Why we do it Strategy What we do Services How we do it Methodology Our Leader UX Strategy Strategy building solutions with the client (business) and customer (user) in mind improving the quality, productivity and satisfaction of people's study and work lives validating solutions through real customer feedback iterating upon solutions to ensure the final solution will work well for the people who will use it UX Strategy - Opportunity Create a formal UX strategy principles service offerings methodology A Project Charter is being developed Distribute and evangelize the value and benefits of UX work: Increased customer satisfaction Increased productivity Improved recruitment and retention efforts Decreased training and support costs Reduced development time and costs Reduced maintenance costs UX Context Involving UX professionals Why we should What can happen if we don't Services UX Services Researching, defining and user testing the navigation, organization and user interaction of the system. To ensure our solutions are useable and useful for our clients and their users. Support the strategy & development of solutions; User Research Planning PLANNING Requirements Elicitation Business Process Mapping Understanding user behaviours, needs and motivations through observation techniques, task analysis and other feedback methodologies. Gathering and analyzing user and business needs for the solution is an integral part of information systems design, critical to the success of interactive solutions. Assisting your organization in becoming more effective, through clear and detailed business process map or diagrams identifying whether or not improvements can be made to the current process. What are our client's and user's motivations and needs? Talk to users Understand processes Elicit requirements Identify opportunities Scan the environment Understand motivations Information Architecture Design DESIGN Interaction Design Focuses on organizing, structuring and labeling content in an effective, consistent and sustainable way. The goal is to help users find information and complete tasks. Create engaging interfaces with well thought out behaviours. Understand how users and technology communicate with each other Anticipate how someone might interact with the system Fix problems early Invent new ways of doing new things Provide consistent ways of doing familiar things We create solutions which meet those needs. Identifying actions and context Breaking down complexity Modelling solutions Creating consistency Prototyping solutions Heuristic (Expert) Evaluation Evaluation EVALUATION Usability Testing Unlike interviews or focus groups which attempt to get users to accurately self-report their own behaviour or preferences; Detect problems with ease of use Measure actual performance on critical tasks A usability inspection method that helps to identify usability problems in the interface (UI) design. Experts examine the interface (low to high-fidelity prototypes) Judge compliance with recognized usability principles We determine if the solution meets expectations. Standards review Watching and listening Confirming supposition Artifacts & Analogies Business opportunities identification Business process discovery, maps & diagrams Card sorting CMS content model Competitive review Content inventory Content maps Heuristic evaluation Interaction design patterns & guidelines Journey and service mapping UX artifacts & analogies Online surveys & reports Paper & 3D prototyping Persona development Requirements analysis Site architecture map Usability & focus groups Use cases & context maps User analysis & reporting User flow diagrams Wireframes Elements of User Experience ~ Jessie James Garrett UX as the blueprints for clients and developers The UX Toolbox Collaboration opportunity Developers Subject matter experts Users Stakeholders Methodology Methodology What does a UX process look like? Plan Research Observe Understand Analyze Design User artifacts Business processes Wireframes Maps Develop Solution delivery Communicate Monitor Refine Deploy Usability testing User acceptance Quality assurance Approval Elicit requirements and domain details from users/customers and stakeholders Collect existing business and/or user research data Analyze and compare user needs with business goals to identify opportunities Develop, communicate and iterate upon a solution plan with stakeholders and development team Create information architecture artifacts: user experience and business process maps, use case Q&A Q
Transcript: To Start With... And then...about You! In this story you will enter personal information. You should talk about yourself, what you like, what is important to you. You should talk about your long term goals and what career you would like to work towards. You should also mention something about your family and the activities you like. You should use your "About Me" worksheet to reflect on these questions. In this story you will explain your Curriculum Map and GPA graph. You should incorporate the following information about the Curriculum Map and GPA Graph: This is my Heatherwood Middle School Curriculum Map and GPA. These are all the classes I have taken so far at Heatherwood Middle School. The top left graph shows the credits I have earned by passing all my classes. The next graph shows my cumulative grade point average. This is important for me to understand now because next year in high school I will have to make sure all my classes are mapped out and that I am passing classes so I can earn enough credits to graduate in four years. The next story you will share will be about your Long term goals. The following statements are some ideas that you might want to incorporate: I understand that when I get to high school next year I will have to make sure I have good study habits. I understand that I will have a four year plan to graduate which I must stay on track with I understand that I will be responsible to complete a scholarly paper my junior year I understand that I will have to complete a Senior Project my last year. Therefore, as I begin my eighth grade year I am really going to focus on the following goals From here you will want to elaborate on your school goals for this year. You will need to work through your SMART goal worksheet located on at the back of the ABOUT ME worksheet. These will be personal goals that you believe you need to work on as an eighth grade student to have a successful school year. This will then take you to each one of your classes and the trimester goals your teacher has set. You will need to make sure that you have completed the Goal Sheet Recording form. Make sure that your teacher has sign off on this so you know that you have the written down the correct goal. 1st Period Using your Goal Recording form you should be able to incorporate the following questions into your story about this class: This is what I like about this class This is my goal for this class This is what I need to work on Here is some evidence of my work 2nd Period 3rd Period 4th Period 5th Period 6th Period 7th Period SUCCESS! In this story you want to write about what it will take for you to have a successful school year. You will need to reflect on you strengths and some of your shortcomings. You will need to be very open about this particular story in your presentation. You want to share what you do well and how you want to be recognized for this. You also need to talk about what you need to work on this year. This will be difficult to be honest about what you need to work on. However, this is a very significant concept in goals setting. The ability to recognize one's weaknesses and share how you are going to overcome them is a very mature response. Study Plans This next story will be about your action plan for the school year. After you have shared your goals you now want to put together a plan which will help you to succeed. One of the tools that you can utilize with this program is the Study Plan Graph. Here is what you will need to share with regards to the Study Plan Graph: This is the study plan that I have completed to help me stay on track. There are four parts to it: 1. How I will study 2. The resources I need 3. My weekly class routine 4. A schedule of when my projects and tests are due I will keep this updated and posted so you can help me by checking this. High School This story should be about your thoughts regarding high school. Next school year you will be entering high school as a ninth grade freshman. How do you feel about this? What are some things that excite you about the reality of being in high school? What are the parts of high school that you are really looking forward too? There also has to be some apprehensions! Reflect on your concerns and what you might be worried about. In this story you need to write about how you need to take this school year to help yourself be prepared for the transition. Help!!! Your education at Heatherwood Middle School should be seen as a "partnership" between you, your family and your teachers. Understanding this concept then should allow you to ask for help and support. In this story reflect on what you need to be successful. How can your family support you this school year? How can your teachers help you? And perhaps most of all, how can you help yourself to be the best that you can be? In Conclusion So know you have come to the end of your presentation. Here you must summarize all that you have said. Enjoy the moment. This presentation is about
Transcript: UX Portfolio Oskar Gahler BIPA E-Commerce The BIPA Online Shop This project was the main focus of the Talent Garden UX Design Bootcamp. Our team consisted of 5 people and the project duration was 6 weeks. Research Design Follow this link to Figma Clickable Prototype Welt Museum Wien Guide
Description: For grant requests, program proposals, or any other nonprofit or education presentation, this globe-themed creative Prezi template is the way to generate interest and momentum. Like all Prezi education templates and Prezi nonprofit templates, it’s easy to customize.
Description: Impactful presentations need stunning visuals and a meaningful metaphor to show high-level concepts and the smaller details. This customizable presentation template uses a classic world map visual to help you navigate complex information while staying grounded in your presentation’s core message.
Description: If you work in education, make your next report visually interesting and easy to navigate. The line-drawn illustrations in this edu report presentation template encourage curiosity and discovery.
Now you can make any subject more engaging and memorable