Ειδικό Design για κινητές συσκευές ή εφαρμογή για κινητά;

Σχόλια από τον χώρο του Web Design, Web Development.

Συντονιστές: WebDev Moderators, Super-Moderators

Απάντηση
Gveronis
Δημοσιεύσεις: 24
Εγγραφή: 07 Σεπ 2012 11:38

Ειδικό Design για κινητές συσκευές ή εφαρμογή για κινητά;

Δημοσίευση από Gveronis » 20 Οκτ 2012 22:25

Όταν εξετάζετε το ενδεχόμενο να μετατρέψετε την ιστοσελίδα σας για την προβολή της σε κινητές συσκευές υπάρχουν 2 επιλογές: να γίνει Design για κινητές συσκευές που να ανταποκρίνεται (responsive) ή να αναπτυχθεί μια ειδική εφαρμογή για κινητά. Θα μου πείτε γιατί όχι και τα δύο; Υποθέτω ότι θα μπορούσατε, αλλά το κόστος συχνά δεν δικαιολογεί την επιλογή και των δύο λύσεων. Σε αυτό το άρθρο θα δούμε τί πρέπει να εξετάσουμε όταν έχουμε να επιλέξουμε ανάμεσα σε αυτές τις δύο λύσεις..

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

Responsive Κατασκευή Ιστοσελίδων


Είναι απλά η προσαρμογή του στρώματος της σχεδίασης της σελίδας σε ορισμένες αναλύσεις οθόνης διαμέσου HTML5 media-quires. Δηλαδή, κάνοντας την ιστοσελίδα σας responsive και έτσι διαθέσιμη για κινητές συσκευές είναι τόσο απλό όσο να δημιουργείσετε ένα άλλο αρχείο CSS (αρχείο για τα γραφικά).
responsive-design

responsive-design

Τα πλεονεκτήματα:

Προϋπολογισμός για την κατασκευή του Site ιδιαίτερα φιλικός.

Διαθέσιμο μέσω HTML5 ενεργοποιημένων web browsers.

Είναι πιο εύκολο να παραχθεί, δεν απαιτεί διαφορετικό σύνολο γνώσεων.

Τα μειονεκτήματα:

Δύσκολο να πάρει την ίδια συμπεριφορά ως μητρική εφαρμογή κινητού.

Oι browser σε κινητές συσκευές δεν είναι τόσο προσβάσιμες όπως είναι οι εφαρμογές της.

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



Εφαρμογή για Κινητά:

Είναι ουσιαστικά ένα λογισμικό που αναπτύχθηκε για μια φορητή συσκευή. Μοιάζει πολύ με desktop εφαρμογές. Οι κινητές εφαρμογές πρέπει να αναπτυχθούν για μια συγκεκριμένη πλατφόρμα: IOS, Android κ.α. Oι Mobile εφαρμογές δεν είναι διαθέσιμες μέσω του World Wide Web, αλλά μέσω ειδικών αγορών για εφαρμογές (google play,app store κτλ).
mobile application

mobile application

Τα πλεονεκτήματα:

Συμπεριφορά του site όπως στην αρχική του σχεδίαση (Native).

Πιο προσβάσιμη μορφή του site.

Τα μειονεκτήματα:

Υψηλό κόστος, πρέπει να αναπτυχθεί ένα διαφορετικό λογισμικό για κάθε πλατφόρμα.

Δεν είναι προσβάσιμο μέσω του World Wide Web.

Υψηλότερο κόστος συντήρησης.

Μετά την εξέταση των πλεονεκτημάτων και των μειονεκτημάτων οι απαντήσεις φαίνεται να είναι πολύ σαφής, επενδύστε σε μία κινητή εφαρμογή μόνο αν έχετε μια πραγματική ανάγκη και γιατί να μήν την κάνετε απευθείας responsive; Είναι αληθές, αλλά υπάρχουν μερικές παγίδες που θα θέλατε να αποφύγετε πριν πάτε σε αυτή την επιλογή. Εξακολουθώ να βλέπω τις επιχειρήσεις να μπερδεύονται με τέτοιου είδους ζητήματα καθημερινά. Παρακάτω είναι μερικές συμβουλές και οδηγίες που μπορώ να μοιραστώ από τη δική μου εμπειρία:

1. Κάντε το Responsive Αλλά …

Λαμβάνοντας υπόψη το χαμηλό κόστος, συστήνω να κάνετε οποιαδήποτε εφαρμογή responsive με ορισμένες εξαιρέσεις… Σκεφτείτε την αξία από τους χρήστες, χρησιμοποιώντας την εφαρμογή σας στην κινητή συσκευή τους, αν είναι αρκετά απλό κάντε το responsive, αλλά αν η εφαρμογή σας έχει κάποια πολυπλοκότητα σε αυτό, περιορίσετε τις δυνατότητες σε αυτές που έχουν πραγματική αξία σε μια φορητή συσκευή.

