I’m very excited about the v1.0 release of the “XD to Flutter” plugin for Adobe XD. While the prerelease versions were interesting, and occasionally handy for grabbing a style or shape, the addition of responsive layout support in 1.0 makes it a genuinely useful tool for creating beautifully designed widgets and even simple views.
Now that the first production release is available, I thought I’d write up a short blog post that introduces the plugin, and helps you get started using it.
If you’d prefer not to read, you can check out this Adobe Creative Cloud video on LinkedIn that features Will Larche from Google describing what Flutter is, and me (@~17:00) talking about the XD to Flutter plugin.
Recently I saw this video explaining all 80+ Blender material nodes on my YouTube homepage. Naturally, I watched the video and one of the nodes, in particular, caught my attention: the Shader to RGB Node.
Yes, I’m very lazy and proud of it. Most programmers out there will understand that. We’re among the laziest people you’ll ever meet. We’ll work hard and create a vast array of tools and scripts to aid us in tasks that we consider boring or repetitive, all so we don’t need to do extra work. Many of the repos at gskinner have a utils folder that’s full of scripts that serve one specific purpose. That’s a good thing. In daily programming, there are always repetitive tasks that crop up. Some are easy, some are just boring and time-consuming. Here are a few tips to help you also be lazy and save those precious seconds during your day.
When Should you Create Tools?
Is there a group of tasks that’s repetitive? Ex: everyday are you running the same X commands? Make a script to wrap them.
Is there a boring, but labor-intensive task that comes up every few weeks or months? Make a script for that. A good way to know when you should create a script for these tasks is, are you always having to remember those nit-picky details about how to do it? Or are there weird edge cases you know will be forgotten? A quick script will help isolate those dependencies for next time.
Is it a task that’s large and time-consuming? Examples could be data extraction or converting a folder full of files. Make a script for that. Sometimes if you know that one task will take you a few days (or more) to complete. Then, by all means, spend a few hours or even a day or 2 making that script that will save you time in the long run.
A “tool” doesn’t need to be a script. It could be a small, throwaway, RegExp expression. I don’t know how many times the “List” feature on https://regexr.com/ has saved me from hours of tedious data conversion tasks.
Focus on Functionality
These tools don’t need to be perfect. They don’t need to be used by other projects or other people. Sure, if you make something that’s useful, then, by all means, consider making it more portable. But don’t waste time upfront with that extra work. It’s very tempting to over-architect your tool, but it may only be a script that’s only ever used in your project, or potentiality only runs once or twice. Your initial focus should be making it functional and don’t worry so much about error handling. Don’t worry about making the UI or cli interface perfect. Don’t worry about making the code clean. Do what’s fast, do what’s gonna get you to that point of running the script, so you can move past your boring task. You can always tweak or polish your script in the future. Or someone on your team will.
I had the pleasure design two vignettes for our Google Flutter Vignette Showcase. What made the opportunity even sweeter was I could use 3D motion in the Flutter showcases. Here is how I designed the two 3D vignettes to showcase Flutter’s capabilities.
Flutter is a mobile UI toolkit that combines fast development, expressive and beautiful UIs, with native performance. To test-drive the platform, Grant Skinner & Mike Chambers recently built Redrix: a mobile companion app for Destiny 2.
Warning: There is a GIF at the bottom of the post with flashing images.
Like many of you, I was inspired by the impressive visuals of Spider-Man: Into the Spider-Verse (which, by the way, has a website built using gskinner’s CreateJS libraries) and wanted to try to apply some of that style into one of my animations.
On top of that, I’ve had the idea of making a walk cycle with an astronaut for a while and decided it was time to make it.
It’s been a while since I did any motion graphics so I thought I’d jump back into it. My goal: make a short HUD animation inspired by sci-fi films. I’m a sucker for flashy sci-fi FUI (Fictional User Interface) visuals, so I couldn’t resist making my own and documenting the process.