There’s one quality that you’ll find in all good SaaS startups. The magnetic quality that makes the audience fascinated, makes people watch every brand’s move. This quality was inherent in the go-to-market strategies of companies like Slack, Figma, and Stripe.
We are talking about confidence, that pumps out the message:
I’m changing their industry. I know what I’m doing. And I do believe it’s important and true.
- Figma claimed to provide “a better way to design”. People believed the claim and massively moved from Sketch to Figma.
- Stripe declared, “Payment processing. Done right,” and now the company is valued at almost $100 billion.
- Slack promised to kill emails and fulfilled the promise, entering along the way Silicon Valley's hall of fame as the fastest growing business app.
You see those tough taglines, and you feel that’s a high flier. When ambitious startups make bold promises, confidence triples their chance of success.
The problem is that words have to become deeds.
Figma managed to innovate design collaboration. Stripe really made the lives of small businesses easier. Slack offered a novel product that worked much better than internal emails, just like it promised. That’s why their confident taglines worked.
Often, the momentum behind a great idea dies when a bar has been set too high and a startup can’t cope with building a really game-changing product.
Let the race begin
A line between confident success and overconfident failure is very fine. So it’s always intriguing when a new very ambitious startup takes a run-up. How will it end this time?
Today, the focus of our attention is going to be CRON, a new productivity app that calls itself a next-generation calendar.
Oh my, that sounds ambitious. It looks like CRON wants to lure people out of their established Google, Apple and Microsoft work ecosystems. With such a bold plan, the app should be something special.
The argument for CRON’s future success is that in 2021 it won Product Hunt’s Best Productivity App of 2021. Moreover, Notion believed in the company’s triumph and acquired it recently.
Is the app worth it or not, that is the question. To answer it, we turned to three product design experts from Eleken UI/UX design agency.
Here’s what they say.
“Not impressed very much”
That was the first reaction of Maksym, Eleken’s Design Director after he reviewed CRON for the first time. Even though he spotted some valuable features:
“I liked the sidebar on the right, which opens when you click on an event. On the side, all the information about the event appears, with a highlight on the main action — a Zoom call, for instance”.
The menu bar also shows upcoming meetings, makes meeting links available in one click and includes other UI/UX gems that save lots of hectic time. The bar is one of CRON’s signature features that earned much love from users.
However, it’s not all rosy in CRON’s user experience if you listen to Maksym:
“It is not very obvious how to add a new event. Google Calendar has a big "Create" button, but I didn't see such a button in CRON. Maybe I missed it, but it seems to be a big flaw in terms of UX. It should be possible to click on a button at any moment to create a custom event instead of looking for the date and time on the grid.
And even creating an event on the grid is not obvious enough. In Google Calendar, you can click anywhere to open a window for event creation. Here you need to either double-click or right-click.”
Overall, Maksym doesn’t believe in the idea of a game-changing calendar app. Apps that are trying to innovate this market are based on the Google Calendar functionality and can’t really offer anything revolutionary.
One thing that, according to Maksym, sets CRON apart from other calendar apps is its remarkable visual design and fancy dark theme. Apparently, Maksym wasn't the only one who found CRON’s interface attractive.
“Compelling design and incredible attention to details”
Natali, a UI/UX designer at Eleken, immediately noticed CRON’s polished look, and it's no surprise. Raphael Schaad, Head of CRON, is a designer who aimed to create a design-first app. And he has succeeded: CRON has a pleasant UI and can do a ton of little delightful things that Google or Apple calendars can’t.
“I love how everything is kept in the same style, with many different integrations. And it's cool that the app works in a minimized mode.”
But is it enough to fight the inertia and make people switch from the apps they already use?
“I can’t say that CRON made something outstanding. I wouldn’t leave my standard calendar for it”.
For Natali, CRON lacks some fundamental improvements to basic calendar functionality that can make people choose in its favor. Her colleague, however, disagrees with this.
“CRON has a few things that matter to me”
Ihor, a UI/UX designer at Eleken, doesn’t use calendars very actively. Working in a design agency, you don’t usually have a ton of meetings with overbooked people. So 80% of CRON’s features don’t matter for Ihor, but among those remaining, there are a few really helpful ones:
“Sometimes I need to book a meeting with somebody from a client's team. It’s not an option to ask people when they are free all the time, but Apple calendar offers no other option. Google Calendar enables a side-by-side view of my schedule and the person's schedule to see what time slots you both have available. CRON went on and made availability sharing available in just one click”.
Availability sharing is probably the most prominent CRON feature so far. With one click on your team member’s nickname in the sidebar and you make your scheduled meetings overlap and choose a time that suits both. The feature is not new in the world of calendars, but this is one of the main CRON advantages compared to Apple and Google.
But Ihor found another advantage:
“Apple calendar has a noticeable delay between the moment when changes were made and the moment they update on your computer. Sometimes it is that somebody says they have scheduled a meeting with you, but your calendar shows nothing until you refresh the page several times. With CRON you don’t have such an issue because everything happens in real time”.
Well, now a fly in the ointment:
“As a big fan of command menus, I can say that CRON's has serious room for improvement. It’s pretty basic now, I’d prefer it to get inspired by Todoist and allow me to schedule events using natural language, like “block two hours in the morning tomorrow”.
According to CRON’s official Twitter account, the app's command menu won't upset Ihor much longer. Human-formatted due dates are coming soon.
Behind the hype
We are witnessing a boom of new calendar apps. CRON, Daybridge, Amie and a dozen of other products attack the bastions of Apple, Google and Microsoft calendars.
They clean up the look, upgrade the layout and add some new quirks, but still build themselves up on the basis of old-school calendars. Will it be enough to overtake the legathy of conventional solutions and the network effects of huge corporations? Time will tell.
If you need greater certainty in your own app’s success, involve experienced UI/UX designers at the product discovery stage. Just in case, Eleken designers are always happy to get involved in game-changing projects. Drop us a line.
Top Stories
Must Have: Personalized vs Customized in the User Experience (With Lots of Examples)
Words “personalization” and “customization” are often used as synonyms. And it’s not surprising as they both exist to serve the same goal: improve user experience by adjusting features and content to specific user interests, needs, or problems. But, as we’re talking about personalization vs customization here, there is obviously a difference between the two.
As a UI/UX design agency, we had a chance to create personalized user experiences, and work on customizable features within products. Based on this experience, we can say that businesses, whose products are aimed to satisfy a versatile audience, should definitely know the difference between customized and personalized UX to apply them correctly.
So, let's define both terms and compare how companies improve user experience through customization vs personalization.
The difference
We’ve already said that both personalization and customization are aimed to create unique user experiences, individualizing information they see and this way making products or services more credible and tailored to specific user needs.
So what’s the difference between them?
Personalization is done by the system/application that the user interacts with. The software gathers customer data (like purchase history, browsing history, location, job position, and so on) to recognize their wants, and uses predictive technology to adapt experience and content accordingly.
Customization is done by the user who adjusts the app on their own to meet their wants or preferences. The software gives users the opportunity to choose what features, content, layout, and so on they want to see.
Take a look at the image below to better understand the difference.
So, you want to listen to music in the background while studying. The result you will achieve with a customized or personalized experience will be the same: you will listen to classical music at a low volume. But the path to this goal will be different.
With customization, you adjust the volume independently. You clearly understand what you want and are in control of making the desired changes to improve your experience.
With personalization, the app guesses your need (by taking into account that you’re listening to music after midnight) and sets the volume low for you to improve your interaction with the system. As a user, you make no additional effort.
Here are some more examples to better understand the difference between customization and personalization.
Customization:
- A music app asks you to choose genres you like to create your personal music feed.
- In your smartphone, you create different folders to organize your apps, change the skins, functionality, and push notifications the way you like.
- Using the dating app you change the information in your profile (like your age, pronouns, profile picture, location, and the like).
- In a social media application you hide some type of content or choose it to only be shown to your friends.
Personalization:
- An online store gives you product recommendations based on your recent searches.
- Banking app sends you an alert when your account balance falls below a certain limit.
- A cab booking app gives you quick access to the departure point for your previous trip.
- A project management software shows you different dashboards depending on the job position you have in your company.
Personalization or customization: what is better?
In one sentence, personalization and customization are equally useful as they put the customer in the center and make the business revolve around them. So, if your business requires dealing with customers, you should tailor an experience for them.
But of course, they both have advantages, disadvantages, and use cases where they work best. Let’s dive into more details.
First of all, let’s figure out why tailoring your product to specific user needs is important.
Here are some statistics:
- McKinsey Personalization Report states that personalization has the potential to increase company revenue by 40%.
- According to Smarter HQ, 90% of consumers are eager to give businesses access to their personal behavioral data in return for a more affordable and simpler experience.
- Epsilons research states that 80% of customers are more likely to buy from a company that offers personalized experiences.
- State of Personalization Report by Twilio says that unpersonalized user experience will cause a business to lose 62% of consumers' loyalty in 2022, up from 45% in 2021.
- Adobe says that customers are irritated by non-individualized content in 42% of cases.
As you may have guessed from these statistics, customization and personalization provide many benefits for businesses. Below are three of them.
- They improve user engagement. Users want to receive content that matches their needs, and when you manage to give them exactly what they want, they feel that your company values and cares about them and their interests. As a result, customer relationships become stronger and users are more willing to interact with your product.
- They encourage customers to come back. Personalizing and customizing provide a distinctive and more personal experience for every user, increasing brand loyalty and encouraging them to choose you over competing brands.
- They increase conversion. You may draw in leads with a high possibility of converting by using tailored content to target specific categories of users. Additionally, it will save your sales department the time and effort they would normally spend cultivating cold leads.
Now, let’s discuss when businesses should use customization and personalization, as well as their advantages and disadvantages.
Customization
Customization improves the user experience by giving customers control over their interactions. It allows users of your website or app to choose exactly what they want to see, ensuring that you are only presenting the content they are interested in.
That’s why customization would be a simple first step you can take to adjust user experiences if your brand is just launching into the market. But to make the customization of UX work effectively, businesses have to ensure that users understand their goals and wants well.
The advantage: as users are in control, they can receive precisely what they want. Additionally, unlike with personalization, users are not so concerned about privacy matters.
The disadvantage: most users don’t know their true needs and lack the motivation in making an effort necessary to customize the UI to suit their preferences.
Personalization
As personalization is based on user data that the system collects over time, it can be effective when users aren't aware of their needs and have to sort through a great amount of information.
Companies usually choose to enhance a product’s UX with personalization when they have several clearly defined buyer personas with different needs, or when they have reliable tools, enough sufficient data, and resources to provide users with individualized experience.
The advantage: personalization makes the user experience simpler and more convenient without requiring any effort from users.
The disadvantage: when it comes to personalization, user privacy is an issue. Some people find the experience confusing, even terrifying since the system collects information about their preferences, especially if the content they get is very accurate.
As the final point here, I’d like to mention that you should be very careful when tailoring your product to the users’ needs, as the line between “enough” and “too much” is actually fairly thin. Extra customization or personalization can make the process of interacting with your product tedious, excessive, or even creepy. That’s why try to define how much personalization is enough for your specific case.
Real examples of personalized and customized UX
Personalization and customization are already widespread across brands of different sectors and sizes and there’re many different approaches to providing a more compelling customer experience with their help.
Here are some customization and personalization UX examples that show how different companies implement these concepts.
Spotify - personalized playlists
In order to retain users in the app, Spotify offers each customer a tailored listening experience with the help of AI.
A “Discover Weekly” feature allows users to receive personalized playlists based on their streaming history, listening patterns, and favorite artists from all of Spotify's active monthly users. The company's discovery and recommendation AI engine creates these lists, allowing users to discover new music and artists even if they don’t know what they want to listen to.
Reddit - relevant posts for each user
Reddit has a great amount of helpful, interesting, and sometimes weird content on their platform, and they are doing their best to make sure each user gets the content they like in their feed. Customization and personalization help them with this goal.
- Customization: The user can choose what content they want to see or vice versa to avoid by adjusting Feed Settings on Reddit.
One more example of how Reddit uses customization is the “What are you into?” pop-up that appears during the sign-up process. This way, the platform starts discovering your interests to be able to offer relevant content from the very beginning.
- Personalization: Reddit analyzes info about their users (such as location, and device info) plus their activity (communities they join, votes, browsing info, and the like) to make intelligent assumptions about what posts may be interesting or useful to a certain user.
Netflix - using A/B testing to provide the best personalized experience
Every action that Netflix does is informed by data and guided by sophisticated AI algorithms. To make sure that the information shared on its platform reflects the users’ wants precisely, the company is constantly testing and brainstorming new ideas.
This is why Netflix benefits greatly from its personalization features.
The fundamental component of Netflix's data-driven strategy is A/B testing. To assess how consumers respond to the recommended adjustments, each of these tests offers them a choice between two alternative versions of the same experience. This is one of the reasons that two users of its platform won’t have the same experience.
For example, if you’re into horrors, over some time (when a platform learns your habits and preferences well enough), your recommendations on Netflix will be mostly related to this genre.
Even the thumbnails for the videos are tailored to the user. For example, depending on whether you mostly watch romantic movies or prefer comedies, you'll see a different cover for the movie Good Will Hunting.
Airbnb - giving personal recommendations based on user location
Airbnb uses location tracking to recommend places and activities that you may find interesting based on the place where your stay.
For example, it may advise hotels close to you, or show you the locations you may visit, where to dine, surf, do shopping, and so on. As well, based on your previous searches, the software can suggest what places are worth visiting.
All the above-mentioned companies are real giants in their industries. Now, I want to give you some examples from our experience to show that not only well-established companies can benefit from tailoring their content to specific user needs, but smaller businesses can successfully implement customization or personalization too.
Gridle - optimizing the workflow with customization
Gridle (now Clientjoy) is an all-in-one cloud-based CRM system that provides full client lifecycle management automation to small and midsize businesses. Our task on a project as UI/UX designers was to rethink the look and feel of the software to make small businesses more efficient in interacting with their clients.
To make the right design decisions and also understand and prioritize users' needs correctly, we conducted six one-hour user interviews. As a result, we found out that one of the users' wishes was to see “custom fields and some other customization” in the new Gridle version to get better at managing their clients.
Here’s how we implemented customizable features in the software to help users feel more professional and confident while using software:
- When sales managers build a sale funnel, they can choose a more convenient way for them to display it: Kanban columns or lists.
- Users can choose the attributes they want to see in a client database and use filters to quickly find the data they need.
- Users who work with invoices can select customizable invoice templates that let them quickly add the necessary client information.
As all our ideas of customization were informed by insights from user research, the user feedback about this new revamped version was very positive.
Acadeum - role-based personalization
Acadeum is software that allows universities to share and sell online courses. Eleken was hired to redesign the platform while making it consistent with the existing design system.
A part of our work included creating a personalized user experience within the platform. Here’s how we implemented it:
- For the system to be able to provide the most relevant course recommendation to the user, newcomers are asked to give answers to several questions as part of the sign-up process. This way each individual receives their own personalized experience.
- Acadeum is used by different types of users (for example, advisors, student consultants, institution admins) that have different requirements for the platform. To tailor the app to their requirements, users can select their role, and depending on it, the platform will give access to information that fits their needs most.
Textmagic - customization for a simpler user experience
TextMagic is a SaaS text messaging platform for businesses that’s been on the market for more than 20 years already. When they came to Eleken, they wanted to develop products for their new Marketing Suite with SMS and email marketing campaigns and live chats.
Adding a lot of new functionality to the platform may end up with a poor and confusing user experience. One of the methods we used to reduce the complexity and design for simplicity was the customization of certain features.
- Support manager who operates live chats can customize chat widgets so that they stay consistent with their brand.
- We created an easy-to-use drag-and-drop editor and added the possibility to edit the HTML for TextMagic users to easily customize their email campaigns.
Populate - saving doctors’ time spent on documentation with personalization
Populate is a healthcare startup that wanted to cut down the time required for documentation, this way helping clinicians spend more time engaging with patients.
Populate offers a solution that combines AI-powered technology with consistent UX design for generating visit note templates depending on the problem a patient has.
- A patient independently fills in their personal information including the history of illness before visiting the doctor.
- AI processes this information and generates a personalized template taking into account specific patient cases.
- As a result, a doctor receives a ready-to-use visit note template that contains only the necessary fields and nothing extra.
To design a template that would perfectly suit the doctor’s needs and truly simplify their work, we were constantly testing our designs with potential users.
For customization and personalization start with learning your users
The successful implementation of customization or personalization is based on thorough user research. You have to learn what your customers actually want or struggle with and carefully plan how to tailor your app according to those needs.
But neither personalization nor customization can improve a user's experience of a product that already has issues with its UX. For example, in case your users have trouble finding relevant information because of a complicated app’s structure, the solution may be not to give them highly personalized recommendations but to improve the product architecture first.
And this is where you need to find someone to provide you with high-quality UI/UX design services so that you can identify the problem correctly and develop a proper strategy to solve it together.
Eleken can become your dedicated design partner. Contact us for a free consultation.
How to Design Integrations Before You Build Them: Step-By-Step Workflow
Almost every task that SaaS software user has to complete involves interacting with several tools at once. In fact, on average, clients of B2B products access about eight different tools during the day. They get used to switching between browser tabs, sometimes even without thinking of it.
To enhance this experience and attract more clients to their products, SaaS companies invest in building integrations. However, from our experience as a UI/UX design agency for SaaS, we can state that integration design that would add maximum value to your users’ experience and meet their end goals requires a lot of planning and thorough research before moving to the technical implementation. That’s a challenging process even for experienced designers.
To help you deal with this complex task, in this article, we will share with you a step-by-step plan on how to design integration. But first of all, to convince you that the game is worth the candle, here are several benefits of integrated design.
Benefits of integrating SaaS products with external and internal systems
Software never exists in a vacuum. Each app lives in its ecosystem with numerous rivals, alternatives, and potential partners. There’s probably no customer in the world that can satisfy all their needs using one technology only. So, in today’s crowded market, numerous businesses choose to build integrations to help them
- Save time.
Perhaps this one is the most obvious benefit of all and the main reason for many businesses to employ SaaS integration. Integrations save time by allowing companies to automatically transfer data between apps without having to enter it manually. Users just need to set up the initial integration quickly and can start taking advantage of the possibilities it gives.
For example, imagine you use Shopify to run your online business, and Freshbooks to send invoices, track expenses, and fulfill other accounting jobs. You need all the info about online purchases to be forwarded to the accounting system so that orders can be booked and processed by your team. Thanks to integrations, the information could be automatically transferred from Shopify to FreshBooks, so you won’t need to do anything manually. What a time saver, right?
- Reduce human error.
When people enter data manually there's always a risk of making a mistake that can cost hundreds or thousands of dollars (even if it's a very tiny mistake). You then have to invest time and energy into identifying and fixing the problem, not to mention the reputational damage that may be done to your vendor or yourself as a result of the blunder. With integrations, you can automatically transfer the needed information from one app to another without having to rely on a third party. This greatly reduces human error or even eliminates it.
- Increase transparency.
When your teammates have urgent questions, they need to search for an answer either by checking one of the numerous apps your company uses or by approaching coworkers for an update. With integrations, they can quickly find the needed info by accessing a tool they know best. This way everybody on your team can be aware of the latest updates without having to bother and distract their coworkers.
For example, if your team member connects Slack with their Salesforce account, they’ll instantly receive a notification to the Slack channel when an opportunity stage changes or a quote is approved. That’s how your team has the needed information in the right place, at the right time.
- Increase the chance of turning prospects into paying users.
More than 90% of participants of the SaaS integration survey conducted by MuleSoft and THINKstrategies, says that integration with other systems is “important” or “extremely important” in luring new customers. This way, if your product integrates with another SaaS software that your prospects use, it gives additional reason for people to choose you over competitors. More integrations - more reasons for customers to pay for your offer.
So, integrations positively influence your business in many aspects. If you were hesitating to whether build it or not - it's definitely worth it. But here comes the difficult part. The thing is that your users don’t actually want any software integration. What they really need is the smooth and intuitive cross-product experience this integration can provide. And a step-by-step workflow that we’re going to provide you with in the next section can help you fulfill this task.
7 steps of integration design workflow
Here’s a piece of advice for you before we begin: to make the process of data integration design easier and more effective, start with the big vision - identify the overall goal you want to achieve, and then gradually break it down into smaller tasks until you get to such specifics as determining what data you want to move into each particular field.
With this recommendation in mind, let’s see what your design process may look like if we break it into a step-by-step plan.
Step 1. Define the business case
The business case articulates the primary goal and central topic of the integration project. It should provide an general overview of the integration without diving into too many tech details.
The business case is created based on the market and user research but there’s no universal format it’s supposed to have. Just make sure it describes the benefit that stakeholders would receive once they have this integration, and the competitive advantage your company would get from it.
A business case may look something like this: “By integrating our CRM system with X enterprise resource planning (ERP) software, we can improve visibility and coordination across our entire organization. This integration will enable our sales team to view real-time inventory levels and product availability, allowing them to better manage customer expectations and improve order fulfillment. At the same time, our finance team will have access to the customer order bases and other valuable data, which will help them to more accurately forecast demand and manage cash flow.”
Step 2. Describe use cases
Following our recommendation of moving from broad to narrow, the next step should be deconstructing the business case into smaller, more manageable units, or use cases.
The thing is that when you connect two systems together they usually perform more than one function, and that's what use cases should describe. In other words, they should communicate what your integration can do, not in tech but in a business-oriented manner.
As well, use cases shouldn’t depend on one another, as in the next step of the workflow, you’ll have to continue breaking them into smaller units. But don't get into too many details when writing a user story, try to keep it short and clear.
For that purpose, you can use
- Job-to-be-done framework
- User story format
Here’s an example of a use case in a user story format: “As a chief financial officer, I want sales from a CRM to flow directly into the ERP, so that I would be able to report on actual sales data without re-entering every quote from every sales rep.”
Step 3. Define data flows
At this stage we finally move from determining the benefits integration would bring to your business and users to defining technical requirements.
A data flow describes what type of information moves from one system to another, and what it looks like at the outcome. Usually, you can define up to 3 data flows for each use case. If you end up getting more than that, the use case is too broad.
The data flow should also describe the information that moves in one direction. Defining a bidirectional one may mean you have a use case where more than one data flow is necessary to provide value to users.
So, to define a data flow you need to indicate
- The system to which the data is moving.
- The system from which the data is coming.
- The type of data that enters the target system.
- The type of data that leaves the source system in order to produce data that enters the target system.
Here’s what the data flow description may look like: Customer contact information plus purchase history from your CRM system to the ERP software.
Step 4. Specify triggers
As you might have noticed in the previous section, while data flow answers the question of “what information moves from one system to another”, it doesn’t tell us when it happens. That’s the task for triggers.
Triggers state what should happen for a certain type of information to move from one system to the other.
There are several activities that can serve as triggers, such as an event happening in the source system (a user submits a form, posts a comment, or the like), meeting query criteria, placing a file in a defined location, or manually triggering a flow.
Here’s an example. “When a user submits a form in a CRM system, a webhook is triggered and sends the data to an ERP system.”
Step 5. Define outcomes
As the name implies, the outcomes specify what happens when data reaches its destination (the target system).
Naturally, there should be something that would indicate the end result of the data flow. It can be a success status response provided by API (application programming interface) or just the absence of the error message. But not all the outcomes are successful, and it’s crucial to describe both positive and negative scenarios when designing an integration.
To make your app more reliable for users, you should ensure sufficient support for unsuccessful transactions. Think about what can go wrong when the data moves from one system to the other (problems with a server, invalid data, issues with its validation, and so on), and decide how the system will react to such a problem.
Here are examples of successful and failed outcomes:
- “When the data successfully reaches the target system, the user sees a green “complete icon”.”
- “When the data fails to reach a destination, the user sees an error message and receives an email that explains the reason.”
Step 6. Map data elements that move from one system to another
In other words, this step is about field mapping.
Field mapping is the process of connecting and transforming data fields between different systems. When data is transferred from one system to another, it may need to be mapped to different fields or transformed to meet the requirements of the target system.
For example, if you are integrating data between a CRM system and an ERP system, you may need to map the "customer name" field in the CRM system to the "account name" field in the ERP system. Similarly, you may need to transform data formats or values to match the requirements of the target system. For instance, you may need to convert a date field from one format to another or apply a specific calculation to a numeric field.
Field mapping is crucial in data integration design because it ensures that data is correctly interpreted and utilized in the target system. Without proper field mapping, the data may not be accurately transferred, leading to errors and inconsistencies in the target system. It also helps to ensure data quality and consistency across systems.
Step 7. Test the integration
To ensure the development team gets your vision right and implements everything properly, you can create test cases.
Test cases have to cover each field mapping and show how the integration will fulfill the use cases. They help to ensure that you don’t bring faulty functionality to the end user.
Identifying errors early in the design stage saves money and time compared to doing it when the technical team has already started working. Similarly to this, finding drawbacks during testing is less expensive and quicker than finding them when end users are trying to push actual data via the integration.
This was the last step in our workflow. Below you’ll find some more recommendations that would help you design integration that performs its goal and satisfies its users.
What else to take into account to create best integration user experience
Every integration is unique. Integrations to popular platforms like HubSpot and Salesforce vary from one product to the next. Still, there are some integration design best practices that can be applied to every project and lead to better UX. Here are five of them.
- Make it easy for prospects and customers to find and learn about your integration
Integrations are a valuable addition to your product, but they won't be effective if your users and prospects aren't aware of them. To maximize the impact of your integrations, it's crucial to educate potential users and current customers in multiple ways.
For prospects, it’s best to place the information about the integration on your website to help them self-educate about your offer. To make their experience seamless, take care of making them easy to find with intuitive web navigation, ensure the content that describes the integration is consistent and that your call-to-action buttons convert prospects to users.
For existing users, make sure they’ll be able to easily find the needed integration at the right time. For example, when designing an MVP for a personal finance platform, we placed the ability to connect with the user’s pension provider as one of the onboarding steps. Users get acquainted with this opportunity right after signing up.
Still, if users decide to omit this step during onboarding, they can always find the integration feature in the Pension section.
- Guide the user through the setup process
Even minor obstacles can lead to user frustration and cause them to abandon the setup process. Typically, it begins with the user clicking on a call-to-action button, such as "install" or "connect," on the integration marketplace.
For the users that are already logged in to the system at the moment of installation, the process would be quite straightforward. A smooth setup process can be illustrated with the design we created for Tromzo, a code security app. When a user needs to set up one of many integrations, they'll see all the options on one screen, so there is no need to open the page of the app separately. It's enough to select the needed app and click the continue button.
For users that are not logged in, it's recommended to use deep links to direct users to the integration's listing on the in-app marketplace. It's also important to keep best practices in mind, such as remembering where the user left off and returning them to that exact place after they sign in and making the sign-in process as quick and easy as possible.
- Onboard your users properly
Though we always strive for simplicity, when talking about integration design simplicity is often overrated. Integrations are difficult, especially when customers are not familiar with a certain type of technology. For that reason, you should help users with onboarding.
Consider which type of support they may require in your specific case: documentation, chat support, phone support, or else. People should feel that they have access to the same level of help and that their needs are being met, regardless of whether they require assistance with integration or any other product feature.
For example, HubSpot offers a wide range of training resources to help users understand how to use their integrations. There are courses such as "Getting Started with the HubSpot Salesforce Integration", "Using Zapier with HubSpot,” and so on.
- Give users control over the data flow
Users require an on/off button that would allow them to easily enable or disable the integration's functionality. To ensure a positive user experience, the button should be easy to use. Users should be able to quickly determine if the integration is currently working or not, and they should feel confident that clicking the button will give them the desired result. Additionally, displaying the data flow status once the integration is enabled will help reinforce that everything is working properly.
Salesforce provides an integration settings page where users can manage their integrations with other systems. Users can enable and disable integrations, as well as configure settings such as authentication and data mapping.
- Help users understand if the integration works well or has some failures
For simple integrations, a red/green color may be enough. However, in case the integration is complex and handles critical data, it’s better to provide more detailed information. Specific data records labeled with business identifiers (like an order number) may do well to indicate successful or unsuccessful syncing through the integration.
All in all, the process of designing an integration is rather similar to the one of creating a regular product feature. So, avoid making the mistake of believing that it’s a purely technical problem that only a developer can solve. Designing integration that would bring value to your business and to the end user requires professional UI/UX design services.
If you’re looking for a dedicated design partner with experience working with SaaS products and building integrations, contact Eleken for a free consultation.
Your email has been submitted successfully. Check your email for first article we’ve sent you.
