.svg)
User feedback is the backbone of app improvement. But the way we ask for feedback makes all the difference. Badly timed popups often get dismissed, while smart, well-integrated flows lead to higher ratings and actionable insights. AppRemark is an in-app bug reporting tool that captures screenshots (shake to capture), allows annotation, and submits contextual feedback/bug reports to your AppsOnAir dashboard. It is not a store-rating / review prompt service
This guide shows how to integrate AppRemark by AppsOnAir in React Native to collect user feedback, bug reports, and suggestions efficiently.
Why Ratings & Feedback Matter?
- App Store visibility: Higher ratings improve app ranking and discoverability.
- User trust: New users rely heavily on reviews before installing.
- Product improvement: Structured feedback highlights bugs and feature requests.
- Retention: Listening to users increases loyalty and reduces churn.
What AppRemark provides (key facts)
- Shake-to-capture current screen (can be disabled).NPM package
- Annotatable screenshot + customizable “Add Remark” screen.
- Manual invoke option (open the remark screen programmatically).
- It accepts extra metadata (attach a user ID, build info, etc.).
- The React Native SDK is distributed as appsonair-react-native-appremark
Quick Integration
Step 1: Add Dependency
Use the package appsonair-react-native-appremark
npm i appsonair-react-native-appremark
Step 2: Basic AppsOnAirAppID Setup
Go to App Settings in the AppsOnAir web portal and copy the AppsOnAirAppId
For iOS, add AppsonairAppId in Info.plist file and add Photo permission too.
<key>AppsonairAppId</key>
<string>XXXXXXXX-XXXX-XXXX-XXXX-XXXXXXXXXXXX</string>
For Android, add AppsonairAppId in the AndroidManifest file
<application>
...
<meta-data
android:name="AppsonairAppId"
android:value="********-****-****-****-************" />
</application>
Set up AppsonairAppId for your mobile app. For more details, refer to this documentation.
Step 3: Basic AppsOnAir Setup
Invoke the initialize function in a useEffect hook to run it once during app startup.
import { initialize } from "appsonair-react-native-appremark";
useEffect(() => {
initialize(
true // Set shakeGestureEnable true or false as per your need
);
}, []);
Step 4: Add Extra metadata (Optional)
Attach identifying or debugging metadata (user ID, email, app build, server ID) so each report is actionable:
import { addRemark } from "appsonair-react-native-appremark";
// Button to navigate to the Add Remark screen
<Button title="Add Remark" onPress={() => addRemark({ key: "value" })} />;
This metadata is saved with the submitted AppRemark. You can access it from the AppsOnAir AppRemark web portal.
Step 5: Theming (Optional)
You can pass an options map during initialization to control visual text/colors and small UI behavior (keys like pageBackgroundColor, appBarTitleText, descriptionMaxLength, etc.). For more information, please refer to React Native AppRemark documentation.
Best Practices & Implementation Notes
- Use for bug/UX reports, not ratings. AppRemark is built to capture context-rich bug reports (screenshots, annotations, logs), not to prompt users to rate your app on the app store. (Use a separate rating strategy or store APIs if you need that.)
- Attach useful metadata (user ID, session ID, OS version, build number). Use setAdditionalMetaData.
- Control frequency - if using shake-to-capture, provide an in-app "Report a Problem" button to avoid accidental captures.
- Privacy & permissions - iOS requires a photo usage string if gallery use is allowed; ensure you comply with user privacy policies.
- Beta note: AppRemark was published as a public beta - expect minor changes as the SDK evolves. Test before wide rollout.
What You’ll get
- Capture contextual bug reports with annotated screenshots for faster reproduction and reduced back-and-forth with users.
- Centralized feedback/bug collection in the AppsOnAir dashboard for easier triage.
References
