Process – UX Mastery https://uxmastery.com The online learning community for human-centred designers Fri, 17 Dec 2021 16:59:11 +0000 en-AU hourly 1 https://wordpress.org/?v=6.2.2 https://uxmastery.com/wp-content/uploads/2019/12/cropped-uxmastery_logotype_135deg-100x100.png Process – UX Mastery https://uxmastery.com 32 32 170411715 Wireframes Are Bad… Don’t Use Them https://uxmastery.com/wireframes-are-bad-dont-use-them/ https://uxmastery.com/wireframes-are-bad-dont-use-them/#respond Thu, 02 Dec 2021 02:00:00 +0000 https://uxmastery.com/?p=109839 I failed in using wireframes; that’s why I say that they are bad. I know so many beginners and intermediate UX designers use wireframes in the early phases of the design process, especially in research and usability testing. I used to use them this way, but let me tell you why I don’t use them […]

The post Wireframes Are Bad… Don’t Use Them appeared first on UX Mastery.

]]>
I failed in using wireframes; that’s why I say that they are bad. I know so many beginners and intermediate UX designers use wireframes in the early phases of the design process, especially in research and usability testing. I used to use them this way, but let me tell you why I don’t use them in that way anymore.

What Is a Wireframe?

Before digging deep into this subject, let me try to simplify what a wireframe is. A wireframe is a skeleton for the digital product design. You can imagine it to be the blueprint for any product. It consists of lines and shapes, and each represents some element/hierarchy/structure.

The main three elements of a wireframe are:

1. The Line

This element could represent a frame, a border, or a separator.

2. The Image

This element could represent either an image, or an icon, or any graphics.

3. The Solid

This element represents either a block or a line of text.

Using all these elements in a design can produce something like this:

Now remove these hints from the design and give them to a user asking them to use it. Can you imagine that?

Why Are Wireframes Bad?

I remember one time I was working on a mobile app product for weekly/monthly healthy food ordering subscriptions. The app allowed a user to subscribe and get healthy meals delivered daily. It allowed the user to choose the daily meals and the delivery time. And it also provided health tips and some workout exercises to keep living a healthy life. Here’s a concept that we tried testing out.

Wireframe to evaluate options for placement of icons. Option 1 was at the top left, and option 2 was at the bottom center.

When I tested this concept as a wireframe with the first group of users, I asked each one this question “Suppose your daily meals will be delivered daily at 2 PM and you want to change this time to be at 3 PM, how can you do this?”

I was shocked by the result. 4 out of 5 users tapped on icon no.2, which was supposed to be for the health tips, while just one user tapped on icon no. 1, which was for the menu and settings. This meant that 80% of users expected to change delivery times using the middle button at the bottom. However, I didn’t rely on that result.

To make this clear enough, I created a simple test and iterated the same scenario after applying the UI and providing a finished prototype to another group of users. This time, 5 out of 5 users didn’t like the changing delivery time feature to be placed in position no. 2. The common reason was that they wouldn’t need to perform that daily, and instead, they might need the health tips to be placed at this position since they might need to use this feature more than once a day.


Wireframes come in two forms, digital and paper sketches. The main reason why wireframes were invented was that they were cheap and fast to create, but this doesn’t come free. There’s a hidden cost to that.

1. Cost of Educating

Although wireframes are fast to create and they seem to be a time-saver, they take up too much time in educating, especially in user testing. The time you save in producing them, you pay the double in educating users about them.

2. Misunderstood

What’s the difference between these two elements? Are they both images? Are they both icons? Are they clickable? What should they represent? Too many questions to process in the user’s head may lead to either making wrong decisions or driving them away from the central value.

3. Miss the Whole Experience

Making the user assume that a specific element may serve a particular purpose will not lead to correct research results. When you test with many users, the findings will not be accurate because each one will interpret the shapes in their own way, which will lead you to correct their understanding and guide them back to the right path, which is wrong in research and testing. You should not lead the user.

Feeling and living the whole experience is way better. Making the user live within a semi-real product, feel the interactions, sense the animations, and deal with colors and typography will lead to better and more accurate results.

So, Are Wireframes Useless?

Wireframes are plain, too neutral to be usable by actual users, but this doesn’t mean they are useless. Here is how and when to use wireframes:

1. Guiding You in Your Process.

Design wireframes for yourself to make it easy for you to structure the product you are designing. By creating wireframes, you pour all the imaginations in your head on a canvas or paper faster, organize your thoughts, clearly see where you are heading, and most importantly, iterate more quickly. Know where to place the right elements in the right place, either here or there.

2. Brainstorming and Generating Ideas With Your Peers.

Product owners, UI designers, UX designers, product managers, and developers—all of them can understand wireframes well; they may even add to it, generate ideas, and make a clear direction for the best structure.

3. Flow Design

Because wireframes are plain, you can use them as flow demonstrations with techies and developers. In this way, it will work better than the traditional user flow’s symbols and shapes.

4. Business Owners (Carefully)

Business owners are like users: they can easily misunderstand the wireframe and are time-consuming to educate. But the difference here is that the business owner is just one person, the time cost won’t be as much as educating many users, and in the end, they’re the business owner—you have to keep them involved and in the loop throughout the design process.

Conclusion

Actual users are ordinary human beings. They are not as deep into the technology or the product as you. You must do your best to talk to them in their language, not yours, so it’s better to do your research and usability testing using realistic prototypes instead of wireframes.

Lastly, creating and using wireframes is beneficial if created for people like you within your production environment.

The post Wireframes Are Bad… Don’t Use Them appeared first on UX Mastery.

]]>
https://uxmastery.com/wireframes-are-bad-dont-use-them/feed/ 0 109839
How to Make Developers Love You as a Designer https://uxmastery.com/how-to-make-developers-love-you-as-a-designer/ https://uxmastery.com/how-to-make-developers-love-you-as-a-designer/#respond Thu, 30 Sep 2021 03:00:00 +0000 https://uxmastery.com/?p=109792 Handing off designs can be pretty stressful for designers since a small mistake in this process can result in hours of reworking for developers. This is true for companies and products of all kinds and sizes. A seamless handoff will significantly minimize guesswork and ensure a frictionless development process. However, handoffs are full of potential […]

The post How to Make Developers Love You as a Designer appeared first on UX Mastery.

]]>
Handing off designs can be pretty stressful for designers since a small mistake in this process can result in hours of reworking for developers. This is true for companies and products of all kinds and sizes. A seamless handoff will significantly minimize guesswork and ensure a frictionless development process.

However, handoffs are full of potential pitfalls that even the most experienced teams are prone to. In today’s article, we’ll take a closer look at the most important things to take care of when handing your design off. 

Let’s dive right in, shall we?

What Is a Design Handoff?

The design handoff is a point in the product development process where developers implement the finished design. In order for a handoff to be successful, a good designer-developer collaboration is vital.

But more often than not, this phase doesn’t go as smoothly as it should. Part of the problem is the designer’s perception of the process—many of us tend to think that this is where we reach the finish line, rest on our laurels, and let the developers “do their thing.”This perspective is conducive to a siloed and inefficient collaboration between the two tribes. So, let’s take a look at the things we should do to ensure a more productive designer-developer interaction.

Use a Library

Establishing a sense of continuity in your designs is imperative for a successful handoff. Fragmented design hand-off files and components here in there are a recipe for major headaches and confusion. 

As opposed to sharing individual assets directly with the developers or attaching files to the user stories/tickets/Jira or similar products, have them in a shared library or folder and use the links inside tickets. This will make finding assets significantly easier for developers.

Screenshot of a pattern library
© Adam Fard, Source

An asset library, which is a part of the design system, should be the single source of reference. In Figma, for example, you can copy a link to a specific asset within the library. This is the link you should share in tickets. Not to mention there’s a plethora of plugins or native integrations among Figma, Sketch, and Adobe Products with project management tools like Jira.

Screenshot of Figma's Jira integration
© Figma, Source

Involve Developers Early

A common issue among teams is the assumption that designers should just drop their designs off to developers and let them figure the rest of it out. A better way of approaching this would be to involve developers as early as possible to provide them with insight into the various behaviors and states you’re working on. Otherwise, you might design something that’s not feasible to code, which is synonymous with wasting time.

Here are a few recommendations to ensure a smoother and more seamless handoff:

  • If possible, include developers in calls with clients and stakeholders if they’ll be able to gather some essential insight about the product; 
  • Communicate with developers to learn how design elements would end up being transferred to the end-product;
  • Consult with developers during early prototyping to avoid any potential code-related issues later on; 

However, sometimes, if developers have a pre-established framework, it’s best to give them the freedom they need and take a look at the implemented version first, rather than insisting on your particular design decisions that may be complicated to implement.

It should also be noted that involving developers too much can also be an issue. In my experience, you can easily overwhelm developers at the ideation stage, since there are a lot of different concepts and changes, all of which might have their own technical caveats. 

That said, you should seek to strike a balance between keeping developers engaged and overwhelming them with concepts. 

Static vs. Dynamic Handoffs

There’s a case for both static and dynamic handoffs. The former implies that you’ll present your design ideas via basic illustrations. On the other hand, the latter comes with more specific requirements for interactions and overall user experience. 

Making the right decision in this regard is relatively simple—make sure to have an open and transparent interaction with the developer team.

