Widget types

Start with a layout to set up your Raffle widgets in your system as easily as possible.

On this page, you will find an overview of your existing widgets as well as the ability to create new ones.

Raffle offers four different widget layouts that can be customised to fit the environment and layout of your domain(s). Click here to read more about installation and how to start using our AI in a matter of seconds.

Launcher

Displayed as a pop up box at the bottom right corner of the browser window. The widget is often used for chat interfaces or quick search access.

Raffle widget, launcher design

Overlay

Our Overlay widget is triggered by a search icon. It takes over the whole screen, providing an immersive search experience.

Raffle widget, overlay design

Embedded

The embedded widget resembles a classic search bar, with results shown in a dropdown, perfect for more traditional search interfaces.

Raffle widget, embedded design

Inline

Another search bar option, but with results appearing in a side panel. This is a convenient solution for more compact designs.

Raffle widget, inline design

Initial View

This is the initial view when someone opens the Launcher widget.

In the top-right corner is an option to expand the view, so you get even more space to display your content.

You can enable a custom GDPR message in the search-bar that informs your users about safe usage in any way you see fit. Hover the compliance badge to display the message.

Frequently Asked Questions are completely customizable, which allows you to proactively and quickly lead your users through to the answers they most frequently need.

When you initially open the Launcher widget

Search Results

This view is relatively simple. We display the most relevant answers to your users’ questions.

Each answers is a clickable card consisting of:

  • Breadcrumbs that show the path of the answer. Clicking this will take you directly to the source URL and lead you to the relevant section of the content.
  • Title
  • Small preview of the answer section
  • File indicator - if the answer comes from a file (e.g. pdf), we display the file type

Moreover, you have the to option to display a custom message below the search bar for any purpose you see fit.

After having asked a question, we display the answers

Top Bar

We’ve separated the search bar from the answer view to have a more natural separation of navigation and content. This has been compiled into a top bar that contains navigational utility (back-button, breadcrumb) as well as the option to expand the size of the Launcher widget.

The color of the top bar is customizable through the widget config in our web-application, Raffle Insights. Personalize it to fit with your brand identity.

Navigation, utility and natural separation from content

On the initial screen upon opening the Launcher widget, we now allow for you to display your own company logo.

We know how important it is to feel like external services are well-integrated into your existing brand.

This new option allows you to keep the common thread and emphasize your existing brand identity.

Further customization to promote your brand identity

Custom Border-Radius

We’ve introduced three different options for border-radius to allow for continuation of brand identity.

Choose between three different options for roundness. Square, rounded, very rounded.

Square

Rounded

Very Rounded

Search Bar Layout

The Overlay/Embedded/Inline layout is a simple wide search bar you can place anywhere on your website.

Upon focusing the input field, we display a list of question suggestions that can be customized.

When you’ve asked a question, we display the most relevant search results.

If you purchased the Raffle Summary feature, we display a pending state until it’s done.

When the content for the summary is ready, we stream it directly into a container on the top of your search results.

Autocomplete

Appears as a dropdown with smooth transitions that drive the users’ focus. Use keyboard actions to navigate through the autocomplete suggestions.

Autocomplete

Autocomplete results

Support Channels

Your enabled support channels appear on this overview. Your users can simply select their preferred channel to get in contact.

Raffle also integrates seamlessly with any third-party live chat provider you’re currently using.

You have full control over the headlines, descriptions, opening hours, etc. on all screens.

See each available phone contact, it’s opening hours and whether it’s available currently.

Support Channels

Phone Support

Raffle Chat

Use the input field to ask your questions and get an immediate response.

If you want to talk about a new topic, you can clean the conversation with the button to the left of the input.

Simple introduction screen

Raffle Chat

When accessing the Chat, users are met with a simple introduction screen that automatically transitions into Chat state whenever they ask a question.

As our client, you have full freedom over the introductory message in the chat as well as the headline and description in the expanded top bar.

Search and Chat

You can choose to use both the classic Raffle Search and newly-introduced Raffle Chat.

On the widget settings, simply enable both the search and chat, then you can access both on the Launcher widget.

Combined Raffle Search and Chat with glass and solid backgrounds

Customize the Launcher search widget

Add custom instructions and support options for Raffle Search

Add custom introductory messages for Raffle Chat

Add custom color and support options for Raffle Chat

More about customisation

Explore the different customisable settigns here. If you want total customization of your Search UI, you can consult the API documentation and see how to configure your UI to use Raffle behind the scenes.