fbpx Skip to main content
Tag

user experience

Design Systems: Unlocking Saas Product-Led Growth With UX cover

Design Systems: Unlocking Saas Product-Led Growth With UX

By design system, product, product led growth, UX No Comments
design guideline

We all know the importance of good user experience when it comes to growing a successful software as a service (SaaS) product. But pushing beyond good UX and into great UX for your product requires more than just tweaking design elements here and there. It requires an understanding of user behavior and an understanding of how best to engage users in meaningful ways. That’s where design systems come in!

Design systems are a powerful tool that enables teams to create consistent, effective experiences across all platforms and formats. At the same time, they help teams understand the larger design patterns they need to grow their products.

In this article, we’ll explore how you can unlock the potential of your SaaS product with the power of design systems, what benefits they bring to the table, and ultimately how you can use them to take your product-led growth efforts to the next level!

What is a design system?

Have you heard about design systems yet? They’re unifying forces behind great UX, driving smoother product development and enabling faster product iteration. But what exactly are they?

At their root, design systems are living documents that serve as the single source of truth for all your design decisions. From there, they bring together component libraries, user flows and interaction patterns to create an integrated set of design standards. This not only provides a consistent look and feel but also ensures that your designs remain true to brand standards. Plus, it simplifies the process for teams working on different products/versions.

In a nutshell: Design systems are a powerful way to drive product-led growth. Not only will they give your SaaS product a consistent look and feel while allowing rapid iteration over time, but they’ll also strengthen team collaboration and help you reach new heights with your user experience!

Benefits of design systems

If you want to unlock product-led growth for your SaaS product, design systems are the way to do it. A design system is a set of libraries, tools, and guidelines that help create a consistent user experience across the product’s user interface. When implemented correctly, this can supercharge your SaaS product’s growth.

growth metrics

Design systems have various advantages for SaaS companies, allowing them to:

  • Streamline their development processes by increasing the efficiency and speed of their workflows.
  • Optimize customer journeys with intuitive navigation and UI elements so users can easily understand how to use each feature of your product.
  • Measure success through analytics and data tracking so you can make informed decisions on how to improve user experience.
  • Build trust with existing customers as they will be familiar with the consistent user experience every time they use the features of your product.

So whether you are in the early stages of designing a new SaaS product or revamping an existing one, investing in an all-inclusive design system should be at the forefront of your development strategy.

Elements of a UX design system

You may not know this, but UX design systems are the key to creating an optimized Saas product-led growth strategy. In a design system, each element has a specific purpose. Let’s take a look at what those elements are:

Design principles

Design principles define the overall philosophy behind the product. These can help guide decision-making and ensure that product features are always aligned with overarching goals.

UI/UX patterns

Design patterns define how users interact with the product—they provide a consistent interface across all user channels. This could include things like buttons, menus, forms, and other common UI/UX components.

design patterns

Style guide

The style guide sets the tone for esthetic consistency, outlining everything from typefaces and color palettes to image sizes and placement. All these details help define the visual representation of the brand in all of its touchpoints.

In addition to these elements, there should also be guidelines in place which outline how to use them together. This way, everyone involved knows what is expected of them when building out the product. By leveraging all of these components as part of your SaaS product-led growth strategy you can make sure that you are always providing an amazing user experience!

Best practices for establishing a design system

You may not know it, but using a design system can be a major boon for your SaaS product-led growth. A design system helps your product look and feel like the same product, no matter which device you’re using. On top of that, it helps keep costs down in the long run since you can reuse components across different platforms.

So what techniques can you use to establish an effective design system? Here are some of the best practices:

Start small

Rather than taking on too much too soon by creating a design system all at once, start out small. Focus on developing a library of core UI components that are shared across multiple projects; then, once those components have been deployed and tested in production, you can expand the system to include more reimagined elements.

Keep your design system evergreen

Maintain your design system through regular documentation and testing of existing components—and add new ones as technology and user behavior evolves over time. Think about how color palettes change from year to year or how new trends emerge in UX design; you want to be sure that your design system is always up-to-date with the latest industry trends and best practices.

Educate your team

Make sure everyone on your team is properly educated about how to use the design system correctly. Otherwise, it’s all for naught! Depending on the size of your team, you might consider having dedicated training sessions with detailed documentation on how to use each UI component correctly.

team training

By following these best practices when establishing a design system, you’ll be able to create an efficient way for users to interact with your SaaS.

Increasing consistency and scalability with design systems

With the rise of digital products, it has become important for companies to provide a consistent user experience across all platforms and devices. This is where design systems come in.

Design systems are collections of reusable components and styles, organized into a library that can be used and adapted to create new designs more quickly and efficiently. By giving developers and designers a framework to work within, design systems facilitate collaboration across teams and help ensure consistency of product design.

This makes them great for SaaS products. They make the process of scaling easier by allowing designers to quickly create new user interfaces in line with the existing visual language. Design systems also encourage innovation by giving developers more flexibility to experiment with new ideas while keeping the product on-brand.

