SlideShare a Scribd company logo
1 of 21
Phone for Me, Tablet for We:
Building a multi screen app
Abhay Aggarwal & Nitin Khattar
2
Phones & Tablets –
Are they different?
3
Something happened…
4
It’s all in the design
5
One design, Multiple Personalities
6
7
The Apple Bandwagon
960 x 640 screen 1024 x 768 screen
8
The Android Carnival
1280x800
800x480
1024x600
240x320
240x400
320x480
360x640
480x800
540x960
• Highly fragmented mobile technology landscape
• Need specialized resources or learn each technology
• Production and maintenance costs overshoots the budget
9
Become a Native App Developer…
10
…Or, you can code smart
11
Let’s build an app…
12
The Key to Nirvana…
13
#1
IDENTIFY YOUR USER
14
#2
Sketch basic layouts for different
sizes
15
#3
CONSTANT = CONSISTENT
16
#4
Modularize your code
17
#5
Separate the
business logic from user interface
18
#6
Plan for data storage
19
#7
Use CSS & resource bundles
extensively
20
Your thoughts
21
</thanks>
abhay aggarwal . aaggarwal@xebia.com
nitin khattar . @khattarn
www.xebia.in

More Related Content

Similar to Phone for me, tablet for we mods

MCL Corporate Presentation - 0416
MCL Corporate Presentation - 0416MCL Corporate Presentation - 0416
MCL Corporate Presentation - 0416
Raj Ojha
 
MCL Corporate Presentation - 0416
MCL Corporate Presentation - 0416MCL Corporate Presentation - 0416
MCL Corporate Presentation - 0416
Raj Ojha
 
Mm co e creds mma smarties india
Mm co e creds mma smarties india Mm co e creds mma smarties india
Mm co e creds mma smarties india
shyni Johnson
 
Camerjam golden gekko mobile sport masterclass
Camerjam golden gekko mobile sport masterclassCamerjam golden gekko mobile sport masterclass
Camerjam golden gekko mobile sport masterclass
James Cameron
 

Similar to Phone for me, tablet for we mods (20)

Superfast Business: Getting the most out of iPads
Superfast Business: Getting the most out of iPadsSuperfast Business: Getting the most out of iPads
Superfast Business: Getting the most out of iPads
 
MCL Corporate Presentation - 0416
MCL Corporate Presentation - 0416MCL Corporate Presentation - 0416
MCL Corporate Presentation - 0416
 
MCL Corporate Presentation - 0416
MCL Corporate Presentation - 0416MCL Corporate Presentation - 0416
MCL Corporate Presentation - 0416
 
InfoBeans Mobile Practice Capabilities Presentation
InfoBeans Mobile Practice Capabilities PresentationInfoBeans Mobile Practice Capabilities Presentation
InfoBeans Mobile Practice Capabilities Presentation
 
Mm co e creds mma smarties india
Mm co e creds mma smarties india Mm co e creds mma smarties india
Mm co e creds mma smarties india
 
Superfast Business Getting the Most Out of iPads: Dorset Event Slides
Superfast Business Getting the Most Out of iPads: Dorset Event SlidesSuperfast Business Getting the Most Out of iPads: Dorset Event Slides
Superfast Business Getting the Most Out of iPads: Dorset Event Slides
 
Bristech 03/09/15 - Drupal and the IoT
Bristech  03/09/15 - Drupal and the IoTBristech  03/09/15 - Drupal and the IoT
Bristech 03/09/15 - Drupal and the IoT
 
Camerjam golden gekko mobile sport masterclass
Camerjam golden gekko mobile sport masterclassCamerjam golden gekko mobile sport masterclass
Camerjam golden gekko mobile sport masterclass
 
Responsive Design & Mobile First
Responsive Design & Mobile FirstResponsive Design & Mobile First
Responsive Design & Mobile First
 
How to Build a Great Web Application
How to Build a Great Web ApplicationHow to Build a Great Web Application
How to Build a Great Web Application
 
Simmtronics Presentation
Simmtronics PresentationSimmtronics Presentation
Simmtronics Presentation
 
Introducction to FIWARE TMF Open Hack
Introducction to FIWARE TMF Open HackIntroducction to FIWARE TMF Open Hack
Introducction to FIWARE TMF Open Hack
 
Gameathon @ Neev
Gameathon @ NeevGameathon @ Neev
Gameathon @ Neev
 
Desigining for auto_layout
Desigining for auto_layoutDesigining for auto_layout
Desigining for auto_layout
 
Zain TechTalk Magazine | Issue 2, Q2 2017
Zain TechTalk Magazine | Issue 2, Q2 2017Zain TechTalk Magazine | Issue 2, Q2 2017
Zain TechTalk Magazine | Issue 2, Q2 2017
 
Why Select 3DPrinterOS as your answer for 3D Printer Deployment
Why Select 3DPrinterOS as your answer for 3D Printer DeploymentWhy Select 3DPrinterOS as your answer for 3D Printer Deployment
Why Select 3DPrinterOS as your answer for 3D Printer Deployment
 
