So it’s that time of the year when people are looking back on the past year and reflecting on all that has been accomplished, the design wins we have had and the not so great ideas we threw in the bin.
Everyone loves to keep up with the newest trends and make sure that they and their designs aren’t stuck in the early 2000s Lady Gaga phase.
Now we aren’t going to tell you these are the trends you HAVE to follow to be a good designer, these are just a few trends that we here at Neslo really enjoyed or that interested us in 2021 and what we are going to try and work on implementing in 2022.
One of my personal favorites of 2021 was dark mode. Every app I use that has the dark mode option — it’s on. Now dark mode seems like a very recent thing but actually computers back in the “stone age” ran their ‘screens’ on cathode ray tubes that used electron guns to light phosphors behind the glass screen — real spy sounding stuff right? These tubes couldn’t handle illuminating a whole screen for long periods of time so the screens were made to be black and all the elements were either white, amber or green.
Dark mode wasn’t brought back to pay homage to these old computers, it was actually re-purposed to look super cool and mysterious, and it’s better for your eyes. There is not as much blue light emitted as with light mode so it reduces eye strain and dry eyes in darker environments, it saves battery and could be really helpful for people with light sensitivity. Another perk is that it won’t keep your partner awake when you’re on your phone at night.
Dark mode is not the easiest UI to design, especially for large bodies of text, because you have to make sure it is always legible. Also, the design could feel cluttered if the page has too many elements. And some people just really don’t like it — Gen X we are talking to you.
But when dark mode works, it really works and it can be beautiful.
My next trend is a bit of an oxymoron. AntiDesign. Why? Well because it goes against all design principles yet it was a trending design style in 2021 — we are a confused species.
AntiDesign originated in Italy in 1966 and continued until 1980. It was a reaction to modernism and avant garde design and was known for its bright clashing colours, scale distortion, asymmetrical layouts, mixed fonts, layered imagery, irony and kitsch. It was used to protest against mass production, consumerism and greed.
How is AntiDesign UI functional you ask? AntiDesign focuses on giving the user the most functional and easy UX experience. Just like in the 1960s, it looked crazy and like it’d never work but it did.
The best quote I found to explain this movement is “confident designers can venture far out to sea, but they remember to never lose sight of the lighthouse”.
Designers always walk the tightrope between AntiDesign and just a mess, but they should remember which side of the tight rope is the functional side and what’s good for the user. Neslo didn’t dive into AntiDesign in 2021 but it definitely was an interesting topic that we started to explore and one we want to see grow during 2022.
Another favourite is illustrations and hand drawn elements. We have used these quite a bit in our projects this year and I have absolutely loved them.
By using hand drawn elements or illustrations it brings a page to life and gives it a feeling. It helps us not depend on stock photography that doesn’t always match what we are trying to say.
Not that anyone needs any convincing on why illustrations are the best things for websites, but here are a few anyways.
They create a base of originality and artistic harmony, they add style and creativity to your designs, they are customisable to fit your target audience and great illustrations help you stand out from other websites.
Illustrations give visual messages of what the user should be doing or experience, like if you are waiting for a page to load and see a person sitting impatiently at a desk it tells you that they know you’re frustrated but the application or page is loading.
People perceive messages faster than words, images are easier to remember long term which will make all future interactions with the user easier. Visuals are also more universal.
Graphics provide great support for copy to reinforce a message. If a user is unsure of a meaning of the text, a visual could give that last helping hand in ensuring the text is understood.
Illustrations can be turned into simple motion graphics which increase user interaction and make the site more memorable and unique.
My last topic that we at Neslo enjoyed this year was motion and interactivity.
We dived a bit into this, this year whether it was images loading out with the page, success screens ‘exploding’ to give the users a bit of a surprise or just making cool loader animations. It was exciting to dive into the world of motion, it is complex and very tricky as you can either get it perfect and it looks amazing or it looks like you let your cat walk over your keyboard and they made some things move.
The bits I have loved from this trend are icons or menus animating as you are hovering over them. It’s something so small that will keep the user interested in your website, but it can also go too far if every little thing on your page moves, it can cause confusion and an unappealing user experience. I also loved the creative ways of making a screen loader, no one wants to sit and watch their screen while it loads so adding in a bit of fun and something exciting can make a waiting period feel a whole lot shorter and less boring.
There are a few different types of motion that are used in UI. Motion for feedback, showing that an action happens when a button or icon is clicked, for example, clicking a burger menu and a dashboard sliding across the screen.
Motion that communicated state change, for example, an edit button becoming a cross or tick after the user has pressed it. This minimises the amount of icons and buttons needed in a page by animating an icon to turn into another that becomes redundant once its action has taken place.
Motion for navigation, for example, as you go through the process of an application instead of just appearing the screen slides from right to left to show you are moving forward in your process.
Motion as a signifier, how do we know that that popup can be closed by swiping right? because it came from there. It helps the user know when they can close something by swiping it away, saving space and a need for a close or exit button, plus it aids the user experience, saves space and looks super cool
Attention grabbing, it helps to tell you what to do next. If you are unsure about where you need to go next or what your next action should be and a button pops up or does a little jump you know that’s where you’re supposed to be going without being told you have to go there or taking time to figure it out.
So those were a few of our favorite trends from 2021 that we will most likely be taking with us into 2022, but just with a little more practice and knowledge.
Finding a design style of your own is always important and necessary, it’s not an easy task when you have multiple trend guides and UI design blog’s around you.
Don’t forget to focus on your true style, allow the trends to influence your work while you let your own style and character shine through.