Static handoffs are useful when the developers aren’t versed in Figma, Zeplin, or similar products. As a result, they might not intuit what information or specs they need to grab. What static handoffs provide is the ability to explicitly highlight essential information such as margins, paddings, font sizes, etc.

That said, static handoffs sometimes create more problems than they solve. The primary issue is the fact that this type of handoff requires a lot more time, since you have to do manually what Figma, for example, does for you automatically, which is marking distances among elements. Another challenge that is otherwise avoidable is the hassle with marking versions and changes, introducing layers of taxonomy, etc. As such, before committing to a static handoff, make sure the pros outweigh the cons.

Screenshot of a static handoff
An example of a static hand-off. Note how the distances among elements are explicitly highlighted.

When using dynamic handoffs, date the iterations and don’t change already shared designs, at least not without explicit communication with developers and a project manager or product owner. It’s very tempting to just update the same shared design and file, but that leads to confusion, especially when those links and files are in a user story. You, as a designer, can’t be certain that developers know what’s been changed and where. For all you know, they might be midway into the implementation.

Screenshot of Figma showing specifications of different elements
An example of a dynamic handoff in Figma. Note how you have to select an element to get information about its position.

SVG Is King

SVG is a vital format for defining vector-based graphics. It’s very handy when looking to increase development speed when working on projects that deal with a fair share of animation and design. Furthermore, SVG graphics use up less space, which is very useful in the long run. 

Here are a few essential benefits that should motivate you to choose SVG over any other format:

  • When it comes to handoffs, size matters. Since SVG is pretty much XML code, files in this format are extremely lightweight. There was even a report suggesting that you can save up to 80% of bandwidth by switching from PNG to SVG. As a result, your products will load faster, which is conducive to a satisfying experience;
  • SVG files can scale with no distortion. Respectively, these files can be used for anything from watches to giant outdoor banners without compromising quality during the resolution scaling;
  • Given that these files have the styling information incorporated, this allows developers to create pixel-perfect prototypes without needing a stylesheet;
  • Lastly, because an SVG is basically code, they’re fairly easy to edit or animate for developers, which eliminates the need for a designer to create multiple versions or states of the same element.

Avoid Doing the Work Twice

Creating a sense of continuity and consistency in your design library will benefit both you and the developer team substantially. Products like Storybooks, Figma, and Sketch are valuable tools that allow achieving this. What these products do is enable us to break the barriers between designers and developers by linking code to design elements.

Storybook, for instance, allows developers to access all the components in an organized manner. As a result, they’ll be able to use, share, and test all the elements in your design. Taking the time to merge your design with code via storybooks will save both you and the developers a lot of time.

© Storybook, Source

The same goes for Figma, Sketch, and Adobe XD. All of these tools allow creating a design system, which, in practical terms, is either a separate page or a separate file with symbols (in Sketch) or components (in Figma). What components and symbols do is allow you to make global changes in all instances of a certain element. Say, you want to make all calls to actions green instead of blue—it’s as simple as a few clicks.

Voog's Design System
© Voog, Source

Conclusion

Great products rely on a great handoff. While this may often seem like a very technical process that enters waters that we don’t necessarily understand (front-end development), it’s essential that we take the time to learn how to do it. Furthermore, some of the facets of this process have nothing to do with code. They revolve around communication and productive collaboration.

The post How to Make Developers Love You as a Designer appeared first on UX Mastery.

]]>
https://uxmastery.com/how-to-make-developers-love-you-as-a-designer/feed/ 0 109792
How to Organize and Reuse Research Insights https://uxmastery.com/how-to-organize-and-reuse-research-insights/ https://uxmastery.com/how-to-organize-and-reuse-research-insights/#comments Wed, 09 Oct 2019 05:34:39 +0000 https://uxmastery.com/?p=73191 Have you ever wondered what life would be like if we reused research insights? Lucky for you - it's easy! Zack Naylor from Aurelius teaches us how.

The post How to Organize and Reuse Research Insights appeared first on UX Mastery.

]]>
Have you ever been asked “Hey, do we have any research about [fill in the blank]?” and not known where or how to search for the past research that answers this question?

Well, you’re not alone. Thousands of UX researchers across the world see the clear need in being able to efficiently organize, search and reuse their past research insights. Often referred to as ‘user research repositories’, teams are looking for systems and tools that allow them to get the most out of their user research efforts without hiring more researchers or getting additional resources. Our world—and the work we do—are both moving faster. The quicker we can answer someone’s question about past research insights; the more valuable our work can be for the entire company.

What is a User Research Repository?

A user research repository is a digital platform that stores and organizes all of your UX research data so that it can be easily searched and reused again later. This can take many forms such as traditional tools like Google Docs/Drive, Confluence and internal wikis, as well as newer platforms built specifically for the purpose – like Aurelius, the one I co-founded.

A screenshot from Aurelius, showing tags used across the project’s research repository

The main goal for any user research repository is the ability to quickly search through past research studies to apply those insights at a later time. Other primary goals for teams include finding patterns across multiple studies, and sharing the data and key insights across the organization.

A user research database or repository provides the ability to quickly search and trace your findings to particular past studies, allowing you and your team to get more mileage out of the research you’re already doing. As teams look to get faster and more efficient, having a system like this in place allows you to reuse past research insights where appropriate and focus new research efforts in the right places.

Rise of the UX Research Repository

These systems have recently become popular for several reasons. Mainly, researchers are realizing that many of the tools we use to do our work aren’t built for the purpose of UX research. The ways in which we take notes, analyze our data, document our findings and ultimately store all of that information is often scattered across multiple tools or platforms; none of which are built particularly well for user researchers’ needs.

The ever-popular standby of a research report is a great example. UX research reports are traditionally the most common way of sharing and communicating findings from a study. Where research reports sometimes fail us is that they don’t include all of the data and insights we’ve gathered from any particular study. Often, research reports only include summary findings and answers to questions that immediately address the needs of a project. The information contained in them is not easily searchable, making it harder to find specific findings or insights that may apply to a future need. This means a lot of valuable customer insight gets lost.

We also see the landscape of our teams and work changing. Many UX research teams are working across multiple time zones and physical locations. This means the traditional affinity diagrams with post-it notes on a physical wall is getting harder to do together.

This change in landscape is also clear in the recent rise in popularity and definition of the ‘ResearchOps’ (or ‘ReOps’) community. The practice of user research is maturing in many organizations, causing a realization that our work and processes can, and should, benefit from refined “operationalization” to increase efficiency and value to the entire organization. A user research repository is only one part of this but clearly fulfills the need to easily search and share past research and reduce wasted effort on conducting research that’s already been done.

When should you Invest in a User Research Repository?

If you’re not already using, building or looking into a research repository, then the answer is ‘now’. As with many things that bring us a lot of value in the long run, investing the time and effort today pays off dramatically later.

I’ve often described our very own platform, Aurelius, as a vitamin instead of a pain killer. Vitamins don’t often provide much instant gratification, but they prevent the need for pain killers later. Taking vitamins now gives you confidence that you’ll be healthier for your yearly check-up with your doctor and allow you to enjoy life for years to come. The same is true with research repositories, as they setup your research practice for long term success.

Getting Started with a User Research Repository

Before jumping head first into a research repository, consider who will be using it and how you’ll want to reuse past research data. Obviously a good first step here is to examine how you’d like to be able to search, organize and reuse your research today. Problems, challenges and opportunities you have here-and-now will help define the model, features and workflow you should look for in a new platform. All of this will help guide you in deciding which tool(s) can best fit your needs.

Here are 6 steps to guide you in getting started with a user research repository:

1. Appoint someone to own the “library” or repository

It’s important, just like in any project, that someone is the ‘owner’ of the effort required for getting your very own UX research database up and running. This person can, and should be, driving the effort forward — but should also be making sure the team and stakeholders involved have their say in what’s important for such a platform. The owner can gather feedback from the team on tools, vendors and more to drive the ultimate decision and implementation for starting up your new user research repository. Finally, this person should be the shepherd of the platform — ensuring its use and adoption is done in the way most appropriate for your company.

2. Organize your research projects with consistency

Organized Projects in Aurelius

Once you’ve decided on a tool or platform, it’s critical to have a consistent organization scheme for your projects. At Aurelius, we see teams commonly organize their projects in one of two ways; by project or by product. Sometimes people use a mix of both but, whatever you choose, be consistent so that finding those projects is much easier once they’re complete.

3. Add notes, data, observations, and feedback

Choose a system that allows you to tag and code your data as you collate user research in real time. We’ve found this is most helpful as it not only speeds up your analysis time but also builds your research library as you’re doing research — two for one!

Work out the wrinkles in your data tagging and encoding. This can feel tricky at first but don’t fret. Feel free to tag data as liberally as you need to at first. Doing so will allow you and your team to quickly find the appropriate tags, taxonomy and application for all of your upcoming projects. My general recommendation is to use tags for notes and data to help speed up analysis and create themes, then use tags for things like findings and key insights to describe them for easy finding and reuse later.

Get all those notes and observations into your repository so everything is in one place. Once there all tagged in the way you like, your research hub is slowly growing on its own!

4. Do analysis and synthesis in your repository

