Save 37% off PRO during our Black Friday Sale! »

Nikolaos Giannopoulos - Offline Hybrid Application with Wordpress - WordCamp Athens 2016

Nikolaos Giannopoulos - Offline Hybrid Application with Wordpress - WordCamp Athens 2016

A717e9d055b2284e573b2412e32f5397?s=128

WordPress Greek Community

November 19, 2016
Tweet

Transcript

  1. Offline Hybrid Application with Wordpress Nikolaos Giannopoulos @gnnpls

  2. Design & Development Located in Corfu Co-Founder UX/UI motivar.io

  3. Information Architecture Hybrid Application Development Sync Content in Offline Application

    Sync Analytics Data
  4. Real Case Scenario

  5. Scenario Travel Guide

  6. Travel Guide No Digital Content Scenario

  7. iOS / Android Offline Application

  8. None
  9. CMS

  10. CMS Design Develop

  11. CMS Design Develop

  12. Solutions

  13. Design Develop CMS

  14. Design Develop

  15. WordPress Admin Simple Use of Posts Content in Categories Image

    Gallery
  16. keep in mind...

  17. I don’t ask why patients lie I just assume they

    all do Dr. House
  18. so do editors!

  19. Custom Fields Strict Content Restrictions Use of necessary fields Input

    Guides
  20. Display Errors

  21. Design Develop

  22. Team Facts Native Experience == false Specialized Partners == false

    Challenge Mode == true
  23. so we searched...

  24. Hybrid Application Development Hybrid Application Development

  25. Native Applications

  26. Web Applications

  27. Hybrid = Native + Web

  28. None
  29. Build

  30. Build

  31. Hybrid Frameworks Ionic http://ionicframework.com/ Onsen Ui https://onsen.io/ Cordova / Phonegap

    https://cordova.apache.org/ Jquery Mobile https://jquerymobile.com/
  32. Hybrid Frameworks Ionic http://ionicframework.com/ Onsen Ui https://onsen.io/ Jquery Mobile https://jquerymobile.com/

    Cordova / Phonegap https://cordova.apache.org/
  33. None
  34. None
  35. Solutions

  36. REST API Advantages Frequent Updates Use Cache to Save Data

    Drawbacks No Web no Content Bad Local network
  37. Save Data on Device Advantages Offline Access Control over Content

    Drawbacks No Frequent Updates Time Consuming Uploads
  38. #drawbacks { transform: advantages; }

  39. Launch Versions Export Content to JSON Export Images to ZIP

    Create Update Token
  40. Export UI

  41. Export JSON to SQLite Register Device on WP Use of

    Local Storage Sync Update Tokens
  42. SQLite Content

  43. None
  44. Corfu Summer News

  45. Life@Corfu

  46. iOS / Android Card Design Newspaper

  47. Search Function Hamburger Menu Nearest Articles

  48. Categories Subcategories Articles Counter

  49. SlideShow Title & Headline Content

  50. Calls to Action Custom Fields Consistency

  51. GPS on demand Google Maps Directions Api

  52. Code Layout

  53. Performance First Target more than 4000 Devices Limit Queries to

    SQLite Call Scripts on Demand
  54. HTML5

  55. Data Mapping

  56. Libraries & Tools Jquery https://jquery.com/ Velocity.js http://velocityjs.org/ Materialize.css http://materializecss.com/ FastClick

    https://github.com/ftlabs/fastclick GapDebug https://www.genuitec.com/products/gapdebug/
  57. Done?

  58. not yet!

  59. The price of light is less than the cost of

    darkness Arthur C. Nielsen
  60. Analytics

  61. None
  62. Statistics Content Geo-Location Call to Action

  63. Solutions Store Analytics Google Analytics SDK Multiple SDKs

  64. Project Status Last Minute Delivery == true Offline App Experience

    == false Code Transformation Needed == true
  65. Custom Solution

  66. SQLite & Local Storage Article & Call to Action Geo

    Stats
  67. Online Connection Confirm Device ID Store Analytics & Sweep

  68. Device List

  69. User Journey

  70. User Journey

  71. Various True Facts

  72. 3,000 total Downloads

  73. 23% Downloads before Trip

  74. 17% Asked for Directions

  75. 14% Converged

  76. 650% Profit Increase in 2 Years

  77. Expand in Ionian Islands

  78. Summary

  79. None
  80. Useful Links Building a PhoneGap App with WordPress http://bit.ly/2eHI5vo Creating

    a Mobile App for your WordPress Site http://bit.ly/2eNpKeW PhoneGap Tips http://bit.ly/2dSzjLX Top 10 Performance Techniques for Hybrid Apps http://bit.ly/2eCKmaz
  81. remember..

  82. not always works like a charm

  83. but don’t worry

  84. challenge == true && devotion == true && comfortZone ==

    false { progress = true; }
  85. Thanks Nikolaos Giannopoulos n.giannopoulos@motivar.io @gnnpls