2. Εξετάστε τις λειτουργίες

Μπορεί να επιτευχθεί μια εύχρηστη εμπειρία με responsive σχεδιασμό και μόνο; Οι περισσότερες εφαρμογές περιέχουν φόρμες, καταλόγους και πίνακες, στοιχεία που δεν είναι δύσκολο να γίνουν με responsive σχεδιασμό. Τα δύσκολα μέρη είναι τα συρόμενα στρώματα (sliding layers) και η ανταπόκριση στο άγγιγμα, αλλά αυτά μπορούν επίσης να επιτευχθούν με τη χρήση JavaScript. Ο καλύτερος τρόπος για να το εξετάσετε είναι να διερωτηθείτε αν μία εφαρμογή για κινητό είναι ένα ουσιαστικό μέρος του προϊόντος σας γιατί να αναλωθείτε κάνοντας ένα responsive design; Αν η απάντηση σε αυτό είναι σαφής, τότε σκεφτείτε τι θέλετε ο χρήστης να κάνει με την εφαρμογή σας, αντί να πραγματοποιήσετε το όλο εγχείρημα. Νομίζω ότι μία εφαρμογή για κινητά προσφέρει καλύτερη λύση σε συγκεκριμένες λειτουργίες αλλά όχι της πλήρους εφαρμογής του site σας στο τελικό χρήστη.

3. Το κρυφό κόστος


Πριν κάνετε οτιδήποτε προσαρμοσμένο για κινητές συσκευές, ρωτήστε τον εαυτό σας αν είστε έτοιμοι για το επιπλέον κόστος που φέρνει. Είναι εύκολο να δούμε τον αρχικό προϋπολογισμό ανάπτυξης της εφαρμογής από μόνη της, αλλά τι γίνεται με τα συνεχιζόμενα πράγματα; Χωρίς να λαμβάνονται υπόψη οι επιπλέον δαπάνες για το μάρκετινγκ και τις προμήθειες από τα app καταστήματα, εδώ παρουσιάζετε μια σύντομη οικονομική επίπτωση για το μέλλον της εφαρμογή σας που καταδεικνύει αν συμφέρει να αναπτύξετε μια έκδοση για κινητά:

1.Πρόσθετες δαπάνες ανάπτυξης, νέα χαρακτηριστικά θα πρέπει να αναπτυχθούν για την κινητή έκδοση, καθώς, αυτό όχι μόνο αυξάνει τις μελλοντικές αναπτυξιακές δαπάνες σας, αλλά και το χρόνο διάθεσης στην αγορά.

2. Διαδικασία αποδέσμευσης. Μετά από την πρώτη έκδοση, κάθε επόμενη θα απαιτεί την εξέταση πριν από την κυκλοφορία, όσες περισσότερες εκδόσεις, τόσο περισσότερο χρόνο και χρήμα καταναλώνει η διαδικασία.

4. Πότε να κάνουμε και τα δύο;

mobile application-responsive design

mobile application-responsive design

Πότε είναι επιθυμητό να κάνουμε και τα δύο: responsive σχεδιασμό μαζί με μία κινητή εφαρμογή;Δύσκολο να απαντήσεις, γιατί αν έχετε ένα responsive σχεδιασμό , δεν χρειάζεται κατ "ανάγκη μία κινητή εφαρμογή να κάνει τη δουλειά. Θα έλεγα ότι η μόνη περίπτωση που δικαιολογεί το κόστος και για τα δύο είναι εάν η web εφαρμογή σας έχει ωριμάσει αρκετά για να περάσει από τα πρώτα στάδια της ανάπτυξης και κατάφερε να κερδίσει σημαντική απήχηση στους χρήστες που θα αποκτήσουν μια άμεση και αναμφισβήτητης αξίας εφαρμογή για το κινητό τους, επιπρόσθετα με την κανονική πρόσβαση στο site σας μέσω του browser του κινητού τους. Μια άλλη περίπτωση είναι ότι έχετε αρκετά χρήματα και το business model που απαιτεί η επιχείρησή σας βασίζετε στην προβολή κάθε συσκευής πολυμέσων.

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

γιάννης βερώνης
design για κινητές συσκευές

ALR
Honorary Member
Δημοσιεύσεις: 1712
Εγγραφή: 09 Απρ 2005 17:30

Ειδικό Design για κινητές συσκευές ή εφαρμογή για κινητά;

