Mobile app vs native app

Ο τίτλος θα μπορούσε να είναι και “θέλω να φτιάξω ένα site που να παίζει σε όλους τους browsers, κινητά και tablets που υπάρχουν στην αγορά”. Δυστυχώς όμως μερικά πράγματα δεν γίνονται όσο μαγικά θέλουμε… Αλλά καλύτερα ας πάρουμε τα πράγματα από την αρχή. Το mobile web έχει μπει για τα καλά στην ζωή μας, μιας και μπορούμε πολύ εύκολα είτε με ένα smartphone είτε με ένα tablet να κάνουμε σχεδόν τα πάντα και μάλιστα ενώ είμαστε μακριά από το γραφείο μας. Η πλειοψηφία των παραπάνω συσκευών λειτουργεί με μόλις 2 λειτουργικά, το iOS της Apple που είναι ενσωματωμένο σε όλες τις συσκευές της (iPhone, iPad, κτλ.) και το Androind OS το οποίο είναι η πρώτη σοβαρή και open source επιλογή για τους υπόλοιπους κατασκευαστές.

Το πρόβλημα συνήθως ξεκινάει με το πως θα φαίνεται το site μας σε μια τέτοια συσκευή. Για κάποιο περίεργο λόγο, οι περισσότεροι χρήστες/πελάτες είναι αρκετά μπερδεμένοι, μιας και δεν ξέρουν τι λύσεις υπάρχουν (και υπάρχουν λύσεις για όλα τα budgets), ποια είναι τα πλεονεκτήματα και μειονεκτήματα τους, και γενικότερα επικρατεί μια σύγχυση για το θέμα, με αποτέλεσμα να δημιουργούνται προβλήματα και παρεξηγήσεις. Ελπίζω το παρακάτω άρθρο να ξεδιαλύνει κάπως το τοπίο έτσι ώστε να επωφεληθούμε όλοι. Σε αυτό το σημείο θα ήθελα να τονίσω πως δεν είμαι κανένας φοβερός mobile guru/expert, και ίσως κάπου κάνω λάθος, γι’ αυτόν τον λόγο όποιος έχει να συμπληρώσει/προσθέσει κάτι, απλά ας μου αφήσει ένα σχόλιο. Έχουμε και λέμε λοιπόν, το site μας μπορεί να εμφανιστεί στο smartphone/tablet μας με δύο τρόπους.

Web app

Επιλέγοντας αυτήν την λύση, εννοούμε πως θα χρησιμοποιούμε τον browser της συσκευής μας (smartphone/tablet) για να δούμε το site μας. Μια αρκετά απλή λύση μπορεί να είναι η χρήση κάποιων CSS queries (Responsive Web Design) έτσι ώστε το site μας να φαίνεται λίγο πιο μαζεμένο και optimised στις συσκευές (οθόνες) που έχουμε αποφασίσει να υποστηρίξουμε. Αυτό δεν σημαίνει πως μπορούμε να φτάσουμε μέχρι εκεί. Ανάλογα με τις ανάγκες του project, και φυσικά το budget του, το mobile site μπορεί να γίνει όσο πολύπλοκο θέλουμε, χρησιμοποιώντας όσο καλύτερα γίνεται τις δυνατότητες της συσκευής και του browser που μας παρέχει. Για παράδειγμα η Google (λόγω και του Android), αποφεύγει τις native εφαρμογές, προσφέρει όμως σχεδόν σε όλες της τις υπηρεσίες ειδικά διαμορφωμένες web εφαρμογές για κινητά και tablets (μπείτε στο Gmail από τον browser του κινητού σας και θα καταλάβετε τι εννοώ).

