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

Τους τελευταίους μήνες, ήμουν αρκετά τυχερός που μου δόθηκε η ευκαιρία να εκπληρώσω αυτό το όνειρο.

Ήταν έτοιμος να γράψω αυτή τη θέση στο blog μου, αλλά ο Walter με προσκάλεσε πολύ να μοιραστώ αυτή την περιπτωσιολογική μελέτη με το πολύ μεγαλύτερο κοινό εδώ στο Webdesigner Depot και σε ολόκληρο το δίκτυο Smashing.

Δεν είμαι Elliot Jay Stocks και σίγουρα δεν ισχυρίζομαι ότι είναι, οπότε όταν η Virgin Atlantic έρχεται σε επαφή μαζί μου το Νοέμβριο, έκπληκτος, ταπεινός και εξαιρετικά ενθουσιώδης με την προοπτική να συνεργαστώ με την εταιρεία σε ένα νέο blog για τον ιστότοπο "vtravelled".

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

Η αρχη

Τον Νοέμβριο του 2009 ο συντάκτης vtravelled, Maxine Sheppard, έρχεται σε επαφή για να με ρωτήσει εάν θα είμαι διαθέσιμος για να σχεδιάσω και να αναπτύξω ένα πλήρες blog για τον ιστότοπο που έχει χρεωθεί (Η νέα κοινότητα ταξιδιών της Virgin και η εφαρμογή ιστού). Συναντήθηκαν συναντήσεις και μετά από μια εβδομάδα ήθελαν το πράσινο φως για το έργο.

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

Η Virgin Atlantic έχει καταφέρει να βάλει μαζί μια πραγματικά μεγάλη ομάδα σε νίκη. ως αποτέλεσμα, δεν ήταν μόνο η εταιρεία με πολύ εύκολο να εργαστεί, αλλά ήταν επίσης πολύ διασκεδαστικό.

Virgin Atlantic HQ

Το κτίριο είναι τόσο μεγάλο όσο είναι μακρύ, έχει ακόμη και το δικό του φανάρι.

Περίεργο, νομίζω ότι το πιο τρομακτικό (ίσως εμπνευσμένο) μέρος ολόκληρης της διαδικασίας πήγε στην έδρα της Virgin Atlantic για συναντήσεις.

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

Κατά την πρώτη συνάντηση, ρώτησα τον επικεφαλής της Lysette Gauna (ως αστείο) αν όλα τα βραβεία σχεδίασης που περιείχαν το γραφείο που είχε αναβαθμιστεί ήταν δικά της. Η απάντηση ήταν: "Ναι, αλλά κρατώ τους περισσότερους από αυτούς στο σπίτι." D'oh! Ώρα να φοβάσαι πραγματικά.

Το Σύντομο

VTravelled Offices

Τα ενοικιαζόμενα γραφεία είναι φωτεινά και δημιουργικά και ολόκληρος ο πίσω τοίχος είναι κιμωλίνα!

Η σύντομη παρουσίαση ήταν αρκετά απλή: η vtravelled είναι μια μεγάλη διαδικτυακή εφαρμογή και η κοινότητα για τους λάτρεις των ταξιδιών αλλά εξακολουθεί να αναπτύσσεται ενεργά. Η ομάδα χρειάστηκε έναν τρόπο να αποκαλύψει το συντακτικό περιεχόμενο και να συνεργαστεί με τους χρήστες στα κοινωνικά δίκτυα. Ένα προφανές αποτέλεσμα ήταν ένα blog.

Ήθελα να βεβαιωθώ ότι πραγματικά καρφώθηκα στην κατεύθυνση που έψαχνα για να πάω στην πλευρά του σχεδιασμού, οπότε ήρθα με μια ελαφρώς διαφορετική εφαρμογή της χρήσης πλασμάτων διάθεσης? Τους τηλεφώνησα Κάρτες Moo'd . Η ιδέα ήταν απλή αλλά αποτελεσματική: πήρα 100 δείγματα εξαιρετικής δουλειάς σχεδίασης τα οποία είχα συλλέξει και τα τυπωμένα σε 100 μίνι κάρτες από το Moo.com.

