What is Human-Centered Web Design?

Human-centered design is a concept that gained traction in the 1990s as an approach  to developing innovative solutions based on a laser-sharp focus on human needs and human perspectives during every phase of a design or problem-solving process. Building upon the principles of human-centered design, Promet Source has served as a pioneer and leading practitioner human-centered web design. 

At the core of our approach to human-centered web design is a deep level of inquiry that questions all assumptions and engages key stakeholders in various exercises that call for letting go of individual preferences and moving toward an empathetic focus on optimizing the experience for the user. The results reveal new possibilities on multiple levels.

With an overarching emphasis on empathy, we look to open new opportunities by understanding the needs and expectations of the people who actually use the website. Sometimes this sparks a mind-shift, that reorients the site architecture away from an organization’s internal structure, and focused instead on user journeys.
Too often, websites are architected from the perspective of insiders—organized by department, without stepping back to ask: 

• Who visits the site? 
• What kinds of information are they seeking? 
• How can we align the navigation of the site around what makes sense to users? 

The best web experiences leverage empathy, and begin with human-centered design processes that dig deep and question any all assumptions about how users’ interactions with the website can it be designed to ensure that they and easily find the information they need and that their experience of visiting the site is both engaging and value added. 

At Promet Source, we approach human-centered web design as a seven-step process.

 

1. Build empathy with user personas

The first and most essential question: For whom are we building or redesigning this site? Following the identification of the key persona groups, we proceed to dig deep, asking “why” and “how” concerning every aspect of their motivations and expectations.
 

2. Assess what user personas need from the website

Understanding of and empathy for user personas dovetails into an analysis of how they currently use the site, how that experience can be improved, and how enhancing their experience with the site can drive a deeper relationship. 

This level of inquiry at the front end might feel excessive or out of sync with what many are accustomed to, but as Tom Gilb noted in Principles of Software Engineering Management, getting it right at the outset pays off tenfold over the cost of fixing after the site is released.

Ensuring that projects get off to an excellent start is at the core of what human-centered design is all about.

 

3. Map their journeys through the site to key conversions

Just as user groups do not all fit the same mold, what they are looking for from your site will vary, depending on what phase they are in relative to their relationship with your organization—what we refer to as the user journey. 

Too often, website design focuses on one aspect of the user journey. It needs to be viewed holistically, taking the perspectives of all user groups into account.

 

4. Identify obstacles in their path.

Next step: identify challenges. We map user journeys through every phase, aiming for seamless transitions from one phase to the next.
This step calls for continuous inquiry along with a commitment to not defend or hold on to assumptions or previous approaches that may no longer be optimal, while pursuing answers to questions such as:

• What have we heard from clients? 
• Where have breakdowns occurred in conversions and in relationships?
• How can we fix it with the messaging, design, or the functionality of the website?  
   

5. Brainstorm objectives

Our facilitated workshop setting is structured to build upon a productive flow of ideas via several exercises that draw upon stakeholder perspectives and expertise from multiple angles.

 

6. Prioritize solutions

While there are “no bad ideas in brainstorming,” in the real world of budgets and time, questions such as “how,” “what’s the cost,” “where to begin,” and “what will have the best impact,” need to be considered. 

As ideas are synthesized, these answers will begin to take shape.  

 

7. Create a roadmap for development

Too often, web design and development begins at this step. 

With human-centered web design, a depth and breadth of research, persona development, empathetic insights, journey mapping, solution gathering, collaborative energy, and excitement about what’s to come have already been invested when we get to this point. 

As a result, clients have the advantage of moving forward with a high degree of alignment among stakeholders, along with a conviction of ownership in an outcome that will enhance both the experiences and relationships with the humans who visit the site. 

 

Human-Centered Design Activities

The above steps help to define the “What” of human-centered web design. The “How” of human-centered web unfolds during facilitated workshops. Here are some of the activities that we leverage in the process of bringing human-centered web design to life.

 

Persona Development

Identifying individual personas helps to define the range of differing user needs and expectations, for purposes of tailoring solutions accordingly. 

Giving every identified persona a name helps to humanize the exercise and reinforces empathy for the actual users of the site. It also serves as a ready reference point or shorthand for further conversation for questions such as: 

• What else is Joshua going to expect from this page?
• Will this navigation make sense to Alexis?

 

Rose-Thorn-Bud

This exercise is designed to quickly gather a significant amount of data in response to specific and essential questions. Adopted from a Luma Institute collection of exercises, participants are given brightly colored Post-It® notes and asked to write everything that they view as an advantage or a plus on a pink (Rose) Post-It. Challenges or downsides are to be written on a blue Post-It (Thorn). Green

Post-Its are for collecting input on potential or emerging for opportunities (Bud). 
Every participant’s opinion ranks equally as responses are gathered and grouped on a white board according to identified categories.

 

Affinity Clustering

During this next step, the “Rose-Thorn-Bud” input is organized according to agreed-upon groupings, to reveal patterns, surface priorities, bring order to complexity, and spark productive conversation.

The use of different colored Post-Its is particularly useful in revealing that within a particular category there might be a mix of challenges, opportunities, or advantages. Participants might also have differing opinions as how to characterize a particular attribute.

For example, some stakeholders might view the current site architecture as a Plus (Rose), others might view it in terms of the inherent opportunity or potential (Bud), while others might be largely focused on the challenges of the and ways that the site’s architecture falls short (Thorn).  

In all cases, this exercise sparks engaging conversations and reveals new opportunities for achieving consensus.

 

Stakeholder Mapping

Stakeholder mapping results in what is essentially a network diagram of people involved with or impacted by the website. Typically, there are considerably more stakeholders than originally thought, and stakeholder mapping evaluates all the possible users of a system to then identify and prioritize needs and expectations.

 

Abstraction Laddering

During this exercise, we guide teams through the process of deconstructing a goal as dig deeper into questions concerning “How” and “Why” for purposes of advancing toward greater clarity and specificity. 

Let’s take the example of the statement: “We need to get more visitors to sign up for a demo?” which on its own does not offer much context to develop an action plan. 

During a human-centered design workshop, we’ll move up the ladder going at least three deep to record answers to “Why” and down at least three deep recording answers to “How.”

 

Importance / Difficulty Matrix

Inevitably, some of the ideas that emerge will spark excitement for the strategic leap forward that they could represent. The required time and resources to move forward with them, however, might exceed current capabilities. Other ideas might fall into the category of Low Hanging Fruit—initiatives that can be achieved quickly and easily.

Plotting every idea on an Importance / Difficulty Matrix is an essential group activity that sparks conversation and accountability concerning Who, How, and When—transforming good ideas into action items.

In the current environment, organizations tend to be defined by their digital presence. The stakes for getting it right are high and the margin for error is low. Optimizing ideas and perspectives at the outset, and continuing to iterate with feedback creates a strong starting point that serves as a superior foundation for web solutions that are capable of heavy lifting over the long haul. 

Interested in learning more about the possibilities for a human-centered design workshop in your organization? Contact us today.