Τα πλεονεκτήματα μιας web app είναι αρκετά. Το πρώτο και σημαντικότερο είναι πως δεν χρειάζεστε κάποιο συγκεκριμένο SDK (όπως πχ. το iOS SDK) για να δημιουργήσετε την web εφαρμογή σας. Μπορείτε να χρησιμοποιήσετε web τεχνολογίες όπως HTML (HTML5 καλύτερα), CSS και Javascript! Σε αυτό το σημείο αξίζει να σημειώσω πως οι browsers των κινητών/tablet (των σοβαρών κατασκευαστών τουλάχιστον) είναι φοβερά εξελιγμένοι και με πολλά χαρακτηριστικά, πράγμα που σημαίνει πως ήδη υποστηρίζουν πολλά HTML5 και CSS3 καλούδια. Το δεύτερο πλεονέκτημα μιας web app είναι πως, αν είναι καλοσχεδιασμένη φυσικά (βλέπε Progressive enhancement, Responsive Web Design, κτλ. κτλ.), μπορεί να καλύψει την πλειοψηφία των συσκευών και των browser που υπάρχουν! Αυτό σημαίνει πως με μόλις μία εφαρμογή μπορεί να καλυφθούν όλα τα κινητά και tablets ανεξαρτήτου κατασκευαστή και λειτουργικού συστήματος. Τέλος ακόμα ένα πλεονέκτημα μπορεί να θεωρηθεί και η ανεξάρτητη διανομή, μιας και στην ουσία η εφαρμογή ζει στο web και όχι σε κάποιο store (o χρήστης απλά συνδέεται με την εφαρμογή χρησιμοποιώντας τον browser του). Χαρακτηριστικό παράδειγμα φοβερής web εφαρμογής που ήθελε να παρακάμψει το γνωστό για την εκκεντρικότητα του Apple App Store, είναι η εφαρμογή της Financial Times. Ρίξτε οπωσδήποτε μια ματιά από το κινητό σας και δείτε τι φανταστική δουλειά έχουν κάνει…

Τα μειονεκτήματα τώρα (ναι υπάρχουν και αυτά) έχουν να κάνουν κυρίως στο ότι δεν είναι εγγενής (native) εφαρμογή (τι έγραψα τώρα!). Οι web εφαρμογές λοιπόν, είναι συνήθως λίγο πιο αργές σε ανταπόκριση, μιας και στέλνουν σε έναν server κάποιο request και περιμένουμε απάντηση, ενώ συνήθως δεν έχουν και την “γυαλάδα” του native user interface. Επίσης οι web εφαρμογές μπορούν να κάνουν μόνο ότι μπορεί να καταλάβει ο browser της εκάστοτε συσκευής, δεν έχουν με άλλα λόγια πρόσβαση σε πιο advanced χαρακτηριστικά της συσκευής (όπως πχ. camera, GPS, πυξίδα, γυροσκόπιο, κτλ.).

Native app

Εγγενείς (native) εφαρμογές ονομάζουμε αυτές που τις κατεβάζουμε και της εγκαθιστούμε στην συσκευή μας από κάποιο store (πχ. App Store), είτε δωρεάν, είτε πληρώνοντας κάποιο χρηματικό ποσό. Η κάθε εφαρμογή έχει φτιαχτεί ειδικά για την συγκεκριμένη συσκευή, πράγμα που σημαίνει πως εκμεταλλεύεται πολύ καλά τα χαρακτηριστικά της εκάστοτε συσκευής, αλλά όπως καταλαβαίνεται πρέπει να γράψετε τουλάχιστον 2 διαφορετικές εφαρμογές (και να δουλέψετε με 2 διαφορετικά SDK) έτσι ώστε να δημιουργήσετε εφαρμογές για τα 2 βασικά λειτουργικά των κινητών/tablet (iOS και Android).

Τα πλεονεκτήματα και εδώ είναι αρκετά, με πρώτο και σημαντικότερο πως δεν χρειάζεται να είσαι συνδεδεμένος στο internet για να χρησιμοποιήσεις την εφαρμογή (εκτός φυσικά και αν αυτό είναι requirement της ίδιας της εφαρμογής). Το user interface και η απόκρισή είναι πολύ πιο γρήγορα και συνήθως πιο εντυπωσιακά από τα αντίστοιχα μιας web εφαρμογής, ενώ μπορούμε να χρησιμοποιήσουμε και όλα τα advanced χαρακτηριστικά της εκάστοτε συσκευής όπως camera, GPS, πυξίδα, γυροσκόπιο, κτλ. (εδώ την έχει πατήσει λίγο το Android μιας και οι κατασκευαστές εκτός από ότι είναι πολλοί, προσφέρουν και διαφορετικά χαρακτηριστικά στις συσκευές τους, πράγμα που δημιουργεί αρκετά προβλήματα στους developers).

Το βασικότερο μειονέκτημα τώρα, το ανέφερα και πιο πάνω, δεν είναι άλλο από το γεγονός πως η εφαρμογή είναι platform-dependent, που σημαίνει πως πρέπει να γράψετε την ίδια εφαρμογή για πολλές πλατφόρμες (τουλάχιστον 2), χωρίς να κάνω λόγο για τις υποπεριπτώσεις τους (όπως πχ. τις αλλαγές που μπορεί να υπάρχουν σε hardware χαρακτηριστικά πχ. retina display, ή εντελώς διαφορετικά hardware setup σε android συσκευές). Τέλος ένα μικρό μειονέκτημα μπορεί να θεωρηθεί και το γεγονός πως για να γίνει update η εφαρμογή, πρέπει να ξανά-ανέβει στο εκάστοτε store (αφού εγκριθεί κτλ .κτλ.), να την ξανά-κατεβάσει και να την ξανά-κάνει install ο εκάστοτε χρήστης (στην περίπτωση της web app το update είναι πολύ πιο άμεσο).

