HCI - 5-6 -Design Process Interaksi Manusi Komputer.pptx

ssuser58c832 153 views 65 slides Oct 09, 2024
Slide 1
Slide 1 of 65
Slide 1
1
Slide 2
2
Slide 3
3
Slide 4
4
Slide 5
5
Slide 6
6
Slide 7
7
Slide 8
8
Slide 9
9
Slide 10
10
Slide 11
11
Slide 12
12
Slide 13
13
Slide 14
14
Slide 15
15
Slide 16
16
Slide 17
17
Slide 18
18
Slide 19
19
Slide 20
20
Slide 21
21
Slide 22
22
Slide 23
23
Slide 24
24
Slide 25
25
Slide 26
26
Slide 27
27
Slide 28
28
Slide 29
29
Slide 30
30
Slide 31
31
Slide 32
32
Slide 33
33
Slide 34
34
Slide 35
35
Slide 36
36
Slide 37
37
Slide 38
38
Slide 39
39
Slide 40
40
Slide 41
41
Slide 42
42
Slide 43
43
Slide 44
44
Slide 45
45
Slide 46
46
Slide 47
47
Slide 48
48
Slide 49
49
Slide 50
50
Slide 51
51
Slide 52
52
Slide 53
53
Slide 54
54
Slide 55
55
Slide 56
56
Slide 57
57
Slide 58
58
Slide 59
59
Slide 60
60
Slide 61
61
Slide 62
62
Slide 63
63
Slide 64
64
Slide 65
65

About This Presentation

Desain Process Interaksi Manusi Komputer


Slide Content

User Centered Design Process

References Brown, Tim. Change By Design https://www.interaction-design.org Sharp, H., Rogers, Y., Preece, H., Interaction Design 5th edition https://medium.com/ux-burner/design-thinking-vs-lean-startup-vs-lean-ux-vs-design-sprint-vs-ux-burner-89da64fb3d31 https://www.usability.gov/what-and-why/user-centered-design.html https://designthinking.ideo.com https://www.ideou.com/pages/design-thinking Jeff Gothelf. Lean UX Jake Knapp. Sprint: How to Solve Big Problems and Test New Ideas in Just Five Days

Understand Context of Use Identify the people who will use the product, what they will use it for under what conditions they will use it

Specify User Requirement Identify any business requirements or user goals that must be met for the product to be successful.

Design Solution This part of the process may be done in stages, building from a rough concept to a complete design

Evaluate Against Requirement   Evaluation - ideally through usability testing with actual users - is as integral as quality testing is to good software development.

Design Thinking

“ Design thinking is a human-centered approach to innovation that draws from the designer’s toolkit to integrate the needs of people, the possibilities of technology, and the requirements for business success.” — Tim Brown, president and CEO, IDEO

A cognitive scientist and Nobel Prize laureate Herbert A. Simon first mentioned design thinking in his 1969 book,  The Sciences of the Artificial , and then contributed many ideas to its principles. Design Thinking started with a notion of creating value for humans by keeping them at the centre of your products and services It can be used for designing products, services, spaces, systems and experiences tailored to meet the human needs in a best possible way

Sources: Interaction- design.org

Spaces of Innovation Thinking like a designer can transform the way organizations develop products, services, processes, and strategy. This approach, which is known as design thinking, brings together what is desirable from a human point of view with what is technologically feasible and economically viable In order to gain an innovation, these spaces (constraints) should be integrated and balancing: Feasibility: what is functionally possible within the foreseeable future Viability: what is likely to become part of a sustainable business model Desirability: what makes sense to people and for people

The Creative Process: Diverge & Converge Thinking The convergent phase of problem solving is what drives us toward solutions The objective of divergent thinking is to multiply options to create choices.” “To have a good idea, you must first have lots of ideas” (Linus Pauling) But we also need to be realistic. More choices means more complexity, which can make life difficult

Empathy Maps Empathy mapping can help you take what you learn from observing human behavior and come away with actionable insights. Place observations about what people DO in the lower-left quadrant. (Use one post-it per idea.)  Add observations of what people SAY in the upper-left quadrant.  When you run out of observations on the left side, fill in the right side by inferring what people THINK and what they FEEL. Try to draw some insights or conclusions from what you have written down and shared.

Source: Interaction- design.org Empathize  Research Your User’s Need Define  State your user’s need and problems in human centric ways Ideate  Challenge assumption and create ideas Prototype  Start to create solutions in prototyping Test  Try your solutions out

Design Thinking Framework: The 5-Stage Design Thinking Process— d.school

Design Thinking Framework: The Early Traditional Design Process—Herbert Simon

Design Thinking Framework: Head, Heart and Hand—AIGA