Enterprise Mobility @ Neev
Enterprise Mobility @ NeevEnterprise Mobility @ Neev
Enterprise Mobility @ Neev
 
Aalogics
AalogicsAalogics
Aalogics
 
UXPA Dallas - Google Analytics and What's Before Mobile First
UXPA Dallas - Google Analytics and What's Before Mobile FirstUXPA Dallas - Google Analytics and What's Before Mobile First
UXPA Dallas - Google Analytics and What's Before Mobile First
 
IBM s'associe au SmartHome Challenge
IBM s'associe au SmartHome ChallengeIBM s'associe au SmartHome Challenge
IBM s'associe au SmartHome Challenge
 

Recently uploaded

Artificial Intelligence: Facts and Myths
Artificial Intelligence: Facts and MythsArtificial Intelligence: Facts and Myths
Artificial Intelligence: Facts and Myths
Joaquim Jorge
 
IAC 2024 - IA Fast Track to Search Focused AI Solutions
IAC 2024 - IA Fast Track to Search Focused AI SolutionsIAC 2024 - IA Fast Track to Search Focused AI Solutions
IAC 2024 - IA Fast Track to Search Focused AI Solutions
Enterprise Knowledge
 
EIS-Webinar-Prompt-Knowledge-Eng-2024-04-08.pptx
EIS-Webinar-Prompt-Knowledge-Eng-2024-04-08.pptxEIS-Webinar-Prompt-Knowledge-Eng-2024-04-08.pptx
EIS-Webinar-Prompt-Knowledge-Eng-2024-04-08.pptx
Earley Information Science
 

Recently uploaded (20)

08448380779 Call Girls In Diplomatic Enclave Women Seeking Men
08448380779 Call Girls In Diplomatic Enclave Women Seeking Men08448380779 Call Girls In Diplomatic Enclave Women Seeking Men
08448380779 Call Girls In Diplomatic Enclave Women Seeking Men
 
Advantages of Hiring UIUX Design Service Providers for Your Business
Advantages of Hiring UIUX Design Service Providers for Your BusinessAdvantages of Hiring UIUX Design Service Providers for Your Business
Advantages of Hiring UIUX Design Service Providers for Your Business
 
The Codex of Business Writing Software for Real-World Solutions 2.pptx
The Codex of Business Writing Software for Real-World Solutions 2.pptxThe Codex of Business Writing Software for Real-World Solutions 2.pptx
The Codex of Business Writing Software for Real-World Solutions 2.pptx
 
Artificial Intelligence: Facts and Myths
Artificial Intelligence: Facts and MythsArtificial Intelligence: Facts and Myths
Artificial Intelligence: Facts and Myths
 
04-2024-HHUG-Sales-and-Marketing-Alignment.pptx
04-2024-HHUG-Sales-and-Marketing-Alignment.pptx04-2024-HHUG-Sales-and-Marketing-Alignment.pptx
04-2024-HHUG-Sales-and-Marketing-Alignment.pptx
 
2024: Domino Containers - The Next Step. News from the Domino Container commu...
2024: Domino Containers - The Next Step. News from the Domino Container commu...2024: Domino Containers - The Next Step. News from the Domino Container commu...
2024: Domino Containers - The Next Step. News from the Domino Container commu...
 
Breaking the Kubernetes Kill Chain: Host Path Mount
Breaking the Kubernetes Kill Chain: Host Path MountBreaking the Kubernetes Kill Chain: Host Path Mount
Breaking the Kubernetes Kill Chain: Host Path Mount
 
Bajaj Allianz Life Insurance Company - Insurer Innovation Award 2024
Bajaj Allianz Life Insurance Company - Insurer Innovation Award 2024Bajaj Allianz Life Insurance Company - Insurer Innovation Award 2024
Bajaj Allianz Life Insurance Company - Insurer Innovation Award 2024
 
Real Time Object Detection Using Open CV
Real Time Object Detection Using Open CVReal Time Object Detection Using Open CV
Real Time Object Detection Using Open CV
 
Handwritten Text Recognition for manuscripts and early printed texts
Handwritten Text Recognition for manuscripts and early printed textsHandwritten Text Recognition for manuscripts and early printed texts
Handwritten Text Recognition for manuscripts and early printed texts
 
A Domino Admins Adventures (Engage 2024)
A Domino Admins Adventures (Engage 2024)A Domino Admins Adventures (Engage 2024)
A Domino Admins Adventures (Engage 2024)
 
Mastering MySQL Database Architecture: Deep Dive into MySQL Shell and MySQL R...
Mastering MySQL Database Architecture: Deep Dive into MySQL Shell and MySQL R...Mastering MySQL Database Architecture: Deep Dive into MySQL Shell and MySQL R...
Mastering MySQL Database Architecture: Deep Dive into MySQL Shell and MySQL R...
 
