What you can build
Widgets work best when the learning involves a decision, calculation, or self-assessment. Common examples include:ROI calculator
Students enter inputs like budget, expected close rate, or deal size. The widget calculates and displays a result.
Lead-fit scorecard
A set of weighted criteria that helps a student evaluate whether a prospect is a good fit.
Pricing estimator
Students configure options and see an estimated price or budget range update in real time.
Diagnostic quiz
A series of questions that leads to a personalized recommendation or score.
Goal tracker
An input-driven widget that shows progress toward a defined outcome.
Comparison tool
Side-by-side comparison of two options based on student-entered values.
How to create a widget
Open the block menu
In the lesson editor, type
/ to open the slash command menu and search for Widget.Describe what you want
A prompt appears. Write a plain-language description of the tool you want to embed. For example: “An ROI calculator where the user enters their monthly ad spend and expected conversion rate, and the widget shows estimated monthly revenue.”
Review the generated widget
Fayne builds the component and previews it inside the editor. You can see how it looks and interact with it before saving.
Adjust or iterate
If the widget is not quite right, describe what to change in the same prompt. For example: “Add a slider for deal size” or “Show the result in a bold card at the bottom.”
How widgets are built and delivered
Widgets run in a sandboxed iframe inside the lesson viewer. They cannot access data outside their own scope, which keeps your academy secure and your students’ inputs private.
- Cards for displaying results and grouped content
- Inputs and selects for text, numbers, and structured choices
- Sliders for range-based values
- Buttons for triggering calculations or navigation
- Badges for labels, scores, and status indicators
- Charts for visualizing results (line, bar, pie, and area)
Widgets versus standard interactive blocks
If you need something lighter, the block editor includes standard interactive blocks like multiple-choice quizzes, flashcards, and reflection prompts that do not require any generation step. Widgets are the right choice when the interaction involves custom logic, calculations, or branching based on student input.| Use case | Best tool |
|---|---|
| Simple knowledge check | Multiple-choice quiz block |
| Key term recall | Flashcard block |
| Custom calculation | Widget |
| Self-assessment with scoring | Widget |
| Step-by-step task completion | Checklist card block |