This will be highly dependent on which tool and/or platform you choose, but we highly recommend doing your analysis and sense-making in your repository itself. Again, if you’re coding and tagging your research notes and data in real time right in the tool, this should dramatically speed up analysis time and then provides you the ability to trace back a single data point to key findings later on… all in one place.

5. Create Key Insights, nuggets and findings

It cannot be overstated that creating digestible statements of learning within your user research repository is a must. At Aurelius, we call them Key Insights. They’ve often been referred to as “nuggets” by Tomer Sharon and his initial work in developing his own in house solution while at WeWork. Additionally, many UX researchers call them key findings or highlights. That said, we recommend creating Key Insights that have four parts, which are:

  • Name – The statement of what you learned from the research
  • Description – Further detail about that finding for context
  • Tags – Descriptors of the key insight based on product, theme, topic, persona, etc.
  • Supporting Data – Notes, observations, artifacts and data that support and/or led to your statement of learning
Creating Key Insights model in Aurelius

6. Grouping, search and share your Key Insights

Once you have all these pieces in place you should group, organize, search and share your Key Insights. Do this in way that provides access to these findings, to helpfully inform actions taken across your team and company.

We typically recommend grouping Key Insights across multiple projects by:

  • product
  • persona/customer segment
  • team/department
  • global theme, or
  • business goal

Each of these groupings could have overlapping key insights and that’s just fine. The important point here is that now you have a system in place to quickly search and share relevant user research insights with all interested parties based on their role, function or focus.

Next Steps

Getting your team up and running with a user research repository doesn’t have to be a huge task. As I said, once you choose a central place to store all of your user research data – whether it’s Aurelius or another tool – choose someone to own the rollout, training, and adoption of that platform.

Once you’ve chosen a tool or platform, follow the rest of the steps above. To quickly bring in past research data, we suggest focusing on those past Key Insights first and then bringing in previous study raw data as you find extra time.

We’ve found that following these guidelines in your user research process will dramatically help you organize, search and reuse your findings across multiple projects. Ultimately, it should help you build a solid user research repository as you’re doing your work. It means there are no extra steps, and it will result in your research having a greater impact at your company.

Mention UX Mastery to get 10% off any Aurelius plan, just email Aurelius after you sign up to claim the offer.

The post How to Organize and Reuse Research Insights appeared first on UX Mastery.

]]>
https://uxmastery.com/how-to-organize-and-reuse-research-insights/feed/ 1 73191
How Kasasa used Optimal Workshop’s Reframer to rebuild a product, prove the value of UX, and inspire their team to UX maturity https://uxmastery.com/how-kasasa-used-reframer-to-rebuild-prove-value-and-inspire-ux-maturity/ https://uxmastery.com/how-kasasa-used-reframer-to-rebuild-prove-value-and-inspire-ux-maturity/#respond Wed, 12 Jun 2019 05:50:02 +0000 https://uxmastery.com/?p=72428 UX Mastery talked with Anthony Rezendes, Senior UX Manager at Kasasa, about his experiences using the qualitative research tool Reframer. What we heard was an empowering story about how insights and an efficient, human-centred approach turned a failing product into a successful legacy.

The post How Kasasa used Optimal Workshop’s Reframer to rebuild a product, prove the value of UX, and inspire their team to UX maturity appeared first on UX Mastery.

]]>

In November 2016, Anthony Rezendes sat at a lunch table and took a deep breath. Joining him for sushi were two senior managers, interviewing him for a potential UX Manager role. They were viewing printed screenshots of one of their products and discussing Anthony’s critique.

“So, Anthony, what would you do?” one of them had asked. “What would you do to improve this?”

The company had recently rebranded from BancVue® to Kasasa®. The mood of optimism and a drive for progress was thick in the air.

“In my mind, I was thinking ‘We’ll need to better understand what people want and try to align that with business goals’. That might even mean starting from the ground up.” Anthony recently told us.

He also knew he would have a big task ahead. The challenge would be exciting and demanding. This was a project that required going beyond the typical scope of design; a step up and back was also needed to help build awareness of and maturity in the company’s user experience practice.

And Anthony already had a good idea of how he could do that. Conversations and successes from previous roles, a desire to get stuck in and make a positive difference, and support from a particular software tool he knew could help champion a user-centred approach.

A company with tenacity in its DNA

Kasasa is a financial technology and marketing provider that works exclusively with community banks and credit unions. Essentially it’s an alternative to giant banks like Citibank, Capital One, or Wells Fargo. With 450 employees, Kasasa has helped over 900 community financial institutions establish long-lasting relationships with their own customers. It does this via branded retail products, a marketing team with good rapport with their audience, and a lineup of expert consultants.

An aerial photo of the Kasasa team standing on the lawn
Some of the Kasasa team in 2016. Source: Glassdoor

Anthony was hired as part of the team focussed on analytics. Together with Jay Egan (Kasasa’s Director of Business Intelligence) and digital media savvy front-end developer Gregory Griffith, they had the mission of renovating Kasasa’s data analysis platform, Insight Exchange, to better meet internal and external demands.

Key to their definition of success was increasing the product’s utilisation rate. They knew that some of their target users were unaware of the tool’s fundamental strengths. Others had existing workflows outside of it, or had workarounds that sidestepped it. It was therefore important to make changes that would attract and welcome these customers and users. This would allow them to be better supported by Kasasa’s maturing ecosystem of products and services.

A Google Streetview image of the front entrance of Kasasa's building.
Kasasa’s Insight Exchange product presented Anthony, Jay and Gregory with an opportunity to demonstrate how an iterative, user-centred process could align business and user needs. Source: Google Street View

Insight Exchange was a product of its time. While Kasasa’s corporate values are centred on creating engaging relationships with customers, there was more that could be done to consult them on their needs for a digital product

“Historically, talking to clients was about educating them or going through a demo with them, and less about listening to their thoughts, ideas, or concerns,” Anthony explained.

This presented a substantial opportunity for Anthony and Kasasa, and there would be a lot at stake without it. “This analytics product is, ultimately, about the user and what the user needs. And if we’re not meeting their needs, our software’s not going to be seen as helpful.”

Anthony gave himself a four-step plan for addressing the sticking points

  1. First, to build trust and develop opportunities to talk with the target audience.
  2. To show the value of these conversations, especially where this helped make a distinction between ‘UI’ and ‘UX’ tasks.
  3. To increase the team’s UX maturity by bringing in a mix of traditional pen & paper methods, along with new technologies like the qualitative user research tool, Optimal Workshop’s Reframer.
  4. And finally, to actually get on with the task of redesigning the Insight Exchange product itself.

Finding the right tool

“I first started using Reframer at my previous place of employment (a medical analytics firm). I really enjoyed it and saw the benefits of using it. But that was a bigger company, with resources like dedicated UX researchers.”

“I needed the same rigour and discipline to approach Kasasa’s discovery phase, but without a full-time research team.”

“UX researchers are into data and are often working heavily with databases. I had to come up with data that I didn’t have access to yet. I needed qualitative data, and a tool like Reframer to keep track of all the conversations we were having.”

Reframer’s role was to quickly and effectively summarise findings from the research. It is able to do this in a way that supports clear communication to stakeholders.

Optimal Workshop’s Reframer is a qualitative user research tool. It allows a team to capture all observations and data points collected during the research phase of a project. Once collated into a single space, it supports ways of exploring that data in new ways.

It also recently emerged from public beta on February 4.

Interview notes, emotional and behavioural data, user test feedback, and more can be entered or imported. Data can then be tagged, filtered and tracked within the tool.

A screenshot of the Theme Builder in Optimal Workshop's Reframer.
Building themes in Reframer by using tags pulled from quotes from participants. Source: Optimal Workshop

Tagging the data in this way allows researchers to surface recurring themes. It makes it straightforward to track and analyse trends. Multiple people can also add their data making it simple for remote teams to aggregate and synthesise their findings

A chord diagram showing relationships between data points in Optimal Workshop's Reframer.
One of the several visualisations available in Reframer: The chord lines that connect the tag nodes represent observations that contain both tags. The thicker the chord, the more times the two tags appear together on the same observation. Source: Optimal Workshop

Anthony sets the scene: “We were growing and learning as a team. Part of that effort is shared understanding with regard to the data we collect. The UX discipline is about leveraging user research and team collaboration to solve barriers to engagement.”

Getting buy-in with tangible data

After weeks of building alliances and making detailed plans, Anthony got the stakeholder support for a discovery phase. He then spent four months conducting interviews, running empathy mapping sessions, and measuring behaviour and perspectives with surveys.

Anthony standing at a whiteboard running an empathy mapping exercise
Anthony facilitating an empathy mapping exercise with internal users and stakeholders. Source: Anthony Rezendes

Early conversations began with internal stakeholders, then quickly expanded to clients and end users. These interviews gave Anthony a direct view on how utilisation might be increased.

“With Reframer, and Optimal Workshop’s entire suite of research data-oriented UX tools actually, I then had a way to show that the UX process was much more than just visual design. More than just a look and feel.”

The Analysis tab of Optimal Workshop's Reframer showing insights discovered by Anthony
Optimal Workshop’s Reframer tool allowed Anthony to break down longer interviews into themes, quotes and user sentiment by recording and tagging highlights from the conversation. Here we can see the analysis tab within Reframer, showing that many users mention the desire for a dashboard that helps visualise and find meaning in the data for customers. Source: Anthony Rezendes

