Upgrade to Pro
— share decks privately, control downloads, hide ads and more …
Speaker Deck
Features
Speaker Deck
PRO
Sign in
Sign up for free
Search
Search
Nikolaos Giannopoulos - Offline Hybrid Applicat...
Search
WordPress Greek Community
November 19, 2016
Programming
1
400
Nikolaos Giannopoulos - Offline Hybrid Application with Wordpress - WordCamp Athens 2016
WordPress Greek Community
November 19, 2016
Tweet
Share
More Decks by WordPress Greek Community
See All by WordPress Greek Community
Όμορφα, γρήγορα και οικονομικά websites με WordPress
wpgr
0
3
Unlocking creativity - Marilia Darilli
wpgr
0
23
Έλλη Μουχτάρη - Χτίσε το προσωπικό σου brand και απόκτησε τους πελάτες που θες
wpgr
0
11
Ioannis Kastorinis - WooCommerce technical automations in the real world
wpgr
0
18
Christos Paloukas - Cache me if you can, a journey through caching layers in WordPress
wpgr
0
31
Ευάγγελος Πάλλης - Malware Cleanup & Protection
wpgr
0
29
Νίκος Μαυράκης - Κοστολογώντας τη δημιουργικότητα
wpgr
0
22
Πώς να διατηρήσω το WordPress site μου ασφαλές;
wpgr
0
36
CSS 101: Τα μυστικά του στυλ - Χάρης Βαλτζής
wpgr
0
36
Other Decks in Programming
See All in Programming
VibeCoding時代のエンジニアリング
daisuketakeda
0
240
KANNA Android の技術的課題と取り組み
watabee
1
570
ビカム・ア・コパイロット
ymd65536
1
150
複雑なフォームの jotai 設計 / Designing jotai(state) for Complex Forms #layerx_frontend
izumin5210
6
1.6k
Boast Code Party / RubyKaigi 2025 After Event
lemonade_37
0
110
GitHub Copilot for Azureを使い倒したい
ymd65536
1
340
生成AI時代のフルスタック開発
kenn
8
960
事業KPIを基に価値の解像度を上げる
nealle
0
140
実践Webフロントパフォーマンスチューニング
cp20
45
10k
一緒に働きたくなるプログラマの思想 #QiitaConference
mu_zaru
83
21k
ASP.NETアプリケーションのモダナイゼーションについて
tomokusaba
0
270
読書シェア会 vol.4 『ダイナミックリチーミング 第2版』
kotaro666
0
120
Featured
See All Featured
Raft: Consensus for Rubyists
vanstee
137
6.9k
The Invisible Side of Design
smashingmag
299
50k
The Web Performance Landscape in 2024 [PerfNow 2024]
tammyeverts
5
580
The Myth of the Modular Monolith - Day 2 Keynote - Rails World 2024
eileencodes
24
2.7k
For a Future-Friendly Web
brad_frost
177
9.7k
Building Better People: How to give real-time feedback that sticks.
wjessup
368
19k
Creating an realtime collaboration tool: Agile Flush - .NET Oxford
marcduiker
30
2k
Chrome DevTools: State of the Union 2024 - Debugging React & Beyond
addyosmani
5
620
StorybookのUI Testing Handbookを読んだ
zakiyama
30
5.7k
Building a Modern Day E-commerce SEO Strategy
aleyda
40
7.3k
Let's Do A Bunch of Simple Stuff to Make Websites Faster
chriscoyier
507
140k
Speed Design
sergeychernyshev
29
940
Transcript
Offline Hybrid Application with Wordpress Nikolaos Giannopoulos @gnnpls
Design & Development Located in Corfu Co-Founder UX/UI motivar.io
Information Architecture Hybrid Application Development Sync Content in Offline Application
Sync Analytics Data
Real Case Scenario
Scenario Travel Guide
Travel Guide No Digital Content Scenario
iOS / Android Offline Application
None
CMS
CMS Design Develop
CMS Design Develop
Solutions
Design Develop CMS
Design Develop
WordPress Admin Simple Use of Posts Content in Categories Image
Gallery
keep in mind...
I don’t ask why patients lie I just assume they
all do Dr. House
so do editors!
Custom Fields Strict Content Restrictions Use of necessary fields Input
Guides
Display Errors
Design Develop
Team Facts Native Experience == false Specialized Partners == false
Challenge Mode == true
so we searched...
Hybrid Application Development Hybrid Application Development
Native Applications
Web Applications
Hybrid = Native + Web
None
Build
Build
Hybrid Frameworks Ionic http://ionicframework.com/ Onsen Ui https://onsen.io/ Cordova / Phonegap
https://cordova.apache.org/ Jquery Mobile https://jquerymobile.com/
Hybrid Frameworks Ionic http://ionicframework.com/ Onsen Ui https://onsen.io/ Jquery Mobile https://jquerymobile.com/
Cordova / Phonegap https://cordova.apache.org/
None
None
Solutions
REST API Advantages Frequent Updates Use Cache to Save Data
Drawbacks No Web no Content Bad Local network
Save Data on Device Advantages Offline Access Control over Content
Drawbacks No Frequent Updates Time Consuming Uploads
#drawbacks { transform: advantages; }
Launch Versions Export Content to JSON Export Images to ZIP
Create Update Token
Export UI
Export JSON to SQLite Register Device on WP Use of
Local Storage Sync Update Tokens
SQLite Content
None
Corfu Summer News
Life@Corfu
iOS / Android Card Design Newspaper
Search Function Hamburger Menu Nearest Articles
Categories Subcategories Articles Counter
SlideShow Title & Headline Content
Calls to Action Custom Fields Consistency
GPS on demand Google Maps Directions Api
Code Layout
Performance First Target more than 4000 Devices Limit Queries to
SQLite Call Scripts on Demand
HTML5
Data Mapping
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/
Done?
not yet!
The price of light is less than the cost of
darkness Arthur C. Nielsen
Analytics
None
Statistics Content Geo-Location Call to Action
Solutions Store Analytics Google Analytics SDK Multiple SDKs
Project Status Last Minute Delivery == true Offline App Experience
== false Code Transformation Needed == true
Custom Solution
SQLite & Local Storage Article & Call to Action Geo
Stats
Online Connection Confirm Device ID Store Analytics & Sweep
Device List
User Journey
User Journey
Various True Facts
3,000 total Downloads
23% Downloads before Trip
17% Asked for Directions
14% Converged
650% Profit Increase in 2 Years
Expand in Ionian Islands
Summary
None
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
remember..
not always works like a charm
but don’t worry
challenge == true && devotion == true && comfortZone ==
false { progress = true; }
Thanks Nikolaos Giannopoulos
[email protected]
@gnnpls