Presented at FITC Toronto 2016 See details at www.fitc.ca Responsive design, content adaptation, automatically adjustable brightness and other techniques are meant to improve the end user experience. However, those techniques take in consideration device sensors input and not you as a human being! Of course, you can adjust your device settings, but think for a second how cool it would be to have the app adapt to you automatically. Imagine you playing a game where the main character changes accordingly to your genome profile. During this talk, we’ll discover how to embed in an existing game the logic needed to have a character interact with the game environment according to strength, speed, resistance, etc. provided by your DNA profile. Target Audience Mobile engineers, engineering managers, entrepreneurs. Assumed Audience Knowledge Some bases of iOS and Android development, consuming restful API and some experience with the mobile development ecosystem. Five Things Audience Members Will Learn How to read basic info from a human genome Effectively consume external data on an unreliable network Integrating external data into existing game engines Influence the game engine and character behaviors Exchange securely data on a mobile network

1. mobile games
mutating
@giorgionatili

2. Roadmap
Today’s Presentation at a Glance
Concept
and Motivation
Opening
Remarks
Tech Stack and
SDK
Workflow and
Implementation
Data and
Reports
Questions &
Answers

3. Giorgio Natili
Engineering Lead, McGraw-­‐Hill Education
Giorgio Natili
@giorgionatili
Engineer, #opensource idealist, #community fellow.
I make things happen on screens.
90%
JavaScript
70%
iOS & Swift
60%
Android
80%
Agile Coach
I am a strong opponent of agile development with a passion for clean,
maintainable, and testable code. My areas of expertise include standards-­‐based
application development, real-­‐time communication, and surfing off the coast of
my native Italy.
Technical Skills

4. @giorgionaKli // #mobiletea
http://careers.mheducation.com

5. GAME
PERSONALIZATION
How to create an intimate
gaming experience
WHY MOBILE?
Understand why focusing on mobile games
makes sense
MANAGING
DNA DATA
How to acquire data and enrich the
model through contextual info
TECHNOLOGY STACK
Explore what’s under the hood
Agenda

6. WORKING WITH
DATA
Explore the design of the
Restful API
MOBILE SDK
Examine the design of the mobile SDK
ROADMAP
Beta 1.0 roadmap
Q&A

7. Play it your way!
Game Personalization

8. Game Personalization
Custom Settings
Different games, different
settings; follow best practices.
1
Device Settings
Device and game settings
impact user experiences.
2
Accessibility
Always take into consideration
users with special needs.
3
Personal Settings
Suggest user presets based on
known user data.
4
Character Customization
Customize game characters
based on gamers.
5
Physical Traits
Make character traits
dependent on a user’s DNA.
6
@giorgionaKli // #mobiletea

9. Custom Settings
★Most mobile games have a settings (or options) screen.
★Custom settings can range from zero to the kitchen sink.
★Common adjustments: audio, resolution, window state, color palette, etc.
@giorgionaKli // #mobiletea

10. Avoid Mediocrity
★Be accurate.
★Don’t generalize.
★Don’t settle on low, med, high.
@giorgionaKli // #mobiletea

