Ladies of Creative Coding, CSS and Web Animations

I was inspired by this post after someone sent a funny video about how a dev team solved a problem and the only woman was the “mean” project manager. Like a few other women who got the link to the video, I thought it was a little stereotypical. That is because as I’ve learned more about CSS and creative uses of CSS and web animations, I’ve come to notice that a few experts and thought leaders in creative CSS and SVG animation are female. There are obviously more than I’m going to list here, but this post is based on my personal experiences with what they’ve put out.

In the order of whose work I last interacted with:

Sarah Drasner

I just finished Sarah’s course on Lynda, Advanced SVG Animations. It was originally produced by Frontend Masters, not Lynda. It’s more of an edited live course (with students in the room) than an online course, so the educational style is very different from Lynda. (I personally did not like this format for Lynda, but I think it would be much better as an in-person course.)

Her course went into using GreenSock Animation Plugin (GSAP) and a few of their plug-ins: Draggable, DrawSVG [Plugin], motion on a path as an animation technique, SplitText, and HSL color tweens. She also talked about how she plans her animations and showed examples of her work throughout the course.

 

Sarah also made an appearance on The Coding Train, on YouTube. Here she is giving a tutorial on web animations and Mo.js.

Sarah seems like an expert – a Frontend Master, if you will – on web animations, especially with SVG, GSAP, and any host of JavaScript or web plugins related to animation. In her Lynda/Frontend Master’s course, Sarah said she makes it a point to learn the animation capabilities for new JavaScript libraries and plugins. So for React, she’d learn the animation capabilities in React. For Angular, the animation capabilities in Angular. And so on, and so forth. That seems like a really smart way to keep up to date in an area of programming/web that you’re really interested in. (Mental note: I should do this too.)

 

Val Head

I came across Val’s course, also on Lynda, where she teaches a course on CSS Animations.

In looking up Val’s Lynda profile, I’ve also just discovered that she also teaches a course on responsive typography, called Responsive Typography Techniques! This course looks like it would go really well with the two web typography courses by Laura Franz, Typography for Web Designers and Choosing and Using Web Fonts, both of which I also highly, highly recommend.

Val was also a guest instructor on the Coding Train.

Val also teaches an in-person web animation course with…Sarah Drasner! Web Animation Workshops. These are one- and two-day courses, in multiple cities around North America and Europe (and possibly even further than that). Given that it’s now October, there aren’t many left this year. But, check out the website now so you can ask your boss for some funding for next year. They also have scholarships for underrepresented groups, if you happen to belong to one. You can sign up for announcements on new classes on the website.

Val also curates the UI Animation newsletter. The newsletter is how I found out about and joined, the Creative Coding Club. I feel terrible saying that I haven’t read many of Val’s UI Animation articles in a while. (Let’s be honest: I haven’t had much time to keep up with Creative Coding Club either. And let’s be even more honest and say I haven’t had time to keep up with much of my personal email, in general!) I might need to resubscribe with a different email address, because the links she shares are very inspirational and educational. And I want to keep up with what’s going on.

 

Leah Verou

I am not quite sure when or where I came across Leah Verou’s work, but it was obviously while I was trying to figure out CSS gradients because I’ve had her wonderful site, CSS Patterns Gallery, bookmarked for a year or two. You can look at my own project sites to see that I’ve used her CSS background patterns multiple times on my own projects. I probably also came across her Cubic Bezier site, as well, most likely during a CSS animation tutorial. You can find more of her projects on her website, http://lea.verou.me/projects/.

As I’m writing this, I cannot remember all the things that made me think of Leah, except for the bookmarks to her CSS gradients page. I think that at one point in the semi-recent past, it seemed that every time I looked for some building block for some cool CSS thing-a-ma-jig, turned out she’d already built it. I really hope she teaches a class somewhere, someday, because she really seems to know her stuff!

 

Rachel Nabors