Design systems can be incredibly powerful tools for growing your SaaS product – so why wait? Take advantage of this technology today!

Examples of successful product-led growth: Companies using design systems

You may not know this, but many of the world’s most successful SaaS companies are using UX design systems to achieve product-led growth. In fact, these carefully planned and tested design systems are allowing these businesses to quickly iterate on their products while also increasing customer engagement, reducing development costs, and ensuring reliable user experience across a wide range of digital platforms.

Here are a few examples of SaaS companies that have experienced success from using UX design systems in their products:

With Intelligence (HFM & Fundmap)

Their design system promotes efficiency in the design and development process. By providing a library of pre-built design components and patterns, designers, and developers can quickly and easily create new screens and features, saving time and reducing errors. The design system also promotes increased collaboration between team members, as everyone is working from the same set of guidelines.

6sense

By creating and implementing a custom design system, 6sense was able to speed up the engineering process from four weeks down to two days. This meant faster delivery of new features while also reducing platform errors and the need for expensive fixes. In addition, thanks to its organized structure, people were better able to find the components they needed without wasting time searching through code bases or manual documents – saving them valuable time in the long run!

Atlassian

Thanks to the use of an enterprise-level UX design system, Atlassian was able to ensure consistent user experience across multiple platforms. This not only saved them development time but also improved customer satisfaction, leading to increased user loyalty and revenue growth.

atlassian

Ultimately, with UX design systems at your disposal, you can unlock product-led growth and gain a competitive advantage in the long run, quite like Atlassian did.

Final thoughts

In conclusion, it’s time for SaaS product-led growth to unlock its potential with UX design systems and have the user experience at its core. Design systems allow for greater collaboration between teams, faster time-to-market for product design, and a more consistent user experience. With a robust design system in place, teams are able to pre-empt customer usage and create an improved user experience.

Design systems are the key to success for product-led growth. With a well-thought-out system, your SaaS product can go from serviceable to standout, and your brand will be the one to watch!

Want to learn more? Feel free to reach out

User Experience and Digital Transformation : The Why, What, and How

User Experience and Digital Transformation: The Why, What, and How

By digital transformation, innovation, UX No Comments

The current health crisis forced many brick and mortar businesses to move online and completely rethink the way they operate. However, successfully undergoing a digital transformation isn’t always easy. While most traditional companies are striving to remain relevant in the new reality, only some of them understand how to do digital transformation right and what changes it triggers. One of the main mistakes organizations often make is to pay too much attention to technologies while underestimating the role of user experience.

In this article, we’ll explain why focusing on the UX design is crucial for receiving positive results from digital transformation. We’ll also give you some tips on how to get on the right track with creating outstanding digital experiences for current and potential customers.

Why center digital transformation around UX

No business can remain afloat if it ignores customer needs. But that’s exactly what some companies inadvertently do while undergoing digital transition. They think the same strategies that have proven their efficiency in real life will work equally well for online interactions. However, people behave differently in the digital space. This means that most traditional methods of offline communication aren’t necessarily effective on the internet.

Purchasing decisions online are influenced to a greater extent by a number of factors; including greater competition with plenty of available alternatives, the availability of reviews, almost effortless comparison of prices, and other conditions (e.g. delivery time and cost) have significantly raised the level of customer expectations. It usually takes just a few clicks to find another online shop selling similar products. So even one episode of poor customer experience can become a deal-breaker for internet purchasers.

A good UX design can address a number of these factors. It can help a company increase audience engagement, simplify interactions with every buyer, and, ultimately, get more sales. Statistics show that a return from every dollar invested in creating a decent user experience amounts to $100. At the same time, about 88% of online shoppers say that they won’t use a website again if the UX was bad. In other words, achieving business goals while undertaking a digital transformation isn’t possible without making the entire process user-centric.

How to get started with the UX-oriented digital transformation

Creating great products isn’t necessarily enough to combat fierce competition in the overcrowded internet arena. To stand out, a company must truly delight its customers, or at the very least make the purchasing journey effortless. In order to achieve this, a deep understanding of customer needs and wants is a must. Here are a few tips on how to take a comprehensive approach to the creation of user experience within the online transition process.

Do UX research

The main goal of UX research is to help you understand how to make every interaction with a mobile application or website pleasant to users. It allows a design team to identify problems and opportunities related to the usability of functions and solutions that you have already implemented or plan to implement. All insights and valuable information gathered at this stage can be fed into the further digital transformation process.

To do the research, UX professionals use:

  • qualitative measures (e.g. interviews) to figure out why customers do certain things, and
  • quantitative measures (e.g. analytics and statistics) to discover patterns and test the assumptions made after qualitative research.
UX research
Image source: Ferpection

Companies should apply UX research methods throughout the entire digital transformation process, not just at the beginning. During the later phases, they help to make sure that implemented software is easy to use and doesn’t create bottlenecks in the key processes and workflows.

Create wireframes

whiteboard

Rushing into the development process with no wireframes and prototypes isn’t a good idea. Even if you have to execute a digital transformation strategy within strict deadlines, it’s better to review the timeline than waste resources on building custom software that won’t bring you desired outcomes.