11. Provide Presets
★Give gamers built-­‐in presets.
★Give gamers the option to save and share presets.
★Give gamers the option to load preset from external sources
(e.g., https://sfx.thelazy.net/games/).
@giorgionaKli // #mobiletea

12. Device Settings
★Leverage the gamer’s device settings.
★Understand the constraints of iOS and Android.
★Use the respective APIs to detect accessibility settings.
@giorgionaKli // #mobiletea
http://developer.android.com/reference/android/provider/Settings.Secure.html

13. Accessibility Settings
★High contrast for visually impaired gamers.
★Options for gamers with deficient color vision.
★Options for gamers with learning and attention issues
(e.g., speed adjustments).
@giorgionaKli // #mobiletea
http://www.includification.com/AbleGamers_Includification.pdf
https://developer.apple.com/library/ios/documentation/UIKit/Reference/UIKitFunctionReference/
http://developer.android.com/guide/topics/ui/accessibility/apps.html

14. Android Accessibility
★ String settingValue =
Settings.Secure.getString(getC
ontentResolver(),
Settings.Secure.ENABLED_ACCESS
IBILITY_SERVICES);
★ACCESSIBILITY_DISPLAY_INVERSIO
N_ENABLED,ACCESSIBILITY_ENABLE
D,ACCESSIBILITY_SPEAK_PASSWORD
@giorgionaKli // #mobiletea
http://stackoverflow.com/questions/5081145/android-­‐how-­‐do-­‐
you-­‐check-­‐if-­‐a-­‐particular-­‐accessibilityservice-­‐is-­‐enabled

15. iOS Accessibility
★ UIAccessibilityZoomFocusChanged
★ UIAccessibilityIsMonoAudioEnabled
★ UIAccessibilityIsReduceMotionEnabled
★ UIAccessibilityIsInvertColorsEnabled
@giorgionaKli // #mobiletea

17. User Profile
@giorgionaKli // #mobiletea
Accessibility
Settings
Device
Settings
★ Use available information to create user
profiles.
★ Customize the user experience .

18. Personal Settings
★Suggest a Preset to change the game environment and dynamics.
★Adjust the environment according to vision, hearing, movement, etc.
★Change the color scheme (visually impaired) or zoom in (shortsighted).
@giorgionaKli // #mobiletea

19. Character Customization
★A good character creator can make a difference.
★A great character creator lets gamers get into their characters.
★A great character creator considers the gamer’s physical characteristics.
@giorgionaKli // #mobiletea

20. Customizable Character Creator
★ Present gamers with a character
similar to him/her.
★ Provide suggestions based on
abilities and characteristics.
@giorgionaKli // #mobiletea
http://gamerant.com/five-­‐best-­‐character-­‐creator-­‐games-­‐144/

21. Physical Traits
★A standard DNA exam report (e.g., eye, skin, and hair color).
★Strength, attack, health and sensory capabilities.
★What’s difficult? To assign a numeric range to these capabilities.
@giorgionaKli // #mobiletea

22. Strength
★ Gene COL5A1 can determine the attitude to
muscle cramps.
★ Gene OPRM1 helps moderate the body’s
response to pain.
@giorgionaKli // #mobiletea
Source http://snpedia.com/index.php/SNPedia

23. Attack
★ Gene NOS3 is associated with abilities of
strength and speed.
★ Gene COMT is associated with the
metabolism of norepinephrine, which is
involved with cognitive abilities.
@giorgionaKli // #mobiletea
Source http://snpedia.com/index.php/SNPedia

24. This is cool s**t!

25. Great opportunities for developers!
Why Mobile?

26. Why Mobile?
Abandonment Rate
Most of mobile games are
played only for few days.
1
No Medical Conditions
DNA information doesn’t
involve any medical condition.
2
Enriched Context
Mobile devices provide useful
sensors and information.
3
@giorgionaKli // #mobiletea

27. Abandonment Rate
★In the US: 10 mil. gamers (66%) will stop playing after the first day.
★Internationally: Games are 2nd among apps used only once in 6 months.
★Creating a more intimate experience can help turn things around.
@giorgionaKli // #mobiletea
http://www.statista.com/statistics/307638/app-­‐category-­‐abandonment-­‐rate/

28. No Medical Conditions
★ In the US, the FDA prevents organizations from sharing medical data.
★The same is true for other countries.
@giorgionaKli // #mobiletea

29. Enriched Context
★Mobile devices can expose a lot of personal information.
★Android (Google Fit) and iOS (HealthKit and CareKit) provide personal
health information APIs that can be used in conjunction with a DNA report.
★Game settings (and experience) can be fine-­‐tuned with the acquired data.
@giorgionaKli // #mobiletea

30. Can we have more, please?

31. Accessing and preserving sensitive data
Managing DNA Data

32. Managing DNA Data
DNA Exam Providers
Exam providers and their pros
and cons.
1
Accessing Data
Understand what you are going
to expose.
2
Exposing Data
Keep gamer’s sensitive
information secure.
3
Data Mashup
Get the required information
with open-­‐source algorithms.
4
@giorgionaKli // #mobiletea

33. DNA Exam Providers
★Services to get a DNA exam include:
★23andme.com
★ancestry.com
★familyTreeDNA.com
★Only 23andme offers a complete set of APIs
@giorgionaKli // #mobiletea

34. Get Your Kit
★ DYI at home
★ Nice packaging
@giorgionaKli // #mobiletea

35. Accessing Data
★Access your report online:
★Ancestry
★Wellness
★Traits
★Carriers
★Browse and download info about nucleotide polymorphism (aka SNP)
@giorgionaKli // #mobiletea
https://en.wikipedia.org/wiki/Single-­‐nucleotide_polymorphism

36. Expose Data
★Use the API to authenticate / authorize external apps to access the data.
★Download and upload the report to get more detailed information.
★Get a detailed report (based on the literature cited in SNPedia.com) from
promethease.com.
@giorgionaKli // #mobiletea

37. Look for Disclaimers
★ Most analysis tools are limited to or intended
for research
★ All of them encourage you to discuss the
results with a doctor or a genetic counselor
@giorgionaKli // #mobiletea

38. Data Mashup
Health Information
Acquire health information
from the device
Compare Data
Compare the new data
set with existing data
DNA Report
Get raw data and run
analysis tools on them
Data Model
Produce a meaningful
data model
Device Settings
Acquire accessibility
settings from the device
@giorgionaKli // #mobiletea

39. Comparing Data
★Reports often note “uncertain pathogenic” next to a genome variant.
★Reduce uncertainty by comparing acquired data with other data sources.
★Use “real life” data to “merge” data from the report and the gamer.
@giorgionaKli // #mobiletea
http://www.personalgenomes.org/harvard/data

40. Make Your Data Meaningful
@giorgionaKli // #mobiletea
module.exports = mongoose.model('Health', new Schema({
handle_poison_capability: {
value: Number,
description: String
},
handle_disease_capability:{
value: Number,
description: String
},
process_potions_capaibility: {
value: Number,
description: String
},
process_potions_exponentially_capability: {
value: Number,
description: String
},
recover_injury_capability:{
value: Number,
description: String
}
}));

41. Now I’m getting excited!

42. Under the hood: reactive programming and data mashups!
Technology Stack

43. Technology Stack
Restful API
JSON objects provided
through authentication tokens
1
Android
Standard Java for Android
distributed with Gradle
2
iOS
Swift SDK distributed using
Cocoapods
3
Hybrid Platforms
JavaScript API built using
TypeScript and ECMA 6
4
@giorgionaKli // #mobiletea

44. Restful API
★Plain JSON object for faster communication over unreliable networks
★Logic written in TypeScript and NodeJS
★Analysis algorithm written in C++ used from V8
★Persistence data layer implemented with Redis
@giorgionaKli // #mobiletea
https://blog.scottfrees.com/c-­‐processing-­‐from-­‐node-­‐js

45. Android
★Standard Java implementation distributed as a JAR using Gradle
★Tests written using JUnit and JMock
★Tests executed with Roboletric
★Targeting Android >= 4.4
@giorgionaKli // #mobiletea
https://plugins.gradle.org/docs/submit

46. iOS
★Implemented using Swift 2.2 and distributed as a Pod with Cocoapods
★Tests written with Expecta, OCMock, and Specta
★Targeting iOS > 9.x
@giorgionaKli // #mobiletea
https://cocoapods.org/

47. Hybrid Platforms
★Library written with TypeScript and ES6
★Tests written with Mocha and Chai
★Tests executed with Karma and PhantomJS
★Packaging and distribution through NPM
@giorgionaKli // #mobiletea
https://docs.nativescript.org/runtimes/require
https://www.reddit.com/r/reactjs/comments/45e1m1/question_about_using_react_with_external/

48. You said JavaScript?!?

49. Overview of the backend and of the API
Working with Data

50. Working with Data
User Interaction
Review the available
interactions.
1
API Signature
Explore the API signature and
debug options.
2
Local Setup
Set up the local development
environment.
3
Sample Data
Use the remote sample data to
avoid any local setup.
4
@giorgionaKli // #mobiletea

51. @giorgionaKli // #mobiletea
Authentication
•Twitter API
•Google API
•Facebook API

52. @giorgionaKli // #mobiletea
User Actions
•Upload report
•Delete report
•Close account

53. API Signature
★/authenticate
★/user/{id}/device/{settings}
★/user/{id}/accessibility/{settings}
★/user/{id}/health/{data}
★/user/{id}
★/user/{id}/profile/
★/user/{id}/traits/
★/user/{id}/presets/
@giorgionaKli // #mobiletea

54. Local Setup
★Install nodejs $ brew install node
★Install redis $ cd redis-stable & make
★Clone the repository (available since next week)
★Install dependencies and run $ npm install & npm run
@giorgionaKli // #mobiletea

55. Sample Data
@giorgionaKli // #mobiletea
mutalo.io
available soon

56. Design and strategy of the mobile SDK
Mobile SDK

57. Mobile SDK Overview
Design Principles
Multiple targets with common
design strategies
1
Android
Android SDK pratical usage in
a nutshell
2
iOS
Practical usage of the iOS SDK
in a nutshell
3
@giorgionaKli // #mobiletea
Hybrid Apps
Using the JavaScript SDK in
hybrid apps
4

58. Design Principles
★Stateless services that are able to return data handling offline.
★Methods are pure functions that return value (e.g., chaining methods).
★Different caching strategies depend on the target platform; shared data
layer implemented with Redis.
@giorgionaKli // #mobiletea

59. Android
@giorgionaKli // #mobiletea
http://codereview.stackexchange.com/questions/36298/asynctask-­‐for-­‐handling-­‐server-­‐api-­‐calls
https://github.com/CodeAndMagic/android-­‐deferred-­‐object/tree/2.0
final MutaloAuth auth = new MutaloAuthImpl().login("giorgio", "4%##$");
Observable.create(subscriber -> {
subscriber.onNext(authorization => {
final MutaloProfile profile;
profile = new MutaloDataProviderImpl().getUserProfile(authorization, false);
});
}).subscribe(auth);

60. iOS
@giorgionaKli // #mobiletea
let auth = MutaloAuth()
auth.login("giorgio", "@#$@534")
.responseJSON { response in
guard (response.data != nil) else {
return
}
let provider = MutaloDataProvider(response)
provider.getUserProfile()
.responseJSON { profile in
print(profile)
}
}

61. JavaScript
@giorgionaKli // #mobiletea
let auth = new MutaloAuth()
let user = auth.login("giorgio", "@#456")
.then((token) => {
let provider = MutaloDataProvider(token);
provider.getUserProfile((profile) => {
console.log(profile);
});
})
.fail(error => console.log(error));

62. Keep calm and async program!

63. Mutalo Roadmap

64. Mutalo Roadmap
Web Site
April 2016
Restful API v1
July 2016
@giorgionaKli // #mobiletea

65. iOS SDK
August 2016
Restful API v2
September 2016
Android SDK
November 2016
User Registration
December 2016
@giorgionaKli // #mobiletea

66. Public Beta 1.0
Winter 2017

67. Questions & Answers

68. Contact Information
1. github.com/mutalo
2. mutalo.io
3. me@webplafrom.io
4. @mutalosdk
@giorgionaKli // #mobiletea

69. Resources and Links
★ http://www.gamesradar.com/stats-­‐confirm-­‐nobody-­‐really-­‐cares-­‐about-­‐mobile-­‐games
★ https://redd.it/26xj5y
★ http://snpedia.com/index.php/SNPedia
★ http://gameaccessibilityguidelines.com/
★ https://www.reddit.com/r/gamedev/comments/2b02mj/game_settings_best_practices
★ https://www.rockpapershotgun.com/2012/09/03/gaming-­‐for-­‐everyone-­‐game-­‐accessibility-­‐guidelines
★ http://www.polygon.com/features/2014/8/6/5886035/disabled-­‐gamers-­‐accessibility
★ http://www.includification.com
★ https://github.com/23andMe
★ http://researchkit.org
★ http://www.personalgenomes.org
★ http://game-­‐accessibility.com/documentation/accessibility-­‐guidelines
★ http://redis.io/topics/quickstart
★ https://openapis.org
★ http://www.decode.com
@giorgionaKli // #mobiletea

70. Thanks!
@giorgionatili