177: With Sarah Drasner

Download MP3

Sarah Drasner is the Senior UX Engineer at Trulia and she's obsessed with animation. In fact she's giving a workshop at Front End Masters about it (coming soon) called Advanced SVG Animation.

She's on Shop Talk Show to talk animation framework options, style guides and 5W30 motor oil.



Sarah Drasner

Web · Social

Sarah is a speaker, consultant and writer at CSS-Tricks.

Time Jump Links

  • 23:10 How many miles will 5W30 SYN oil last for in a 2010 Lexus ES350?
  • 24:30 Hi there! My name is Louis Novick and I am a Front-End developer living & working in Orlando, FL. I was extremely taken away with how creative your work is. How do you go about planning/storyboarding a piece? Do you sketch it first and then decide how to animate it? What is your process when coding art?
  • 27:04 Greensock animation Framework audio question
  • 38:10 If anything, what do you use for style guides and why? I'm a full stack engineer, but very new to design. I like the idea of managing components that make up your site. At first glance, looks better to me, because it helps you manage small components, but also how they should be used. Other solutions like KSS just add documentation to CSS. (Sarah mentioned Trulia's Hologram).
  • 52:19 Animations are becoming popular on websites, they grab attention and provide another layer of UX (as mentioned in the recent UX episode). Is jquery best for that? I’ve heard of things like greensock that supposedly make it easier. How do you go about debugging these animations (Google Designer, Adobe Edge Animate, etc), what other software do you recommend? As far as UX goes, what are some of the pros/cons of having an animation repeat after it has been brought back into view port (user already saw it, scrolled back up)
  • 1:03:26 What resource do you guys use as a “Breaking News” source for keeping up industry-specific changes or need-to-know announcements?