Wireframes will help you connect information architecture with a user interface. Building wireframes is the cheapest and fastest way to see if a solution has convenient navigation. Besides, wireframes will allow a design team to experiment with different ways of displaying content on screens. This will give you a chance to choose the perfect UX for your solution.

At this point, it’s important to create a holistic design system. Following the rules of such a system will make the visual representation of your brand consistent throughout different platforms.

Work on experience optimization

Digital transformation is a continuous process. Getting the IT infrastructure designed and developed won’t bring a company long-term benefits if opportunities for experience optimization are ignored later. As with any optimization process, moving to the digital space means that you always have to seek improvements and keep track of the current trends.

experience optimization
Image source: decibel.com

In this context, optimizing a digital customer experience should be a priority. Modern customers are demanding — they won’t tolerate brands that don’t show that they care for people. But digital transformation initiatives also cover the implementation of internal enterprise solutions. It means that you should provide the company’s staff with user-friendly tools as well. Such tools will help them do the work faster, increasing the company’s productivity and profitability.

Top post-COVID-19 trends in UX design

Covid-19 shopping

The coronavirus pandemic brought a lot of changes to our daily lives. Naturally, it also transformed customer service and things we expect from companies that sell us products and services online. To help you catch up with the current state of UX, here are the main post-COVID-19 trends to consider in a product development process.

Online videos

The coronavirus outbreak boosted the popularity of video content. Today, businesses use all kinds of videos to deliver their messages to customers, from live streams to online courses. In short, if you want the online transition to be successful, investing in quality video content will be the right decision. It will help you reach and engage a broader audience in a relatively short period of time.

Smooth virtual interactions

Yes, a smooth virtual interaction is something that people expected before quarantine as well. However, a stay-at-home regime moved even more of our daily tasks online. Now, people use the internet to solve literally every issue: purchasing groceries, work, talking to doctors via video call if some health concerns occur. That’s why simple and informative user flow and adjusting to the needs of users with different tech skills play a critical role in UX today.

Clarity in UX writing

The situation with COVID-19 made it hard to deal with information overload. Most of us are exposed to an enormous amount of news and thousands of messages all the time when we’re online.

It’s vital for companies that sell products or services to be clear and concise with their written content. No unnecessary distractions, ambiguity, and confusion — just plain expressions and straightforward guidelines.

The role of user experience in digital transformation

Digital transformation isn’t just about using more software tools and upgrading a company’s IT infrastructure. When an organization decides to implement technologies in its business operations, the way it engages with customers changes as well.

What this means is that if user experience doesn’t get enough attention, chances are the entire process will fail. To ensure that the digital transformation of your company will be successful, make it user-centric and take a holistic approach to building UX design.

Need a tenacious team for the digital transformation process?

Drop us a line!

The State of UX for 2019

The State of UX for 2019

By design, interaction design, omnichannel, user experience, user interface, voice No Comments

Keeping up with the current trends is important for any area, not to mention the UX design which directly influences the way your digital product is positioned and perceived by the users. In this article, we’ll take a brief look at what happened with 2018 UX trends and try to anticipate the emerging tendencies that have potential to become real big things in the coming year.

Read More

Removing The Mystery of UX Design

By design No Comments

This article is an entry level of UX design, written for UX designers.

UX design is about developing products that are both usable and user-centric. The “design” aspect focuses on how the ease of use and efficiency for a user’s interaction with a product can be improved. The question you probably often ask yourself, though, is how it all works in practice? What do real-life UX design processes actually look like?

In this article, I want to show you how to start a UX design project. The article will give you a taste of the techniques used by UX designers when working on designing or redesigning a product, as well as show you the order in which specific UX steps should be taken. We’ll touch on subjects such as User Research, Design, and Testing.

Before Project Starts

To craft good user experience both the business context and project objectives must be clearly understood. Before starting any design project it’s important to create a strategy. A strategy will shape the goals of the project—what the business is hoping to achieve with the project and how its success should be measured.

Value Proposition

Value proposition is a process of mapping out the key aspects of the product: what it is, who it is for and when/where it will be used. Value proposition helps the team narrow down and create consensus around what the product will be.

UX designers create a document to communicate a value proposition which contains the following information:

  • Key business objectives
  • UX attributes that will influence the success (both directly and indirectly) of the key objectives and desired outcomes
  • Desired state of these UX attributes
  • A list of activities and design work that can be done to improve the state of the UX
Value proposition of UX should be directly associated with key business objectives. Image credits: uxmag

Key Performance Indicators (KPI)

KPIs help inform design decisions along the way and measure results of the UX efforts.
Usually, UX designers conduct a series of interviews with stakeholders to define KPIs.

Same as for value proposition, the key is to connect your KPIs to your business objectives. A few common examples of KPIs:

  • Conversion (sales / visits)
  • Bounce rate (e.g. basket abandonment for e-commerce site)
  • Average order value
  • Total number of sales

UX Design Process Explained