Mood Cards

Κάποιες από τις κάρτες Moo'd που χρησιμοποιήθηκαν.

Κοιτάξαμε όλα αυτά κατά τη διάρκεια της συνάντησης kick-off και οκτώ κάρτες επιλέχθηκαν για να αντιπροσωπεύουν το είδος του στυλ που η ομάδα έψαχνε να προσφύγει στη βάση χρηστών του vtravelled.

Εάν δεν έχετε δοκιμάσει αυτή την τεχνική, το συνιστώ ανεπιφύλακτα. Είναι ένας πολύ καλός τρόπος για να ανακαλύψετε τις προσδοκίες του πελάτη για το σχεδιασμό. Από τότε κυκλοφόρησε όλα τα αρχεία προέλευσης για τις κάρτες Moo'd ως έργο OpenSource, συμπεριλαμβανομένων των εκδόσεων ιστού και iPhone.

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

Η διαδικασία σχεδιασμού

Η διαδικασία σχεδιασμού όταν εργάζεστε με μια μεγάλη επιχείρηση είναι αρκετά παρόμοια με οποιαδήποτε άλλη: αρχίζοντας με wireframes, στη συνέχεια αναπτύσσοντας mockups.

Η κύρια διαφορά έρχεται στο στάδιο της ανατροφοδότησης: δύο ή τρία άτομα έπρεπε να επανεξετάσουν και να υπογράψουν σε κάθε στάδιο, οπότε πήραν υπόψη πολύ μεγαλύτερα θέματα. Για παράδειγμα, η Virgin είναι ιδιαίτερα ευαίσθητη στο πώς απεικονίζεται το εμπορικό της σήμα. Οτιδήποτε κάνει η εταιρεία πρέπει να ταιριάζει με τα ηθικά, τα πρότυπα και τις ιδιότητές της.

Μετά τη δημιουργία της δομής της ιστοσελίδας, ήρθε η ώρα να προχωρήσουμε στην πραγματική δημιουργία του σχεδίου.

Πρόκειται για μια διαδικασία 30 ωρών (για την αρχική σελίδα) η οποία κινήθηκε μέσω διαφόρων ενδιαφερόντων φάσεων που οδήγησαν στο τελικό αποτέλεσμα. Ευτυχώς, εν αναμονή της εγγραφής αυτής της θέσης, κατέγραψα μια εκπομπή σχεδόν κάθε λεπτού του χρόνου σχεδιασμού και την συμπίψω σε ένα βίντεο τριών λεπτών.

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

Αυτό το βίντεο δημιουργήθηκε με ScreenFlick ($ 25) για Mac OS X, ηχογραφημένο σε 1 καρέ ανά δευτερόλεπτο και επεξεργασμένο στο iMovie.

Η διαδικασία ανάπτυξης

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

Η Virgin Atlantic χρησιμοποιεί το IE6 στα εταιρικά της γραφεία, οπότε αυτό ήταν ένα μεγάλο μέλημα στην ανάπτυξη του front end. Ο ιστότοπος έπρεπε να υποβαθμιστεί αρκετά χαριτωμένα ώστε να φιλοξενήσει αυτό το πρόγραμμα περιήγησης έτσι ώστε να είναι τουλάχιστον λειτουργικό. Για άλλη μια φορά, εξαιτίας της μεγάλης ομάδας που κέρδισε, μου επιτρέπεται επίσης να χρησιμοποιώ προοδευτικές βελτιώσεις με το CSS3 για νεότερα προγράμματα περιήγησης.

Το επόμενο βήμα ήταν η ενεργοποίηση του κώδικα του front-end σε ένα προσαρμοσμένο θέμα WordPress. Υπήρξαν μερικές ειδικές σκέψεις εδώ για να γίνει ο δικτυακός τόπος όσο το δυνατόν ισχυρότερος.

