The best animated site I’ve seen in years.

Soleil Noir 2012 | We believe in…

Η αρχική σκέψη ήταν να το μοιραστώ μέσω twitter αλλά αυτό το site αξίζει το δικό του post. Μπορεί και 2. Είναι ο τύπος animation που θα ήθελα να είχα φτιάξει εγώ. Βλέποντας τον κώδικα από πίσω θα έκανα κάποιες αλλαγές, και θα ήταν ενδιαφέρον αν το animation γινόταν σε css ή javascript, αλλά έτσι όπως είναι ήδη εντυπωσιάζει. Η επιλογή χρήσης animated gif έδωσε περιθώρια για πιο εκλεπτυσμένη κίνηση και η εκτίμησή μου είναι ότι στο τέλος η δουλειά έγινε γρηγορότερα από μια προγραμματιστική προσέγγιση. Enjoy!

5 thoughts on “The best animated site I’ve seen in years.

    • Ευχαριστώ για το σχόλιο Γιώργο. Αν δεν κάνω λάθος δίνεις το site για σύγκριση και ως παράδειγμα προγραμματιστικής προσέγγισης. Το θέμα είναι ότι έχω δει παρόμοια sites όπως και αυτό New Zealand 100% Pure, αλλά αυτό που σχολιάζω στο άρθρο έχει άνα άλλο επίπεδο animation, πολύ δυσκολότερο στην εφαρμογή σε website.

  • Δε νομιζω. Το Nike site ηταν το πρωτο που εμφανιστηκε με αυτο το slide effect. Το concept ειναι ιδιο, ή εκτελεση παρομοια.

    Στο Νικε εχουν χρησιμοποιησει HTML markup ενω στο Soleil απλα μια Unordered list gia to content.

    To slide γινεται και στα 2 με JS.

    Αυτο που αλλαζει ειναι τα εσωτερικα animations στο Soleil που ειναι GIFs.

    Η κινηση που αναφερεις ως πιο εκλεπτυσμενη δεν υπαρχει. Τα animated GIFs δεν εχουν κανενα interaction και σε καποιες στιγμες μπορεις να δεις και 2 μαζι απο διαφορετικο section.

    Βασικα εκει που στο Nike εχουν image σε καθε section, εδω εχουν animated GIFs.

    GA

  • Το ξέρω οτι πρόκειται για το ίδιο slide concept και καταλαβαίνω ότι η διαφορά βρίσκεται στα gifs. Αυτό που θέλω να τονίσω είναι πως το animation που φαίνεται στις συγκεκριμένες εικόνες δεν είναι το ίδιο εύκολο να γίνει προγραμματιστικά όσο το να δώσεις ένα interaction μέσω javascript σε σχέση με το scroll στην οθόνη. Προσωπικά δε μου αρέσει το gif για παρουσίαση animation αλλά σε αυτή την περίπτωση το αποτέλεσμα είναι εντυπωσιακό.

Leave a Reply

Your email address will not be published. Required fields are marked *