“We use a variety of different techniques as a UX team. A lot of times we’re doing empathy mapping, journey mapping. We’re conducting focus groups, user testing, sometimes showing prototypes and giving feedback there.”

Kasasa's internal stakeholders standing at a whiteboard, sticking red dots onto screenshots of the new design.
Conducting a workshop with internal stakeholders, using dots to identify features proposed in the redesign. Source: Anthony Rezendes.

“Part of the reason I do these reports is so the company can see the business value. Why we spent the time to do this, and how it impacts the product. There’s proof of return on investment when you can show and validate the value of UX through the tool. It became our evidence rather than a fumble trying to figure out what all it meant.”

“There’s proof of return on investment when you can show and validate the value of UX through the tool. It became our evidence rather than a fumble trying to figure out what all it meant.”

“Building the case for UX research is important. We opened up the process so that others could listen in on conversations. And even allowed long-time staffers to lead conversations so they could experience the value of interviews first-hand. Also, we sat in on a lot of sales calls so we could assess what was resonating with clients. When we explained who we were and what we were doing, most people really appreciated someone listening to their concerns. The company opened up to the possibility of leveraging UX as yet another opportunity to satisfy client needs.”

Answering the Call

“A large success from the discovery phase was being able to use Optimal Workshop’s Reframer to help the company understand the notion of qualitative data and its effectiveness in the design process.”

“We could then really lean in to building a product that was sustainable. Everything was based on listening to people, and being able to communicate data back through the tool.”

So what did Anthony and the team find when they analysed the data gathered and collated in Reframer?

“On the practical side of things, it was clear the users needed an actionable dashboard. And a simple way to export their data”. Anthony also discovered there were two clear but distinct types of users to develop into user personas. The redesigned tool also ultimately proved its value by enabling the core clients to make measurably better financial decisions.

Finding: People needed an actionable dashboard

“Once we realized people wanted particular directional insights, that they wanted to know what to do next, well, that wasn’t in the original tool. They had no next steps, it was just a bunch of information and charts. So we built a quarterly health report within the tool to show performance in a way that was directly actionable.”

A screenshot of the original version of the product showing image boxes linking to key report types.
Before: The first iteration of Insight Exchange contained lots of data and graphs. But the users were unsure of their next steps. Source: Kasasa

Finding: Supporting exported data

“Another key finding was that not only were people finding other ways to get what they needed, they felt more comfortable exporting the data to manipulate directly in spreadsheets and presentations,” Anthony says.

“We found it wasn’t intuitive or useful for internal folks either, despite the internal referencing and processes surrounding it.

With the information collated in Reframer, they were able to determine a clear path forward.

“We realized our first version was going to be for those internal users. We had to train the internal staff and show them this new version was valuable. That we could use this to share the bank’s data in a way that made sense with visualizations and filtering. Initially, internal users didn’t have that confidence in the tool.”

“Working with them and working with Reframer to collect the data allowed us to refine the platform to make it work for everyone.”

Finding: We actually had two audiences, not one

What Optimal Workshop’s Reframer also allowed the Kasasa team to see is that Insight Exchange had two distinct audiences.

Anthony explains: “There are the bank staff that are interested in seeing some high level metrics and going through filtering things. And there is the financial analyst persona who loves the data, and wants to really dive deep into it.”

“The notion that there are different types of users came out through Reframer. We ended up also building another tool called ‘Insight Author’ as a way to drill down into more complex data”. This proved the value of careful UX research, and allowed Kasasa to develop further tools that users needed and wanted.

Feedback from Stakeholders

“The new tool allows clients to be more empowered. I think if you talk to anybody in the higher level of the company, they would say Insight is becoming a go-to tool for us to be able to express the effectiveness of our products. And it’s contributed to growth within our analytics area too.

“It’s contributed to growth not only in the company but, for all of the FI’s [financial institutions]. Being able to have transparency and visibility in their performance. It’s an opportunity not only to understand what’s in the data but also to do actual consulting. And to work on other important things, like nurturing relationships.”

Seeing results

“All of our work culminated in a presentation at our annual Symposium of Peers. We got in front of the entire organization and showed where we were headed with the second iteration of the platform. We received feedback saying people were really wowed by our responsive demo. The platform had come so far from the Flash-based, non-responsive tool with minimal utilization. It was now a more robust, user-centered application that appealed to not only clients but internal service folks too.”

A screenshot of the original product interface showing measurement data for a company called Freedom Institution
Before: The graphics were simple but didn’t make it easy for the user to compare data from different areas. Source: Kasasa

Insight Exchange was relaunched with the name ‘Insight’ and positive results from the improved user experience were immediate. The upgraded platform showed a continual lift in utilization. 114% lift in the first month, 24% lift after three months, and 16% lift after six months.

A bar chart showing an increase in Insights product use over a 6 month period
The new product had an immediate adoption rate followed by healthy growth in use. Data source: Kasasa.

Looking ahead

Could Anthony have predicted during his first interview that he would go from a solo UXer to proving the value of user experience in a company that now has a dedicated and growing team of UX experts?

“I feel like we’re stronger and better equipped to be partners within the organization as opposed to just a service to it. In true Agile form we’ve been able to transform some dev-centric processes and give UX a seat at the table.”

“Based on the success and growth of Insight, we’re adding additional user-centred folks to the product team. Right now, we’re up to five employees and adding two more within the next few weeks.”

A photo pf the work environment at Kasasa, including corralled workstations and computer monitors
Kasasa has a reputation in the local banking industry for being a desirable place to work. Source: Yelp

“With several new products at the company, it’s an exciting time to be working here. While our journey is far from complete, I’m looking forward to future challenges and employing tools like Optimal Workshop’s Reframer in our mix.”


A free trial of Optmal Workshop’s Reframer is available with no time limits but a maximum of 3 sessions per study. Full product details and pricing are available on the Optimal Workshop website: https://www.optimalworkshop.com/reframer


UX Mastery produces unbiased, authentic and reliable content. This success story was produced independently and without input from Optimal Workshop. Project details were kindly supplied by Kasasa upon request. Optimal Workshop is also a sponsor for UX Mastery’s newsletter and social channels.

The post How Kasasa used Optimal Workshop’s Reframer to rebuild a product, prove the value of UX, and inspire their team to UX maturity appeared first on UX Mastery.

]]>
https://uxmastery.com/how-kasasa-used-reframer-to-rebuild-prove-value-and-inspire-ux-maturity/feed/ 0 72428
Inside Research – Interview with Erik Goyette, User Researcher at Shopify https://uxmastery.com/inside-research-interview-with-erik-goyette-user-researcher-at-shopify/ https://uxmastery.com/inside-research-interview-with-erik-goyette-user-researcher-at-shopify/#respond Tue, 09 Apr 2019 14:00:45 +0000 https://uxmastery.com/?p=72267 Benjamin speaks with Erik Goyette, UX Researcher at Shopify, to learn more about how they approach user research and design.

The post Inside Research – Interview with Erik Goyette, User Researcher at Shopify appeared first on UX Mastery.

]]>
This article was originally published on the Dovetail Blog.

Shopify is the world’s leading e-commerce platform with 800,000+ people from 175 countries using its platform as of 2018. Its ability to empower entrepreneurs and small businesses has pushed it to the forefront of the industry.

Shopify’s design and research team has been growing steadily over the past few years. We spoke with Erik Goyette, and other members of the Shopify design and research team, to learn more about how they approach user research and design.

The shopify logo as a neon sign

What’s Shopify’s mission?

Erik: Shopify is a commerce platform that helps entrepreneurs and businesses of any size design, set up, and manage commerce stores across multiple sales channels. We provide merchants with a powerful back-office and a single view of their business. Our mission is to make commerce better for everyone so that entrepreneurs around the world can easily start a business to sell online, through social media or in person.

One of Shopify’s brick-fronted offices

How does user research work across Shopify?

Erik: Shopify’s goal is to help small and large businesses become more successful, so making sure our product is easy to use is essential. We’re super passionate about understanding the problems our users have and building tools that will help them accomplish what they need to do.

One thing that maybe differentiates us from other businesses is that user research is directly embedded into teams. Being part of a team helps us researchers get a lot of deep context in a specific product area. On the other hand, researchers love discovering new things, so we also have the freedom to stray off the path and start digging into larger, more undefined problem spaces.

Multiple people sitting at desks in Shopify’s office

Could you let us know about a recent user research project?

Erik: I conducted a series of exploratory interviews and concept tests for my first project at Shopify, and thought to continue using my old method for sharing information: an atomic research database (Tomer Sharon explains the method best here).

I analyzed all of the interviews into a bunch of really interesting individual observations that were then grouped up into insights. As a researcher, I love this method because it serves as a very detailed, searchable, and well organized “second brain”.

However, as a method of sharing findings, it wasn’t very effective. The team had very specific questions to answer and though the answers were available, the atomic research format has a little more friction involved in finding them. Where a presentation or a report pushes insights to its audience, insights have to be pulled out of atomic research. As a method of sharing research, it’s much more demanding on the people who need insights to inform their decisions.

Realizing the lack of engagement with the atomic research format, I went through and turned some of the more relevant insights into stories. Those stories were then included in a little presentation.

