3 comments

  • Simon EvansSimon Evans, over 8 years ago

    Animations are really grim for me, 2012 MBA on Chrome

    0 points
  • Tierney CyrenTierney Cyren, over 8 years ago

    Really, really fucking nice. It's amazing. You did an excellent job. I can hardly believe the smiley face at the top--it blew my mind when I saw it. I'm making a personal site right now, similar (but nowhere near as nice) to your site. I've got a few questions about what you used to build/how you built your site, if you don't mind.

    • What did you use to get the header to change from section to section? What about the layout of the header, and the different effects?

    • How would you suggest creating a similar odd/even flipping of the portfolio items?

    • Could you describe what processes and tools you used to create the top section? I'd like to know about color choice, font choice, effects, and anything else you think would be relevant.

    A couple comments on buggy issues:

    • On FF 28 (latest) the header pops in several times when the page is first loaded. It seemed strange.

    • The second and fourth social links at the bottom are just gray boxes on FF 28.

    I totally understand if you don't want to answer my questions. I really like your site, and can only aspire to create one as nice some day.

    0 points
    • , over 8 years ago (edited over 8 years ago )

      I used jQuery waypoints to trigger everything that happens based on scroll, which includes change of sections. I would set waypoints for certain sections and toggle CSS classes on the nav that would change its style.

      The red/blue colors I set for myself like 3 years ago were kinda based on my lifelong love affair with Spider-Man. They're not a unique combination but they've always been my favorite, to this day my entire summer wardrobe consists of bright red/blue. ANYWAYS, font was meant to resemble my favorite font (PF DIN) but be a bit less infrastructure-ey?

      As for the top section animation sequence, I used arctext.js to create the actual arcs, then applied CSS classes to the parent in a sequence timed with when the lines of text would arc. Those CSS classes would just use translate to reposition the text to where the arcs could form the face. That's pretty much the gist of it, but let me know if you're like a more in-depth explanation of any of it.

      Not actually very good at front-end dev, just find some creative ways to use CSS here and there. Let me know if you have any more questions I'm seriously happy to answer them. Sorry for not getting to this a week ago.

      0 points