Αυτά τα λίγα περί web και native εφαρμογών για κινητά και tablets. Ελπίζω να ξεκαθάρισα λιγάκι το τοπίο, μιας και για κάποιο ανεξήγητο λόγο τα πράγματα είναι αρκετά μπερδεμένα! Αν κάποιος θέλει να συμπληρώσει κάτι, ας αφήσει απλά ένα σχόλιο…

Tsevdos.com και WPtouch plug in

Εάν έχετε κάποιο WordPress installation και θέλετε να δημιουργήσετε εύκολα και γρήγορα μια mobile έκδοση του site σας η οποία θα λειτουργεί σε όλα τα κινητά τηλέφωνα (iPhone/iPod touch, Android, BlackBerry Storm κτλ.), τότε το WPtouch plug in είναι ακριβώς αυτό που χρειάζεστε! Προσωπικά με κέρδισε από το MoFuse που χρησιμοποιούσα μέχρι τώρα, για δύο κυρίως λόγους. Πρώτον, δεν χρειάζεται να έχω ή να ρυθμίσω κάποιο διαφορετικό mobile domain (πχ. m.tsevdos.com) για να λειτουργήσει. Οι mobile χρήστες μπαίνουν κατευθείαν στο site μου, και μόλις το WPtouch αντιληφθεί πως έχει να κάνει με mobile user agent, απλά του “σερβίρει”  την mobile έκδοση. Το δεύτερο χαρακτηριστικό που με κέρδισε, είναι ότι υποστηρίζει όλους τους σοβαρούς mobile browsers και συσκευές που υπάρχουν, και όχι μόνο το iPhone, όπως κάποιες άλλες λύσεις.

Το συστήνω ανεπιφύλακτα, μιας και σε χρόνο μηδέν, αλλά και χωρίς κόπο μπορείτε να κάνετε το WordPress site σας mobile-friendly.

Mobify.me

Πολύ ενθουσιάζομαι όταν ανακαλύπτω πραγματικά έξυπνες και πρακτικές λύσεις. Την συγκεκριμένη υπηρεσία την ανακάλυψα από το blog της Veerle και περιμένω πως και πως να γυρίσω σπίτι για να “παίξω” λίγο μαζί της. Η υπηρεσία ονομάζεται Mobify και σου επιτρέπει να δημιουργήσεις σχετικά εύκολα μια custom mobile έκδοση του site σου. Η διαφορά με τις υπόλοιπες υπηρεσίες, όπως για παράδειγμα το Mofuse που χρησιμοποιώ αυτήν την στιγμή στην mobile έκδοση του Τsevdos.com, είναι πως επιτρέπει πλήρη customization και έλεγχο της  mobile έκδοσης του site σας – κάνετε δηλαδή πραγματικό mobile web design – και δεν στηρίζεται σε κάποια έτοιμα templates τα οποία δημιουργούνται αυτόματα μέσω RSS feed (όπως λειτουργεί το Mofuse για παράδειγμα).

Με αυτόν τον τρόπο ένα μικρο-μεσαίο site μπορεί πολύ εύκολα να αποκτήσει μια αξιοπρεπέστατη και custom mobile λύση, με σχεδόν μηδενικό budget και χωρίς την σπατάλη πολύτιμων resources και χρόνου σε extra development ή την εκμάθηση πολύπλοκων API. Επίσης δεν χρειάζεται να κάνετε τίποτα το ιδιαίτερο για την ανανέωση του, πέρα από το να ανανεώνεται το κανονικό σας site. Στην συνέχεια απλά και ανάλογα με τις ρυθμίσεις και το περιεχόμενο που έχετε επιλέξει, η mobile version site σας ανανεώνεται αυτόματα!

Από μια γρήγορη ματιά που του έριξα, είναι κάπως πολύπλοκο και δύσκολο στην χρήση, τουλάχιστον μέχρι να καταλάβεις πως λειτουργεί, όμως αυτό είναι και η δύναμη του, μιας και με αυτόν τον τρόπο μας προσφέρει πλήρη ελευθερία στις δημιουργίες μας.

Τέλος οι τύποι είναι και πολύ έξυπνοι στο marketing μιας και επικοινώνησαν με μεγάλα sites/blogs όπως το Veerle’s blog και το A List Apart και τους δημιούργησαν – δωρεάν φυσικά – τις mobile version τους!