Δημοσίευση από ALR » 21 Οκτ 2012 00:39

Γιάννη Βερώνη υπάρχει και μια τρίτη επιλογή.

Να σχεδιάσεις μια mobile version του website σου.
Γίνονται πραγματάκια

Άβαταρ μέλους
cordis
Administrator, [F|H]ounder, [C|S]EO
Δημοσιεύσεις: 27616
Εγγραφή: 09 Οκτ 1999 03:00
Τοποθεσία: Greece
Επικοινωνία:

Ειδικό Design για κινητές συσκευές ή εφαρμογή για κινητά;

Δημοσίευση από cordis » 21 Οκτ 2012 00:43

αυτό δεν είναι το "Responsive Κατασκευή Ιστοσελίδων";
Δεν απαντάω σε προσωπικά μηνύματα με ερωτήσεις που καλύπτονται από τις ενότητες του forum. Για ο,τι άλλο είμαι εδώ για εσάς.
- follow me @twitter

ALR
Honorary Member
Δημοσιεύσεις: 1712
Εγγραφή: 09 Απρ 2005 17:30

Ειδικό Design για κινητές συσκευές ή εφαρμογή για κινητά;

Δημοσίευση από ALR » 21 Οκτ 2012 05:31

cordis έγραψε:αυτό δεν είναι το "Responsive Κατασκευή Ιστοσελίδων";
Όχι δεν ειναι αυτο. Όταν το design της ιστοσελίδας σου ειναι responsive τότε σημαίνει πως ανταποκρίνεται σε περισσότερες απο μια αναλύσεις και πιθανότατα συσκευές. Το ίδιο design δηλαδη προσαρμόζεται κατάλληλα. Κουμπιά μεγαλώνουν, κείμενα αυξομειωνονται σε font size, φωτογραφίες το ίδιο, το positioning των στοιχείων αλλάζει στο ίδιο design και για αυτο το λέμε responsive.

Υπαρχει η επιλογή να δώσεις στον χρήστη σου μια νέα, διαφορετική version της ιστοσελίδας σου, η οποία θα έχει σχεδιαστεί αποκλειστικά για κινητά και να κανείς αυτη τη version responsive σε iPhone Samsung και όλες τις μικρό διαφορετικές σναλύσεις σε αυτη την κατηγορία.

Σε αυτη την περίπτωση δεν Μιλάμε για το ίδιο design που απλα προσαρμόστηκε, αλλά για νέο design. Αυτο θα χρησίμευε σε πολύπλοκα portals ή web εφαρμογές που βλέπεις ότι πρέπει να αφαιρέσεις 1.000.000 options γιατι οι δυνστοτητες που έχεις σε μια κινητή συσκευή ή ο σκοπός σου απο μια κινητή συσκευή αλλαζει. Αφαιρώντας ή επαναπροσδιορίζοντσς την ιεραρχία των στοιχείων, αλλαζει και ο τρόπος που πρέπει να παρουσιαστούν κι εκει το responsive απλα θα ήταν μια λύση της στιγμής, απλα για να φαίνεται αξιοπρεπώς η σελιδα.

Νομιζω το basecamp έχει αναπτύξει το web app του με αυτο τον τροπο για mobile και ειναι καλο παράδειγμα.
Γίνονται πραγματάκια

Gveronis
Δημοσιεύσεις: 24
Εγγραφή: 07 Σεπ 2012 11:38

Ειδικό Design για κινητές συσκευές ή εφαρμογή για κινητά;

Δημοσίευση από Gveronis » 15 Φεβ 2013 16:31

@ALR Πολύ ωραιος ορισμός για το responsive, η συνεχεια του αρθρου με προσαφατες εξεελίξεις εδω: http://www.freestuff.gr/forums/viewtopi ... 65&start=0

Άβαταρ μέλους
viktoras
Δημοσιεύσεις: 963
Εγγραφή: 05 Απρ 2001 03:00
Τοποθεσία: Γαλάτσι, Αθήνα
Επικοινωνία:

Ειδικό Design για κινητές συσκευές ή εφαρμογή για κινητά;

Δημοσίευση από viktoras » 15 Φεβ 2013 23:35

Για ποιο λόγο να κάνεις ξεχωριστό νήμα; Δεν βοηθάς την συζήτηση να εξελιχθεί.

Διαφωνώ με ορισμένα πλεονεκτήματα/μειονεκτήματα και των 2 "επιλογών".

Στο responsive:

Oι browser σε κινητές συσκευές δεν είναι τόσο προσβάσιμες όπως είναι οι εφαρμογές της.

