{"id":58582,"date":"2018-10-09T14:10:10","date_gmt":"2018-10-09T14:10:10","guid":{"rendered":"https:\/\/blog.glaciermediadigital.ca\/?p=58582"},"modified":"2018-10-23T18:31:19","modified_gmt":"2018-10-23T18:31:19","slug":"5-web-design-trends-actually-use","status":"publish","type":"post","link":"https:\/\/blog.lodestardigital.ca\/index.php\/2018\/10\/09\/5-web-design-trends-actually-use\/","title":{"rendered":"5 Digital Design Trends We Actually Use"},"content":{"rendered":"

I asked <\/span>Adriano<\/span><\/a> (one of the many talented designers here at Glacier Media Digital) what he was most looking forward to seeing in digital design. His answer was pretty immediate. Having seen many trends come and go in his many years as a designer Adriano was quick to say, \u201cDesign trends are cyclical. We\u2019ll get sick of something and stop using it only to have it reappear in later years…\u201d<\/span><\/p>\n

And this concludes my post.<\/span><\/p>\n

Just kidding! There is more to say!<\/span><\/p>\n

Adriano continued, \u201cHowever, I am looking forward to seeing typography put to use as a stronger graphic element in digital.\u201d At that moment, he stopped walking and pointed at a sign he liked. It hung outside of an adorable bakery. Playfully arranged, large, vertical, peachy letters filled up the entirety of the sign, while a more meaningful message displayed overtop in stark contrast. \u201cSee, the peach letters are being treated almost as if they were an image. It\u2019s almost not meant to be read. It\u2019s creating an energy and giving that sign personality,\u201d he explained. \u201cI think we will see more of this in digital.\u201d<\/span><\/p>\n

I often see this treatment \u00a0in conceptual phases and design specific websites. Here\u2019s an example of what I\u2019m talking about:<\/span><\/p>\n

1. Bold Typographic Treatment<\/h3>\n

\"\"<\/p>\n

Unusually large letters for a website take up the first quarter of this web page. But it somehow doesn\u2019t overwhelm the viewer \u2013 Why is that? The main common trait for the use of such bold typographic treatment involves a degree of blending into the background or adhering to thematic rules you create as you design. That can look like the use of a similar colour palette, patterning or even a slight opacity but even then, \u00a0it all depends on the tone or perhaps shock factor you\u2019re trying to create. Maybe you do want to overwhelm the user \u2013 at least initially.<\/span><\/p>\n

2. Semi-flat Design<\/h3>\n

\"\"<\/p>\n

I\u2019ve tried to create a sense of depth and layers to the form in the mockup above. This depth, use of shadows and the illusion of light playing on the button (a painters trick), is what separates completely flat design from semi-flat design. \u00a0The background looks like frosted glass, hinting at something more behind it, while the button is highlighted by a soft ambient shadow \u2013 an effect that makes the button seem delightfully squishy. As a UI designer, I think imitating real life in the digital space can help create a richer experience for the user. And when I say \u201cimitating real life\u201d I\u2019m talking about how light moves across objects to create shadows, giving us a sense of depth perception and overall understanding of the relationships between objects. Purely flat design, though it makes information easier to understand, quickly runs the risk of being too simplistic and subsequently a bit boring. And though it\u2019s important that our work is legible, we also want to capture our users\u2019 imagination and attention. <\/span><\/p>\n

3. Responsive Logos<\/h3>\n

\"\"<\/p>\n

Responsive logos are self explanatory but they can be a challenge. When we\u2019re creating logos, there are a lot of factors to consider thanks to the fact that everyone is going to look at your website or your logo through a different viewport height and width. Be that on a Mac, PC, Android, iPhone or in print on a billboard or magazine \u2013 is your logo recognizable on different types of mediums? If not, it may be time to refresh your logo with the help of a designer.<\/span><\/p>\n

4. Micro-Animations<\/span><\/p>\n