Once UX designer has a clear idea of a product definition and how it might fit into the current market, s/he moves into user-centric modelling. Although there are no hard and fast rules to this process, UX design generally occurs in the following five stages:

Value proposition of UX should be directly associated with key business objectives. Image credits: Usability Geek

Step 1: User Research

Dieter Rams once said, “You cannot understand good design if you do not understand people; design is made for people”. A great product experience starts with a good understanding of your users. That’s why user research is every UX designer’s starting point for a UX design project. User research has to come first in the UX design process because without it, designer’s work can only be based on their own experiences and assumptions.

“Good user research is key to designing a great user experience. Designing without good user research is like building a house without solid foundations – your design will soon start to crumble and will eventually fall apart.” – Neil Turner (Uxforthemasses)

Research phase is probably the most variable between projects. What is involved In user research:

Interviews

Interview is an in-depth one-on-one discussion between an interviewer and a user from the target audience. Interview should be designed to discover the underlying needs and requirements of the user when using your product. This technique is especially useful when the target audience is new or unknown to the team.

When starting a new project, you actually need to talk to people from your target group.

Online surveys

An online survey is a questionnaire consisting of a set of very precise questions sent to a sample of your target audience over the internet. The length and format of an online survey can vary from project to project.

Interviews and online survey can work together. Before you start writing questions for your online survey, take the time to conduct a few interviews to fully understand the user’s problem space. This will help inform your survey questions.

Surveys are used to validate the assumptions that designers make about a product. Image credits: Usability Geek

There are many tools available for running surveys, ranging from lightweight and inexpensive tools right through to specialist market research tools. For most UX applications simple surveys tools such as Google Forms, SurveyMonkey or Wufoo should offer adequate functionality to create surveys.

Competitive analysis

Evaluating the competition is one way to determine where a designed product stands, and what potential markets it can break into. When conducting a competitive analysis, UX designer evaluates a competing product’s usability, interaction design, and unique features, to see how their own product stacks up. Competitive analysis is especially important when designers are building an entirely new product that hasn’t entered the market yet. A competitive analysis gives insight into what competitors are doing right, and what difficulties they face, leaving opportunities available.

Research the competitors, get information about features, advantages and disadvantages Image credits: xtensio

Step 2: Analyze & Define

The aim of the Analyze & Define phase is to draw insights from data collected during the User Research phase. This step is clearly the ideation part of the process.

Persona

When a designer has finished a user research and know what users need and what they expect, s/he can summarize those findings into user personas. Personas are fictional characters which are used as a representation of a real audience and their behaviours. The purpose of personas is to create reliable representations of target audience segments for reference (UX designers build a product based on personas). Personas make it easier for designers to create empathy with users throughout the design process.

Persona’s template by romanpichler

User Stories

Once UX designer has a clear idea of who might use a product, it’s time to map out how they might use it. Every user has a goal to achieve, UX designer needs to define each step that the user will go through to get to the final goal. These steps will shape a user story. Good user story must clarify the specific type of user, describe the task with comparable detail, and clarify on the context in which work must be done.

Each individual action needs a corresponding user story. Image credits: UXPin

Step 3: Design

The premise of the Design is to create a product which will be tested with real users. This product may be represented by paper or interactive prototypes, interactive wireframes, or semi-functioning prototypes. The Design phase of a UX project should be collaborative (involving input and ideas from all team members) and iterative.

Information Architecture

Navigation is a make or break aspect of the user experience of a site/app. Each person who’ll get lost navigating through a site is going to have a bad experience of that product. To avoid these scenarios, UX designers perform a process called Information Architecture (IA). The purpose of IA is to organize the content on a site so that users can find exactly what they need to perform the task they want and to reach their goal.

The outcome of IA process varies based on the type of a project. If UX designer is creating a website, s/he’ll create a sitemap during this step. Sitemap is one of the most iconic IA deliverables, consists of a diagram of the website’s pages organized hierarchically.

Sitemaps are a hierarchical diagram showing the structure of a website or application. It makes it easy to visualize the basic structure and navigation of a website.Image credits: kristenjoybaker

Card sorting is one of the most popular UX techniques used for creating IA. During card sorting session, users organize topics from content within an app/website into groups that make sense to them.

Organizing the hierarchy of the content using card sorting technique. Image credits: Zurb

Brainstorming and sketching

Brainstorming is the most frequently practiced form of ideation. Brainstorming helps to generate constraint-free ideas that respond to a given creative brief. The intention of brainstorming is to leverage the collective thinking of the group, by engaging with each other, listening, and building on other ideas.

Brainstorming relies on a group of people coming together with their prior knowledge and research in order to gather ideas for solving the stated problem. Image credits: Tubik Studio

Brainstorming work in tandem with sketching. Sketching is the easiest way of visualizing ideas.All you need is just pen and paper. Sketching allows designers to visualize a broad range of design solutions before deciding which one to stick with. I haven’t met a single designer who doesn’t use quick sketching or some other paper prototyping form at the early stage of a design process.

Whiteboard sketches. Image credits: Dribbble
Sketches bring ideas to life. Image credits:webdesignerdepot