Ξεκίνησα με το WooThemes "WooFramework" για να επιτρέψω ένα υψηλό επίπεδο προσαρμογής back-end αλλά, τελικά, τροποποιήθηκε και προσαρμόστηκε τόσο πολύ ώστε το vtravelled blog τελικά κατέληξε με δικό του προσαρμοσμένο σύστημα. Ήταν σημαντικό να λάβουμε υπόψη ότι πολλοί άνθρωποι θα διοικούσαν το blog, οπότε έπρεπε να είναι όσο το δυνατόν πιο ευέλικτο σε όλους τους τομείς.

Τέλος, το θέμα απαιτούσε ισχυρή περιστροφή και ελαφρά μηνύματα σφάλματος στο 404 και Ψάξιμο σελίδες που αντικατοπτρίζουν τη φιλική φύση της μάρκας.

Μικρή αλήθεια Tweet

TrickleTweet Sketch

Το πρώτο σκίτσο του plugin Trickle Tweet.

Είμαι αρκετά βολικό όταν πρόκειται για τη συγγραφή PHP για WordPress, αλλά όταν χρειάζομαι κάτι εντελώς προσαρμοσμένο, υπάρχει μόνο ένας τύπος που απευθύνομαι: ο συνεργάτης μου στο έγκλημα, Japh Thomson .

Κατά τη διάρκεια της φάσης σχεδιασμού, είχα σκιαγραφήσει μια ιδέα κατά τη διάρκεια μιας συνάντησης η οποία πέρασε πολύ καλά με την ομάδα που κέρδισε. Η ιδέα ήταν να χρησιμοποιήσουμε την επωνυμία Helvetica-Man που υπήρχε σε ολόκληρο τον ιστοχώρο και τα προφίλ των κοινωνικών μέσων για μια ροή ζωντανής συνομιλίας σχετικά με τα ταξίδια.

TrickleTweet Final

Η τελική έκδοση του plugin TrickleTweet.

Ο Ιαφ είχε ήδη αναπτύξει ένα κομμάτι κώδικα με το API Twitter, που ονομάζεται Trickle Tweet που σας επιτρέπει να αναζητήσετε οποιονδήποτε όρο στο Twitter και να δείτε μια ζωντανή (μέχρι και τη δεύτερη) ροή των τελευταίων αναφορών για αυτό.

Μου επιτρεπόταν να αναθέσω σε υπεργολάβους τον Ιαφ και ανατέθηκε να τροποποιήσει το σενάριό του για να γίνει ένα εντελώς προσαρμοσμένο plugin για το WordPress. Αυτό αποδείχτηκε πραγματικά το κομμάτι-αντίστασης της ιστοσελίδας.

Έναρξη και Συμπέρασμα

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

Έπρεπε να ασχοληθώ με τη διαφημιστική εταιρεία για να διασφαλίσω ότι εγκαταστάθηκαν οι σωστοί κώδικες διαφήμισης και έπρεπε να περάσω μια τρελή 24ωρη περίοδο beta-δοκιμών, καθορισμού σφαλμάτων και αναθεώρησης της απόδοσης.

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

Όπως με οποιονδήποτε ιστότοπο, υπάρχουν βελτιώσεις που μπορούν να γίνουν και τα χαρακτηριστικά θα αναπτυχθούν με την πάροδο του χρόνου, αλλά είμαι πολύ ευχαριστημένος με το πώς v1.0 του blog έχει αποδειχθεί.

Η συνεργασία με την Virgin Atlantic υπήρξε ένα από τα απόλυτα χαρακτηριστικά της καριέρας μου μέχρι στιγμής και είμαι πολύ ευτυχής που συνεργάζομαι με την εταιρεία ξανά επί του παρόντος σε μερικά άλλα έργα σχεδιασμού.

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

Πιστώσεις

  • Δημοσίευση εικόνας από sebas
  • Virgin Atlantic HQ φωτογραφία από MilborneOne
  • φωτογραφίες από γραφεία Maxine Sheppard
  • Νέα Υόρκη φωτογραφία ευγενική προσφορά του vtravelled
  • Όλες οι άλλες φωτογραφίες και στιγμιότυπα οθόνης από John O'Nolan

Παρακαλώ μοιραστείτε τα σχόλιά σας σχετικά με το σχεδιασμό και τη διαδικασία παρακάτω ...