A case study delving into the challenges encountered with chatbots in messenger applications, and presenting actionable strategies to enhance their usefulness and functionality.
Introduction
In 2016, I embarked on a personal side project, inspired by the challenges we faced while developing a chatbot that acted as a marketing sidekick at my former company, Crowdfire. This project fueled my desire to create a conversational experience that would imbue bots with delight, usefulness, and high functionality. However, I grew increasingly concerned about the prevalent use of scripted chatbots, characterized by predetermined flows. These chatbots often lacked engagement, leaving me with little enthusiasm to utilize them. Their unpredictable outcomes made even simple tasks, like ordering pizza, unexpectedly more exhausting than using a traditional app.
The Outcome
As part of this case study, I aimed to demonstrate a proof of concept through the development of 'Slash Messenger' — a fusion of a social network, messenger app, and app store. The primary objective was to cultivate more intimate connections among users while exploring the potential of leveraging chatbot technology for brands. My focus centered on creating an experience that caters to the needs of end-users, offering practical features with real-world applications that enhance convenience and enrich their daily lives.
Project Overview
Analysis
Messaging apps have surpassed social networks in terms of usage, driven by factors such as increased privacy, direct communication, real-time interactions, convenience, and content sharing without public profiles. Over 2.5 billion people had at least one messaging app installed in 2016, and this figure has risen close to 5 billion in 2022. Facebook Messenger and WhatsApp lead the market. Chat apps are now akin to the new browsers, with bots anticipated to become the new websites, ushering in a new era on the Internet.
Brands in Messaging Apps
Brands are increasingly utilizing messaging apps as a means of reaching and engaging their audience. This includes leveraging chatbots for automated interactions, sending sponsored messages, providing customer service, distributing content, incorporating e-commerce functionalities, managing loyalty programs, and harnessing influencer marketing campaigns. Messaging apps offer brands a convenient and engaging platform to connect with their audience in real-time, providing personalized experiences and driving conversions. Brands are capitalizing on the popularity and convenience of messaging apps to create innovative ways of connecting with their audience and enhancing their overall brand presence.
The Challenge
Creating chatbot scripts presents several complexities, including managing dynamic user inputs, addressing scalability issues, overcoming limitations in natural language processing (NLP), and seamlessly integrating with backend systems. Businesses lacking expertise in chatbot development may struggle to grasp the intricacies of conversational design. However, I believe this is not their fault. With the rapid advancement of absolutely everything, it can be very easy for individuals and small businesses to be left behind. Without the ability to invest on an in-house tech team, or big-name SaaS solutions, smaller teams miss out on little ways digital tools can improve their days.
The Impact on End-Users
Chatbots often struggle to provide a satisfactory user experience due to their inability to mimic human-like conversation with pre-determined scripts. They lack contextual understanding, emotional display, and nonverbal cues, making it challenging for users to feel understood and engaged. Additionally, chatbots may encounter difficulties in handling complex queries or responding to unexpected inputs.
User Expectations
Today's users have elevated expectations for digital platforms. They anticipate seamless connectivity, personalized interactions, convenient access to information, and a sense of community. They also seek intelligent assistance, quick responses, and tailored recommendations. These insights emphasize the need for user-centric solutions across social media apps, social networks, and chatbots, ensuring enhanced experiences that foster engagement and satisfaction.
Approach
Planning Taskflows
Taskflow planning focused on achieving speed, accuracy, and convenience as key design goals. To achieve this, I carefully identified specific actions that could be executed more efficiently with the assistance of a bot, such as fetching relevant results and applying additional filters to queries for better precision. Conversely, I also recognized actions that would be slower to perform with a bot, such as making subjective decisions based on personal preferences or executing tasks that typically require a single tap on traditional applications, like filling out forms without the necessary autofill information.
To capitalize on the strengths of chatbots, I aimed to distribute the workload accordingly, assigning actions that could be accomplished faster through the bot, while presenting the remaining tasks (primarily single-tap actions) to the user. The envisioned solution was a hybrid interface that combines a chat-based interface for queries and seamlessly integrates screens that mimic conventional apps, allowing for user interaction when necessary.
Sketching Solutions
To effectively execute the planned taskflows, I began by outlining the interactions involved. My objective was to create visual representations of various real-world scenarios and applications, including but not limited to tasks such as ordering food, booking movie tickets, and searching for news or information. Additionally, I noticed that brands on most messenger apps lacked vibrancy and personality, so I envisioned incorporating features that would allow them to showcase their unique identity within the app.
The Concept
Showcasing Brand Personality
When designing the Chat interface, the main objective was to create a versatile shell that effectively showcases the unique personality of various brands. To achieve this, I made the decision to utilize real-life imagery and assets instead of generic stock imagery. This approach eliminates concerns about whether the inline previews would look great, as the design language is practically invisible, allowing the brand identity to take center stage and showcase its own unique flair. The platform seamlessly handles this process by providing rich inline previews and interactive elements, ensuring a visually appealing user experience.
Additionally, users have the flexibility to communicate with the bot through three input modes: typing, voice commands, and tap-based interactions, providing added convenience to suit individual preferences.
Customizable Components for Brands
Slash offers a unique departure from conventional messaging apps by empowering brands to utilize customizable pre-built components that adopt the brand's designated accent color, enabling them to showcase their distinctive personality. For instance, when ordering coffee, users can effortlessly browse the menu, personalize their order, complete the checkout process, and securely make payment—all accomplished with a few simple taps and far more expediently than engaging in numerous text exchanges with a chatbot. This approach delivers an intuitive purchasing experience that resonates with individuals, thanks to the familiarity of the flow's patterns.
Creating a Component Library
I created the component library by prototyping brand-specific bots for practical applications, enabling convenient access to popular services within a single app. The objective was to provide users with a delightful, consistent, and reliable experience. In designing the components, my focus was on reusability and modularity. As illustrated below, a single card component could be used across industries like restaurants, ticketing, news, and e-commerce, simply by selecting the appropriate variant. All assets used, such as articles, products, and media, were obtained directly from brands without modifications, showcasing Slash's plug-and-play nature and minimal integration effort for brands.
In-App Everything
The true power of a messaging app becomes evident when it seamlessly integrates all necessary functionalities within the app itself, eliminating the need for redirections or switching between different apps or browsers. Such disruptions are universally disliked and must be eliminated. Let's consider the scenario of planning a movie outing with friends as an example. With Slash, you can effortlessly share a review from the New York Times bot, open links securely in an in-app browser, enhance coordination and planning by adding bots to group chats, conveniently select seats and showtimes through a user-friendly interface provided by the component library, and even complete the payment and checkout process without leaving the group chat. Moreover, the bot ensures that the tickets are automatically shared within the group, eliminating the hassle of forwarding them to your friends.
Visual Design
In shaping the app's design, my ultimate goal was to create a discreet and unobtrusive visual language, providing brands, users, and communities the freedom to personalize the app to their liking. It needed to be a design that seamlessly blends into the background, allowing the presented information to command the user's attention. This philosophy guided the choices made in typography and component construction, prioritizing a minimalist and understated approach. However, when it came to the color library, I opted for an energetic, playful, and delightful approach. Additionally, in representing bots, I chose an illustration style that portrays them as friendly and helpful assistants, incorporating a touch of humor and whimsy into their expressions and demeanor.