Wireframing

Wireframes are the “blueprint for design.” A wireframe represents the page structure, as well as its hierarchy and key elements. Wireframes tie together the underlying conceptual structure (information architecture) with the visible part of design (visual design). The process of wireframing helps designers uncover different methods for representing content and information as well as prioritizing that content in according to the user’s goals.

Wireframes aren’t supposed to represent the visual design or contact graphic elements. They should be quick, cheap, and simple to create.

Wireframe can be a quick sketch on scratch paper. Image credits: UXPin

User Flow

User Flow is the path a user follows through an application. The flow doesn’t have to be linear, it can branch out in a non-linear path. User flows are helpful in hashing out complex flows before prototyping a product. Creating users flows will help the designer think about what happens to the user before & after they visit a particular page.

37 Signals created a helpful shorthand for User Flows which you might consider during crafting your own flow.

Shorthand for User flows

Prototyping

A prototype is a simulation of the final product. Basically, it’s a version of a product that takes designer as close as possible to a good representation of an app/website and its user interface before any coding has begun. Prototype makes it possible to test the product — see how the overall design works and fix any inconsistencies.

Prototypes can be either low-fidelity or high-fidelity. Lo-fi prototypes help you focus on creating the smoothest flows for users to accomplish their goals.

Low-fidelity prototyping a quick way to validate a product before fully developing it. Image credit: Smartlogic
The user flows are the heart of your prototype. Image credits: Flickr

While high-fidelity prototype can be a fully-interactive version of a product.

High-fidelity interactive prototype. Image credits: prototypr

An interactive prototype has functional animations and microinteractions which are used to build meaning behind about the spatial relationships, functionality, and intention of the system.

Animated feedback in high-fidelity interactive prototype. Image credit: Dribbble

Animation can contribute heavily to the user experience if used correctly. Both functional and delightful animations can be used to deliver a feedback:

Animated microinteraction (notification trigger). Image credits: Dribbble
Animated microinteraction (floating labels). Image credits: Matt D. Smith

Step 4: Testing

The premise of the Testing phase is to put ideas in front of users, get their feedback, and refine the design. It’s important to understand that the earlier you test, the easier it is to make changes and thus the greater impact the testing has on the eventual quality of the product.

Usability Testing

Usability testing is usually a one-to-one, moderated in-person usability session. The purpose of in-person usability testing is to identify problems or issues the user has while interacting with a product. Test participant performs tasks using a product while the UX designer observes and taking notes. When conducting usability testing it’s crucial you observe the actions the user takes without intruding on their actions or decisions.

Testing doesn’t need not be either time consuming or expensive. Jakob Nielsen’s research has found that testing with 5 users generally unveils 85% of usability problems.

A/B Testing

A/B Testing (also known as split testing) is a form of quantitative analysis comparing two different versions of a product (e.g. two different types of landing pages). A/B testing makes it easier for UX designer to test hypotheses about design. A/B testing helps if you already have a product/service and need to improve it.

A/B testing is comparing two versions of a web page to see which one performs better. Image credits: vwo

Accessibility Analysis

Accessibility enables people with disabilities to perceive and interact with a product. A well-designed product is accessible to users of all abilities, including those with low vision, blindness, hearing impairments or motor impairments.

Accessibility analysis checks that a product can be used by everyone, including users with special needs. W3C guidelines define a basic set of accessibility rules. By following these rules UX design increases changes that all users are satisfied. It’s possible to use an automated tool to regularly test your service’s accessibility. One of the popular automated tools is WAVE (Web Accessibility Evaluation Tool)

Step 5: Measuring

Unlike any other discipline, UX designer’s work doesn’t stop with releasing a product. UX is an ongoing process that continues for as long as a product will be used by people. UX designers should continually measure product performance to see if it meets user satisfaction and if any improvements can be made.

Metrics Analysis

Numbers provided by an analytics tool tell designers about how the user interacts with a product: clicks, session time, search queries etc. Metrics analysis and usability testing work great together because metrics can “uncover the unexpected”, surfacing behaviours that are not explicit in user tests.

Analytics tools such as Google Analytics can offer quantitative results about what is happening on your site.

User Feedback

Metrics analysis helps UX designer to understand what is happening on a site/in an app. But when it comes to uncovering why, the true value lies in collecting qualitative data.

User feedback allows UX designer to discover the reasons behind the actions that analytics tools show. With an option to leave feedback, users can effortlessly report anything that’s causing the friction. This feedback item can then be labelled and filtered directly to UX designer’s mailbox.

With an option to leave feedback, users can effortlessly report anything that’s causing the friction.

Conclusion

While we’ve described the most common UX design methods and deliverables that can help the design process, it’s important to understand that each project is different and it’s often important to adapt the techniques to your own needs (in other words, you don’t need to follow them like textbook examples).

Voice Interfaces: New Era Of Human-Computer-Interactions

By ai, interaction design, user experience, voice No Comments