Stories informed by data is very impactful at Shopify, so I’ll have to find out how to pair that with atomic research as a method. Ideally, atomic research doesn’t just exist as a hyper-detailed library of knowledge, but also as a driver for change.

Two Shopify employees sitting on a sofa

What software does Shopify use? What have you tried in the past? What’s been working well?

Erik: We use Slack and G Suite extensively. We try to use tools that the rest of the company also uses, so we can more easily collaborate and share resources. But we’re also lucky to have the freedom to use whatever we believe will get the best results.

For interviews, we’ll often use Google Hangouts, Zoom, or Lookback. The nice thing about Google Hangouts is that participants don’t have to install anything, but it doesn’t work if you’re using Safari. Lookback is a fun one because it works on mobile and desktop. Notes you take are time-stamped to the recording, which is fantastic when reviewing.

To catalog our research, we’ve built a research library. Anyone across the company can go there to find our reports, slide decks, and recordings of our presentations.

Dovetail’s been great for our research team as well because if we’re ever curious about certain keywords or themes, we can search across multiple projects for them. With 50 researchers, there’s a lot of qualitative data available to remix and learn from. In a way, it’s become our second research library in addition to being our main tool for qualitative analysis (goodbye, spreadsheets!).

A single Shopify employee on a laptop in a library-style meeting room

What challenges do you have with user research?

Erik: Before focusing on research, I was a UX specialist. I dabbled in designing the product (wireframes and interaction design patterns) in addition to running research initiatives. When designing, I received a lot of feedback on my work that helped me re-assess my approach. Moving to a role where my focus is now entirely user research, I’ve been reflecting on how I receive feedback and how I measure the success of my research.

If I compare research to the design and engineering disciplines, where there are very clearly defined opportunities for feedback from team members, the feedback cycle for a researcher is less structured and less frequent. We’ll get eyes on our research plan. If we’re lucky, or ask for it, we’ll get some feedback on how the research findings were presented. Questions about whether or not we could have shared the information in a better, clearer, or more memorable way are rare. Feedback on how the analysis was performed? That’s a black box for most people, and it takes a long time for even a talented researcher to understand someone else’s analysis, so the lack of feedback there is understandable.

What we’re often left with as feedback on how we’re performing is the impact of our research. If the research leads to a project (which isn’t always the case) it can be a difficult thing to measure because of the long stretch of time that user research lives at.

As a researcher, you could be conducting exploratory research on a project that won’t be prioritized until a roadmap planning meeting many months in the future. Leading up to that meeting, you could try measuring the impact of your work by paying attention to how people think about a problem. At the very least, you can feel a sense of satisfaction when something you have uncovered becomes a team’s focus. It isn’t necessarily something you use to improve on your work and methodology in the future, but it’s nice to know that there was alignment on a goal and user research played a part.

A wooden stairwell in one of Shopify’s open plan offices

What’s changing about user research at Shopify?

Erik: As Shopify expands into new markets, we’re exploring how researchers who have a deep understanding of a product area can approach international research. Localization of content is one thing, but we also have to consider how business processes and expectations may be different in each of the countries we support.

We’ve also been checking in on how our knowledge management solutions are performing. In an effort to be more resourceful, we’re going to make sure existing user research is organized and formatted in a way that can be consumed and understood by other teams. Some research is almost timeless and will always be relevant.

Why do you do what you do?

Erik: I am absolutely in love with Shopify’s users. They’re driven, they’re smart, and they’re a wonderfully diverse group of people. Seeing someone gain independence by turning their passion into a business is so inspiring. Every day I wake up wanting to better understand how they work, what their challenges are, and uncover opportunities for us to help them reach their goals.

Two people sitting in a common area in Shopify’s office

Any advice for new user researchers?

Erik: If you’re new to the industry or are thinking of turning user research into a career, my biggest hope is that you already have some of the foundational stuff down. The most important thing you’ll need starting off is the ability to think critically about the projects you’re working on, the questions people are asking, and your own work. You have to be able to zoom in, fuss over the details, and then zoom out to see the whole picture at a high level. If you have that down, you’ll be in a really good place to grow.

What comes afterwards is getting experience and growing your skillset. You don’t need to have first hand experience running card sorts, usability tests, interviews, surveys or a dozen workshops under your belt. You’ll learn that as you go, and improve over time.

With that in mind, it’s important to find an environment that’ll allow you to try out a bunch of research methods. For me, that environment was working at start-ups. Start-ups move at a rapid pace, and people will tend to run off and build while still holding some risky assumptions (with the best intentions). If you can find yourself in a place like that, equipped with your research mindset, you can experience a lot of growth and have a lot of influence. The skill you’ll have is the ability to test assumptions before anyone has to invest hundreds of hours into building something.

The rapid pace also means projects might wrap up relatively quickly, giving you the opportunity to learn from the launch, find the gaps, learn from them, and experiment with your research methods next time. If you’re resourceful and can handle the pace of the work, you’ll expand your skill set dramatically in a very short period of time.

Two people standing talking in a common area in Shopify’s office

A single person sitting in a sunny meeting room in Shopify’s office

Two people working together in a room in Shopify’s office

Three people standing over a long wooden table in Shopify’s office

A single person lying on the floor on his laptop in Shopify’s office

The post Inside Research – Interview with Erik Goyette, User Researcher at Shopify appeared first on UX Mastery.

]]>
https://uxmastery.com/inside-research-interview-with-erik-goyette-user-researcher-at-shopify/feed/ 0 72267
How wireframes can help you create great user experiences https://uxmastery.com/how-wireframes-can-help-you-create-great-user-experiences/ https://uxmastery.com/how-wireframes-can-help-you-create-great-user-experiences/#respond Fri, 11 May 2018 11:10:05 +0000 https://uxmastery.com/?p=66515 Wireframes are often the first time we meet our designs and see them come alive, but it can still be tempting to jump directly to high-fidelity work. In this article, Julie gives us ten reasons why we shouldn't.

The post How wireframes can help you create great user experiences appeared first on UX Mastery.

]]>
Whether you’re a Web-designer, a UX designer, or a graphic designer, using an online tool for wireframing and mocking-up concepts can provide a useful and experimental playground.

Wireframes are bare-bones sketches of the intended layout for your design. They’re quick to produce, which also means you can discard them if they’re not working well; you can experiment with as many ideas as needed to come up with one that best solves the problem. They’re visual, so they’re a good way to share early thinking about your design vision with your team, clients and stakeholders. And they’re testable, meaning you can validate ideas, check user flows and finesse the user experience using interactive, clickable wireframes.

Sometimes it’s tempting to cave in to pressure and jump directly to high-fidelity designs, skipping wireframes and going directly to the visual idea that may be gelling in your mind.  Yes, it’s possible to create a successful solution this way, but you’re much more likely to get to the right solution for your design problem, and in a quicker time, using an iterative process beginning with a low-fidelity version such as a sketch or wireframe.

Using an iterative process involving user feedback, and investing your design time well, is an important skill for a user experience designer. At NinjaMock, we firmly believe wireframing can help you create the best possible user experience. Here are ten reasons why:

1. Maintain flexibility while ideas are maturing 

Wireframes allow you to explore concepts without investing too much time in unproven ideas. This results is a healthier ideation process for you and your team, with iterations and spinoff ideas helping mature your thinking until you’re close to a workable solution.

2. Find the major problems before you’ve invested hours in a design

Sketching a ‘good enough’ wireframe will allow you to validate major assumptions about structure and flow of your website or app. You’ll be able to spot any potential design issues before you spend hours creating and polishing the final design.

3. Set structure and hierarchy first

The blocky, sketchy nature of wireframes makes it easier to establish a hierarchy of information in your design. Fewer elements mean you can see the building blocks of the design and position them without having to accommodate fine details.

4. Keep your stakeholders looking where you need them to

The same blocky, sketchy nature also helps simplify communication between you and your client. If the thinking is broad-stroke ideas about structure, content, features and user flows, a wireframe will stop them from questioning choices about branding, colour, specific words or imagery when they should be focussed on the fundamentals.

5. Focus on functionality

Early in your design process ideas fly thick and fast, and it may feel like stakeholders (or even other team members) are creating friction by suggesting unrelated ideas or working in alternate directions. Wireframes can help avoid this by bringing everyone back to a concrete process focused on functionality.

6. Provide incremental value

Good ideas sketched as wireframes form stepping stones towards your final design solution. A wireframe approved by your client or stakeholders acts as a visual blueprint, as an agreed reference for where the main elements are going to be positioned in the final design, and how the high-level mechanics of interactions and screen flow will work. Future refinement of the idea can proceed without being undermined by too many fundamental changes, letting you increase the fidelity of the design as you move into subsequent iterations.

7. Save time (and money)

It’s easy to spend several days worth of time creating a detailed design. If this is done too early in the process, much of the pixel-perfect positioning may have been wasted effort—new considerations, stakeholder feedback or changes in direction may all require big changes to the design.

8. Iterate, iterate, iterate

Overall design time can be reduced by working iteratively, staying flexible when needed, and working towards detail only as you increase in confidence of an approach.

9. Validate your ideas early

Many online wireframing tools such as NinjaMock, Balsamiq Cloud, Mockflow, Lucidchart, and others enable you to create clickable wireframes that mimic the basic interactions and flows of your final solution. You can use these prototypes in usability testing to get early feedback on your designs, and fold the insights back into your work.

