You know, we use ad-blockers as well.
We gotta keep those servers running though. Did you know that we publish
useful books and run
friendly conferences — crafted for pros like yourself?
E.g. our upcoming SmashingConf New York, dedicated to smart front-end
techniques and design patterns.
I have been drawing desktop wallpapers for Smashing Magazine's monthly collections for over a year now, and every time it's a very fun and challenging mission. In this article, I would like to share how I approach all stages of the process and provide general techniques for creating vector illustrations in Adobe Illustrator. Hopefully, you will find these techniques useful.
While referring to a particular drawing — the illustration for the "Understand Yourself" desktop wallpaper, which was featured in May's wallpaper collection this year — I'll also highlight key takeaways from my experience as an illustrator and designer.
Buttons are a common element of interaction design. While they may seem like a very simple UI element, they are still one of the most important ones to create.
In today's article, we'll be covering the essential items you need to know in order to create effective controls that improve user experience. If you'd like to take a go at prototyping and wireframing your own designs a bit more differently, you can download and test Adobe XD for free.
Editor’s note:Please note that this article is quite lengthy, and contains dozens of CodePen embeds for an interactive view. The page might take a little while to load, so please be patient.
Layout on the web is hard. The reason it is so hard is that the layout methods we've relied on ever since using CSS for layout became possible were not really designed for complex layout. While we were able to achieve quite a lot in a fixed-width world with hacks such as faux columns, these methods fell apart with responsive design. Thankfully, we have hope, in the form of flexbox — which many readers will already be using — CSS grid layout and the box alignment module.
In this article, I'm going to explain how these fit together, and you'll discover that by understanding flexbox you are very close to understanding much of grid layout.
I realized something the other day: I've been designing apps for nine years now! So much has changed since the early days and, it feels like developers and designers have been through a rollercoaster of evolutions and trends.
However, while the actual look and functionality of our apps have changed, along with the tools we use to make them, there are some things that have very much stayed the same, such as the process of designing an app and how we go through the many phases that constitute the creation of an app.
How can you be sure you're moving your design problem in a straight line? That you're moving directly to a solution? From client to payment, from product to audience?
How certain are you of what the second step in your process is? Or the third? Or how long each will take, or if any should be removed? Are they all useful? Do any need improvement? Is each done with aim and purpose? How often do you fall-forward with momentum, rather than move with reason?
We all have visions and dreams. Whether it’s about our personal lives, our work, or about complex concepts that target issues which are hard to grasp. The important thing is to listen to your ideas, to write them down, and, if they wake strong feelings, to pursue them.
It can be easy to achieve this, yet sometimes it’s not. A nice technique is to start small and take small steps instead of going 100% all-in or do nothing at all. We like to play with new things, we like to try out new technology, and our minds want to explore new paths — let’s do it!
With autumn starting to show its full glory, there is really no reason to stay inside and drink your hot cacao. No, it's time to go outside and soak up all those warm colors nature has to offer, especially the vibrant golden-yellow leaves that can now be found almost everywhere you look.
It's the season of hazy mornings, and beautiful warm color palettes. In this month's collection, I've gathered a couple of illustrations and photos that express this seasonal feeling. The illustration presented above shows a brilliant way of how to spend your days before winter arrives.
Design is more than just good looks – something all designers should know. Design also covers how users engage with a product. Whether it's a site or app, it's more like a conversation. Navigation is a conversation. It doesn't matter how good your site or app is if users can't find their way around.
In this post, we'll help you better understand the principles of good navigation for mobile apps, then show you how it's done using two popular patterns. When we examine the most successful interaction navigation designs of recent years, the clear winners are those who execute fundamentals flawlessly. While thinking outside the box is usually a good idea, there are some rules that you just can't break.
Shaders are a key concept if you want to unleash the raw power of your GPU. I will help you understand how they work and even experiment with their inner power in an easy way, thanks to Babylon.js.
Before experimenting, we must see how things work internally. When dealing with hardware-accelerated 3D, you will have to deal with two CPUs: the main CPU and the GPU. The GPU is a kind of extremely specialized CPU.