26Οκτ

Wireframes στο Web Design

, 26 Οκτωβρίου 2009 | UID | 2 Σχόλια

Ίσως έχετε ακούσει για τα Wireframes στο Web Design, ίσως και όχι. Το σίγουρο είναι πάντως πως όσο εξελίσσονται οι απαιτήσεις στο επάγγελμα του σχεδιαστή ιστοσελίδων, τόσο πολύ αυξάνονται και οι ανάγκες για τη χρήση των Wireframes. Στη συνέχεια του σημερινού άρθρου θα δούμε ακριβώς τι είναι αυτά τα Wireframes, τι μπορούν να προσφέρουν στην παραγωγική διαδικασία και πώς μπορείτε να φτιάχνετε εύκολα τα δικά σας.

Τι είναι τα Wireframes στο Web Design;

Wireframe στο Web Design είναι ο πρόχειρος σχεδιασμός μια ιστοσελίδας ο οποίος γίνεται πριν τον κανονικό της σχεδιασμό. Συνήθως γίνεται με πολύ απλά εργαλεία γιατί στόχος είναι η προβολή της λειτουργικότητας της σελίδας και όχι του εικαστικού της. Λόγω της απλότητάς τους και της έλλειψης εικαστικού, είναι συνήθως ασπρόμαυρα και έχουν μοναδικό στόχο να απεικονίσουν την τοποθέτηση των στοιχείων μιας σελίδας και τη λειτουργικότητα της. Στοιχεία όπως scrollers, κουμπιά, θέσεις εικόνων, θέσεις τίτλων, κ.α.

wireframe

Τι κερδίζετε από την χρήση των Wireframes;

Βλέποντας πώς θα λειτουργήσει ένας διαδικτυακός τόπος, πριν αυτός σχεδιαστεί, σας βοηθάει πάρα πολύ στην κατανόηση του UID (User Interface Design) και δίνει την ευκαιρία στη δημιουργική ομάδα να προβλέψει τυχόν προβλήματα που ίσως προκύψουν στο μέλλον. Εκτός από την ίδια τη δημιουργική ομάδα, οι πελάτες σας μπορούν να φανταστούν τον διαδικτυακό τους τόπο σε ένα αρχικό στάδιο. Αυτό τους βοηθάει στο να καταλάβουν τι ακριβώς θα παραλάβουν και τους δίνει την ευκαιρία να κάνουν τις επεμβάσεις που θέλουν σε ένα σημείο που δεν επηρρεάζει την παραγωγική διαδικασία. Τα εμπόδια αντιμετωπίζονται σε αρχικό στάδιο και ο πελάτης νιώθει ότι έχει μεγαλύτερη συμμετοχή στην όλη διαδικασία.

Πως μπορείτε να φτιάξετε δικά σας Wireframes;

Ο πιο συνηθισμένος τρόπος κατασκευής Wireframes είναι με το χαρτί και το μολύβι. Πάρτε μια λευκή κόλλα χαρτί και το μολύβι σας και αρχίστε να σχεδιάζετε τις ιδέες σας. Η επαφή αυτή με το project σάς δίνει τη δυνατότητα να διευρύνετε τους ορίζοντές σας. Το χαρτί και το μολύβι σας δίνουν την δυνατότητα να δείτε σε εικόνα αυτό που φαντάζεστε πολύ γρήγορα! Αφού ολοκληρώσετε τις ιδέες σας, μπορείτε να τις σκανάρετε και να τις αποστείλετε στον πελάτη σας σαν εικόνες, ώστε να αρχίσει να αποκτάει και εκείνος μια καλύτερη ιδέα του τι σκοπεύετε να του ετοιμάσετε και να του δώσετε την ευκαιρία να επέμβει σε αυτό το αρχικό στάδιο.

Επίλογος

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

ΧΡΗΣΙΜΗ ΠΛΗΡΟΦΟΡΙΑ: Το άρθρο Wireframes στο Web Design γράφτηκε από το WebDesignBlog. Η ομάδα μας σας υπενθυμίζει πως αν θέλετε να ενημερώνεστε για τα νέα του διαδικτύου και για επιλεγμένα άρθρα μας, μπορείτε να γραφτείτε εύκολα στο Newsletter μας ή στο RSS Feed μας.

Ο Σπύρος Παπασπυρόπουλος είναι βραβευμένος Web Professional που δραστηριοποιείται στον χώρο του επαγγελματκού Web Design και του Search Engine Optimisation (SEO) από το 1999. Το 2004 ίδρυσε μαζί με τον Γιάννη Ευσταθίου την βραβευμένη εταιρία x2interactive Web Agency και το 2008 το Web Design Blog.

2 comments so far

Σχολιάστε

Back to top

Recent comments

  • Πολυ καλο αθρο πραγματικα!

    Η σωστή αρχιτεκτονική ενός website και τα οφέλη της
  • Πολύ χρήσιμη η λίστα με τα online tools. Ο επιτυχημένος σχεδιασμός μιας ιστοσελίδας βοηθά σε δύο κατευθύνσεις. Η πρώτη είναι ότι βελτιώνει την εμπειρία του επισκέπτη της ιστοσελίδας με συνέπεια ο τελευταίος να βλέπει περισσότερες σελίδες και να μένει περισσότερο χρόνο σε αυτή. Η δεύτερη είναι ότι επειδή ακριβώς βελτιώνονται τα στατιστικά στοιχεία της ιστοσελίδας, όπως το bounce rate, ο μέσος χρόνος παραμονής στην ιστοσελίδα και ο αριθμός των σελίδων ανά επίσκεψη, βελτιώνεται και η κατάταξη της ιστοσελίδας στα οργανικά αποτελέσματα της Google.

    10+1 Χρήσιμα website και on line tools

Latest From Twitter