The 7 Things I Know About Cyber Security After 25 Years | April 2024
The 7 Things I Know About Cyber Security After 25 Years | April 2024The 7 Things I Know About Cyber Security After 25 Years | April 2024
The 7 Things I Know About Cyber Security After 25 Years | April 2024
 
Workshop - Best of Both Worlds_ Combine KG and Vector search for enhanced R...
Workshop - Best of Both Worlds_ Combine  KG and Vector search for  enhanced R...Workshop - Best of Both Worlds_ Combine  KG and Vector search for  enhanced R...
Workshop - Best of Both Worlds_ Combine KG and Vector search for enhanced R...
 
[2024]Digital Global Overview Report 2024 Meltwater.pdf
[2024]Digital Global Overview Report 2024 Meltwater.pdf[2024]Digital Global Overview Report 2024 Meltwater.pdf
[2024]Digital Global Overview Report 2024 Meltwater.pdf
 
Finology Group – Insurtech Innovation Award 2024
Finology Group – Insurtech Innovation Award 2024Finology Group – Insurtech Innovation Award 2024
Finology Group – Insurtech Innovation Award 2024
 
IAC 2024 - IA Fast Track to Search Focused AI Solutions
IAC 2024 - IA Fast Track to Search Focused AI SolutionsIAC 2024 - IA Fast Track to Search Focused AI Solutions
IAC 2024 - IA Fast Track to Search Focused AI Solutions
 
Exploring the Future Potential of AI-Enabled Smartphone Processors
Exploring the Future Potential of AI-Enabled Smartphone ProcessorsExploring the Future Potential of AI-Enabled Smartphone Processors
Exploring the Future Potential of AI-Enabled Smartphone Processors
 
Automating Google Workspace (GWS) & more with Apps Script
Automating Google Workspace (GWS) & more with Apps ScriptAutomating Google Workspace (GWS) & more with Apps Script
Automating Google Workspace (GWS) & more with Apps Script
 
EIS-Webinar-Prompt-Knowledge-Eng-2024-04-08.pptx
EIS-Webinar-Prompt-Knowledge-Eng-2024-04-08.pptxEIS-Webinar-Prompt-Knowledge-Eng-2024-04-08.pptx
EIS-Webinar-Prompt-Knowledge-Eng-2024-04-08.pptx
 

Phone for me, tablet for we mods

Editor's Notes

  1. What is a phone? What is a tablet? Is it the set of feature? Is it the size? We could also look at Phone as a really tiny tablet, and at the tablet as a really large phone. In the right hands, and at the right time, either could mean the other.
  2. How did we get to here? Innovation happened &amp; markets got disrupted. People, who might not necessarily be tech savvy, are consuming content on these devices, primarily because of the form factor. Strangely enough, or because of the design, children, as young as 2 years can actually use the new devices much better than most adults can do, because of one thing: The FINGER!!!!
  3. The shape of the devices, aided in no small part by availaibilty of well written apps, is driving content consumption &amp; creation. The touchscreen practically begs the user to touch it &amp; play with it. Is it a coincidence that Facebook &amp; Twitter have expanded at precisely the same time that smartphones have been been made available? I think not.
  4. The phone is a very personal device; an extension of one&apos;s own personality. The tablet, on the other hand, is a consumption/development/collaboration device, depending on the time &amp; place it is used.
  5. Let&apos;s look at how the touchscreen device market looks like...
  6. Right now, we have a plethora of devices. Things are still pretty simple in Apple&apos;s camp, where we have to worry about iPhone 4 &amp; iPad 2 dimensions.
  7. Now lets look at Android. Its a huge mess, with differing form factors, and each manufacturer adding its own skin on top of the default Android UI. Now how does one code for all this? Do I make different apps for all markets?
  8. Cross platform tools help you to code once, run many times.
  9. .
  10. The first &amp; foremost need is to understand the plethora of end users…..identifying the target audience &amp; enhancing the user experience/look &amp; feel based on that.
  11. Point is to sketch the layouts in whatever medium possible. What one need is not a tool but a clear thought process and Understanding of varied sizes of multiple devices
  12. What&apos;s the key here? Consistent UI, or Consistent Experience? (Hint: It&apos;s the latter) So what this means is that I might have to code extra, but I do not have to re-invent the wheel. If I can separate my business functionality from my UI, a lot of my work becomes easier
  13. Try &amp; break your application into multiple modules….it helps in parallel development, reduces chances of failures &amp; bugs and lower external dependencies to a greater extent.
  14. Code – Behind Pattern: always try separating entire business logic….whether domain objects, presentation models, services or utilities…from the user interface. In this way, it becomes easier for one to build apps for different platforms like mobile, tablets, web, desktop without rewriting the same code.
  15. Each Device has its own hardware capabilities &amp; performance requirements. One should initially plan all the non-functional requirements like memory, speed, data storage separately for every targeted device.
  16. Make extensive use of External and Runtime style sheets &amp; properties file to load any assets or themes. Handle Platform-Specific UI, DPI/Resolution Specific UI through CSS at runtime. Build easily different themes for different merchants/customers(might be of different age groups)