Voice interaction is the ability to speak to your devices, have them proceed your request and act upon whatever you’re asking them. Today voice user interfaces are everywhere: we can them in smartphones, TVs, smart homes and a range of other products. The rapid development of voice interaction capabilities in our daily lives makes it clear that this technology will soon become an expected offering as either an alternative or even a full replacement to, traditional graphical user interfaces.

According to Gartner, by 2018, 30 percent of our interactions with technology will happen through conversations with voice-based systems.

Amazon Echo
Apple’s Siri, Amazon Echo and Google Now, which have been available for a few years, prove that this technology is no longer in its infancy.

Voice interaction is the next great leap forward in UX design.

In this post, we’re going to explain why voice interfaces will be the next big thing and what does this trend actually mean for designers of the user experience.

What Are Driving Forces Behind Voice Interaction

Before we dive into the specific implications of voice interaction systems or design aspects for them, it’s important to understand what’s lead to rapid adoption of this new interaction medium:

Technology is Ready

It’s clear that improvements in natural language processing have set the stage for a revolution. In 2016 we saw a significant breakthrough in natural language processing, and we’ve reached a point where advances in computer processing power can make speech recognition and interaction a viable alternative to visual interfaces. Another important thing is a number of devices that support voice interaction – today almost a 1/3 of the global population is carrying powerful computers that can be used for voice interaction in their pocket, and it’s easy to predict that a majority of them are ready to adopt voice interfaces as their input method of choice.

Mobile app and voice input
Image credit: Samsung

Natural Means Of Interaction

People associate voice with communication with other people rather than with technology. This means that voice interaction systems can be a more natural way of interaction for the majority of users.

Voice interaction chart
Image credit: Google Mobile Voice Survey 2014

People Want a Frictionless Experience

To interact with a voice interaction system all users need to do is to simply speak to the devices and be understood. In comparison with graphic user interfaces (GUI) where users have to learn how to interact with a system, voice interaction systems can significantly reduce the learning curve.

Windows 10
Even the most advanced graphical user interface still requires humans to learn a computer’s language.

Opportunities For Business

Adding Personality To Branded Content

Companies can leverage the medium of voice interaction as an extension of their personalities. Gender, tone, accent and pace of speech can be used by experience designers to craft a particular customer experience with their brand. For example, kids may finally get to talk directly to their favourite cartoon characters.
Branding

Make Experience More Personalization

Using voice-based system it’s possible to create a deeper personal connection to the system. Even today if you look at the online reviews for Amazon’s Echo speaker, it’s clear that some people establish a close bond with their device in a way that more resembles a pet than a product.

Samantha from Her
Samantha from Her

Voice Interfaces Aren’t a New Direction, They Just a New Step In UX Design

If you are new to designing voice user interfaces, you may quickly find yourself unsure of how to create great user experiences because voice interaction represents the biggest UX challenge since the birth of the iPhone. They are very different from graphical user interfaces and designers cannot apply the same design guidelines and paradigms. But while designing for voice differs from traditional UX, classic usability principles are still critical to the quality of the user experience.

Understand The Basics Of Human Communication

To design great voice user interfaces, you must handle the expectations users have from their experience with everyday conversations. And for that, we must understand the principles that govern human communication: how people naturally communicate with their voices.

Understand User’s Intent

Voice-based interactions between a user and a machine can lead (potentially) to infinite possibilities of commands from a user. While designers may not be able to predict every possible user command, they need to at least design an infrastructure that is contextually driven. For that, it’s important to start with a use case (a reason for interacting in the first place) and try to anticipate users intent at each point in the conversation (to shape the appropriate response).

User Intent
The processing flow of a comprehensive speech interface. Image credit: API

Provide Users With Information About What They Can Do

While on a graphical user interface, a designer can clearly show users what options they can choose from, it’s impossible to do this on a voice interface. In voice user interfaces, it’s almost impossible to create visual affordances. Consequently, looking at a device that supports voice interaction, users will have no clear indications of what the interface can do or what their options are. Therefore, it’s still possible to provide the user with the options for interaction. For example, if you design a weather app you can make it say: “You can ask for today’s weather or a forecast on this weekend.”

Limit the Amount Of Information

While with graphic user interfaces you can present a lot of different options, with verbal content, you need to keep the information brief so that the user does not become confused or overwhelmed. It’s recommended that you don’t list more than 3 different options for an interaction.

Craft Meaningful Error Messaging

Error handling is an essential component of designing thoughtful voice interactions. The wide variation in potential responses places much more emphasis on the importance of crafting meaningful error messaging that can steer the conversation with the user back on track if something goes wrong.

Use Visual Feedback

It’s recommended to use some form of visual feedback to let the user know that the system is ready and listening. Amazon’s Echo is a good example of this: on hearing a user say ‘Alexa’, the bluish light swirls around the top rim of the device, signalling that Alexa’s ‘all ears.’

User Input and Amazon Echo
Image credit: thewirecutter

Conclusion

Voice is the next big platform – it represents the new pinnacle of intuitive interfaces that make the use of technology more natural for people. Properly designed voice interfaces lead users to accomplish tasks with as little confusion and barriers as possible. And the good news is that UX designers already possess the skills they need to design effectively for voice.

