Grid Bot Implementation in Mobile Apps: Setup and Visualization

Grid Bot Implementation in Mobile Apps

Developing a Grid bot (or Grid trading) is one of the most frequent tasks we get. Clients come with experience: they've tried ready-made bots but lacked flexibility, or needed integration with their own trading platform. We take on such projects from scratch: from architecture design to app store publication. We'll evaluate your project within a day — just contact us.

The technical complexity of a Grid bot is not in the algorithm — it's trivial: place a grid of orders, wait for execution, replace them. The main challenges are real-time grid visualization, correct PnL calculation with partial fills, and syncing with exchange API via WebSocket. These three aspects we work on especially carefully.

How to Set Grid Parameters?

Let's start with configuration. A Grid bot operates with four key parameters: price range (lower and upper bound), number of levels, order size, and grid type — arithmetic or geometric. Each parameter affects risk profile and potential return. An arithmetic grid gives equal absolute price step, geometric — equal percentage step. For volatile assets, geometric grid is preferable: at price 10,000 a 500 USDT step is reasonable, but at 60,000 it is negligible.

// Android — grid level calculation
fun calculateGridLevels(
    lower: Double,
    upper: Double,
    count: Int,
    type: GridType
): List<Double> = when (type) {
    GridType.ARITHMETIC -> {
        val step = (upper - lower) / count
        (0..count).map { i -> lower + step * i }
    }
    GridType.GEOMETRIC -> {
        val ratio = (upper / lower).pow(1.0 / count)
        (0..count).map { i -> lower * ratio.pow(i.toDouble()) }
    }
}

The user enters the range and number of levels — the app immediately shows a preview: here are the levels, the step between them, and the total capital required for all orders. For example, BTC/USDT pair with range 40,000–60,000 and 10 levels, arithmetic grid gives a step of 2,000 USDT, geometric — ~4% between levels. This preview helps the trader see how much each level will take and how PnL changes with different settings.

How to Visualize the Grid on a Mobile Screen?

This is the main UI challenge. A custom widget is needed: horizontal lines of grid levels overlaid on a price chart. Executed orders — green/red markers. Current price — pulsing line.

On Flutter we use CustomPainter:

class GridChartPainter extends CustomPainter {
  final List<GridLevel> levels;
  final List<PricePoint> priceHistory;
  final double currentPrice;

  @override
  void paint(Canvas canvas, Size size) {
    final priceRange = levels.last.price - levels.first.price;
    final priceToY = (double price) =>
        size.height - (price - levels.first.price) / priceRange * size.height;

    // Draw grid levels
    for (final level in levels) {
      final y = priceToY(level.price);
      final paint = Paint()
        ..color = level.hasFilled ? Colors.green.withOpacity(0.3) : Colors.grey.withOpacity(0.2)
        ..strokeWidth = 1;
      canvas.drawLine(Offset(0, y), Offset(size.width, y), paint);

      final tp = TextPainter(
        text: TextSpan(text: level.price.toStringAsFixed(0), style: const TextStyle(fontSize: 10)),
        textDirection: TextDirection.ltr,
      )..layout();
      tp.paint(canvas, Offset(4, y - 12));
    }

    // Price line
    final pricePaint = Paint()..color = Colors.blue..strokeWidth = 1.5;
    for (int i = 1; i < priceHistory.length; i++) {
      canvas.drawLine(
        Offset(size.width * (i-1) / priceHistory.length, priceToY(priceHistory[i-1].price)),
        Offset(size.width * i / priceHistory.length, priceToY(priceHistory[i].price)),
        pricePaint,
      );
    }
  }

  @override
  bool shouldRepaint(GridChartPainter old) =>
      old.currentPrice != currentPrice || old.levels != levels;
}

Similar solutions on iOS — CoreGraphics or SwiftUI Canvas, on Android — custom View with onDraw. For React Native we can use react-native-svg or Skia. It's crucial to achieve smoothness at 60 FPS even on devices with 2 GB RAM — we optimize rendering by updating only changed elements.

What is Grid PnL and How to Calculate It?

Grid PnL is the total profit from executed order pairs. Each completed pair yields grid step × order size. Floating PnL is unrealized profit/loss when price exits the range. If the asset drops below the lower bound, the bot holds all bought orders at a loss until it returns. For example, with range 40,000–60,000 and step 2,000 USDT, if price falls to 38,000, Floating PnL will be -2,000 USDT per level. We display these numbers on a real-time dashboard, allowing the trader to stop the bot in time.

We also show: number of completed pairs, current active orders, capital at work. These metrics update every 100 ms via WebSocket.

Why Order a Grid Bot from Us?

We've been developing trading mobile apps for over 5 years. Our portfolio includes more than 20 projects with exchange integration, including 3 Grid bots for cryptocurrency exchanges. Experience with WebSocket, Firebase, StoreKit 2, and Billing 6. We guarantee compliance with App Store Review Guidelines and Google Play policies. Savings on purchasing a ready-made bot — up to 40% when ordering from scratch, as you get only the needed functionality without paying extra for unnecessary modules. Development cost is calculated individually, and we meet deadlines with a buffer.

What's Included

• Settings form with grid type selection and level preview
• Custom grid visualization widget (CustomPainter / Canvas)
• Dashboard: Grid PnL, Floating PnL, number of executed pairs
• History of executed orders grouped by pairs
• Real-time order status updates via WebSocket

Order and Project Estimation

