Everything that a Frontend developer needs to know about web design.

My name is Inês and I love my job! I’m Frontend developer at Polarising, responsible for creating mockups of applications for mobile and web platforms. To be on top of the game I always research web design trends and I like to discuss ideas and come up with new ones. While I was researching, I realized how important this is to make any project look modern and professional. Web design is always evolving and changing, and certain trends and elements can instantly make your website look like a relic from the old days of the internet.

So, don’t take any chances when it comes to your work! There are many trends that I have in mind in all my projects and that I know will determine the irreverence and quality of my designs. This was what led me to write this article and share some insights with you.

I had the opportunity to develop a real cool project at Polarising, for the Arte Institute. It’s called the RHI Think project and its mission was to promote the connection between arts and business, bringing awareness to the cultural sector and empowering artists to become more independent in managing their careers.

The RHI Think project consisted in a mobile app that would allow you to establish a route of artistic events happening in several Portuguese cities and contribute with a chosen amount. To design it I’ve implemented some of the most trendiest concepts, like mobile first, brutalism, loud and proud typography, bold colours and minimalism; shall we take a closer look on each of these concepts? Mobile First
Mobile-first is a trend that is quickly moving away from the trend status towards a good practice in web design. Every year, more people are looking at websites on their phones rather than on desktops.

Brutalism in digital design is a style that intentionally attempts to look raw, chaotic, or unadorned. Although can sometimes be upsetting, it also has the potential to be eye-catching, especially if used to create seamlessly functional and engaging business websites. For brutalism to be used correctly the design must be raw, unpolished yet not unpleasant, and convey a sense of in-your-face authenticity to the users. It will add a sense of visual tension that can be extremely powerful and long-term memorable.

Loud and Proud Typography
Another growing trend is big typography. Visually, big typography means titles with letters in large point sizes. For words to get to speak louder than the thousand words a photo might yell out, it’s necessary to deploy a big, bold and custom font. With more tools and devices available to support custom fonts, 2020 is a big year to make bold statements that set you apart from the crowd. This will only keep expanding in 2020, with more web design .

Hand-lettering is becoming extremely popular because it adds a custom feel to something, most of times, is uniform. It’s a touch of uniqueness without having to be unique to every-single-visitor.

Mobile Dark Mode
Dark Mode, as adopted by both Google and Apple, is probably the top user interface design trend that app designers need to watch out for. In app design, this mode not only reduces the battery strain and the light emitted by the screen device, but alsoapp in dark environments without causing eyes stress.

Scalable Vector Graphics
In the past, websites with rich content had to suffer slower page-load times due to traditional file formats such as GIF, PNG, GIF, and other video formats. These formats are now notoriously anti-mobile. For website owners it’s time to make the early bird switch to responsive, mobile-first designs, prioritizing mobile components at the core of the process without sacrificing rich visual content that enchants visitors. And that’s where SVG (Scalable Vector Graphics) comes in. SVGs ensure consistent quality of the user experience for all mobile visitors.

Bold Colours
Bold, bright, saturated colours help the brand stand out and go against the soft neutrals that a lot of companies have chosen over the past few years. Also, in 2020, web designers will put even more focus on using colour to evoke the mood(s) and feeling(s) a site is meant to convey.

Minimalism, sometimes called ‘flat design’, isn’t a new trend in web design, but it has typically been associated with a lot of white space (think Apple). In 2020, contrary to popular belief, minimalism doesn’t have to be all white. Minimalism also involves simplifying the interface in several ways: hidden navigation bar, minimum of colours and buttons, and so on. Previously, it was popular to pay attention to any little thing but today the user privileges quick access to information.

Animations, Integrated GIFS, and Dynamic Illustrations
Small animations are a trend that’s been growing for a few years and it tends to grow in 2020. Micro animations are used for loading designs, backgrounds, decorative elements, and navigation.

Another project that I was part of was intraPol, our company intranet. As you know, intranets are core to internal communication and this platform needed to have everything an employee needs, from up to date information, documents and HR functional applications, but it also had to be appealing. I think this project is a good example of how we’ve took advantage of these trends because they are all over it, it was fun and challenging to do it!

Besides these, I can think of some other that are becoming relevant, like the Asymmetric Layouts, that reinforce the idea behind asymmetry: websites look less straight-edged and become more interesting to look at, although it’s important to have a visual balance.

3D is also becoming the next big thing, although I wouldn’t consider it a straightforward trend, this might change in 5 years from now. To fully implement it, 3D monitors are not enough because when their value decreases, part of the web design will be presented as information in bulk. A new level of interactivity is VR (Visual Reality) but the financial constrains are still a real issue. When this is possible, it’s likely that users won’t even need a mouse to navigate the website, just to blink or nod to switch pages.

The Push notifications are a controversial trend because it’s unpleasant to get a pop-up a message in the monitor while working or watching movies. Notifications can be blocked, which will eliminate their annoyance, but on devices like tablets or phones, they are often useful rather than unbearable. Most websites are already asking the users permission to send notifications. It’s important to properly configure the subject and frequency of these notifications, making them an element that can help users, not push them away.

One other project I enjoyed so much doing was the AKHQ.IO. This website aims to provide a user interface for the Kafka ecosystem in order to simplify its comprehension, usage and management in a single web interface.

You see, I used a lot of these trends, such as bold colours, big typography, minimalism, animations, and on top of the requirements was to make this website mobile first. It was another great project.

There are many other projects that I would love to tell you about, as well as other trends to discover. There’s no doubt in my mind that, as I’m writing this article, new trends are already emerging. This is a great challenge to any Frontend developer, and at Polarising we want to be ahead and create solutions that can be edgy and effective at the same time. And we can always use some more talent in this area!

Inês Branco
UI / UX Designer & Frontend Developer

sondoramarketing.com/blog/2020-web-design-trends/ (Dennis Dubner, CEO of Sondora. October 2019).
merehead.com/blog/8-main-trends-of-web-design-2020/ (Olga Stashenko, Full Stack Developer. August 2019).
mobileappdaily.com/top-ui-design-trends (Ayush Mehta, Creative Head. October 2019).
theedigital.com/blog/web-design-trends (Megan Burgess, Digital Content Specialist. August 2019).
freepik.com/blog/8-web-design-trends-keep-mind-2020 (Orana Velarde, Graphic Designer. October 2019).
kijo.co/blog/7-useful-typography-trends-used-in-web-design (Mike O’Raw, Designer. August 2019).

Author profile

Leave a Comment

Your email address will not be published. Required fields are marked *