Unifying Mobile, Cloud, and AI Techniques in a Crowdsourcing Application for Smart CitiesA Voice and Location Enabled Platform for Connecting Cities and Their Citizens

By Marc Bacvanskimarc.bacvanski@gmail.comMarch 2017

Ok City!

Problem: Disconnected Citizens

● Cities don't have resources to engage citizens

● Citizens don't know who to call when something concerns them

● People don't report important matters because they don't want to flood

911 calls

● Citizens don't have an effective way to inform and share good news with

the community

Citizens are disconnected from their cities due to a lack of an easy, fast communication platform for reporting issues and sharing positive events in the local community

System Requirements: User Stories

● As a city manager, I want to view statistics for my city so that I can take action on them.

● As a city manager, I want to resolve issues posted in my city to mark their completion

● As a city manager, I want to moderate posts so that I can focus on important ones.

● As a citizen, I want to view nearby posts so that I can know what is going on.

● As a citizen, I want to create posts to inform the city about problems to be fixed.

REST

Sentiment

Text

Post Vis

Post Mgr

Scalable, Mobile Backend AI and ML APIs

NoSQL DatabaseScalable, Mobile Backend

REST

Geo Vis

Post Stats

Post Resolve

Portal Views

Web Sec.

NL API

Citizen Posting

Citizens Viewing

City Manager

● System deployed in cloud● Scalable, distributed architecture ● NoSQL Big Data database● Implemented latest web technologies: Node.js,

enterprise-grade security● AI for sentiment analysis

Context Diagram: Ok City System and its Users

● Mobile application featuring Text-To-Speech

● Material design: consistent experience from phone to desktop application

● REST communication with backend

● Integration with maps and geolocation

Ok City Cloud Deployment

Report stored in database, machine learning applied for sentiment

Flow of Interactions

Recording a Report

User voice-records a report in the app

Browse Reports

User can view nearby reports on a map

Resolving Reports

City manager can resolve obsolete or completed reports

View Reports & Statistics

City manager can view reports and powerful statistics about his city

Citizen (Phone)

Reports and statistics sent to city portal

Report data sent to user's device

City Portal

Back-end

View Resolved Reports

Users can see their reports that have been resolved

Comparison to Other Systems

Feature Existing Ok CityGeographically Placed Posts

Voice-Activated Posts

Custom Posts

City Manager Portal

City Manager can Resolve Posts

City Statistics: Sentiment, Timeline

Existing systems include: Waze, Yelp, TripAdvisor, city portals like Ask Mountain View Mobile. These systems have limited functionality.

Mobile: Browse Nearby Posts

Opens filter dialogue: filter reports by recency

Post on map: message, location, and time of reporting

● Map reflects user-selected filtering options

● Map centers at user's location, shows nearby posts

Mobile: Record New Post

User can manually edit the recorded post

Submit report to city, re-record post

● Automatic speech-to-text is performed on the phone itself to let citizens record reports hands-free

● Safe to use on the road: no need for typing

● Sentiment analysis is done once the text report is sent to the server

Mobile: Filter Posts by Location, Time

● Scalability is maintained by having all filtering done on server-side

● Posts are filtered by time of posting● Posts that are resolved by the city

are not shown to user ● Posts are only displayed from within

selected geographical view bounds

User can select time period from which to display reports

UML Sequence Diagram: Post Creation

Web: City Overview - Geo View and Posts

Filter by keyword

Resolve selected reports

Sentiment of report: positive or negative

This page is built using Material Design Lite and JavaScript that interacts with the Google Maps API as well as the back-end server using REST and JSON.

Web: Resolved/Unresolved Citizen Reports

Reports, filtered by resolved only

Marker on map with description and timestamp

The JavaScript running this page is written in EcmaScript 6 using Functional Programming styles and asynchronous programming techniques using Promises.

Web: Pulse of the City - Analytics Visualization

Pie chart of positive / negative sentiments

Line chart of sentiment over time

More actions in drawer

Zoom controls for pagination of data over time

These graphs use Google's visualization API, and utilize pagination to efficiently handle large numbers of reports. These visualizations can be easily extended to handle custom visualizations.

Sequence Diagram: City Manager Viewing Reports

Component Architecture: Mobile and Web Backends

System architecture presented as UML diagrams, according to the IEEE 1471 standard for representing software architecture.

Functional Programming in JavaScript 6

Code Size (LOC):

● Total: 2425● Java: 1076● JS: 1000● HTML/XML: 349

Mobile: Java 8 Structural Code Analysis

Ok City Vendor-Independent Cloud Deployment

REST Handler

AI: Sentiment Analysis

Text Analytics

Post Visualization

Post Manager

Scalable, Mobile Backend: Node.js

Mobile Device

Firewall Load Balancer

AI and ML APIs

City Portal Firewall Load Balancer

Scalable MongoDB NoSQL Database

Scalable, Mobile Backend: Node.js

REST Handler

Geoquery Visualization

Post Statistics

Post Resolver

Portal Views

Web Security

Natural Language API

Speech to Text

Report Submitter

Report Mapper

Report Manager

City Statistics

Geo View

Technologies Used

Technology Usage

Android Mobile app

Java 8 Programming of Android application

Node.js Web server

Express.js Node.js framework for web applications

EcmaScript 6 Web programming

MongoDB Scalable, NoSQL database

HTML5 + CSS3 Web UI

Material Design Lite Front-end templating

JQuery Client-side scripting

Google Natural Language API Sentiment analysis

Heroku Scalable, cloud hosting from Salesforce

Technology Highlights

Cloud Architecture: Flexibility and Autoscaling● Stateless REST architecture, service-oriented ● Separation of responsibilities, fault-tolerant resiliency

AI and Machine Learning● Sentiment analysis using Google Natural Language APIs● Speech-To-Text on mobile application

Security● OWASP (Open Web Application Security Project) best practices● Implemented with Lusca: enterprise-grade security package

used in financial industry

User Experience: Material Design ● Easily accessible experience● Unified experience across mobile and web

Future: Deep Learning, Real-Time Streaming

● Sophisticated Deep Learning using custom natural language for criticality analysis, beyond commercial offerings

● Integration with IoT sensors and video feeds in cities to generate automatic posts

● Deployment on serverless architecture such as AWS Lambda and Google Cloud Functions

● Automatic server deployment using Docker● Big data analytics on nationwide data● Real-time stream processing

y = softmax(Wx+b)

Join Me on Github!

My Profile

Ok City ReposThis is just the beginning. Let's work together on building the future of connected cities!