Μερικές κινητές πλατφόρμες εξακολουθούν να έρχονται με τα παλιά προγράμματα περιήγησης διαδικτύου που δεν υποστηρίζουν ανώτερες λειτουργίες όπως αυτή.
Δεν κατανοώ το 1ο... κάτι δεν έχει συνταχθεί σωστά.
Όσο για το 2ο, είναι αρκετά χαμηλό το ποσοστό των mobile browsers που έχουν μείνει "πίσω" σε updates ή σε εκδόσεις που δεν υποστηρίζουν τουλάχιστον βασικά χαρακτηριστικά ώστε ένα responsive design να μην μπορεί να αποδώσει.
mobile application

Τα πλεονεκτήματα:

Συμπεριφορά του site όπως στην αρχική του σχεδίαση (Native).

Πιο προσβάσιμη μορφή του site.
Για το 1ο, ελπίζω να μην καταλαβαίνω λάθος, αλλά το "native" της υπόθεσης ενός app δεν έχει να κάνει με την συμπεριφορά της ιστοσελίδας. Ποιος ο λόγος να κάνεις native app και αυτό να έχει την ίδια συμπεριφορά;

Πιο προσβάσιμη; με ποια έννοια;

Θεωρώ ότι η σύγκριση είναι λανθασμένη γενικότερα. Άλλο σκοπό εξυπηρετεί ένα native mobile app κι άλλο το responsive design.

Τέλος σχετικά με αυτά που αναφέρει ο φίλτατος ALR, υπάρχει κάτι που αλλάζει πλέον. Τα κινητά, αποκτούν αναλύσεις που πλησιάζουν στο desktop. Και οθόνες που πλησιάζουν σε μικρό tablet. Τα tablets, κάποια, είναι ήδη εκεί. Υπάρχει δηλαδή μία σύγκλιση.

Το responsive design δεν είναι όμως απλώς media queries ώστε να προσαρμόζεται το μέγεθος του περιεχομένου και των στοιχείων αλλά ακόμα περισσότερα, π.χ. η μέριμνα για λίστες/πλοήγηση/κουμπιά/οποιαδήποτε ενέργεια για συσκευές που είναι touch enabled ωστε ο χρήστης να μπορεί να έχει μία σωστή εμπειρία, η εκμετάλλευση προτερημάτων που έχει μία mobile συσκευή - π.χ. geolocation, καθώς και η συμπεριφορά διαφόρων features/sections της σελίδας σε τέτοιες συσκευές ( π.χ. αν υπάρχει ένας χάρτης - google maps - με scrolling ο οποίος π.χ. στο landscape orientation πιάσει σχεδόν το 100% οθόνης τότε εγκλώβισες τον χρήστη )
<?="Hello Freestuff";?>
Quality hosting by Cityhost

ALR
Honorary Member
Δημοσιεύσεις: 1712
Εγγραφή: 09 Απρ 2005 17:30

Ειδικό Design για κινητές συσκευές ή εφαρμογή για κινητά;

Δημοσίευση από ALR » 15 Φεβ 2013 23:45

Ότι λέω ισχύει. Μην ακούτε τον @viktoras, είναι ψεύτης.
Γίνονται πραγματάκια

Apostolis_38
Δημοσιεύσεις: 1969
Εγγραφή: 14 Φεβ 2008 16:20
Τοποθεσία: ΠΕΙΡΑΙΑΣ

Ειδικό Design για κινητές συσκευές ή εφαρμογή για κινητά;

Δημοσίευση από Apostolis_38 » 16 Φεβ 2013 20:43

Δεν νομίζω οτι υπάρχει κάποια σχέση ανάμεσα στο responsive design ("μεταφορά" μιας ιστοσελίδας σε ιστοσελίδα που να εμφανίζεται σε κινητά σύμφωνα με τις ιδιαιτερότητες που αυτά έχουν) και σε μια mobile application.

Οι ιστοσελίδες και οι εφαρμογές εξυπηρετούν εξ ορισμού διαφορετικές ανάγκες άσχετα αν ηθελημένα μπορεί καμμιά φορά να έχουν UI που ομοιάζει.

Πιστεύω οτι δεν τίθεται θέμα για το τι πρέπει να κάνεις όταν θες να απεικονίζεις το freestuff (ιστοσελίδα) στο iphone και όταν θέλεις να έχεις τις εφαρμογές του office για την ίδια συσκευή.

Απάντηση

Επιστροφή στο “Web Usability & Accessibility”

Μέλη σε σύνδεση

Μέλη σε αυτήν τη Δ. Συζήτηση: Δεν υπάρχουν εγγεγραμμένα μέλη και 0 επισκέπτες