UX Design 101 Presentation
As our Global Digital team continues to grow, so do our capabilities and knowledge into different realms of digital marketing and production.
To help expand our understanding of user experience and digital design, Associate Director of User Experience, Laura Chang, and Digital Designer, Sarah Peng, gave an introductory presentation on designing digital content.
This is a critical topic for anyone involved in content creation or promotion. If you missed the presentation, we encourage you to watch the recording. You can access the recording and the slide deck in the links to the right. You can also refresh on the main ideas by scrolling through the presentation recap on this page.
The UX and Design team
The UX and Design team sits on the Global Digital team and is a fairly new discipline to TNC. The team and consists of Laura Chang, Assoc. Director of User Experience and Sarah Peng, Digital Designer. They both have deep and broad expertise in digital design and are eager to help all TNC creators build the best content possible.
By working closely with the Systems, Analytics, and Content teams, Laura and Sarah make sure whatever we design adds value to our audiences and meets their needs on nature.org, or any other digital platforms.
What is UX?
First things first — what do we mean when we talk about User Experience or UX?
Quote
A good user experience has to provide value and fulfill a need that the audience has, as well as being easy to interact with.
The heart of UX is that it is evidence-based. There are lot of different type of design, but the special sauce of UX is that it is based on what people say, think and do. We make decisions based on real user behavior. This helps us make sure that what we create is aligned with how people think about and interact with the world.
Why does UX matter?
A lack of good, thoughtful design can cause serious, real-life consequences. And some humorous consequences as well.
If you aren't familiar with the image bellow, Steve Harvey announced the wrong winner at the 2015 Miss Universe pagent. He announced the first runner up (second place) as the winner.
Perhaps he should have been more careful - or perhaps they could have employed a designer to help with the results envelopes.
Take a look at the results card that was handed to Steve.
How could this card be redesigned to reduce the chance of errors occuring?
What is wrong with this card? What could be improved?
The alignment of information is all over the place, while the most important information is positioned on the bottom corner of the card.
It isn’t clear at first glance who the winner is because the word “Winner” isn’t written on the card.
Had this card been better designed, Steve Harvey would have saved himself and the contestants from the very uncomfortable mishap.
Another example of why UX matters is in understanding how to empathize with your users. Take a look at the MRI machine below.
A lot of pediatric patients were intimidated and scared by the appearance of the machine.
Industrial designer Doug Dietz at General Electric Healthcare wanted to transform how children experience the scanner. The challenge he posed was, “How could one create a scanner experience that children would love?”
What came about was a visual transformation from a medical operating room to a playroom of adventure. They were designed to be kid-friendly and imaginative sparking excitement and happiness from the kids. His scanners became part of an adventure setting and the machine might be a pirate ship, an underwater castle, or a sleeping bag under the stars.
Thoughtful design turned an intimidating procedure into a fun adventure that made the result - getting an accurate scan of the child - much easier for everyone involved. In fact, these scanners helped children get through the scanner more quickly with fewer issues, and so ultimately more children could be served with the scanners.
This design was successful because the designer had empathy for the patients and started his redesign with an understanding of the emotional experience of the patients.
In the next example we look at workplace systems. Take the examples of Deltek time reporting and the emergency alert system in Hawaii.
We encounter user experiences every day that impact our emotions and decisions. If the Deltek timesheet interface was designed to be more simple and intuitive, would we not dread it so much, putting off doing them until the last minute? Or, if the interface for Hawaii Emergency Management Agency shift-change drill selection was designed to be clearer, would the employee have not hit the wrong selection saving the whole nation from getting an emergency alert notification of a missile threat?
Design issues can have minor annoyance as a consequence, such as with Deltek, or it can be near-catastrophic, as with the emergency alert system in Hawaii.
The screenshot here from the Hawaii alert system shows that triggering an all-out alarm - rather than a drill - was as easy as clicking the wrong link. This is poor design. The page is not intuitive and it is not easy to make the correct decision.
(For more details on the event and the alert system design, check out this article.)
Why should companies care? One reason is that it can drive profitability. If people are engaged and able to effectively use your product, it can increase conversion rate, engagement and customer satisfaction.
In addition, in the product design and development cycle, it can help reduce cost. One option is to go off into a corner, design something, and launch it off into the marketplace, hoping it works. Another option is to incorporate user feedback along the way, which can help de-risk the possibility of launching something that just doesn’t work.
Marketing and UX go hand and hand. Marketing is about getting peoples’ attention, convincing people that they should walk toward you. User experience is about clearing the path for them as they walk toward you.
Think about all of the experiences we support at TNC, both digital and non-digital. We have members, principal gift donors, influencers, all with different needs.
The UX process is broken up into four phases: Discover (insight into the problem), Define (defining what you are solving for), Ideate (solving for the problem), and Deliver (deploying, testing and iterating your solutions).
Each one helps you frame your design decisions based on real user behavior and needs.
The Double Diamond represents the flare and focus mindset. Where the Diamonds get wide (diverge) is where you have a lot of problems, ideas and solutions on the table. Where the diamonds come to a point (converge) is where these concepts are narrowed and focused into something workable.
Let’s say you’re redesigning the About Us page (something the Global Digital team pursued!).
This is a typical picture of how we would brainstorm ideas: a bunch of business colleagues getting into a room exchanging ideas on what ‘they’ want.
If that’s how we work, then we only ideate for our business needs rather than the needs of the consumer. To ensure we’re serving for our audience, we need to shift our focus from being company-center to human-centered.
Quote
To ensure we’re serving for our audience, we need to shift our focus from being company-center to human-centered.
The first thing to ask yourself before starting your brainstorm session is “Who are you designing for?” Donors? Prospect members? Media? Influencers?
In the Discover phase, you want to get as much feedback from your audience as possible. You want to understand the pain points and everyway that the current design may not be working for your audience. You can get a better understanding of your audience and their needs from direct interviews, workshops, observation (including tools such as mouseflow), personas, user journeys, and analytics.
When Global Digital redesigned the About Us page on nature.org, we conducted interviews to determine what people were looking for on the page and whether or not they found that information. After getting a lot of feedback, we had to define the problem. What we determined was that the mission of TNC came across clearly on the About Us page, but people did not come away with a good understanding of how we were working to achieve the mission.
Now that we had defined our problem, it was time to again go wide and explore all possible problem solutions. We brainstormed content and design, sketched out concepts and created storyboards, built wireframes, and prototyped potential new pages to replace the current About Us page.
Our idea was to make the About Us page exist as an ecosystem that present paths for users to explore other nature.org pages to learn more about the organization.
With a couple solid ideas fleshed out, it was time to test the ideas with our audience.
