Αποτυπώστε τις Responsive ιδέες σας στο χαρτί με το ‘Responsive Sketchsheets’

• 19 Οκτωβρίου 2012
• by: Georgios
• in: Web Design

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

Αυτό που κάνει το σχεδιασμό Responsive σελίδων πιο δύσκολο από την οικοδόμηση μιας σταθερής (fixed) φιλικής ιστοσελίδας είναι η έλλειψη καλών εργαλείων mockup.

Ξεκινώντας το mockups σας σε εφαρμογές όπως το Photoshop σημαίνει ότι ξεκινάτε με ένα σταθερό (fixed) μέγεθος το οποίο όμως ουσιαστικά δεν πρόκειτε για responsive design.
Το Photoshop ή το GIMP μπορεί ακόμα να είναι χρήσιμα εργαλεία, αλλά περισσότερο στην αρχή της διαδικασίας σχεδιασμού. Μετά αφού σχεδιάσουμε – σκιαγραφώντας σε φορητούς υπολογιστές ή ακόμα και σε χαρτί τις βασικές διατάξεις για όλα τα μέσα, στη συνέχεια δημιουργούμε τον κώδικα HTML και CSS για το mockup.

Το πρόβλημα με το στυλό και το χαρτί είναι ότι είναι δύσκολο να σχεδιάσουμε τα μεγέθη του viewport κάθε μέσου το οποίο θα δείχνει πώς θα γίνει το reflow.

Γι ‘αυτό τον λόγο μας αρέσει το νέο εργαλείο sketchsheets του Zurb.
Το sketchsheets είναι ακριβώς αυτό – πρότυπα για τη σκιαγράφηση layout. Προτείνουμε τη προσέγγιση μέσω κινητού πρώτα, όπως συνιστά και ο Zurb ξεκινώντας με τα full-size φύλλα. Επίσης, πολύ βολικό είναι τα sheets για την οπτικοποίηση off-canvas περιεχόμενου σε μικρές οθόνες.

Αν θέλετε να το δοκιμάσετε πηγαίνετε στο Zurb’s playground και κατεβάσετε τις νέες responsive sketchsheets (περιλαμβάνουν επίσης ορισμένα παλαιότερα sketchsheets) και να αρχίστε να σκιαγραφείτε τις ιδέες σας.