10. They’re fun!

Wireframes are often the first time you get to meet your designs and watch them come alive. Some would say this is one of the most important reasons! Personally I find this very satisfying, and a lot of fun.

I hope these points are useful, and that they’ve convinced you to be brave (like a ninja!) and start your next project with a wireframe!

This sponsored post by NinjaMock supports the ongoing work of UX Mastery.  

The post How wireframes can help you create great user experiences appeared first on UX Mastery.

]]>
https://uxmastery.com/how-wireframes-can-help-you-create-great-user-experiences/feed/ 0 66515
Best Practices for Agile UX Testing https://uxmastery.com/best-practices-for-agile-ux-testing/ https://uxmastery.com/best-practices-for-agile-ux-testing/#respond Thu, 19 Apr 2018 00:00:00 +0000 http://uxmastery.com/?p=65222 While we all dream of launching the perfect product or feature, it’s only through testing and iterating that we can refine and improve the user experience. Luckily, Agile development creates opportunities to test at every stage. Read on for tips on how you can fit testing into the Agile cylce.

The post Best Practices for Agile UX Testing appeared first on UX Mastery.

]]>
Every product manager’s dream is to launch a product or new feature that is perfect for their customer right out of the gate. But we know this is hardly ever the case.

It’s only through experience, and repeated user feedback using user experience testing, that we learn to tweak our product’s features and interface according to our users’ conscious or unconscious demands.

Over the last two decades, agile and sprint based development has enabled an efficient and effective product management – development team – design team feedback loop. The next stage in the Agile revolution is to add the customer and the user to this cycle, through Agile user experience testing (Agile UX Testing).

Test small, test often

Conducting market research and usability testing used to be an expensive and lengthy process. That’s why it was typically performed only once, or maybe twice during the design and development of new products and features. Since UX testing was often done towards the end of the product development cycle, the feedback gained was often used more as a “validation” exercise than an “exploratory” exercise.

It’s now possible to set up a UX test script in 5 minutes, receive qualitative picture-in-picture responses (webcam view recording of respondents + screen recording + audio + quantitative data) within hours, and add the customer and the user to the agile software development feedback loop.

You can even run a user test for every sprint, and for every design and development iteration. This iterative process avoids the risk of putting together a complete prototype and realising far too late that there is a flaw in the design that should have been dealt with in the early development stages

You don’t need to run these tests with large sample sets. It’s a rule of thumb within the usability industry that 5 participants going through a qualitative picture-in-picture recording session like that of Userlytics.com will allow you to uncover 80% of the usability and user experience issues in a design.

See who is testing your product

It’s important to always have your target persona front of mind. It helps you look at your product through the lens of your customer – as much as possible.

However, it’s impossible to fully immerse yourself as your own customer no matter how hard you try. If you can’t be them, watch them. The best feedback you can get on your product is from the users its meant for.

Online remote tests with only screen recording and audio don’t allow you to know if the person providing the feedback is truly your target persona. Including a webcam view of participants adds a whole new level of depth and details to your qualitative UX testing insights. You can start to verify whether the person is actually your target persona, and better understand their contextual surroundings as they interact with your UI and answer questions. By being able to visually analyse the tester you can track their real-time emotional/physiological reactions to the product.

It’s always better to actually see people use your product. 

When launching a test with Userlytics, you can use demographic filters and set screener questions to ensure their global participant panel provides you with a tester that fits your persona. They also track participant location via their IP, and review every result to reject or approve it through their QA process.

Getting feedback on your product is always great, but it’s even better when the feedback is from participants that match your target persona.

Moderated vs. unmoderated vs. hybrid

For lab-based user testing, moderated testing (a UX researcher guiding the respondent) used to be the norm. The advent of new technologies allowed UX researchers to conduct moderated sessions on a remote, online basis, using screen sharing platforms like GoToMeeting, Webex, Zoom, Skype, Hangouts and so on. The problem is scalability. UX design researchers only have so much time to moderate target participants, let alone conduct the project management and scheduling and logistics required to manage a moderated usability testing process.

When Userlytics and its peers in the industry invented unmoderated usability testing, the economics, time requirements and scalability of user testing advanced by orders of magnitude. The drawback? A rigid non-personalisable test script.

In other words, a single UX researcher could manage tests of hundreds or even thousands of respondents, anywhere in the world, at a fraction of the time, and cost required for moderated or in-lab UX testing. However, it was not possible to adapt the unmoderated test script according to the answers and actions of each respondent, which would be possible with moderated usability testing.

But that problem has now been solved, through conditional logic (“branching” or “skipping” logic). The most advanced UX testing platforms have a hybrid approach that marries the scalability, speed and economics of unmoderated user testing with the personalisation of moderated user testing by leveraging branching logic. When branching logic is applied to a given task/question in the test script, it redirects the tester to a new task/question depending on their response to the prior question or task. Through branching logic you can essentially replace the moderator’s function through creating a customised set of instructions to different testers depending on their actions.

Branching logic creates more personalised tests.

Efficient analysis

In an agile sprint where time is short, you need to get to your analysis quickly. Rapidly and economically launching a user experience test is only part of the equation. Reviewing and analysing the results, and decision-making in a timely manner is the other half. If you launched a test with 30-minute sessions of 10 participants, you and your colleagues have 5 hours of video to watch, analyse, make annotations, and pull insights so as to enable product and UI optimisation. 100 participants would imply 50 hours. This time adds up quickly.

When you’re working in sprints, you needs results quickly.

Your user testing platform should provide the tools you need to quickly review participant sessions, leverage searchable, time stamped & hyperlinked audio transcriptions to locate the most interesting actions and comments, add & share hyperlinked and shareable annotations, and create & share highlight reels.  

Benchmark your product

Learning from how your users engage with your product is one way to ensure a positive customer experience. It’s also important, however, to see how your product compares to your competitors through benchmarking.

Benchmarking your prototype designs against each other, against existing production assets, and against your competition will allow you to identify additional opportunity areas where you can improve your usability design to create a superior customer experience.

The best way to do this is using pre-formatted system usability scale questions with automatic calculations of the resulting score. You can also use comparison metrics such as net promoter score, time on task, and success/failure, which allow you to quantitatively measure your usability and user experience against different design iterations and against the competition, or best practice websites and apps. “If you are not measuring, you are not managing”

TestFlight and Google Play equivalent

Testing your product early in the process is essential. However, once your mobile app prototype reaches a high fidelity stage and is on the Appstore or Google Play, you need to have a process for testing the apps prior to production.

Some platforms use testing apps, which may have the drawback of incompatibility with the tested app and the Testflight app. Others like Userlytics use an approach that does not require any kind of SDK or testing app, therefore avoiding potential usability testing pitfalls.

Conclusion

An agile UX testing approach takes an iterative customer-centric approach, providing many small sample tests with your target persona at every stage of the product lifecycle allowing you to optimize your product prior to launch. Like having your customers form a seamless whole with your sprint teams. This strategy reduces time and money wasted in design and development and results in a much higher customer engagement and satisfaction score.

If you want to learn more about agile UX, or how to launch an agile UX testing process you can schedule a demo here

We just wanted to let you know this is a sponsored post. Every now and then, we partner with people and companies doing awesome things.

The post Best Practices for Agile UX Testing appeared first on UX Mastery.

]]>
https://uxmastery.com/best-practices-for-agile-ux-testing/feed/ 0 65222
The Workflow of a UX Designer: The Process and Tools You Need https://uxmastery.com/ux-designer-workflow/ https://uxmastery.com/ux-designer-workflow/#comments Mon, 29 Jan 2018 23:00:11 +0000 http://uxmastery.com/?p=62177 What kind of tools do UX designers use? In this article, we talk you through the all the tools you might need throughout the UX Design process. From inspiration through to ideation and implementation.

The post The Workflow of a UX Designer: The Process and Tools You Need appeared first on UX Mastery.

]]>
What kind of tools do UX designers use?

I get asked this all the time by people new to user experience (UX) design. Understandably, they want to learn the tools of the industry so they can get hired.

To celebrate the recent launch of the UI for UX Designers course in collaboration between CareerFoundry and InVision, I’ve put together an answer to this all too common question. 

Hiring someone based on the tools they use would be like hiring an artist because they have the right brushes. It’s not about the tools, it’s about method and craft. UX design relies heavily on process and the tools that I use mirror that process.

A design process is a recipe for creating great products. Everyone has their own way of doing it, and everyone uses different tools to make it happen. I’m going to try to share my recipe and the tools that I use along with a few alternatives.

Even better, most of the tools listed here are available on a freemium model and have a usable version for free. The exception is Sketch (good news- there are tons of free alternatives). The only requirement for these tools is a computer or tablet, but with UX design in general, all you really need to create a good user experience is pen, paper, and an inquisitive mind.

There are lots of things that should happen behind the scenes of creating a great product, such as user personas and customer journey maps. I’m just going to assume that you’ve already created these for your business and talk about my workflow from the first stage of inspiration, all the way to implementation of a new product or feature.

Inspiration stage

I know it’s tempting to get on Behance, look for inspiration, and then move straight into wireframes, but as a UX designer, you want to fall in love with the problem, not the solution. You’ll try to define the problem and create a competitive analysis to make sure that you’re solving the right problem in the right landscape. I like to use various survey and polling tools to define this.