To be fair, I have not signed up for any course with Rachel Nabors. Nor have I had much experience with her work. But, she does run a web animation Slack channel, called Animation at Work. Many of the discussions there seem a little over my head right now, but I want to keep involved and stay learning. She also offers a few online courses and has a book published by A Book Apart, called Animation at Work. She also runs a web animation newsletter, Web Animation Weekly. Check out the Archive if you’re interested in learning more. (As you’ve guessed, I am not really reading this newsletter either.)

Rachel is also an amazing Illustrator, and her animations look really good! You can find examples of her work, and get a sense of what I mean about her animation/cartooning skills, by checking out her website(s):

Many of her courses seem to cover a lot of topics as Val Head. But, if you’re interested in CSS animation, motion, and transitions, my experience has been that the best results come from learning from as many sources as possible. Sign up for both!

 

Shoutouts and More Ladies to Look Up:

Sarah Drasner mentioned Sara Soueidan (pronounced Sweden) a couple of times in her course. I looked her up and she seems like a pretty amazing front-end developer. She is on Twitter @SaraSoueidan. Sarah also mentioned Joni Trythall and Amelia Bellamy-Royds in her credits at the end of her course. I will have to look them up later…

Nat Cooper is the founder of the Creative Coding Club. Like Rachel Nabors, she has amazing graphics skills and comes up with some pretty sweet animations and keeps the group motivated every month. Find her on Twitter @natacoops and the Creative Coding Club (@artcodeclub).

Learning About Lean, Kanban, Six Sigma, and Kaizen

A few months ago, a friend of mine recently asked on LinkedIn if anyone had any information about Six Sigma certification. It caught my eye, not only because a friend asked, but also because I’d recently come across a conversation on Reddit about Six Sigma, which got me thinking about the concept of kaizen, which is Japanese for “continuous improvement”. Following this path further, I learned more about the connections between kaizen, Six Sigma, and Lean. Six Sigma appears to be one way to implement Lean, which appears to be the way to implement/interpret kaizen*.

NYC Lean/Kanban Meetup, June 2017

Cut to the NYC Lean/Kanban Meetup, which I attended in June to learn more. Unfortunately, it was the last of the season, until September, but they have an ongoing weekly morning get-together on Fridays at 8:30 AM.

https://www.meetup.com/nyc-kanban/

Event Recap

The event was meant to recap a recent series of meetups on Lean as well as a planning session for the next year/season. The talk was interesting, but it’s clear that I’m an n00b. I picked up a few names, book titles, and resources, listed below.

People

Book

During the speaker’s recap, he mentioned a book title, This Is Lean. The book can be found at www.thisislean.com.

A video on ThisIsLean.com explains more about the book:

Radio

The speaker also mentioned a This American Life episode on NUMMI, a GM + Toyota manufacturing partnership. Interestingly, I also found an article disputing the TAL episode, although I think that might be more due to a pro-union POV than actual criticism of the article.

Storymapping

After the speaker’s presentation, we got together to talk about a few ideas for the next year. The table I joined was on story mapping, which someone had suggested as a topic. I joined this table because I wanted to learn more about story mapping. And a few other people at the table didn’t seem to know exactly how the person who suggested it could use it in the example she provided. But, eventually, we eliminated other choices and figured out how it could work. So, it will be a topic next “year”, after the summer break, and I hope to learn more. Although it’s meant to be used in Agile, I guess you could use it even if you don’t work in Agile.

Resources:

Story Mapping Tools: 

  • Cardboardit.com – https://cardboardit.com/
  • Feature map – https://www.featuremap.co/en

Certification

Also, in chatting with someone there, I learned that there is Scrum Product Owner certification that you can get in 2 days. I found a session in Saint Paul, MN, and that one is $1,095 per person at regular price. There was an option to filter for discount only, but I’m guessing it will still be several hundred dollars.

Implementing Kaizen Without Knowing It

As a side note, I used to own a book called, One Small Step Can Change Your Life: The Kaizen Way. (There’s also a summary of the book’s contents on YouTube, by someone unrelated to the book and the author.) But after getting through the audiobook of The Life Changing Magic of Tidying Up, I sold it to The Strand.