Design Thinking Framework: The 3-Stage Design Thinking Process—IDEO Inspiration — Connecting with people to understand their needs Ideation — Creative thinking and diverging to generate ideas Experimentation — Prototyping, making tangible, and iterating

Design Thinking Framework: DeepDive ™ Methodology—IDEO Frame a Question —Identify a driving question that inspires others to search for creative solutions. Gather Inspiration —Inspire new thinking by discovering what people really need. Generate Ideas —Push past obvious solutions to get to breakthrough ideas. Make Ideas Tangible —Build rough prototypes to learn how to make ideas better. Test to Learn —Refine ideas by gathering feedback and experimenting forward. Share the Story —Craft a human story to inspire others toward action.

Empathise To gain an empathic understanding of the problem you are trying to solve It involves: Consulting expert  find out more about the observed are Engaging and empathizing with people  understand their experiences and motivations Immersing yourself in the physical environment  gain a deeper personal understanding of the issues involved

Define (The Problem) put together the information you have created and gathered during the Empathise stage. seek to define the problem as a problem statement in a human-centred manner. X “We need to increase our food-product market share among young teenage girls by 5%,” V “Teenage girls need to eat nutritious food in order to thrive, be healthy and grow.” This stage will help the designers in your team gather great ideas to establish features, functions, and any other elements that will allow them to solve the problems or, at the very least, allow users to resolve issues themselves with the minimum of difficulty. 

Ideate By having previous stages’ result  start to "think outside the box" and create alternatives Ideation Technique: Brainstorm, Brainwrite , Worst Possible Idea, and SCAMPER( Subtitude , Combine, Adapt, Max/Min, Put to other use, Eliminate/Elaborate, Reverse/Re-arrange), etc Beginning of this stage: Important to get as many ideas or problem solutions as possible End of this stage: pick some other Ideation techniques  to help you investigate and test your ideas  find the best way to either solve a problem or provide the elements required to circumvent it.

Prototype The design team will now produce a number of inexpensive, scaled down versions of the product or specific features found within the product  to investigate the problem solutions generated in the previous stage By the end of this stage, the design team will have a better idea of the constraints inherent to the product the problems that are present have a clearer view of how real users would behave, think, and feel when interacting with the end product

Testing prototypes to choose among alternatives

Prototypes for the Microsoft mouse From Moggridge , Designing Interactions, Ch2

Test test the complete product using the best solutions identified during the prototyping phase Though Test is the final stage but in an iterative process, the results generated during the testing phase are often used to  redefine  one or more problems and inform the  understanding  of the users, the conditions of use, how people think, behave, and feel, and to empathise

LEAN UX

Background Created by Jeff Gothelf New Reality: T he Internet has changed the distribution of software in radical ways No longer limited by a physical manufacturing process and are free to work in much shorter release cycles Facing intense pressure from competitors who are using techniques which able to radically reduce their cycle times.  traditional “get it all figured out first” approaches are not workable

Lean UX (UX = user experience) is the evolution of product design. Lean UX is the practice of bringing the true nature of a product to light faster, in a collaborative, cross-functional way that reduces the emphasis on thorough documentation while increasing the focus on building a shared understanding of the actual product experience being designed.

Foundation

Principles Cross Functional Team Small, Dedicated, Colocated Progress = outcome, no output Problem Focused Teams Removing Waste Small Batch Size Continuous Discovery GOOB: the new user-centricity Shared Understanding Anti-Pattern: Rockstars , gurus, and ninjas Externalizing Your Work Making over Analysis Learning over growth Permission to Fail Getting out of the Deliverables Business

Assumption

Declaring Assumptions Declaring your assumptions allows your team to create a common starting point. Declaring assumptions is a group exercise  gather the team, making sure that all disciplines are represented, including any subject matter experts that could have vital knowledge about the project. Need to prepare: Analytics reports that show how the current product is being used Usability reports that illustrate why customers are taking certain actions in your product Information about past attempts to fix this issue and their successes and failures Analysis from the business stakeholder as to how solving this problem will affect the company’s performance Competitive analyses that show how competitors are tackling the same issues

Problem Statement Elements of Problem Statement: The current goals of the product or system The problem the business stakeholder wants addressed (i.e., where the goals aren’t being met) An explicit request for improvement that doesn’t dictate a specific solution Problem statements are filled with assumptions

Prioritizing Assumption

Hypotheses Testing your assumptions by transforming each assumption statement into a format that is easier to test: a hypothesis statement. Format: We believe [this statement is true] . We will know we’re [right/wrong] when we see the following feed- back from the market: Subhypotheses : Breaking the Hypothesis Down into Smaller Parts Completing the Hypothesis Statement