Surveys

At CareerFoundry we have a very active student community on Slack so I will often create a Simple Poll in Slack as they’re quick, easy, and garner lots of participation.

For more in-depth surveys, you can use a survey tool like Typeform to reach out to your customer via email. I usually create a survey with a final question that asks whether the customer would be interested in a 30-minute video chat.

Interviews

I take a look at their answers and follow up with a video conference using my favourite video chat tool, Appear.in. Make sure you have a script ready, but more importantly, let the customer lead the conversation in the user interview so that you give them the opportunity to identify problems.

I love the combo of Typeform and Appear.in because all the customer needs to participate is a simple URL so the experience can be as simple as one click with no tools or downloads required.

Problem Solving

Once I have an idea of what the problem is, I use Google Docs to create problem statements and share them with my team for further collaboration.

In addition to understanding the problem, we often use “How Might We” statements, a tool pioneered at IDEO, to frame our approach to the problem.

Project Management

For project management, we use DaPulse at CareerFoundry and it’s great for keeping track of complex projects. I would also recommend Trello for project management, even if it’s just for your own daily work management. It’s an amazing tool and the free version is all you will ever need to manage your UX projects.

Ideation Stage

Now that you’ve built empathy with your customer and wrapped your head around the problem at hand, it’s time to start experimenting. As I mentioned earlier, all you need for this phase is paper and pen, as the goal is to keep things as sketchy as possible until you have experimented enough to discover the solution.

Sketching ideas

When I began sketching ideas, I typically just use standard A4 paper cut in half to create a tablet sized canvas. I always start with mobile and sketch my ideas with a marker so that I won’t get too detailed. Ideally, this is a collaborative process, and I would encourage you to have all of the stakeholders attempt to sketch solutions in a brainstorming meeting along with you.

Whiteboards are excellent for collaborative sketching so I recommend you have several around your office for this purpose. Create several sketches to experiment with (I recommend at least 5 novel directions) checking that each idea is feasible with your stakeholders.

You can scan your sketches into your computer and create a “Preference Test” in Usability Hub if you need help deciding on an approach. You could also use your team’s internal channels like Slack for stakeholder feedback. The important thing at this stage is to allow your team the opportunity for feedback so that you can narrow down the solutions to only those that are achievable.

Wireframes

Once you have a few approaches in sketch form, it’s time to create wireframes. If you already have some design skills, try using Sketch or Illustrator. Vector-based tools like Sketch offer a lot of power, but it can be tempting to jump to high-fidelity designs.

If you find yourself tweaking fonts or adding colour to your designs (a common tendency for UXers with visual backgrounds like myself), switch to a tool that only does wireframing like Balsamiq. I use Sketch for wireframing because it’s faster, but I like to use wireframing kits so that I’m not wasting time creating visuals that serve only to distract.  Whether you use a digital tool or even just pen and paper, the important thing is that you stress functionality over aesthetics at this stage.

Prototypes

Experimentation is a pivotal part of any UX designers workflow, and any simulation of what might become the actual product is called a prototype. There is a saying at IDEO that goes, “If a picture is worth a thousand words, then a prototype is worth a thousand meetings.” A good UX designer will spend a lot of time prototyping ideas so make sure that you find a tool that you love.

My favourite prototyping tool is InVision because it covers all the basic functionality in a really intuitive user interface. Of all the prototyping tools I’ve tried, InVision is the fastest way to get something clickable. It’s such a life-saver when you have a user testing session in an hour and your boss is asking you to make changes to the prototype.

They are always adding new features, including a Sketch plugin to prototype in the popular design program. There are a ton of prototyping tools, and most of them are browser-based so all you need is a computer and an internet connection. If you want more in-depth interactions and complex animations, I recommend you buy Flinto for Mac. For on-the-go prototyping, there is even a tool called Prott that allows you to create an entire prototype on your Android or iOS device. Check out uxtools.co for a really nice breakdown of these and other prototyping tools.

Don’t worry about the learning curve involved with these tools. You can also use paper prototypes to test your idea. It all depends on how real you want the prototype to feel. Once I’ve worked out all of the kinks with my team, it’s time to test these prototypes with real users.

User testing

Designing for the user is fundamental to being a UX designer, and you will want as much face time as possible with your users. At first, getting in touch with your user can seem like a daunting task, but don’t worry, there are a million ways to get access to people for testing.

You can find groups on Facebook that fit with your target market. You can create a print ad and put it up in an area where people are likely to fit your demographic. If you’re feeling brave, you can just walk into any coffee shop in the world and find people willing to try out an idea. Keep it simple and try to offer some sort of compensation for their time. Ideally, you should schedule at least a 30-minute usability test and you should be testing with at least 5 participants.  

I really like PowWow for scheduling interviews, and you can schedule up to five on the free trial. If you have more than five interviews to do, I would recommend the paid version or a more powerful tool like Acuity.

You will want to record these interviews if possible and take plenty of notes (I recommend getting a partner for this). Any note-taking program will do, but I recommend using something with a search functionality. I like to use Google Sheets so that I can keep my interview questions and all the responses in one browser tab that is easily searchable.

For recording interviews, I really like Vidyard GoVideo, a really neat Chrome extension that allows you to record the user, the screen, or both in a very simple interface. This works well for testing as it allows you to record the user’s face and the interactions that they have with your clickable prototype. Another alternative would be QuickTime’s screen recording setting (warning: this will create huge files) or even just your phone and a tripod.

CareerFoundry is based in Berlin, but most of our users are in the United States, so we often do remote user testing. The only difference here is that we have the user share their screen while they’re testing the prototype. Offering compensation from across the ocean can be tricky, so we use a tool called Rybbon that offers international gift cards.

Implementation stage

Once you are satisfied with the direction of your idea, it’s time to present your findings to your internal stakeholders. Presenting your work is extremely important for UX designers because many people still don’t understand the process that goes into creating a user-centric product. If they understand all of the steps you went through to get to your final solution, they will be more likely to adopt your approach.

Summarise the testing and pull out your top learnings. Don’t forget to illustrate these with quotes from the testing. I generally use Google Slides for presenting internally because it has excellent commenting and sharing abilities. Sharing your slides afterwards is just as important as presenting your solution! If I want to include more design elements sometimes I will use Keynote as you can drag elements from your wireframes directly from Sketch or Illustrator into Keynote.

Most UX designers won’t get into high-fidelity designs so I’ll keep this phase brief. The UI portion of this process would involve taking your low-fidelity wireframes and turning them into polished designs that are ready for development. I prefer to use Sketch for high-fidelity designs for its ease and simplicity, but some designers still prefer Illustrator or Photoshop or Adobe’s newest design product, Adobe XD.

The important thing to remember about high-fidelity designs is that you clearly present the concept to your development team. One of my favourite tools for this is Zeplin, a program that turns a Sketch or Photoshop file into something that a developer can work with. It pulls out things like hex codes, CSS and fonts allowing them to be previewed through their web app. This is very important because not every developer will have access to Sketch. Use your Zeplin project as the final source of truth between design and development. Having one source of truth will help your developers keep track of the design through the inevitable changes in the development cycle.

In summary

Breaking my process as a UX designer down into three stages, here are the tools I use most often and would recommend.

Inspiration

  • Simple Poll in Slack
  • Surveys with Typeform
  • Interviews using Appear.in
  • Google Docs for Problem and How Might We Statement and user stories
  • DaPulse or Trello for project management

Ideation

  • Pen, Paper, Post-Its
  • Get internal buy-in with Usability Hub
  • Wireframes in Sketch
  • Clickable Prototypes with InVision
  • Find participants with Slack, FB, Print Ads
  • Scheduling Testing with PowWow
  • Take notes in Google Sheets
  • Record Interviews with Vidyard GoVideo

Implementation

  • Telling the Story with Google Slides
  • Sketch for Hi-Fidelity Designs
  • Zeplin for Dev Handoff

Bonus tools (a few more of my favourites)

  • Chrome
  • Trello
  • Balsamiq
  • Flinto
  • Prott
  • Acuity
  • Rybbon
  • Keynote

I hope this has given you a glimpse into the process and tools that go into making a digital product. UX as a discipline is constantly changing and challenging the accepted norms. You should be constantly experimenting with your own tools and process until you find something that works for you. There’s much room for improvement with the current design tools available, so I’m sure our workflows will look very different in just a few short years. 

What’s your favourite UX design tool? Leave a comment and let us know! 

And if you’re interested in levelling up your UI design skills, take a look at CareerFoundry’s new course: UI for UX Designers.

The post The Workflow of a UX Designer: The Process and Tools You Need appeared first on UX Mastery.

]]>
https://uxmastery.com/ux-designer-workflow/feed/ 2 62177
How to Bring Disruptive Innovation to Your Design Process https://uxmastery.com/disruptive-innovation-design-process/ https://uxmastery.com/disruptive-innovation-design-process/#respond Wed, 08 Nov 2017 07:51:42 +0000 http://uxmastery.com/?p=61987 Have you ever been in a rut with your design process? Maybe you’re churning out the same solutions to every problem. Or you just can’t nail the way forward for your product.

To move ahead, you probably need to find a new perspective. Enter innovation sprints, which use immersive insights and assumption-busting to kick-start the design process.

