Program Beneficiary Feedback Form
This thoughtfully designed beneficiary feedback form helps non-profit organizations and NGOs collect valuable feedback from the people they serve. With accessibility at its core, the form uses emoji-based ratings, clear language, and optional voice input to ensure everyone can participate. Track program effectiveness, identify accessibility barriers, and understand the real impact of your services through the eyes of your beneficiaries.
Try the Form
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
167
168
169
170
171
172
173
174
175
176
177
178
179
180
181
182
183
184
185
186
187
188
189
190
191
192
193
194
195
196
197
198
199
200
201
202
203
204
205
206
207
208
209
210
211
212
213
214
215
216
217
218
219
220
221
222
223
224
225
226
227
228
229
230
231
232
233
234
235
236
237
238
239
240
241
242
243
244
245
246
247
248
249
250
251
252
253
254
255
256
257
258
259
260
261
262
263
264
265
266
267
268
269
270
271
272
273
274
275
276
277
278
279
280
281
282
283
284
285
286
287
288
289
290
291
292
293
294
295
296
297
298
299
300
301
302
303
304
305
306
307
308
309
310
311
312
313
314
315
316
317
318
319
320
321
322
323
324
325
326
327
328
329
330
331
332
333
334
335
336
337
338
339
340
341
342
343
344
345
346
347
348
349
350
351
352
353
354
355
356
357
358
359
360
361
362
363
364
365
366
367
368
369
370
371
372
373
374
375
376
377
378
379
380
export function beneficiaryFeedbackForm(form: FormTs) {
// Program Beneficiary Feedback Form
// Demonstrates: EmojiRating, StarRating, MatrixQuestion, SuggestionChips, ThumbRating
// Focus: Accessibility-centered design for inclusive feedback collection
// ============================================
// HEADER
// ============================================
form.addRow(row => {
row.addTextPanel('header', {
label: 'Your Voice Matters',
computedValue: () => 'Help us serve you better. Your honest feedback makes our programs stronger.',
customStyles: {
backgroundColor: '#7c3aed',
color: 'white',
padding: '28px',
borderRadius: '12px',
textAlign: 'center',
fontSize: '16px'
}
});
});
// ============================================
// SECTION 1: Overall Experience (Emoji-based for accessibility)
// ============================================
const experienceSection = form.addSubform('experienceSection', {
title: 'How Was Your Experience?',
customStyles: { backgroundColor: '#faf5ff', padding: '20px', borderRadius: '12px' }
});
experienceSection.addRow(row => {
row.addEmojiRating('overallExperience', {
label: 'How do you feel about our program overall?',
preset: 'satisfaction',
size: 'lg',
showLabels: true,
alignment: 'center'
});
});
experienceSection.addRow(row => {
row.addTextPanel('experienceNote', {
computedValue: () => {
const exp = experienceSection.emojiRating('overallExperience')?.value();
if (exp === 'excellent') return 'We are so happy to hear that!';
if (exp === 'good') return 'Thank you! We appreciate your positive feedback.';
if (exp === 'neutral') return 'We would love to hear how we can do better.';
if (exp === 'bad' || exp === 'very-bad') return 'We are sorry. Please tell us what went wrong so we can improve.';
return '';
},
customStyles: () => {
const exp = experienceSection.emojiRating('overallExperience')?.value();
if (!exp) return { display: 'none' };
const colors: Record<string, string> = {
'excellent': '#d1fae5',
'good': '#dbeafe',
'neutral': '#fef3c7',
'bad': '#fee2e2',
'very-bad': '#fee2e2'
};
return {
backgroundColor: colors[exp] || '#f3f4f6',
padding: '12px',
borderRadius: '8px',
textAlign: 'center'
};
},
isVisible: () => !!experienceSection.emojiRating('overallExperience')?.value()
});
});
// ============================================
// SECTION 2: Program Aspects Rating
// ============================================
const aspectsSection = form.addSubform('aspectsSection', {
title: 'Rate Our Program',
isVisible: () => !!experienceSection.emojiRating('overallExperience')?.value()
});
aspectsSection.addRow(row => {
row.addStarRating('staffHelpfulness', {
label: 'Staff helpfulness and friendliness',
maxStars: 5,
size: 'lg',
alignment: 'left',
showCounter: true
});
});
aspectsSection.addRow(row => {
row.addStarRating('programQuality', {
label: 'Quality of services or support received',
maxStars: 5,
size: 'lg',
alignment: 'left',
showCounter: true
});
});
aspectsSection.addRow(row => {
row.addStarRating('communication', {
label: 'Clear communication and information',
maxStars: 5,
size: 'lg',
alignment: 'left',
showCounter: true
});
});
aspectsSection.addRow(row => {
row.addStarRating('timeliness', {
label: 'Timeliness and scheduling convenience',
maxStars: 5,
size: 'lg',
alignment: 'left',
showCounter: true
});
});
// ============================================
// SECTION 3: Accessibility Assessment
// ============================================
const accessibilitySection = form.addSubform('accessibilitySection', {
title: 'Accessibility & Inclusion',
isVisible: () => !!experienceSection.emojiRating('overallExperience')?.value()
});
accessibilitySection.addRow(row => {
row.addMatrixQuestion('accessibilityMatrix', {
label: 'How accessible was our program for you?',
rows: [
{ id: 'location', label: 'Physical location / Getting there' },
{ id: 'facilities', label: 'Building and facilities' },
{ id: 'materials', label: 'Written materials and forms' },
{ id: 'language', label: 'Language and communication' },
{ id: 'scheduling', label: 'Scheduling flexibility' }
],
columns: [
{ id: 'very-easy', label: 'Very Easy' },
{ id: 'easy', label: 'Easy' },
{ id: 'neutral', label: 'Okay' },
{ id: 'difficult', label: 'Difficult' },
{ id: 'na', label: 'N/A' }
],
striped: true,
fullWidth: true
});
});
accessibilitySection.addSpacer();
accessibilitySection.addRow(row => {
row.addTextarea('accessibilityBarriers', {
label: 'Did you face any barriers or challenges accessing our services?',
placeholder: 'Please describe any difficulties you experienced...',
rows: 3,
autoExpand: true,
isVisible: () => {
const matrix = accessibilitySection.matrixQuestion('accessibilityMatrix')?.value();
if (!matrix) return true;
return Object.values(matrix).some(v => v === 'difficult');
}
});
});
// ============================================
// SECTION 4: What Helped Most
// ============================================
const helpfulSection = form.addSubform('helpfulSection', {
title: 'What Helped You Most?',
isVisible: () => {
const exp = experienceSection.emojiRating('overallExperience')?.value();
return exp === 'excellent' || exp === 'good' || exp === 'neutral';
},
customStyles: { backgroundColor: '#ecfdf5', padding: '16px', borderRadius: '8px' }
});
helpfulSection.addRow(row => {
row.addSuggestionChips('helpfulAspects', {
label: 'Select what was most helpful (choose up to 4)',
suggestions: [
{ id: 'staff-support', name: 'Staff support' },
{ id: 'resources', name: 'Resources provided' },
{ id: 'training', name: 'Training/Education' },
{ id: 'community', name: 'Community connection' },
{ id: 'financial-aid', name: 'Financial assistance' },
{ id: 'counseling', name: 'Counseling/Guidance' },
{ id: 'referrals', name: 'Referrals to other services' },
{ id: 'follow-up', name: 'Follow-up support' }
],
max: 4,
alignment: 'left'
});
});
// ============================================
// SECTION 5: Areas for Improvement
// ============================================
const improvementSection = form.addSubform('improvementSection', {
title: 'How Can We Improve?',
isVisible: () => {
const exp = experienceSection.emojiRating('overallExperience')?.value();
return exp === 'neutral' || exp === 'bad' || exp === 'very-bad';
},
customStyles: { backgroundColor: '#fef3c7', padding: '16px', borderRadius: '8px' }
});
improvementSection.addRow(row => {
row.addSuggestionChips('improvementAreas', {
label: 'What should we improve?',
suggestions: [
{ id: 'wait-times', name: 'Reduce wait times' },
{ id: 'more-staff', name: 'More staff availability' },
{ id: 'location', name: 'Better location/access' },
{ id: 'hours', name: 'Extended hours' },
{ id: 'communication', name: 'Better communication' },
{ id: 'language', name: 'More language options' },
{ id: 'follow-up', name: 'Better follow-up' },
{ id: 'resources', name: 'More resources' }
],
alignment: 'left'
});
});
improvementSection.addSpacer();
improvementSection.addRow(row => {
row.addTextarea('improvementDetails', {
label: 'Please tell us more about how we can improve',
placeholder: 'Your suggestions help us serve you better...',
rows: 3,
autoExpand: true
});
});
// ============================================
// SECTION 6: Program Impact
// ============================================
const impactSection = form.addSubform('impactSection', {
title: 'Program Impact',
isVisible: () => !!experienceSection.emojiRating('overallExperience')?.value()
});
impactSection.addRow(row => {
row.addRatingScale('lifeImpact', {
label: 'How much did this program improve your situation?',
preset: 'custom',
min: 1,
max: 5,
lowLabel: 'No improvement',
highLabel: 'Major improvement',
variant: 'segmented',
size: 'lg'
});
});
impactSection.addRow(row => {
row.addThumbRating('recommend', {
label: 'Would you recommend this program to others?',
size: 'lg',
showLabels: true,
upLabel: 'Yes, I would',
downLabel: 'No',
alignment: 'center'
});
});
// ============================================
// SECTION 7: Additional Comments
// ============================================
const commentsSection = form.addSubform('commentsSection', {
title: 'Anything Else?',
isVisible: () => !!experienceSection.emojiRating('overallExperience')?.value()
});
commentsSection.addRow(row => {
row.addTextarea('additionalComments', {
label: 'Is there anything else you would like to share with us?',
placeholder: 'Your story, suggestions, or questions...',
rows: 4,
autoExpand: true
});
});
// ============================================
// SECTION 8: Contact (Optional)
// ============================================
const contactSection = form.addSubform('contactSection', {
title: 'Stay Connected (Optional)',
isVisible: () => !!experienceSection.emojiRating('overallExperience')?.value()
});
contactSection.addRow(row => {
row.addCheckbox('allowContact', {
label: 'I would like someone to follow up with me about my feedback'
});
});
contactSection.addRow(row => {
row.addTextbox('contactName', {
label: 'Your name',
placeholder: 'How should we address you?',
isVisible: () => contactSection.checkbox('allowContact')?.value() === true,
isRequired: () => contactSection.checkbox('allowContact')?.value() === true
});
});
contactSection.addRow(row => {
row.addTextbox('contactPhone', {
label: 'Phone number (optional)',
placeholder: 'Best number to reach you',
isVisible: () => contactSection.checkbox('allowContact')?.value() === true
});
});
// ============================================
// SECTION 9: Summary
// ============================================
const summarySection = form.addSubform('summarySection', {
title: 'Your Feedback Summary',
isVisible: () => !!experienceSection.emojiRating('overallExperience')?.value()
});
summarySection.addRow(row => {
row.addTextPanel('summaryContent', {
computedValue: () => {
const experience = experienceSection.emojiRating('overallExperience')?.value();
const staffRating = aspectsSection.starRating('staffHelpfulness')?.value();
const programRating = aspectsSection.starRating('programQuality')?.value();
const recommend = impactSection.thumbRating('recommend')?.value();
const impact = impactSection.ratingScale('lifeImpact')?.value();
if (!experience) return '';
const expLabels: Record<string, string> = {
'excellent': 'Excellent',
'good': 'Good',
'neutral': 'Neutral',
'bad': 'Poor',
'very-bad': 'Very Poor'
};
let summary = 'Thank you for your feedback!\n';
summary += '━'.repeat(30) + '\n\n';
summary += `Overall Experience: ${expLabels[experience] || experience}\n`;
if (staffRating) summary += `Staff Rating: ${'★'.repeat(staffRating)}${'☆'.repeat(5 - staffRating)}\n`;
if (programRating) summary += `Program Quality: ${'★'.repeat(programRating)}${'☆'.repeat(5 - programRating)}\n`;
if (impact) summary += `Life Impact: ${impact}/5\n`;
if (recommend) summary += `Would Recommend: ${recommend === 'up' ? 'Yes' : 'No'}\n`;
return summary;
},
customStyles: {
backgroundColor: '#f3f4f6',
padding: '16px',
borderRadius: '8px',
whiteSpace: 'pre-wrap',
fontFamily: 'monospace',
fontSize: '14px'
}
});
});
// ============================================
// FORM CONFIGURATION
// ============================================
form.configureSubmitButton({
label: 'Submit Feedback',
isVisible: () => !!experienceSection.emojiRating('overallExperience')?.value()
});
form.configureCompletionScreen({
type: 'text',
title: 'Thank You!',
message: 'Your feedback is incredibly valuable to us. It helps us improve our programs and better serve our community. Thank you for taking the time to share your experience.'
});
}
Frequently Asked Questions
Why use emoji ratings for beneficiary feedback?
Emoji ratings are more accessible and universally understood than text-based scales. They work well for respondents with varying literacy levels, different languages, or cognitive considerations, making your feedback more inclusive.
How can I make this form more accessible?
The form is designed with accessibility in mind: large touch targets, clear labels, emoji-based ratings, and simple language. Consider also offering paper versions, phone-based collection, or in-person assistance for those who need it.
What accessibility aspects does this form evaluate?
The form assesses physical accessibility (location, facilities), information accessibility (clear communication, multiple languages), and service accessibility (flexible scheduling, staff helpfulness, accommodation of needs).
How do I protect beneficiary privacy?
The form collects minimal personal information by default. Contact details are optional and only requested with explicit consent. Aggregate data without identifying individuals when reporting to stakeholders.
Can I customize this for different programs?
Yes, you can easily customize program-specific aspects, add relevant service categories, modify accessibility criteria, and adjust the language to match your organization's terminology and beneficiary needs.