Η ξεχασμένη τέχνη του gui

[Lanike71]

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

Πόσοι όμως δε βρεθήκαμε αντιμέτωποι με κακοσχεδιασμένα gui, είτε πρόκειται για app σε android, είτε για ιστοσελίδα του taxis, είτε για οθόνη σε κάποιο ATM, με αποτέλεσμα να ρίχνουμε μπινελίκια;

Υπάρχει τελικά κάποιος μπούσουλας για ένα καλοσχεδιασμένο gui ;

Έχω δει κάποιες σελίδες στο γρήγορο, αλλά δε με κάλυψαν. Αν κάποιος έχει κανένα λινκ youtube ή κάποιο tutorial που να τον βοήθησε, ας ποστάρει.

[Tsalikis177]

Για πάμε για πάμε...

 

Πχ: Είσαι απλός χρήστης που δεν ξέρει τίποτα από πληροφορική. Θέλεις απλά να διευκολύνεις την ζωή σου. Σε νοιάζει αν το GUI του ATM έχει φρου φρου και αρώματα? όχι!

 

Θες να αγοράσεις ένα προιον... σε νοιάζει αν η σελίδα έχει την τελευταία λέξη της μόδας όσον αφορά το UI? σε ενδιαφέρει κατά την διαδικασία αγοράς να έχει και άλλα 500 κουμπιά αριστερά δεξιά; όχι! το μόνο που θες είναι να δώσεις τα βασικά σου στοιχεία. ΤΕΛΟΣ! ούτε σε ενδιαφέρει να δεις σχετικά προιοντα ούτε τπτ.

 

Ναι! το έχω δει και αυτό! κατά τη διαδικασία ολοκλήρωσης μιας αγοράς να προτείνει 1002 πράγματα. Αυτά πρέπει μόνο όταν βλέπεις ένα προιον!

 

Απλότητα παν απ όλα. Έχω δει τα πιο εντυπωσιακά UI που μέσα χάνεσαι... να το κάνω τι;;;;

[liakos356]

https://material.io/guidelines/#

Καλό διαβασμα

[Lanike71]

Για πάμε για πάμε...

 

Πχ: Είσαι απλός χρήστης που δεν ξέρει τίποτα από πληροφορική. Θέλεις απλά να διευκολύνεις την ζωή σου. Σε νοιάζει αν το GUI του ATM έχει φρου φρου και αρώματα? όχι!

 

Θες να αγοράσεις ένα προιον... σε νοιάζει αν η σελίδα έχει την τελευταία λέξη της μόδας όσον αφορά το UI? σε ενδιαφέρει κατά την διαδικασία αγοράς να έχει και άλλα 500 κουμπιά αριστερά δεξιά; όχι! το μόνο που θες είναι να δώσεις τα βασικά σου στοιχεία. ΤΕΛΟΣ! ούτε σε ενδιαφέρει να δεις σχετικά προιοντα ούτε τπτ.

 

Ναι! το έχω δει και αυτό! κατά τη διαδικασία ολοκλήρωσης μιας αγοράς να προτείνει 1002 πράγματα. Αυτά πρέπει μόνο όταν βλέπεις ένα προιον!

 

Απλότητα παν απ όλα. Έχω δει τα πιο εντυπωσιακά UI που μέσα χάνεσαι... να το κάνω τι;;;;

 

Σαφώς και έχεις δίκιο. Απλότητα είναι το παν, αλλά πόσο απλό;

 

Επίσης, δεν είναι τυχαίο που κάποια components μπαίνουν  σε κάποιες θέσεις. Textboxes,buttons κλπ δε μπαίνουν όπου να 'ναι. Δεν είναι τυχαίο που (συνήθως) τα buttons μπαίνουν στο κάτω μέρος της οθόνης  κλπ

Το θέμα είναι υπάρχουν κανόνες; Ή είναι διαισθητικό το όλο θέμα;

[Tsalikis177]

Σαφώς και έχεις δίκιο. Απλότητα είναι το παν, αλλά πόσο απλό;

 

Επίσης, δεν είναι τυχαίο που κάποια components μπαίνουν  σε κάποιες θέσεις. Textboxes,buttons κλπ δε μπαίνουν όπου να 'ναι. Δεν είναι τυχαίο που (συνήθως) τα buttons μπαίνουν στο κάτω μέρος της οθόνης  κλπ

Το θέμα είναι υπάρχουν κανόνες; Ή είναι διαισθητικό το όλο θέμα;

 

νταξ δνε σου είπα Buttons stlye windows 98

 

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

 

μπορεί δλδ να είναι απλό στο UI αλλά να σε πρήζει με 1002 π΄ραγματα και να πατώσει.

 

Αυτό που λες ισχύει. Θα το βρεις σε βιβλία marketing. Δλδ πως μια φόρμα επικοινωνίας/παραγγελίας φαίνεται καλύτερα στο μάτι του υποψήφιου πελάτη.

 

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

 