The post How to Bring Disruptive Innovation to Your Design Process appeared first on UX Mastery.

]]>
Have you ever been in a rut with your design process?

Maybe you’re churning out the same solutions to every problem.

Or you just can’t nail the way forward for your product.

To move ahead, you probably need to find a new perspective. At Standard Life, we realised we needed new ways of working to keep our competitive edge. This meant building a culture of innovation from the ground up.

One of the ways we keep the ideas flowing and the approaches fresh is through innovation sprints.

An innovation sprint is a 1-2 week workshop, where a cross-functional team explores a problem from new angles, comes up with new ideas, then iteratively prototypes and tests them.

The first part of our innovation sprint is ideation. We use immersive insights and assumption-busting to kick-start the design process. This helps the team challenge assumptions about the product, its users, and generate new ideas.  

Insights (right) and Ideas on left and centre.

If you’re lucky enough to be coming to Mobile UX London 2017, we’ll walk you through these techniques IRL in our workshop – we hope to see you there!

If you can’t make it, fear not. Here’s how to you can run your own immersive insights and assumption-busting workshops to spark your team’s collective imagination.

Immersive insights

Immersive insights are about immersing your team in examples of innovative or unexpected ways of solving challenges related to the problem you are working on.

These examples should be drawn from outside your industry.

To prepare:  Research insights in advance of the workshop.

Involve your team, by asking them to do their own research and send you insights. Print out the insights (an image and a short description of the problem solved) and place them around the room where your workshop will take place.

During the workshop: Spend time discussing each insight, and how it could be applied to your problem. Record all ideas on post-it notes.

Assumption-busting

Challenge your team to think in a different way by asking them to list their assumptions about your product or users. Then consider what it would be like if these assumptions were untrue.

During the workshop:

  • Ask everyone in your team to share their assumptions about the problem. For example: “Users don’t like to regularly review their finances.” Record these on post-it notes.
  • Go through each assumption and ask: “If this wasn’t true, what would the world look like?” For example, “If users liked regularly reviewing their finances, how could we serve them better? What could we do to make it easier for them to review their finances regularly?”
  • Record all new ideas on post-it notes.

Bringing the two techniques together

You can use a combination of immersive insights an assumption-busting in the same workshop to generate new ideas to test.

Depending on the scope of your problem, set aside between 2 hours and half a day in a design workshop setting.

An example of an ideas wall we use in our innovation sprints.

Here are the steps to follow in your workshop:

  1. Once you’ve recorded your immersive insights and assumption-busters, stick them all up on wall or whiteboard.
  2. If you come up with a large number of ideas, group similar ideas together and assign headings.
  3. Rate the ideas – our favourite way to rate ideas is through dot voting, where each team member is given a number of sticky dots (3 or 5 for example) that represent their votes. They can spend all their dots on one idea or vote for multiple ideas.
  4. Take the top 5 rated ideas, and consider the easiest and cheapest way to test them (paper prototypes, A/B tests, guerrilla testing). Testing early will allow you to throw away non-viable ideas and focus on the ones with potential.

And there you have it, the first step towards a new perspective.

We hope to see you at our Mobile UX London workshop on 10 November.

Mobile UX London combines expert speakers with compelling topics to deliver a day of focused opportunities for learning and networking through quality presentations and practical workshops.

Last minute tickets are still available at mobileuxlondon.com

Tsvetelina Valcheva joined Standard Life in 2014 with a background in telecommunications and financial services. She now works for an internal consultancy within Standard Life designing websites for clients. She also looks after the institutional clients’ external website. Previously she worked on Standard Life’s direct customers online servicing team, and before that – its mobile app for customers. Follow Tsvetelina at @LinaValcheva.

Matthew Dickson joined Standard Life in 2015 from a startup in London, attaining a place on Standard Life’s sales and marketing graduate scheme. Passionate about exploring the vast opportunities in the financial industry, it led to him helping to create the Business Innovation Team – solely focused on implementing new ways of working around the business to ensure Standard Life is primed to tackle existing business problems, but is also geared towards being a major disrupter in the industry.

The post How to Bring Disruptive Innovation to Your Design Process appeared first on UX Mastery.

]]>
https://uxmastery.com/disruptive-innovation-design-process/feed/ 0 61987
Going Guerrilla: How to Fit UX Research into Any Timeframe https://uxmastery.com/guerrilla-ux-research/ https://uxmastery.com/guerrilla-ux-research/#respond Thu, 19 Oct 2017 04:51:29 +0000 http://uxmastery.com/?p=61304 As more and more companies realise the value of UX research, “guerilla” methods have become a popular way to squeeze research into limited budgets and short timelines. This often means reducing scope and/or rigor. The key to successful guerilla research is to strike the right balance to hit time and budget goals, but still be rigorous enough to gather valuable feedback.

So when is the best time to tackle your research guerilla style?

The post Going Guerrilla: How to Fit UX Research into Any Timeframe appeared first on UX Mastery.

]]>
As more and more companies realise the value of UX research, “guerrilla” methods have become a popular way to squeeze research into limited budgets and short timelines. Those of us working in agile sprints often have even less dedicated time for research.

When I say guerrilla research, I don’t mean go bananas or conduct jungle warfare research. Guerrilla research is really just a way to say that you’ve taken a regular UX research method and altered it to reduce time and cost.

To do so, you often end up reducing scope and/or rigour. The key to successful guerrilla research is to strike the right balance to hit time and budget goals, but still be rigorous enough to gather valuable feedback.

Read on for a framework for reducing any research method and an overview of the best time to use guerrilla tactics.

If you’re looking for practical advice on using guerilla research methods, take a look at my second article: Getting Started with Popular Guerrilla UX Research Methods

Crafting your guerilla plan

You can “guerrilla-ise” any UX research method, and there’s almost never one single correct way to do so. That said, qualitative techniques like usability tests and interviews lend themselves especially well to guerrilla-isation.

The easiest way I’ve found to plan guerrilla research is to start by determining how you’d do the research if you had desired time and budget. Then work backwards to find the elements you can toggle to make it work for the situation. The first place I look to cut is scope of the research question.

Let’s say your team is working on a new healthcare application and wants to assess the usability of the entire onboarding process. That’s an excellent goal, but pretty broad. Perhaps you could focus your study just on the first few steps of the signup process, but not the follow-up tutorial, or vice versa.

Once you’ve narrowed down your key research goals, you can start looking at what sorts of methods will answer your questions. The process for choosing a research method is the same, regardless of whether you’re trying to go guerrilla or not. For a great summary of choosing a method, take a look at Christian Rohrer’s excellent summary on NNG’s blog or this UX planet article.

Besides narrowing the scope of your research goal, think about the details that make up a study. This includes questions such as:

  • What do you need to build or demonstrate?
  • How many sessions or participants do you need?
  • How will you recruit them?
  • What’s the context of the studies?

Then you can take a look at all those elements, identify where your biggest time and money costs are, and prioritise elements to shift.

Reducing scope

Let’s say, for example, that you determine the ideal way to test the onboarding flow of your new app is to conduct 10 one-hour usability sessions of the fully functional prototype. The tests will take place in a lab and you’ll have a participant-recruitment firm find participants that represent your main persona.

There are many ways you could shift to reduce time and costs in this example.

You could:

  • Run test sessions remotely instead of in a lab
  • Reduce the number of sessions overall
  • Run unmoderated studies
  • Build a simpler wireframe or paper prototype
  • Recruit participants on social media
  • Intercept people in a public location
  • Or a combination of these methods

To decide what to alter, look at what will have the biggest impact on time, budget, and validity of your results.

For example, if working with a recruiting firm will be time consuming and expensive, you’ll want to look for alternative ways to recruit. Intercepting people in public is what many of us envision when we think of guerrilla research. You could do that, or you could also find participants on social media or live-intercept them from a site or web app.

You may even decide to combine multiple guerilla-ising techniques, such as conducting fewer sessions and doing so remotely, or showing a simple prototype to people who you intercept.

Just remember, you don’t want to reduce time and effort so much that you bias your results. For instance, if you’re doing shorter sessions or recruiting informally, you may want to keep the same overall number of sessions so you have a reasonable sample size.

Best uses for guerrilla research

So, when is the best scenario to use guerrilla tactics in your research?

  • You have a general consumer-facing product which requires no previous experience or specialty knowledge OR you can easily recruit your target participants
  • You want to gather general first-impressions and see if people understand your product’s value
  • You want to see if people can perform very specific tasks without prior knowledge
  • You can get some value out of the sessions and the alternative is no research at all

And when should you avoid guerrilla methods?

  • When you’ll be researching sensitive topics such as health, money, sex, or relationships
  • When you need participants to have very specific domain knowledge
  • When the context in which someone will use your product will greatly impact their usage and you can’t talk to people in context
  • When you have the time or budget to do more rigorous research!

Guerrilla research is a great way to fit investigation into any timeframe or budget. One of its real beauties is that you can conduct multiple, iterative rounds of research to ensure you’re building the right things and doing so well.

If you have the luxury of conducting more rigorous research, take advantage, but know that guerrilla research is always a better option than no research at all.

Read the next article on getting started with common guerrilla techniques.

The post Going Guerrilla: How to Fit UX Research into Any Timeframe appeared first on UX Mastery.

]]>
https://uxmastery.com/guerrilla-ux-research/feed/ 0 61304