What You Should Know About Internet of Things

By design, IoT, user experience No Comments

The “Internet of Things” (IoT) is the addition of internet connectivity and other sensors to physical objects. Broadband Internet becomes more widely available, the cost of connecting is decreasing, and more devices are being created with built-in network adapters. This movement creates a “perfect storm” for the IoT. That’s why IoT begins to move from ‘next big thing’ to something more and more of us are living with and it’s going to grow even more in coming years and eventually, most of us will use IoT technologies.

Gartner forecasts 21 billion connected things by 2020. That’s approximately four devices for every human being on the planet.

By 2020, more than half of major new business processes and systems will incorporate some element of the IoT. And we, as designers, should be ready for this moment. In this article, you’ll find everything you need to know about the increasingly connected world.

Where Can We Find IoT?

IoT isn’t just one group of devices, the term is used for a big range of connected tools, devices, and services. Technologies are infiltrating the everyday life and things around us are becoming smarter. Common categories of IoT today include:

  • Connected home technology (these are products and services that make home life easier or more pleasant, such as smart thermostats, lighting, and energy monitoring)
  • Nest smart thermostat
    Nest smart thermostat
  • Wearables (such as activity/fitness trackers and smartwatches)
  • Apple watch
    Apple Watch
  • Connected cars
  • Tesla Model S embedded system
    Tesla embedded system
  • Urban systems (such as city rental bikes and parking meters/sensors)
  • Citibike in New York
    Citibike in New York

On a broader scale, the IoT can be used to create “smart cities” which can help us reduce waste and improve efficiency for our environments (e.g. energy use). Take a look at the visual below to see what something like that can look like.
Smart cities

5 Principles To Remember When Designing for IoT

Design is the critical component that bridges IoT technology’s potential with meeting real human needs. And it’s not surprise that IoT is a hot topic for designers today – it opens the door to a lot of opportunities but also to many challenges. While there are a huge array of things to consider while developing a IoT product, you’ll be more likely to gain traction if you keep following 5 principles in mind:

1. Design IoT Only If It Enhance User Experience

Just because something can be connected to the internet doesn’t mean it should be. IoT design requires a sharp focus on user needs because IOT products succeed only when they solve real problems and make users’ lives easier. Thus, if you want to connect something to the internet, you should have a clear answer on the question “Why do I want to do it?” User research should be a critical early step in any solid IoT UX project. Using insights gained from your research can help you explore the interaction contexts well before your team is burning hours designing or developing.

Making the ‘thing’ an IoT make sense only if it solves a real problem for the user. If connecting a product to the internet doesn’t enhance the experience, then don’t do it.

2. Create Good Onboarding

In the world of IoT getting your users up and running isn’t as simple as in a world of web or mobile apps. In addition to account creation, IoT devices usually require a proper configuration. Without a good onboarding experience, the setup phase might be really hard for the first-time users and there is a great possibility of user frustration or failure. That’s successful IoT product (like Nest) have set a relatively high bar for onboarding.

3. Prevent Glitching

Everyone experience occasional glitches in digital products. One common example is slow loading time on websites. Of course, it’s definitely frustrating when loading takes ages, but we are used to this. By contrast, we won’t expect real-world objects respond to us with glitches. When we turn off the lights in our room, we expect an immediate response. However, when we interact with a physical device over the internet (e.g. smart lighting system), that interaction might have the same latency issues as the website. So there’s the potential for delays in response. This could make the real world start to feel broken. Just imagine if you turned your lights off and they took two minutes to respond or failed to come on at all. As a designer, you should prevent all possible situations that can lead to glitch.

4. Make Sure It Works Locally

When designing for IoT, don’t assume always-on internet connectivity. In real life, IoT devices are often intermittently connected. Thus, it’s good to design for no internet connectivity at first, and see how much functionality can be done locally. Also, UX designers have to ensure that important functions (e.g. home security alarms for IoT Smart home system) continue to work properly when some devices go offline.

5. Design For Security and Data Privacy From the Outset

Security is a big issue. Recent high-profile hacks have raised the spectre of IoT-related security risks. More and more users are examining IoT devices for information about security. These consumers may be increasingly cautious about exposing personal information, especially when it is connected to physical spaces (such a local Wifi network) in their homes. Users might have questions like “Will someone be able to hack into my fridge and thereby get access to my entire network?” It’s your job, as a designer, to alleviate such fears. Always help users understand the security of your service by providing this information upfront.

Conclusion

A new generation of IoT is going to enhance our lives dramatically. We will spend less time on monotonous, boring tasks and will have more time to do what’s really important – like spending more time with our family or friends. I really hope the principles mentioned above help get your IoT effort aimed in the right direction.

What You Should Know About VR

By user experience, user interface No Comments

In the last few years, we’ve witnessed an explosion in virtual reality (VR) devices and apps for them. VR is emerging as a new medium with the potential of having as strong an impact as radio or television did in the past century. According to the Heather Bellini of Goldman Sachs:
“We expect virtual and augmented reality to become an $80 billion market by 2025, roughly the size of the desktop PC market today”

