I like to work with creative designers. I like to convert their ideas to HTML and CSS. I think that every professional front-end developer must be able to do it. It’s our job after all. But I look at questions on Habr Q&A and I see people asking about these designs almost every day. I expect to see beginners, the programmers with a year of experience, but I don’t expect these questions from the seniors. But they are there. And a lot of comments like “it’s impossible to create this thing, you should just fire your designer”. I think I’ll write a big article with lifehacks for such tasks in the future, but not now. This time I created just the one example of the responsive custom border. It looks simple, but it’s not. You’ll find the SVG filter for creating a border with padding for the shape of free form in the sources.
Several years ago I created Ucavatar. It’s a simple tool, its only purpose is to create geometric patterns on a canvas for future usage as avatars. But it’s boring. I have been thinking for a while about the similar tool, but with funny faces, and now I found time for making it. Check it out on CodePen and feel free to use it in your projects.
Looking for a step-to-step tutorial without mathematics?
Check out my article about WebGL shaders with examples adapted especially for UI developers (in Russian)!
In the latest article I explained how to use matrices for making 3D scenes. A couple of days later I thought it’ll be a good idea to create an additional interactive demo for my students. And there it is. I don’t know if this thing has its own name in programming or mathematics, but I call it “techno bird”. This variation of it is written in VanillaJS and GLSL and work in all modern browsers. At least it should, I haven’t tested it really. But its main purpose is to illustrate the principles from my article, so if it works in Chrome - it’s enough. Check out this demo on CodePen and follow me to not miss the future updates!
I published the first lecture in the series of lectures on mathematics for UI developers. This subject is not the most important thing for our job, and a lot of programmers didn’t learn it even in school, but if you create custom projects with WebGL or animations, you need it. I don’t know when I’ll publish the rest of the articles in this series, it requires a lot of time to convert them into the text format, but I hope I complete the set in this year. Also, I pushed the scripts for generating the slides in the style of the school deck to the GitHub repository. Feel free to use them for your lectures too.
I published an article about magical thinking in my blog on Medium. It’s in Russian and it contains my personal observations and thoughts from other people with schizotypal disorder from countries of the former USSR. The information in the article shouldn’t be generalized for all patients with the same disorder or for people outside this region, but it’s still can be useful for psychologists.
Woohoo! I wrote 1000 answers to questions on qna.habr.com (ex. toster.ru, the Russian alternative to StackOverflow). I don’t know, if it’s a lot or a little, but these answers helped me to learn, how to explain things in simple words, and they made me a reputation as a programmer. I think the 1000th answer is a good anniversary to celebrate!
Summer is a good time to learn something new. Especially if the all interesting places are under quarantine. Sometimes learning can be hard. It happens if you are trying to dive into a new subject without any preparation. The better idea is to learn subjects, which are connected somehow to the skills you already have. So, I created a skills map for myself. I never thought that all things I’m interested in are connected, but they are. Now I see where I have possibilities to improve myself and open new opportunities. I highly recommend to do the same thing for everyone.
Received a new badge from GitHub and figured out that I’m the Arctic Code Vault Contributor now. Wow! It’s interesting, but… Sometimes I’m ashamed of the code I wrote a year ago and now my sources will be saved for 1000 years. Oops. Anyway, the ideas and the project itself are impressive. Now I’m waiting for the same archive program for CodePen.
Simple UI framework. RSCSS, REM-based sizes, fluid typography and other nice ideas. This website is powered by it.
Boilerplate for static promotional websites. Pug, LESS, PostCSS, ES6+, Gulp, Webpack, BrowserSync, ESLint, Stylelint, auto-generated docs...
Library for creating galleries of photos with effects based on WebGL shaders.