At HTML Goodies, we strive to give you the latest web design information. In this installment, we look at the works of many industry professionals who illustrate their experience and talk about the hot new design trends of 2018. Here are 10 trends to check out:
1. Asymmetric Layouts
According to Brad at Dallas Web Design, “Asymmetric layouts are a trend I expect to explode in 2018. Almost every design client wants to “stand out or be different.” A constant request we hear more and more from clients, is, ‘Can it be less boxy?'”
“Web developers have started breaking the rules of symmetry, and the results can be surprising. It is essential to consider the overall structure of the website carefully. The use of asymmetry must be logical and provide a positive user experience.” As an example, we read right to left, so the most valuable information should be on the left side of the design.
Asymmetrical layouts can be used to emphasize motion or add focal to points of interest to the viewer. When implemented correctly, asymmetry is visually intriguing while maintaining balance in a website.”
Figure 1. Here is an example of an asymmetrical layout.
Tim Keough at Sympli had a different perspective and presented 3 different design trends. These are:
DesignOps is the equivalent of DevOps, but geared towards the design world to improve collaboration, traceability, and automation using paradigms that have been around for years in the development world.
Figure 2. Here is an example of DesignOps.
We’ve embraced DesignOps by introducing a new Git-based version control solution for design files, improved tools to connect designers, developers and speed the building of web apps and sites. This includes tools integrated into both design and development environments to enhance collaboration and teamwork. We think further adoption of these tools and capabilities will enable teams to be more effective at delivering web apps more quickly and cost effectively.
3. Web/Mobile Convergence
Tools will continue to improve to bring web and mobile closer together and move closer towards the goal of building a single solution that powers web and native application experiences.
Figure 3. Here is an example of Web/Mobile Convergence.
React/React native and other frameworks as well as low-code/no-code solutions are helping move in this direction.
Many new applications are going to be delivered that connect to blockchain-based distributed applications and this will impact the web design/development world.
Figure 4. Here is an example of a blockchain application.
Web design will need to understand blockchain applications to effectively design interactions to connect web with these novel backend applications.
Luliia Shchilnyk had a different perspective. “Mondrianizm is a relatively new web design style that I predict will become very popular this year. It’s named after the artist, Piet Mondrian, who is best known for his unique style known as Neoplasticism. Essentially, the style relies on sharp and crisp geometric shapes and typically utilizes primary colors. The crisp outline keeps the pages looking very clean and organized, with a hint of flare. The bright colors make the page pop at you from the screen.”
Figure 5. Mondrianizm.
According to Steffen, “the Design trends that stand out the most are:
6. Drop Shadows and Depth
Images and content are now floating on website canvas, gives a feeling of 3-dimensional parallax layouts.
7. Vibrant, Saturated Color Schemes
With the standardization of 4K monitors, designers are now free to release the full color potential of their designs without fearing quality loss:
8. Mobile First
Since mid-2017 and even more now in 2018 mobile browsing has surpassed desktop. so Now designers tend more and more to think their website as a mobile site first: The roll-out burger has become established, minimizing the menu for the small screen. Use of icons and mobile optimized images
9. Accelerated Mobile Pages
Richard of Colourrich asserts that Accelerated Mobile Pages look set to become a top design trend for 2018. This technology enables mobile browsers to load faster than regular pages but with less data, resulting in an improved browsing experience, more engagement and better search rankings. Adoption of AMP technology will involve some site development work to overcome third party JS and form element restrictions, along with the implementation of special “amp-img” image tags. AMP Project have an excellent guide to creating your first Accelerated Mobile Page.
With the benefits AMP implementation can provide, this is a very cost-effective strategy for 2018.
10. More Web Design Trends
Keri of The Kyle David Group, believes we will see the following trends in web design:
- More interactive content: Gamification that engages users and propels them to complete a task, whether that’s completing a profile or donating.
- Increased focus on usability: More user testing and detailed user personas that help designers get to know their users, target audience, and goals before even beginning a project.
- More animation, more videos, and a break from typical templates.