Oculus Rift
Oculus Rift is the first high-end virtual reality headset sold on the retail market.

With the increasing popularity of VR, a design is evolving to incorporate its requirements and new capabilities.

Where Can We Use VR

VR is giving birth to an entirely new arena for entertainment, education, collaboration, communication and marketing. The following are some general categories that will merge with VR:

Gaming

All types of entertainment activities can be amplified with the integration of VR. VR makes it possible to put your users into a 100% designed space with predetermined tasks while giving the user total control of moving, exploring and learning within this space.
VR for gaming

Learning

VR can have tremendous implications for education — education can be both more engaging and effective. VR can be used for educational classes, labs and demonstrations. To make education experience truly immersive, designers should consider how users may interact with objects.

VR for learning
Microsoft Hololens for medical education

Training

Using VR, training simulations for professionals like drivers, pilots, doctors and police officers can become more accurate, complex and cost-effective.

VR for training
Image credit: Wareable

Big companies like Toyota see the educational potential of VR. The latest training simulator from Toyota – TeenDrive365 system – is focussed on teaching new drivers about the risks associated with distracted driving.

VR for training
Toyota driving simulator.The driver is in a fully immersive virtual environment – and that includes passengers, traffic, buildings and roadway obstacles.

Prototyping

VR can greatly enhance prototyping and testing phases for engineers, with all types of projects from a handstick design to new car designs.

VR for training
The hologram and the object on the screen are synchronized and this makes spatial application part of the production pipeline, not just an isolated island. Image credit: Solidsmack

Communication

Communicating will drastically change with the help of VR. VR makes it possible to create a brand new experience for video conferencing services, such as Skype.

VR for communication
Remote collaboration using avatars.

Shopping

VR makes it possible to blend the online and offline shopping together. Instead of looking at a 2D image of an object online, shoppers in VR will have the ability to pick up an object and look at it in detail. Alibaba Group, Asia’s biggest e-commerce company, divided into virtual reality later last year.

VR for training
Alibaba’s VR shopping. Buy+ technology allows customers to browse 3D images of products and make real-time payment in a virtual mall as if they were shopping in the real store.

Creating VR Experience

Creating a VR experience is much more complex than traditional 2D experiences, which presents designers with a whole new set of challenges. There are currently 4 core considerations for the design of virtual reality experiences:

1. Make Sure Users Don’t Get Motion Sickness

The most important quality to creating any successful UX design is ensuring that users are comfortable throughout the experience. This is especially true in the context of VR experience. Motion sickness (when physical and visual motion cues give a user adverse information) is one of the most common problems of VR experiences. Humans evolved to be very sensitive to vestibular ocular disparities (disparity between the movement and what we’re seeing). So reducing motion sickness is very important for VR systems. The keys to preventing users from getting motion sick while using VR are

  • Always maintain head tracking. VR software should constantly track the user’s head and eye movements, allowing the images to change with every new perspective.
  • Prevent performance degradation. If the system freezes even for a split second that’s going to trigger a lot of motion sickness.

2. Develop Easy-To-Use Controls And Menus

Same as for traditional UI interfaces navigational menus and other controls should be easily accessible and user-friendly. Unfortunately, there’s no universally accepted way to designing menus for VR interfaces. This is a challenge that designers are still working on. However, this doesn’t mean that we can’t transfer existing (2D) practices to 3D. It’s absolutely possible to place the menus on the user’s VR hands. One of such menu interfaces is Hovercast. All menu actions – including navigation between levels – are controlled by simple hand movements and reliable gestures.

VR navigation menu
Hovercast is 2D menu interface for VR environment. Hovercast radiates from the palm of your hand and you can interact with menu items using the index finger of your opposite hand.

3. Ensure Text Is Readable

All text elements should be clear and easily legible, preventing eye strain. The resolution of the VR headset is pretty bad. Because of the display’s resolution, all UI elements in VR will look pixelated. This means that text will be difficult to read. But you can avoid this by using big text blocks.

VR text
Consider the readability for different text section in this VR game. Instructions are almost unreadable. Image credit: Mozilla

4. Use Sound To Create Immersive Experience

As designers, we often don’t think about sound and audio. When we do that we miss an opportunity to communicate more information through a different set of senses. When we have audio sources attached to the objects we create much more realistic environment — if you’re telling a brain that it can see the object and it can hear the object then the object must be real. Try to build a mental image of the environment via sound:

  • Introducing the user to the environment via soundscapes. The audio can be used to give the user the illusion of being in the middle of a particular environment.
  • Guiding the user with sound. By applying positional audio and 3D audio effects to VR, the user will know the direction in which certain sounds originated in relation to where they are.
VR sound
Music and high-quality sound effects are a pivotal feature to encourage experience immersion. Image credit: Google

Conclusion

The possibilities for VR are endless. Soon, all types of companies will be seeking to extend their brand presences into this space. I hope I’ve made the VR space a bit less scary with this article and inspired you to start designing for VR your project.

By Uncategorized No Comments