Incidentally, “tidying” (and cleaning) is another cultural efficiency practice from Japan, which I first learned about on Japanology Plus. It might not be as respected in business circles as kaizen or Lean, but it appears to be very much a part of Japanese culture.

Even though I gave up the kaizen book, I have been using the concept of small changes and small steps. One instance of this is trying to learn new languages with the Duolingo iPhone app, by focusing on just getting through at least one lesson a day. I hope to post my progress on LinkedIn, once I get to 25% in any language.

Also, in chatting with someone there, I learned that there is Scrum Product Owner certification that you can get in 2 days. I found a session in Saint Paul, MN, and that one is $1,095 per person at regular price. There was an option to filter for discount only, but I’m guessing it will still be several hundred dollars.

Implementing Kaizen Without Knowing It

As a side note, I used to own a book called, One Small Step Can Change Your Life: The Kaizen Way. (There’s also a summary of the book’s contents on YouTube, by someone unrelated to the book and the author.) But after getting through the audiobook of The Life Changing Magic of Tidying Up, I sold it to The Strand.

Incidentally, “tidying” (and cleaning) is another cultural efficiency practice from Japan, which I first learned about on Japanology Plus. It might not be as respected in business circles as kaizen or Lean, but it appears to be very much a part of Japanese culture.

Even though I gave up the kaizen book, I have been using the concept of small changes and small steps. One instance of this is trying to learn new languages with the Duolingo iPhone app, by focusing on just getting through at least one lesson a day. I hope to post my progress on LinkedIn, once I get to 25% in any language.

Event: UX Camp 2017, New York City

On June 24th, I attended a one-day unconference, called UX Camp. I heard about this through Meetup/email. I’m not sure what I expected, but I did hope for more hands-on workshops.

Sessions Attended:

Dance as cultural exchange

Using Dance for Cultural Exchange: This was presented by Ana Milena Aguilar-Hauke. I thought it was really smart and innovative, but only 2 people showed up to learn about this which is a shame. We could use more cross-cultural exchange these days. Her idea came from her experience living in Germany and the United States from the perspective of someone of Colombian descent. Her idea was to use salsa, which is a fun, easy to learn dance, to might help people interact with each other.

You can read more about this project on her website.

Kanban discussion list

Independent UX (More of a pow-wow/thought exchange): Helpful, especially for people who are managing their own work as an independent or seeking to. We used voting and Kanban boards, which I hadn’t heard of before, to go through ideas. I got that recruiters really take away your ability to earn more money because they’re skimming off the top. And, I learned that other UX professionals are experiencing the same portfolio headaches that I am.

I’ve since become interested in learning more about Lean and Kanban, which I’ll talk about in an upcoming post.

Some of the work we were doing for the design sprint workshop.

Tips on Design Sprints: I kind of wish I’d skipped this because, apparently, a really great talk that confirmed many of my job hunting suspicions was going on that I missed and probably would have enjoyed. But on the other hand, it was a hands-on activity like I wanted and it gave me new ideas to think about.

Agile to Tri-Track: This was presented by Dave Malouf. To be 100% honest, as soon as I walked into this one, I wanted to walk out. Unfortunately, I was sitting at the front of the room and had walked in a few minutes late. I didn’t understand what he was going for with this talk, or what anyone other than the speaker would get out of it, or even, really, what the speaker would get out of it. But, my biggest disappointment with this talk was that the speaker didn’t seem willing to accept new ideas when challenged with alternative approaches.

Systems Thinking: I went because I wanted to learn about systems thinking. It started off OK. But I noticed that there was one specific moment where he lost me and several other people. One person left, I mentally felt myself check out; another guy started checking his email. And, although he asked for feedback, I felt rude about providing this criticism in a public setting. It just needed to be shorter and get to the point faster.

Portfolio Discussion: This was helpful and vindicated some of the concepts I’ve been thinking and writing about when it comes to what UX managers look for (or don’t look for) when reviewing portfolios. My strategy now is to include information about an unexpected challenge I experienced and what I learned on the job.

 


All Photos