Για "κανόνες" ψάξε σε βιβλία/φορουμ μαρκετινγκ κλπ.

ΥΓ: Δεν είμαι ειδικός απλά σου λέω τι έχω ζήσει και τι έχω εισπράξει από συνεργασίες.

[V.I.Smirnov]

Η σωστή σχεδίαση GUI είναι πλέον μια μικρή επιστήμη εδώ και τουλάχιστον 20 χρόνια.

Μερικές ενδεικτικές επιλογές είναι :

 

- "The essential guide to User Interface Design" 3rd ed  Galitz

- "Human-computer interaction"  Dix

- "GUI Bloopers 2.0"  Johnson

- "Designing the User Interface, Strategies for Effective Human-Computer Interaction" 4th ed.  Shneiderman

 

Κάποια εκ των παραπάνω διδάσκονται σε μεταπτυχιακά προγραμματισμού και πολυμέσων,

(π.χ. το δεύτερο το είχαν ως κύριο διδακτικό σύγγραμα φίλοι μου σε μετ/κό στο ΑΠΘ)...

 

-

[Dinos_12345]

Το GUI είναι ένας τομέας από μόνο του.

Αυτό που μου έλεγε φίλος στο Skroutz. Ο full stack είναι μία Junior θέση. Δεν γίνεται να είσαι καλός στο back end και το ίδιο καλός στο front end. Μιλάω με web στο μυαλό, όμως ισχύει παντού. Πρέπει κάπου να εμβαθύνεις για να γίνεις ανταγωνιστικός. Παίρνω σαν παράδειγμα τον nova launcher στο Android. Είχε δικό του designer (έφυγε πήγε στη Google). Δηλαδή το ίδιο θα ήταν να το έκανε αυτός που κάνει το back end;

[Dark_Sage]

νομιζω αυτο που ζητας ειναι η τέχνη του UX!

[Aztec]

Παράδειγμα κακού UI σε φόρμα από Ινδό developer.

 

Request να αλλάξει ένα πεδίο στην φορμα . Κατέληξε να αλλάξει την σειρα των πεδίων from date - to date στο ανάποδο . Όταν του λες μετά ότι οι χρήστες έχουν συνηθίσει να δίνουν από - έως μέχρι τώρα και θα μπερδευτουνε σου λέει εντάξει τι έγινε και ποιος θα κάνει λάθος ?

 

Το βασικό είναι το UI να είναι consistent σε όλο το εύρος της εφαρμογής

[Alithinos]

Υπάρχουν κάποιες βέλτιστες πρακτικές. Για παράδειγμα κάτι σημαντικό που είχα διαβάσει σε ένα βιβλίο ήταν πως η πλειοψηφία των ανθρώπων μπερδεύεται και νιώθει άβολα αν του παρουσιασεις πάνω από 7 επιλογές ταυτόχρονα. Ετσι λοιπόν το ιδανικό είναι (Εκτός ίσως απο μια shorted list που ενδιαφέρει ρο χρήστη να βρει αυτό που ψάχνει, και ξέρει τι ψάχνει) να σκεφτείς πχ τις επιλογές για nav να να τις κρύψεις σε drop list, ώστε να υπάρχουν ας πούμε έως 7 drop lists, που μέσα τους το καθένα έχει ως 7 επιλογές...

Περαιτέρω, για τα sites υπάρχουν ιδιαίτεροι άγραφοι κανόνες.

Πχ το λογότυπο το βάζεις πανω αριστερά, στο nav βάζεις πρώτο απο αριστερά το λινκ για κεντρική, και τελευταίο το "επικοινωνήστε μαζί μας". ,Την επιλογή για είσοδο χρήστη τη βάζεις τέρμα πανω δεξιά..

 

Ξέρω οτι με αυτό που θα πω κάποιοι θα με κοιτάξουν με μισό μάτι, αλλά τα χειρότερα gui σε προγράμματα τα έχω δει σε open source. Πάρε για παράδειγμα το blender. Πολύ δυνατό εργαλείο που δεν έχει τίποτα να ζηλέψει από άποψη λειτουργικότητας από τα proprietary προϊόντα ιδίου τύπου όπως το Maya των 4000 ευρώ. Ωστόσο ενω πολλοί θέλουν να το μάθουν γιατί τους αρέσει το 3d modelling, τα παρατάνε λόγο gui. Με το που ανοίγεις το blender, σου πετάει στη default 43 πλήκτρα, εικονίδια που κλικαρονται κτλπ. Ενώ το ενδεδειγμένο όριο είναι 7...

[Dark_Sage]

οτι λετε μεχρι στιγμης εχει να κανει με UX οχι με UI.

 

To ξανα λεω, ο OP μαλλον δεν γνωριζει τον ορο ux και μπερδεψε το νοημα της ερωτησης του