This week, Aaron takes on the RTO reigns while Michael attends An Event Apart. Don’t worry, you’re totally in good hands. We promise. Aaron’s lined up a few topics to cover with you, all of which are linked up down below. These include AI gaming bots, writing better CSS, and resources to help you get better at coding, whatever your flavor of choice may be.
Followup Resources
OpenAI Game Bots
- https://techcrunch.com/2018/06/25/openais-dota-2-neural-nets-are-defeating-human-opponents/
- https://www.youtube.com/watch?v=5zaJ58q9vuI
- https://qz.com/1311732/openai-built-gaming-bots-that-can-work-as-a-team-with-inhuman-precision/
- https://edition.cnn.com/2018/06/18/health/video-game-disorder-who/index.html
- https://www.hpe.com/us/en/insights/articles/kill-the-robot-ump-1806.html
- https://thenextweb.com/contributors/2018/06/23/i-built-a-bot-and-now-i-know-why-bots-are-so-dumb/
Writing Better CSS
- https://css-tricks.com/animate-calligraphy-with-svg/
- https://caniuse.com/
- http://blog.theodo.fr/2018/06/write-better-css-part-1/
- https://digitaldesign.tools/
Leveling Up Your Coding Skills
- https://www.fullstackacademy.com/blog/learn-javascript-for-free-11-online-tutorials-resources
- https://www.codewars.com/
- http://rubykoans.com/
- https://www.hackerrank.com/
- http://exercism.io/
- https://www.theodinproject.com/
- https://www.hackthebox.eu/
- https://drunkenux.com/podcast/codin-9-to-5/
Transcript
Good morning, afternoon, or evening! Today is Wednesday, June 27th. This is Aaron, filling in for Michael who’s currently out in the field, enjoying the final day of An Event Apart in Boston (#aeabos). Did you catch episode 13 of DrunkenUX earlier this week, “A disconnected functional CSS of my wretchedness”? Be sure to check out that, as well as episode 1 of our new series, “Build Process”, where Michael talks with web developer Paul Gilzow (hi Paul!) about his experience and journey as a web developer.
Two years ago, the world of eSports was blessed, or cursed?, the the debut of the first neural-net-backed AI bot that was actually skilled enough to square off, 1v1 against some of the top players in the world. The game was DOTA2, a “MOBA”, “Multiplayer Online Battle Arena”. DOTA2, a game I’ve played (and am horrible at, even after about 1,100 hours of practice) pits 2 five-player teams against one another in a strategic and tactical game of tempo where the goal is to destroy the other team’s base, while preventing the other team from destroying yours. Between individual player strategy, in-game decisions, and team-tactics, the game requires a hefty amount of skill and practice to play at the professional level. The DOTA2 International is like this game’s World Cup, and last year’s prize pool exceeded 20 million USD, with each player of the winning team receiving nearly $2M each, with prizes cascading down to 18th place, where each member received a little over $10k each.
OpenAI (co-founded by Elon Musk) has written AI that can play the game…very, very well. Two years ago, it successfully beat the world’s top players in one-on-one duels, demonstrated live at The International 2016. This year, they have expanded their outfit to have five separate AI-controlled bots working in tandem with one another, able to evaluate and respond to the actions of their teammates, and opponents, with split-second accuracy.
On the back-end, this stack is running on 124,000 cores on Google Cloud. When they run simulations to train the neural net, they are able to simulate 180 YEARS of play in a single DAY of simulations.
No word yet on whether or not computers, that effectively spend centuries playing video games instead of interacting with other computers, would be declared to have a “gaming disorder” according to the WHO.
In the somewhat-similar world of meatspace sports, advances in computation and high-resolution videography have led a Belgian fellow, Willy Z, whose last name I would likely butcher if I tried to pronounce it (you can find in the show notes) to posit “what if we replaced human referees with cameras & computers?” Z landed a 50k Swiss franc (roughly 50k USD) prize from the Hasler foundation for his project “Collina”, which uses a combination of cameras and computers to observe and adjudicate sports plays as they happen.
This leaves me wondering, though, about how long it will be before AI players start cursing like McEnroe at AI referees for what they believe are “bad calls.” (and will there be a stack trace?)
On the lighter side, Burke Holland on The Next Web writes about his experience writing a slack bot that can control a lamp on his desk, with the headline “I built a bot and now I know why bots are so dumb.” If you’re curious at all about how bot scripts work (that aren’t backed by the heft 124k Google Cloud cores), particularly those with lexical parsing, it’s an entertaining read.
How good is your CSS? Albéric Trancart (pardon my French) has written “Write Better CSS: From Hell to Heaven (part 1)” on theodo.fr, which distills the bigger concepts about modern CSS down to some pretty simple-to-follow rules and explanations. He covers style rule specificity (now with Sith Visualization!), advice on how and when to comment in your CSS (“a good CSS comment explains the intention behind a selector/rule”), and some suggestions about whether or not you should use ID or HTML attribute selectors — if you happened to catch my thoughts on this in our Functional CSS episode of DrunkenUX, I have to say — I believe I stand corrected!
The author addresses the “to cascade or not to cascade” question by encouraging the use of preprocessor “mixins”, which allow the elegant DRYness of CSS but without the potential for cross-style splash.
The single-purpose site digitaldesign.tools features summaries and direct-links to some of the top software tools used by digital designers today, including Sketch, Adobe XD (does anyone else see the emoji when they look at that?), Webflow, Atomic, and numerous other newer tools. If you’re looking for cutting-edge tools, this would be a good site to check in on occasionally.
Lastly, in the Keanu Reeves “whooooaaa” of CSS, css-tricks.com published a deep-dive into drawing calligraphy using SVG animations, replete with diagrams, demonstrations, and code snippets. It sits at the intersection of “awesome GIFs of people hand-lettering calligraphy” and “sweet coding tricks you didn’t know you needed.”
Back in Episode 7, where we talked about breaking into the biz and also sharpening your skills to stay in the game, we mentioned some sites that are useful for levelling up your coding skills. There are a few of these that I still use on a regular basis, either to hone my knowledge of the languages I know, or to branch out into a new language.
One of the challenges of auto-didactic learning is often the lack of structure, the “resistance weight” that we need to lift with our brains. These websites offer a plethora of approaches for skill-drilling at your own pace, and on your own time, and they’re all free!
As Rubyist, a couple that I really wanted to give a shout to are rubykoans.com and codewars.com – both of these were extremely helpful to me, personally, in my journey in becoming a Rails dev. Rubykoans is a guided path through the basics of using Ruby, where you learn a series of lessons by solving very simple problems, mediated through an ordered test suite — to solve the problem, you just need to make the test pass — it’s literally learning through test-driven-development!
Codewars is a polyglot website that includes Ruby, Javascript, PHP, and many other contemporary languages. You choose the language you want to practice in, and are given a “rank” (those of you with martial arts experience will recognize the ranking system). The exercises you are given are appropriate for your rank and as you complete them and earn Internet Points, your rank advances and the exercises become iteratively more difficult. Some of them are solveable with one-liners, others may require some research into advanced algorithms. All solutions are run against a secret battery of automated tests to verify completion — and after successful submission you can see how other people solved it. For me, it’s been a great reason to dive through the Ruby docs and to learn new methods and patterns.
One last one — Exercism.io is a fun challenge that is more rigorously structured than the others. You choose your language and then subscribe to the “track”. You fetch each exercise, in sequence, and submit your code via the command line, which is then run against automated tests on the remote server. If your code passes, your profile is updated and the next exercise becomes available. The exercises include classics like the Sieve of Eratosthenes or prime number calculation, domain-specific exercises like DNA/RNA parsing, making a chain of dominoes, ciphering, etc.
They’re a lot of fun and a great way to spend 30 mins a day to sharpen up.
Thanks so much for joining us for Real Time Overview this week. We’ll be back again soon with another episode of Drunken UX. If you’re at “An Event Apart” in Boston, be sure to reach out to Michael (@fienen on Twitter) and say “hi!”
While you’re at it, connect with us at DrunkenUX on Facebook or Twitter, and come chat with us on our Slack — drunkenux.com/slack
Until then, keep your personas close and your users closer.