Build Uber-for-X within a day using HyperTrack

Uber’s business model has given rise to a large number of Uber-for-X services. Among other things, X equals moving, parking, courier, groceries, flowers, alcohol, dog walks, massages, dry cleaning, vets, medicines, car washes, roadside assistance and marijuana. Through these on-demand platforms, supply and demand are aggregated online for services to be fulfilled offline.




Core features for an Uber-for-X product

The following applications built with user movement are at the core of developing an Uber-for-X platform:

1. Location-based assignments

When the customer requests the service, the platform needs to assign the request to a provider. The assignment decision involves multiple parameters and location is an important one. For example, who is the nearest available provider who can service the customer in the shortest amount of time?

2. Live tracking experience

Once you assign the customer request to the provider, the customer would expect to track the real-time location of the order within your product experience complete with a live ETA and status.

3. Alerts

The operations team expects to keep an eye on the network and ongoing movement. During service hours, the team especially cares about delays and mishaps that need to be handled proactively. The customer might value getting notified when the provider is about to arrive or when the provider is running delayed.

4. Mileage

Lastly, the platform incurs cost for the miles traveled by providers. Depending on the business model, this is used to calculate charges to customers, reimbursements to providers or direct costs to the platform. The ability to automatically and accurately generate mileage directly impacts revenue and cost.

In this tutorial, we will walk through the steps to build these features using HyperTrack.

Use sample apps

We have open sources Uber-like consumer & driver app repo/s. These apps have end-to-end experience that you would want to build. Feel free to clone, edit and publish these apps on Playstore and Appstore.

Check the Android repo here. iOS coming soon.

Step-by-step implementation

The implementation involves a driver app (used by the provider to service requests), a customer app (used by the customer to order), a dashboard (used by the operations team to provide a great service experience) and a server (to orchestrate the above in one beautiful dance).

1. Get HyperTrack keys

Sign up to get your secret and publishable keys. The secret key is used on the server for backend-to-backend communication. The secret key is authorized forall API calls – to create, edit, list, retrieve and delete data. The publishable key is used by the SDKs in the apps. The publishable key is authorized for read-only API calls for select data entities.

2. Install SDK in your apps

Now, install our lightweight SDK into both your driver and customer apps.

3. Get nearby drivers (server)

When the customer orders the service at a location through the app, you need to assign that order to a driver. Use live locations of your drivers to improve assignment decisions. Get live location of drivers ordered by proximity from customer location. Use this list of nearby drivers as an input to your assignment engine.

4. Create actions (server)

For every order you get, your server would create an order in your system. You may break the order into multiple parts depending on the nature of the service. For example, pickup and dropoff (cabs), pickup and delivery (food), or travel and appointment (home services).

Create corresponding actions (say PICKUP and DROPOFF) on HyperTrack, one action per part that the order breaks into. Do pass the user_id of the driver who you assigned this order to for both of these actions. Pass along the order ID from your system as the collection_id in ours. This way you will be able to query and view these actions using the order ID in your system.

5. Track order (dashboard)

Now that you have assigned both (PICKUP and DROPOFF) actions to the driver, you can track them on your own customer service or operations dashboards. Embed the following URL https://dashboard.hypertrack.com/widget/actions;collection_id=<COLLECTION_ID>?key=sk_xxxx as an iFrame widget.

COLLECTION_ID is the collection_id that you used in step #4 and sk_xxxx is your account’s secret key to authenticate the widget.

6. Set up live tracking of PICKUP action (customer app)

Now we will track the PICKUP action in the customer app. Follow this guide to setup the HyperTrack SDK in the customer app. Call trackAction method to live track the action within your app. Remember to use the PICKUP action_id created in step #4 when calling the trackAction method to track the PICKUP. The customer app needs to be aware of this action_id. You might need to send it to the customer app from the server.

7. Set up webhooks to send alerts (server)

This is an optional step that you could implement if you decide to alert the operations team or the customer of events that happen along the way. You may send these alerts as push notifications, emails or dashboard notifications to your operations team or app notifications or SMS to your customers. For example, you may notify the customer when the driver is a minute away from the pickup location so the customer and driver are better prepared and neither needs to wait. Follow this guide to set up webhooks to receive such events.

8. Complete action (driver app)

Once the driver reaches the PICKUP location, mark the PICKUP action as complete based on the respective action performed by the driver in the driver app. Call the completeAction method (Android/iOS/ReactNative) in the driver app for the PICKUP action_id.

9. Set up live tracking of DROPOFF action (customer app)

Now that the pickup is complete, the customer might want to track the DROPOFF action in the app. In the customer app, refresh the tracking view and call trackAction method for the DROPOFF action_id created in step #4.

10. Complete DROPOFF action (driver app)

Once driver reaches the DROPOFF location, mark the DROPOFF action as complete based on the respective action performed by the driver in the driver app. Call the completeAction method (Android,iOS,ReactNative) in the driver app for the DROPOFF action_id.

11. Get mileage (server)

Now that both the actions are complete, you can get mileage for these actions on the server.

Well done!

You are now all set with awesome location features for your Uber-for-X service. You have built location-based assignments, live tracking experience, alerts and mileage.

Did this tutorial help you build what you wanted? Please share your experience and what you are building with HyperTrack. We would love to feature your story on our blog!