This article introduces the three main ways to integrate with our sports gamification platform, explains what widgets are and when to use them, and includes personality quiz examples to help you choose the best approach for your needs and get started with our widgets.
βοΈ Three Ways to Integrate Our Platform
We offer three main integration approaches to fit different technical needs and timelines:
- APIs: Each feature in the Fans United platform is exposed as an API. Use APIs if you want server-to-server integration with complete control over both frontend and backend implementation.
- SDK Integration: Our SDKs expose platform functionality in a developer-friendly way, working on web. Use SDKs if you want to customize UX on web (create new designs that fit your brand) or integrate the platform in a mobile app.
- Widget Components: Complete ready-to-use components with built-in UI and functionality
π Learn more about all integration options in our technical documentation.
π What are the Widgets?
Widgets are ready-to-use UI components that bring our sports gamification features to life on your platform with minimal development work. Think of them as plug-and-play solutions that handle both the functionality and the user interface, so you can focus on your core business instead of building personality quiz interfaces from scratch.
We provide the widgets for faster integration, designed to be used out-of-the-box with extensive configuration options to get clients up and running as quickly as possible. However, if your goal is complete UI control and deep customization beyond widget capabilities, we recommend using the Fans United APIs or SDKs instead.
One of the main challenges our clients have faced is the difficulty of testing and previewing personality quizzes before going live. With widgets, this problem no longer exists. Using our Storybook environment, which works with real-life data from your own personality quizzes, you can preview exactly how any personality quiz will look and function. Once you're satisfied with what you see, simply copy the div code and embed it directly into your website - no guesswork, no surprises.
π‘ When to Choose Widgets
Choose widgets if you want to:
- Get up and running quickly with minimal development work
- Launch features in hours, not weeks or months
- Have a consistent, tested user experience out of the box
- Easily preview and test your personality quizzes with real data before going live using our Storybook
Consider API/SDK integration if you need:
- Complete control over the user interface design
- Deep customization that goes beyond widget configuration options
- Integration with complex existing systems or custom workflows
- Have more development resources available for custom implementation
βοΈ How Widgets Work
Our widgets are pre-built components that you can directly embed on your website with minimal coding. They can be configured from two main places, and the best part: A div code is automatically generated for you - no manual coding required:
- Management Portal configuration - Set up authentication, upload images, configure branding colors, define personas, and other personality quiz-specific settings from there. The portal automatically generates embed code with the correct data attributes that you can simply copy and paste into your website.
- Storybook preview and testing - Before embedding anything, preview your personality quizzes in our Storybook using your actual quiz data. See exactly how they'll look, test functionality, and adjust configurations until you're satisfied to go live.
π Personality Quiz Widget Preview - See What You Can Achieve!
See how your personality quizzes could look with just a few clicks! Here are examples of a personality quiz created through our portal and previewed in our Widgets Storybook, showing the interactive question flow and engaging results display:
Further Reading
Ready to see how the personality quiz widgets can work for your platform? Check out our template options and setup guides below:
- Management Portal Configuration Guides:
- How to Set Your Personality Quiz Widget Template (Coming Soon)
- How to Change Image Position for Standard Template (Coming Soon)
- How to Configure Lead Fields and Position (Coming Soon)
- Storybook Configuration Guides: Coming Soon π