• Share
  • Email
  • Embed
  • Like
  • Save
  • Private Content
Tuenti Mobile Development
 

Tuenti Mobile Development

on

  • 3,664 views

Tuenti Mobile by Davide Mendolia ...

Tuenti Mobile by Davide Mendolia
Mobile devices are becoming one of the most used platform to connect to Internet, In Tuenti we are putting a focus on mobile platforms through applications and mobile web, discover how we are building m.tuenti.com.


Use of a palette of technologies like mobile device detection and capabilities on the server and the client side that help us to server different version as Plain HTML or HTML5.
How we try to bring the best user experience to every device adapting the possibles interactions based on the features or limitations of each them.

Statistics

Views

Total Views
3,664
Views on SlideShare
3,664
Embed Views
0

Actions

Likes
0
Downloads
7
Comments
1

0 Embeds 0

No embeds

Accessibility

Upload Details

Uploaded via as Apple Keynote

Usage Rights

© All Rights Reserved

Report content

Flagged as inappropriate Flag as inappropriate
Flag as inappropriate

Select your reason for flagging this presentation as inappropriate.

Cancel

11 of 1 previous next

  • Full Name Full Name Comment goes here.
    Are you sure you want to
    Your message goes here
    Processing…
  • Hey,
    Why do not you put an event viewer in mobile applications?, so it would be like getting in Tuenti from the pc, I personally use to make plans every week and if I'm not at home, there is no way to see them. Thanks for reading. Bye!
    Are you sure you want to
    Your message goes here
    Processing…
Post Comment
Edit your comment
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n

Tuenti Mobile Development Tuenti Mobile Development Presentation Transcript

  • Tuenti Mobile Development Davide Mendolia / @davideme - bcndevcon 2011
  • The strategy • Same content on Desktop and Mobile • Native Applications for mainstream operating system • Mobile website supporting most of the the platforms
  • Mobile Apps unique users Android BlackBerry iPhone J2ME900K450K 0K 2010 Q4 2011 Q1 2011 Q2 2011 Q3
  • When users are mobile?100% 50% 0% 0 2 4 6 8 10 12 14 16 18 20 22
  • The challenge 1.7 22 millions pages seen/day millions active users/month
  • DevicesMore than 500 different devices connect every day to m.tuenti.com.
  • Top devices
  • 30+ Different Browsers •AppleWebkit •IEMobile •PSP •TelecaBrowser •BlackBerry •Nokia •Jasmine •OperaMobi •Dolfin •OperaMini •NetFront •UPBrowser •PS3 •SE NetFront •Opera •MSIE •Obigo •...
  • Browser Usage AppleWebkit PSP 4% BlackBerry 5% Jasmine 5% Dolfin NetFront 5% PS3 50% Opera 6% Obigo IEMobile 6% TelecaBrowser Others 12%
  • Modern Browser•WebKit•Firefox mobile•IE for Windows phone 7
  • Modern Browser•WebKit•Firefox mobile•IE for Windows phone 7
  • Modern Browser•WebKit•Firefox mobile•IE for Windows phone 7
  • “There is no WebKit on Mobile” • Symbian^1 WK 413 ~ Safari 2 - 2005 • Symbian^3 WK 525 ~ Safari 3.1 - 2008 • Safari for iOS/Android ~ Safari 4 - 2009 • LG Phantom ~ Safari 4 - 2010 • Samsung Dolfin ~ Safari 4.1 - 2010 • BlackBerry OS 6.0 ~ Safari 5.1 - 2011
  • Browser Usage 2% Safari 2 ~ WK 413-420 15% Safari 4.1 ~ WK 533 Safari 4 ~ WK 528-532 Safari 3.1 ~ WK 525 43% Safari 5.1 ~ WK 534 17% 23%
  • Graded Browser• A Grade A Grade C Grade B Grade • WebKit• B grade 1% • Non-webkit 40% 59%• C grade • Old devices
  • A Grade • HTML 5 • markup • forms • Javascript support
  • B Grade • XHTML • No Javascript support
  • C Grade • Similar to B Grade • Dedicated to old phones • Windows Mobile • Blackberry Os <4.6
  • Screen sizeAll the way from the BlackBerry Curve 8520(320x240) to the GalaxyNexus(720 x 1280), we serve the adapted image size.
  • Pixel densityUsing High and Low version of CSS.And special version for console like for the PSP.
  • • Tracking • User Agent, Device • Device page views • Device usage • Tools •Google Analytics for mobile •Hadoop logging
  • Feature detection • Server side • Browser grade • Screen size and density • Client Side - Javascript/CSS •Screen size and density •Geolocation
  • Server Side • Device Description Repository • RegEx Matching • UserAgent approximation match • WURFL Database • Issues: • Update frequency • Database accuracy
  • Client Side • Javascript • Screen size • Pixel density • CSS media queries • assets density • Issues: • First request approximation • Only recent browser support it • CSS overhead
  • Performance • All Desktop best practices • PCAP Web Performance Analyzer • http://pcapperf.appspot.com • Waterfall view • PageSpeed analysis
  • Performance• Convert your laptop to an Access Point• Capture the traffic• Analyze it
  • Testing & debugging • Lot of manual testing • Device Lab, 80+ devices • Automated testing • Selenium not mature yet • Hard to debug Proxy Browser
  • Navigation redesign • Uniform experience • Content over navigation • Works Portrait and Landscape
  • Navigation redesign
  • Navigation redesign
  • What’s next ? • DeviceApi • Battery status • Contacts (reading from addressbook) • HTML Media Capture(camera/microphone interactions through HTML forms) • Messaging (SMS, MMS, emails) • Network Information API • Sensor API • Vibration API • ...
  • Questions ?