developed an application to revolutionize india’s cargo ...€¦ · react-native-maps to select...

5
Developed an application to revolutionize India’s cargo transportation business SmartShift, incubated by M&M, boasts of 3,500 transport partners and over 12,000 businesses across Hyderabad, Mumbai and Bengaluru, with Mumbai contributing the largest chunk of its business. It clocks thousands of transactions a day, and is now geared towards creating a community of one million stakeholders over the next three years. We helped Smartshift increase their customer base by launching an iOS app and stabilized their android application. Executive Summary

Upload: others

Post on 03-Jun-2020

3 views

Category:

Documents


0 download

TRANSCRIPT

Page 1: Developed an application to revolutionize India’s cargo ...€¦ · React-native-maps to select pickup and drop point and to show/track the vehicles on the google map. React-native-google-places-autocomplete

Developed an application to revolutionize India’s cargo transportation business

SmartShift, incubated by M&M, boasts of 3,500 transport partners and over 12,000 businesses across Hyderabad, Mumbai and Bengaluru, with Mumbai contributing the largest chunk of its business. It clocks thousands of transactions a day, and is now geared towards creating a community of one million stakeholders over the next three years.

We helped Smartshift increase their customer base by launching an iOS app and stabilized their android application.

Executive Summary

Page 2: Developed an application to revolutionize India’s cargo ...€¦ · React-native-maps to select pickup and drop point and to show/track the vehicles on the google map. React-native-google-places-autocomplete

Problem Statement

A businessman with logistics needs had to depend on a transporter; even after paying a premium price the results were unsatisfactory. Intra-city transport being an unorganised sector caused a lot of pain to the customer in terms of availability, time, money and quality of delivery.

On the other hand the transporters(truck drivers) preferred good earning , predictable income and good customer support which protected them for any abuse.

Business Requirements

Objective

To build an application that will provide a platform for sharing of commercial vehicles

Key Requirements

Summarized requirements put forth by client were as below:

● Client wanted a better stable solution for the user

● Integration payment methods had to include netbanking and wallet

● An automated CSR for keeping their call center more organised

Impact and involvement of stakeholdersSmartshift has a big user base. There is also a big network of operations team involved on a daily basis.

● Customers or Load Givers(LG): New iOS app, which increase user base, Multiple booking options, Details on surcharges, Raise Service request via app reducing the time and involvement of the customer.

●● Load Takers pickup truck drivers (LT) : Optimized the reverse bid options. Self registration with

document upload made the onboarding process simple. Incentivised the drivers to help them perform better. GPS location being stored more frequently.

Page 3: Developed an application to revolutionize India’s cargo ...€¦ · React-native-maps to select pickup and drop point and to show/track the vehicles on the google map. React-native-google-places-autocomplete

●● City head/Demand manager/Supply Manager: Optimized penalty, Reduced no. of fake jobs.

Accurate and often GPS location for vetting out fraud cases. Helped motivate drivers by introducing incentives program. A faster resolution of the issues, which helped business run smoothly. Consistent reports and correct payout report.

●● CSR Admin/CSR: Auto assignment of jobs to make the system more efficient, Raise service

request via app thus reducing time spent by CSR’s on phone.

Our Solution Structure

We used React Native to build an iOS app for them, which will work in both on android and iOS phones, this in turn helps them increase their customer base. Their system accepts only cash currently, we redesigned the payments to make app self sufficient to handle netbanking and wallets.

Solution Dynamics and Interactions

Solution Approach

Page 4: Developed an application to revolutionize India’s cargo ...€¦ · React-native-maps to select pickup and drop point and to show/track the vehicles on the google map. React-native-google-places-autocomplete

● App is built in React Native and Redux for both android and iOS. Middleware used are redux thunk,

redux logger, axios.

● Defined UI components of the app using the react native UI Library Native Base.

● Routing in LG app is implemented through React Navigation.

● React-native-codepush is used to push the asset and JS bundle to the server to make updates in the

app without releasing new apk/ipa.

● React-native-sentry is used for capturing the production exceptions and errors and integrated it with

the slack to give alert about the exception/error occurred in the app.

● react-native-fused-location to get the finest location on Android using Fused API.

● React-native-fcm is used for the push notifications in the app.

● Google direction API are used to calculate the estimated distance and duration between the selected

locations for the job.

● React-native-maps to select pickup and drop point and to show/track the vehicles on the google

map.

● React-native-google-places-autocomplete to implement Google Places autocomplete component for

iOS and Android React-Native apps.

● Firebase to track the location of the LT when the job is assigned to him.

● React-native-splash-screen to display the splashscreen with smartshift logo.

● React-native-modal-datetime-picker used to create the component to select date and time in the

app.

● React-native-vector-icons for the custom icons in the app.

● Moment js in the manipulation of date and time in the app.

● React-native-sms-listener to detect the sms and auto read OTP from the message.

● React-native-analytics-segment-io to identify and track the events/activity of the user.

● Maps Static API to show the static map in the past jobs.

● react-native-communications for making call to the call support through app.

● IDE used - Visual studio code(for react code), Android studio(for android) and Xcode(for iOS).

User InterfaceKey aspects of the Load Giver app:

Load Taker app:

The UI build over design support library.

Design pattern which we followed here is Model View Presenter (MVP).

Retrofit for server communication.

FirebaseJobDispatcher for sending location to server at intervals.

FCM for sending push notifications to the client .

Page 5: Developed an application to revolutionize India’s cargo ...€¦ · React-native-maps to select pickup and drop point and to show/track the vehicles on the google map. React-native-google-places-autocomplete

Technology Stack● Java● Angularjs● Android● React native

Business Outcomes

We delivered high quality stable product for Smartshift that included a lot of interesting features:

● Improvements made to backend and front end code to take on many jobs in each city

● The apps have been redesigned in react native(for shifters) and For transporters (native Android which is popular OS in India) to serve larger audience.

● Analytics added to monitor crashes growth retention and also to check the performance of the API and response time of app’s

● Real Time locations are sent, with mandatory job finish OTP’s to prevent any kind of fraud.

● Automated CSR has been designed.

HashedIn has helped a many promising firms across the globe by building customised solutions to give the users a completely hassle-free experience. Kindly let us know if you

have any specific problem / use case, where we can provide more information or consult you.

https://hashedin.com/contact-us/