Contact us — we'll analyze your requirements, propose an architecture, and estimate the project within 1 working day. We work turnkey: from prototype to publication in App Store and Google Play. Get a consultation on your project today. We guarantee transparency at every stage and provide a detailed progress report.

Mobile App Analytics: Firebase, Amplitude, AppsFlyer and Attribution

Our team regularly encounters projects where analytics is already "set up" but yields no real insights. A typical example is a startup with 50k DAU: tracking dozens of events without a single answer to the question "why don't users reach payment?". In two weeks we built a basic funnel and found that 70% of users drop off at the phone number verification screen. After fixing the bug, retention increased by 12%. The takeaway: analytics should start with specific questions, not tracking everything indiscriminately.

Why Event Taxonomy is the Foundation of Mobile App Analytics?

Firebase Analytics, Amplitude, Mixpanel — technically similar. The difference lies in what you put into them. A common mistake: events like screen_view, button_tap_1, button_tap_2 without context. A month later, no one remembers what button_tap_2 means.

Proper taxonomy: object + action + context. product_viewed, checkout_started, payment_completed with parameters product_id, category, price, source. This allows building funnels, cohort analysis, and retention without additional tracking.

We document the naming convention in a tracking plan — a document (Google Sheet or Amplitude Data Catalog) describing every event, its parameters, and triggering conditions. The tracking plan is synced with the analytics team before development begins, not after. This approach ensures that data remains interpretable months later and doesn't become a dump. Experience from 50+ projects confirms: without a tracking plan, analytics maintenance costs increase 2-3 times due to rework.

What Should You Choose for Mobile App Analytics: Firebase, Amplitude, or Mixpanel?

The table below highlights key differences between the three popular platforms. Choice depends on budget, traffic, and tasks.

Firebase Analytics — free, deep integration with Google Ads, BigQuery export for raw data. Limitations: data latency up to 24 hours, limited funnels. For startups with Google Ads traffic, it's the first choice.

Amplitude — product analytics focused on cohorts and user journeys. Journeys (formerly Pathfinder) shows actual paths between events — not assumed funnels but real routes. Session Replay records sessions for UX analysis. The free tier up to 10M events/month is enough for most products at launch.

Mixpanel — close to Amplitude, stronger in real-time segmentation. Insights, Funnels, Retention cover 90% of product analysts' tasks.

How to Solve Multi-Channel Attribution with AppsFlyer?

Knowing where a user came from is a separate task. Firebase Attribution works only within the Google ecosystem. For multi-channel attribution (Facebook Ads, TikTok, Apple Search Ads, programmatic), an MMP (Mobile Measurement Partner) is needed.

AppsFlyer is the market leader. OneLink — universal deep link working on iOS and Android, correctly attributing installs from any channel. Protect360 — built-in fraud protection (fake installs, click injection on Android). Adjust and Branch are competitors with similar features. Branch excels in deep linking; Adjust is popular in gaming.

According to Apple, with iOS 14.5, apps must obtain user permission via ATT before collecting IDFA for tracking. AppsFlyer uses probabilistic matching (IP + user agent + timing) for these users — accuracy is lower but better than nothing. SKAdNetwork and Privacy Preserving Attribution provide aggregated data from Apple with a 24-72 hour delay.

How to Set Up Crash Analytics to Not Miss Bugs?

Firebase Crashlytics is the standard for crash reporting. It automatically groups crashes by stack trace, shows affected users %, and sends velocity alerts when crash rate increases by more than 10% per hour.

Important: symbolication. On iOS, .dSYM files must be automatically uploaded with each build — via Fastlane upload_symbols_to_crashlytics or Xcode Cloud built-in. Without symbols, crashes in Crashlytics appear as memory addresses. This happens more often than expected when switching to a new CI — in one project with 500k users, we found that 40% of crashes remained unsymbolicated due to a missing CI/CD step. After automation, bug response time dropped from 3 hours to 15 minutes.

For React Native and Flutter, @sentry/react-native and sentry_flutter provide additional context: breadcrumbs, network requests before the crash, Redux/Provider state.

Below is a comparison of popular crash analytics tools to choose according to your needs.

Environment Setup

Three environments with separate Firebase projects: dev, staging, production. Mixing analytics from test sessions and production is a common mistake that skews all metrics. On iOS via GoogleService-Info.plist per scheme, on Android via google-services.json in each flavor folder.

Timelines: basic analytics with Firebase + Crashlytics — 3-5 days. Full tracking plan + Amplitude/Mixpanel with funnels and cohorts — 2-3 weeks. Attribution via AppsFlyer with deep linking and fraud protection — 1-2 weeks. Cost is calculated individually based on integration complexity.

What Is Included in Our Work

As part of analytics implementation, we provide:

• Development and approval of a tracking plan with product and marketing teams.
• SDK integration (Firebase, Amplitude, Mixpanel, AppsFlyer) considering your stack (Swift/Kotlin/Flutter/React Native).
• Setup of funnels, cohorts, dashboards, and alerts.
• Automation of symbolication and .dSYM upload via Fastlane.
• Documentation of events and parameters.
• Team training on the analytics platform.
• Two weeks of post-release support and tracking adjustments.

Our experience: 7 years of analytics implementation and over 80 successful projects in mobile development. We guarantee data correctness and transparency at every stage.

Contact us for a consultation on setting up analytics for your app. Request an audit of your current analytics — and we will show you which metrics you are losing.