Completing the Hypothesis Statement Outcome Generate the outcomes and be very specific regarding those outcomes Proto-persona brainstorm Start with assumption, do research later Try to differentiate the personas around needs and roles rather than by demographic. Features

The Minimum Viable Product (MVP) It is a core concept in Lean UX. The idea is to build the most basic version of the concept as possible, test it and if there are no valuable results to abandon it.

MVPs & Experiments Defined the Minimum Viable Product as the smallest thing you can make to learn whether your hypothesis is valid Create the prototype for the MVP Question to choose the right tool: Who will be interacting with it What you hope to learn How much time you have to create it Non-prototype MVPs, when prototyping isn’t necessary and can even be harmful, e.g. determine the value of a new feature or product Mantra: you can always go leaner Techniques: email, Google Ad Words, Landing Page, The button to nowhere,etc

Feedback and Research Continuous and Collaborative It’s time to put the MVP to the test (validation process) since all of the work up to this point has been based on assumptions Lean UX research is continuous : the team should build research activities into every sprint Lean UX research uses collaborative discovery : an approach to research that gets the entire team out of the building—literally and figuratively—to meet with and learn from customers  importantly, multiplies the number of inputs the team can use to gather customer insight.

Lean UX + Agile Kickoff session : to get the entire team sketching and ideating together, creating a backlog of ideas to test and learn from. Iteration Planning Meeting : write user stories together, then evaluate and prioritize the stories. User Validation Schedule : to ensure a constant stream of customer voices to validate against, plan user sessions every single week. Use the artifacts created in the ideation sessions as the base material for the user tests. User story : The smallest unit of work expressed as a benefit to the end user. Syntax: As a [user type] I want to [accomplish something] So that [some benefit happens] Sprint : A single team cycle. The goal of each sprint is to deliver working soft- ware

3 – 12 – 1 Activity Calendar

Design Sprint “The sprint   is a five-day process for answering critical business questions through design, prototyping, and testing ideas with customers” -Jake Knapp, Author of SPRINT and one of the inventors of the Design Sprint

*Set the stage before starting the sprint

1 ST Day Starting at the end  set a long-term goal List sprint questions  by using this prompts “ What questions do we want to answer in this sprint? To meet our long-term goal, what has to be true? imagine we travel into the future and our project failed. What might have caused that?”

Map Make a map: List the actors (on the left) Write the ending (on the right) Words and arrows in between Keep it simple Ask for help e.g. long-term goal and sprint questions (Flatiron Health) e.g. map (Flatiron Health)

Ask the expert It’s a series of one-at-a-time interviews with people from the sprint team, from around the company, and possibly even an outsider or two with special knowledge about one of these topics: Strategy Voice of the customer How things work Previous effort Update long-term goal, questions, and map as you go Take how the team might notes Organize the notes Vote on how we might make notes  taking prioritize

Pick The Target The Decider needs to choose one target customer and one target event on the map Whatever the decider chooses will become the focus of the rest of the sprint

2 nd Day: Remix & Improve, Sketch Lightning Demos. Look at great solutions from a range of companies, including yours Make a list of products or services to review for inspiring solutions Demo the product - Capture the big idea

Sketch it’s about solutions, not the artistry of the drawings it’s the fastest and easiest way to transform abstract ideas into concrete solutions Work alone together: each person sketches alone so he or she will have time for deep thought, the whole team works in parallel, so they’ll generate competing idea without the groupthink of a group brainstorm

The 4-steps Sketch Important: Self Explanatory Anonymous Ugly is okay Words Matter A catchy title

3 rd Day: Input: a stack of solutions Decide  stick decision, if >=2 solutions, options: Rumble All in One Storyboard

The Sticky Decision Art museum: Put the solution sketches on the wall with masking tape. Heat map: Look at all the solutions in silence and use dot stickers to mark interesting parts. Speed critique: Quickly discuss the highlights of each solution, and use sticky notes to capture big ideas. Straw poll: Each person chooses one solution, and votes for it with a dot sticker. Supervote: The Decider makes the final decision

Storyboard take the winning sketches and string them together into a storyboard Draw a grid Choose an opening scene How do customers find out your company exists? Where are they and what are they doing just before they use your product? Fill out the storyboard Thumb of rules: Work with what you have Don’t write together Include just enough details The decider decides When in doubt, take risks Keep the story fifteen minutes or less

4 th Day Adopt a “Fake it” philosophy Realistic Prototype

Prototype Mindset You Can Prototype Anything Prototypes Are Disposable Build Just Enough to Learn, but Not More The Prototype Must Appear Real

Steps pick the right tools Divide and conquer Stitch it together Trial run

5 th Day Interview customer Learn by watching them react to the prototype
Tags